@webiny/react-properties 6.3.0 → 6.4.0-beta.1

package/createConfigurableComponent.js

@@ -1,112 +1,67 @@
-import React, { useCallback, useContext, useEffect, useMemo, useState } from "react";
+import react, { useCallback, useContext, useEffect, useMemo, useState } from "react";
 import { Compose, makeDecoratable } from "@webiny/react-composition";
 import { Properties, toObject } from "./index.js";
 import { useDebugConfig } from "./useDebugConfig.js";
 import { PropertyPriorityProvider } from "./PropertyPriority.js";
-
-/**
- * Each `<Config>` call composes a new HOC around the previous one via `Compose`.
- * The last composed HOC is the outermost wrapper. By placing `{newChildren}`
- * (this HOC's addition) before `{children}` (all previously composed configs),
- * the final render order matches declaration order:
- *
- *   <Config>A</Config>  →  renders first  (outermost HOC, its newChildren rendered first)
- *   <Config>B</Config>  →  renders second
- *   <Config>C</Config>  →  renders third  (innermost, rendered last via children chain)
- *
- * This is important because Property components register in mount order,
- * so declaration order = mount order = predictable config resolution.
- */
-const createHOC = newChildren => BaseComponent => {
-  return function ConfigHOC({
-    children
-  }) {
-    return /*#__PURE__*/React.createElement(BaseComponent, null, newChildren, children);
-  };
-};
-export function createConfigurableComponent(name) {
-  const ConfigApplyPrimary = makeDecoratable(`${name}ConfigApply<Primary>`, ({
-    children
-  }) => {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
-  });
-  const ConfigApplySecondary = makeDecoratable(`${name}ConfigApply<Secondary>`, ({
-    children
-  }) => {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
-  });
-  const Config = ({
-    priority = "primary",
-    children
-  }) => {
-    if (priority === "primary") {
-      return /*#__PURE__*/React.createElement(Compose, {
-        component: ConfigApplyPrimary,
-        with: createHOC(children)
-      });
-    }
-    return /*#__PURE__*/React.createElement(Compose, {
-      component: ConfigApplySecondary,
-      with: createHOC(children)
+const createHOC = (newChildren)=>(BaseComponent)=>function({ children }) {
+            return /*#__PURE__*/ react.createElement(BaseComponent, null, newChildren, children);
+        };
+function createConfigurableComponent(name) {
+    const ConfigApplyPrimary = makeDecoratable(`${name}ConfigApply<Primary>`, ({ children })=>/*#__PURE__*/ react.createElement(react.Fragment, null, children));
+    const ConfigApplySecondary = makeDecoratable(`${name}ConfigApply<Secondary>`, ({ children })=>/*#__PURE__*/ react.createElement(react.Fragment, null, children));
+    const Config = ({ priority = "primary", children })=>{
+        if ("primary" === priority) return /*#__PURE__*/ react.createElement(Compose, {
+            component: ConfigApplyPrimary,
+            with: createHOC(children)
+        });
+        return /*#__PURE__*/ react.createElement(Compose, {
+            component: ConfigApplySecondary,
+            with: createHOC(children)
+        });
+    };
+    const defaultContext = {
+        properties: []
+    };
+    const ViewContext = /*#__PURE__*/ react.createContext(defaultContext);
+    const ConfigApplyTree = /*#__PURE__*/ react.memo(function() {
+        return /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(ConfigApplyPrimary, null), /*#__PURE__*/ react.createElement(PropertyPriorityProvider, {
+            priority: 1
+        }, /*#__PURE__*/ react.createElement(ConfigApplySecondary, null)));
     });
-  };
-  const defaultContext = {
-    properties: []
-  };
-  const ViewContext = /*#__PURE__*/React.createContext(defaultContext);
-
-  /**
-   * Memoized config subtree — ConfigApply components don't depend on WithConfig
-   * props, so they must not remount when the parent re-renders. Without this,
-   * every parent re-render causes Property components inside HOCs to unmount
-   * and remount, corrupting the config object.
-   */
-  const ConfigApplyTree = /*#__PURE__*/React.memo(function ConfigApplyTree() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ConfigApplyPrimary, null), /*#__PURE__*/React.createElement(PropertyPriorityProvider, {
-      priority: 1
-    }, /*#__PURE__*/React.createElement(ConfigApplySecondary, null)));
-  });
-  const WithConfig = ({
-    onProperties,
-    children
-  }) => {
-    // `null` = config not yet collected; `[]` = collected but empty.
-    // This distinction is critical: children must NOT render until the
-    // PropertyStore debounce has flushed and delivered the initial config.
-    // Rendering children with partial/empty config causes errors in
-    // consumers like LexicalEditor that require a complete config on mount.
-    const [properties, setProperties] = useState(null);
-    const resolvedProperties = properties ?? [];
-    useDebugConfig(name, resolvedProperties);
-    const context = {
-      properties: resolvedProperties
+    const WithConfig = ({ onProperties, children })=>{
+        const [properties, setProperties] = useState(null);
+        const resolvedProperties = properties ?? [];
+        useDebugConfig(name, resolvedProperties);
+        const context = {
+            properties: resolvedProperties
+        };
+        useEffect(()=>{
+            if (null !== properties && "function" == typeof onProperties) onProperties(properties);
+        }, [
+            properties
+        ]);
+        const stateUpdater = useCallback((properties)=>{
+            setProperties(properties);
+        }, []);
+        return /*#__PURE__*/ react.createElement(ViewContext.Provider, {
+            value: context
+        }, /*#__PURE__*/ react.createElement(Properties, {
+            name: name,
+            onChange: stateUpdater
+        }, /*#__PURE__*/ react.createElement(ConfigApplyTree, null)), null !== properties ? children : null);
+    };
+    function useConfig() {
+        const { properties } = useContext(ViewContext);
+        return useMemo(()=>toObject(properties), [
+            properties
+        ]);
+    }
+    return {
+        WithConfig,
+        Config,
+        useConfig
     };
-    useEffect(() => {
-      if (properties !== null && typeof onProperties === "function") {
-        onProperties(properties);
-      }
-    }, [properties]);
-    const stateUpdater = useCallback(properties => {
-      setProperties(properties);
-    }, []);
-    return /*#__PURE__*/React.createElement(ViewContext.Provider, {
-      value: context
-    }, /*#__PURE__*/React.createElement(Properties, {
-      name: name,
-      onChange: stateUpdater
-    }, /*#__PURE__*/React.createElement(ConfigApplyTree, null)), properties !== null ? children : null);
-  };
-  function useConfig() {
-    const {
-      properties
-    } = useContext(ViewContext);
-    return useMemo(() => toObject(properties), [properties]);
-  }
-  return {
-    WithConfig,
-    Config,
-    useConfig
-  };
 }
+export { createConfigurableComponent };
 
 //# sourceMappingURL=createConfigurableComponent.js.map

package/createConfigurableComponent.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useContext","useEffect","useMemo","useState","Compose","makeDecoratable","Properties","toObject","useDebugConfig","PropertyPriorityProvider","createHOC","newChildren","BaseComponent","ConfigHOC","children","createElement","createConfigurableComponent","name","ConfigApplyPrimary","Fragment","ConfigApplySecondary","Config","priority","component","with","defaultContext","properties","ViewContext","createContext","ConfigApplyTree","memo","WithConfig","onProperties","setProperties","resolvedProperties","context","stateUpdater","Provider","value","onChange","useConfig"],"sources":["createConfigurableComponent.tsx"],"sourcesContent":["import React, { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\nimport type { Decorator } from \"@webiny/react-composition\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { GenericComponent } from \"@webiny/react-composition/types.js\";\nimport type { Property } from \"~/index.js\";\nimport { Properties, toObject } from \"~/index.js\";\nimport { useDebugConfig } from \"./useDebugConfig.js\";\nimport { PropertyPriorityProvider } from \"./PropertyPriority.js\";\n\n/**\n * Each `<Config>` call composes a new HOC around the previous one via `Compose`.\n * The last composed HOC is the outermost wrapper. By placing `{newChildren}`\n * (this HOC's addition) before `{children}` (all previously composed configs),\n * the final render order matches declaration order:\n *\n *   <Config>A</Config>  →  renders first  (outermost HOC, its newChildren rendered first)\n *   <Config>B</Config>  →  renders second\n *   <Config>C</Config>  →  renders third  (innermost, rendered last via children chain)\n *\n * This is important because Property components register in mount order,\n * so declaration order = mount order = predictable config resolution.\n */\nconst createHOC =\n    (newChildren: React.ReactNode): Decorator<GenericComponent<{ children?: React.ReactNode }>> =>\n    BaseComponent => {\n        return function ConfigHOC({ children }) {\n            return (\n                <BaseComponent>\n                    {newChildren}\n                    {children}\n                </BaseComponent>\n            );\n        };\n    };\n\nexport interface WithConfigProps {\n    children: React.ReactNode;\n    onProperties?(properties: Property[]): void;\n}\n\ninterface ConfigApplyProps {\n    children?: React.ReactNode;\n}\n\nexport interface ConfigProps {\n    children: React.ReactNode;\n    priority?: \"primary\" | \"secondary\";\n}\n\nexport function createConfigurableComponent<TConfig>(name: string) {\n    const ConfigApplyPrimary = makeDecoratable(\n        `${name}ConfigApply<Primary>`,\n        ({ children }: ConfigApplyProps) => {\n            return <>{children}</>;\n        }\n    );\n\n    const ConfigApplySecondary = makeDecoratable(\n        `${name}ConfigApply<Secondary>`,\n        ({ children }: ConfigApplyProps) => {\n            return <>{children}</>;\n        }\n    );\n\n    const Config = ({ priority = \"primary\", children }: ConfigProps) => {\n        if (priority === \"primary\") {\n            return <Compose component={ConfigApplyPrimary} with={createHOC(children)} />;\n        }\n        return <Compose component={ConfigApplySecondary} with={createHOC(children)} />;\n    };\n\n    interface ViewContext {\n        properties: Property[];\n    }\n\n    const defaultContext = { properties: [] };\n\n    const ViewContext = React.createContext<ViewContext>(defaultContext);\n\n    /**\n     * Memoized config subtree — ConfigApply components don't depend on WithConfig\n     * props, so they must not remount when the parent re-renders. Without this,\n     * every parent re-render causes Property components inside HOCs to unmount\n     * and remount, corrupting the config object.\n     */\n    const ConfigApplyTree = React.memo(function ConfigApplyTree() {\n        return (\n            <>\n                <ConfigApplyPrimary />\n                <PropertyPriorityProvider priority={1}>\n                    <ConfigApplySecondary />\n                </PropertyPriorityProvider>\n            </>\n        );\n    });\n\n    const WithConfig = ({ onProperties, children }: WithConfigProps) => {\n        // `null` = config not yet collected; `[]` = collected but empty.\n        // This distinction is critical: children must NOT render until the\n        // PropertyStore debounce has flushed and delivered the initial config.\n        // Rendering children with partial/empty config causes errors in\n        // consumers like LexicalEditor that require a complete config on mount.\n        const [properties, setProperties] = useState<Property[] | null>(null);\n        const resolvedProperties = properties ?? [];\n        useDebugConfig(name, resolvedProperties);\n        const context = { properties: resolvedProperties };\n\n        useEffect(() => {\n            if (properties !== null && typeof onProperties === \"function\") {\n                onProperties(properties);\n            }\n        }, [properties]);\n\n        const stateUpdater = useCallback((properties: Property[]) => {\n            setProperties(properties);\n        }, []);\n\n        return (\n            <ViewContext.Provider value={context}>\n                {/* ConfigApplyTree always renders so Property components inside\n                    composed HOCs can mount and register with the PropertyStore.\n                    It lives outside the children gate below. */}\n                <Properties name={name} onChange={stateUpdater}>\n                    <ConfigApplyTree />\n                </Properties>\n                {/* Gate: only render children once the PropertyStore has flushed\n                    its first batch (properties !== null). This guarantees that\n                    useConfig() returns a complete config object on first render. */}\n                {properties !== null ? children : null}\n            </ViewContext.Provider>\n        );\n    };\n\n    function useConfig<TExtra extends object>(): TConfig & TExtra {\n        const { properties } = useContext(ViewContext);\n        return useMemo(() => toObject<TConfig & TExtra>(properties), [properties]);\n    }\n\n    return {\n        WithConfig,\n        Config,\n        useConfig\n    };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"createConfigurableComponent.js","sources":["../src/createConfigurableComponent.tsx"],"sourcesContent":["import React, { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\nimport type { Decorator } from \"@webiny/react-composition\";\nimport { Compose, makeDecoratable } from \"@webiny/react-composition\";\nimport type { GenericComponent } from \"@webiny/react-composition/types.js\";\nimport type { Property } from \"~/index.js\";\nimport { Properties, toObject } from \"~/index.js\";\nimport { useDebugConfig } from \"./useDebugConfig.js\";\nimport { PropertyPriorityProvider } from \"./PropertyPriority.js\";\n\n/**\n * Each `<Config>` call composes a new HOC around the previous one via `Compose`.\n * The last composed HOC is the outermost wrapper. By placing `{newChildren}`\n * (this HOC's addition) before `{children}` (all previously composed configs),\n * the final render order matches declaration order:\n *\n *   <Config>A</Config>  →  renders first  (outermost HOC, its newChildren rendered first)\n *   <Config>B</Config>  →  renders second\n *   <Config>C</Config>  →  renders third  (innermost, rendered last via children chain)\n *\n * This is important because Property components register in mount order,\n * so declaration order = mount order = predictable config resolution.\n */\nconst createHOC =\n    (newChildren: React.ReactNode): Decorator<GenericComponent<{ children?: React.ReactNode }>> =>\n    BaseComponent => {\n        return function ConfigHOC({ children }) {\n            return (\n                <BaseComponent>\n                    {newChildren}\n                    {children}\n                </BaseComponent>\n            );\n        };\n    };\n\nexport interface WithConfigProps {\n    children: React.ReactNode;\n    onProperties?(properties: Property[]): void;\n}\n\ninterface ConfigApplyProps {\n    children?: React.ReactNode;\n}\n\nexport interface ConfigProps {\n    children: React.ReactNode;\n    priority?: \"primary\" | \"secondary\";\n}\n\nexport function createConfigurableComponent<TConfig>(name: string) {\n    const ConfigApplyPrimary = makeDecoratable(\n        `${name}ConfigApply<Primary>`,\n        ({ children }: ConfigApplyProps) => {\n            return <>{children}</>;\n        }\n    );\n\n    const ConfigApplySecondary = makeDecoratable(\n        `${name}ConfigApply<Secondary>`,\n        ({ children }: ConfigApplyProps) => {\n            return <>{children}</>;\n        }\n    );\n\n    const Config = ({ priority = \"primary\", children }: ConfigProps) => {\n        if (priority === \"primary\") {\n            return <Compose component={ConfigApplyPrimary} with={createHOC(children)} />;\n        }\n        return <Compose component={ConfigApplySecondary} with={createHOC(children)} />;\n    };\n\n    interface ViewContext {\n        properties: Property[];\n    }\n\n    const defaultContext = { properties: [] };\n\n    const ViewContext = React.createContext<ViewContext>(defaultContext);\n\n    /**\n     * Memoized config subtree — ConfigApply components don't depend on WithConfig\n     * props, so they must not remount when the parent re-renders. Without this,\n     * every parent re-render causes Property components inside HOCs to unmount\n     * and remount, corrupting the config object.\n     */\n    const ConfigApplyTree = React.memo(function ConfigApplyTree() {\n        return (\n            <>\n                <ConfigApplyPrimary />\n                <PropertyPriorityProvider priority={1}>\n                    <ConfigApplySecondary />\n                </PropertyPriorityProvider>\n            </>\n        );\n    });\n\n    const WithConfig = ({ onProperties, children }: WithConfigProps) => {\n        // `null` = config not yet collected; `[]` = collected but empty.\n        // This distinction is critical: children must NOT render until the\n        // PropertyStore debounce has flushed and delivered the initial config.\n        // Rendering children with partial/empty config causes errors in\n        // consumers like LexicalEditor that require a complete config on mount.\n        const [properties, setProperties] = useState<Property[] | null>(null);\n        const resolvedProperties = properties ?? [];\n        useDebugConfig(name, resolvedProperties);\n        const context = { properties: resolvedProperties };\n\n        useEffect(() => {\n            if (properties !== null && typeof onProperties === \"function\") {\n                onProperties(properties);\n            }\n        }, [properties]);\n\n        const stateUpdater = useCallback((properties: Property[]) => {\n            setProperties(properties);\n        }, []);\n\n        return (\n            <ViewContext.Provider value={context}>\n                {/* ConfigApplyTree always renders so Property components inside\n                    composed HOCs can mount and register with the PropertyStore.\n                    It lives outside the children gate below. */}\n                <Properties name={name} onChange={stateUpdater}>\n                    <ConfigApplyTree />\n                </Properties>\n                {/* Gate: only render children once the PropertyStore has flushed\n                    its first batch (properties !== null). This guarantees that\n                    useConfig() returns a complete config object on first render. */}\n                {properties !== null ? children : null}\n            </ViewContext.Provider>\n        );\n    };\n\n    function useConfig<TExtra extends object>(): TConfig & TExtra {\n        const { properties } = useContext(ViewContext);\n        return useMemo(() => toObject<TConfig & TExtra>(properties), [properties]);\n    }\n\n    return {\n        WithConfig,\n        Config,\n        useConfig\n    };\n}\n"],"names":["createHOC","newChildren","BaseComponent","children","createConfigurableComponent","name","ConfigApplyPrimary","makeDecoratable","ConfigApplySecondary","Config","priority","Compose","defaultContext","ViewContext","React","ConfigApplyTree","PropertyPriorityProvider","WithConfig","onProperties","properties","setProperties","useState","resolvedProperties","useDebugConfig","context","useEffect","stateUpdater","useCallback","Properties","useConfig","useContext","useMemo","toObject"],"mappings":";;;;;AAsBA,MAAMA,YACF,CAACC,cACDC,CAAAA,gBACW,SAAmB,EAAEC,QAAQ,EAAE;YAClC,OAAO,WAAP,GACI,oBAACD,eAAAA,MACID,aACAE;QAGb;AAiBD,SAASC,4BAAqCC,IAAY;IAC7D,MAAMC,qBAAqBC,gBACvB,GAAGF,KAAK,oBAAoB,CAAC,EAC7B,CAAC,EAAEF,QAAQ,EAAoB,GACpB,WAAP,GAAO,0CAAGA;IAIlB,MAAMK,uBAAuBD,gBACzB,GAAGF,KAAK,sBAAsB,CAAC,EAC/B,CAAC,EAAEF,QAAQ,EAAoB,GACpB,WAAP,GAAO,0CAAGA;IAIlB,MAAMM,SAAS,CAAC,EAAEC,WAAW,SAAS,EAAEP,QAAQ,EAAe;QAC3D,IAAIO,AAAa,cAAbA,UACA,OAAO,WAAP,GAAO,oBAACC,SAAOA;YAAC,WAAWL;YAAoB,MAAMN,UAAUG;;QAEnE,OAAO,WAAP,GAAO,oBAACQ,SAAOA;YAAC,WAAWH;YAAsB,MAAMR,UAAUG;;IACrE;IAMA,MAAMS,iBAAiB;QAAE,YAAY,EAAE;IAAC;IAExC,MAAMC,cAAc,WAAdA,GAAcC,MAAAA,aAAmB,CAAcF;IAQrD,MAAMG,kBAAkB,WAAlBA,GAAkBD,MAAAA,IAAU,CAAC;QAC/B,OAAO,WAAP,GACI,wDACI,oBAACR,oBAAAA,OAAAA,WAAAA,GACD,oBAACU,0BAAwBA;YAAC,UAAU;yBAChC,oBAACR,sBAAAA;IAIjB;IAEA,MAAMS,aAAa,CAAC,EAAEC,YAAY,EAAEf,QAAQ,EAAmB;QAM3D,MAAM,CAACgB,YAAYC,cAAc,GAAGC,SAA4B;QAChE,MAAMC,qBAAqBH,cAAc,EAAE;QAC3CI,eAAelB,MAAMiB;QACrB,MAAME,UAAU;YAAE,YAAYF;QAAmB;QAEjDG,UAAU;YACN,IAAIN,AAAe,SAAfA,cAAuB,AAAwB,cAAxB,OAAOD,cAC9BA,aAAaC;QAErB,GAAG;YAACA;SAAW;QAEf,MAAMO,eAAeC,YAAY,CAACR;YAC9BC,cAAcD;QAClB,GAAG,EAAE;QAEL,OAAO,WAAP,GACI,oBAACN,YAAY,QAAQ;YAAC,OAAOW;yBAIzB,oBAACI,YAAUA;YAAC,MAAMvB;YAAM,UAAUqB;yBAC9B,oBAACX,iBAAAA,QAKJI,AAAe,SAAfA,aAAsBhB,WAAW;IAG9C;IAEA,SAAS0B;QACL,MAAM,EAAEV,UAAU,EAAE,GAAGW,WAAWjB;QAClC,OAAOkB,QAAQ,IAAMC,SAA2Bb,aAAa;YAACA;SAAW;IAC7E;IAEA,OAAO;QACHF;QACAR;QACAoB;IACJ;AACJ"}

package/domain/PropertyStore.js

@@ -1,229 +1,154 @@
 import debounce from "lodash/debounce.js";
-export class PropertyStore {
-  map = new Map();
-  order = [];
-  queue = [];
-  listeners = new Set();
-  priorities = new Map();
-  /** Properties that were explicitly positioned via before/after. */
-  positioned = new Set();
-
-  /**
-   * Synchronous lookup map — written immediately on addProperty (before debounce),
-   * so useAncestor can find properties during render.
-   */
-  lookup = new Map();
-  scheduleFlush = debounce(() => {
-    this.processQueue();
-  }, 0);
-  get allProperties() {
-    return this.order.filter(id => this.map.has(id)).map(id => this.map.get(id));
-  }
-  subscribe(listener) {
-    this.listeners.add(listener);
-    return () => {
-      this.listeners.delete(listener);
-    };
-  }
-
-  /**
-   * Returns properties that are children of the given parent ID.
-   * Reads from the synchronous lookup map, so it works during render
-   * before the debounced queue has flushed.
-   */
-  getChildrenOf(parentId) {
-    return Array.from(this.lookup.values()).filter(p => p.parent === parentId);
-  }
-
-  /**
-   * Find a property by ID from the synchronous lookup map.
-   */
-  getById(id) {
-    return this.lookup.get(id);
-  }
-
-  /**
-   * Register a property in the synchronous lookup map during render,
-   * so useAncestor can find it before the debounced queue flushes.
-   */
-  registerLookup(property) {
-    if (this.lookup.has(property.id)) {
-      const existing = this.lookup.get(property.id);
-      this.lookup.set(property.id, {
-        ...existing,
-        ...property
-      });
-    } else {
-      this.lookup.set(property.id, property);
-    }
-  }
-  addProperty(property, options = {}) {
-    this.registerLookup(property);
-    this.queue.push({
-      type: "add",
-      property,
-      options
-    });
-    this.scheduleFlush();
-  }
-  removeProperty(id) {
-    this.lookup.delete(id);
-    this.queue.push({
-      type: "remove",
-      id
-    });
-    this.scheduleFlush();
-  }
-  replaceProperty(oldId, newProperty) {
-    this.lookup.delete(oldId);
-    this.lookup.set(newProperty.id, newProperty);
-    this.queue.push({
-      type: "replace",
-      oldId,
-      newProperty
-    });
-    this.scheduleFlush();
-  }
-  processQueue() {
-    if (this.queue.length === 0) {
-      return;
-    }
-    const ops = this.queue.splice(0);
-
-    // Stable-sort operations so that "add" ops with lower priority numbers
-    // are processed first. Non-add operations and adds with default priority (0)
-    // keep their original order.
-    ops.sort((a, b) => {
-      const pa = a.type === "add" ? a.options.priority ?? 0 : 0;
-      const pb = b.type === "add" ? b.options.priority ?? 0 : 0;
-      return pa - pb;
-    });
-    for (const op of ops) {
-      switch (op.type) {
-        case "add":
-          this.executeAdd(op.property, op.options);
-          break;
-        case "remove":
-          this.executeRemove(op.id);
-          break;
-        case "replace":
-          this.executeReplace(op.oldId, op.newProperty);
-          break;
-      }
+class PropertyStore {
+    get allProperties() {
+        return this.order.filter((id)=>this.map.has(id)).map((id)=>this.map.get(id));
+    }
+    subscribe(listener) {
+        this.listeners.add(listener);
+        return ()=>{
+            this.listeners.delete(listener);
+        };
+    }
+    getChildrenOf(parentId) {
+        return Array.from(this.lookup.values()).filter((p)=>p.parent === parentId);
+    }
+    getById(id) {
+        return this.lookup.get(id);
+    }
+    registerLookup(property) {
+        if (this.lookup.has(property.id)) {
+            const existing = this.lookup.get(property.id);
+            this.lookup.set(property.id, {
+                ...existing,
+                ...property
+            });
+        } else this.lookup.set(property.id, property);
+    }
+    addProperty(property, options = {}) {
+        this.registerLookup(property);
+        this.queue.push({
+            type: "add",
+            property,
+            options
+        });
+        this.scheduleFlush();
+    }
+    removeProperty(id) {
+        this.lookup.delete(id);
+        this.queue.push({
+            type: "remove",
+            id
+        });
+        this.scheduleFlush();
+    }
+    replaceProperty(oldId, newProperty) {
+        this.lookup.delete(oldId);
+        this.lookup.set(newProperty.id, newProperty);
+        this.queue.push({
+            type: "replace",
+            oldId,
+            newProperty
+        });
+        this.scheduleFlush();
+    }
+    processQueue() {
+        if (0 === this.queue.length) return;
+        const ops = this.queue.splice(0);
+        ops.sort((a, b)=>{
+            const pa = "add" === a.type ? a.options.priority ?? 0 : 0;
+            const pb = "add" === b.type ? b.options.priority ?? 0 : 0;
+            return pa - pb;
+        });
+        for (const op of ops)switch(op.type){
+            case "add":
+                this.executeAdd(op.property, op.options);
+                break;
+            case "remove":
+                this.executeRemove(op.id);
+                break;
+            case "replace":
+                this.executeReplace(op.oldId, op.newProperty);
+                break;
+        }
+        this.order.sort((a, b)=>{
+            if (this.positioned.has(a) || this.positioned.has(b)) return 0;
+            return (this.priorities.get(a) ?? 0) - (this.priorities.get(b) ?? 0);
+        });
+        const properties = this.allProperties;
+        for (const listener of this.listeners)listener(properties);
+    }
+    executeAdd(property, options) {
+        if (options.after || options.before) this.positioned.add(property.id);
+        const exists = this.map.has(property.id);
+        if (exists) {
+            const existing = this.map.get(property.id);
+            this.map.set(property.id, {
+                ...existing,
+                ...property
+            });
+            if (options.after) this.reposition(property.id, options.after, "after");
+            else if (options.before) this.reposition(property.id, options.before, "before");
+            return;
+        }
+        this.map.set(property.id, property);
+        this.priorities.set(property.id, options.priority ?? 0);
+        if (options.after) this.insertAfter(property.id, options.after);
+        else if (options.before) this.insertBefore(property.id, options.before);
+        else this.order.push(property.id);
+    }
+    executeRemove(id) {
+        if (!this.map.has(id)) return;
+        this.map.delete(id);
+        this.priorities.delete(id);
+        this.positioned.delete(id);
+        this.order = this.order.filter((oid)=>oid !== id);
+    }
+    executeReplace(oldId, newProperty) {
+        const idx = this.order.indexOf(oldId);
+        if (-1 === idx) return;
+        this.map.delete(oldId);
+        this.map.set(newProperty.id, newProperty);
+        this.order[idx] = newProperty.id;
+        this.removeDescendants(oldId);
+    }
+    insertBefore(id, before) {
+        if (before.endsWith("$first")) return void this.order.unshift(id);
+        const targetIdx = this.order.indexOf(before);
+        if (-1 === targetIdx) return void this.order.push(id);
+        this.order.splice(targetIdx, 0, id);
+    }
+    insertAfter(id, after) {
+        if (after.endsWith("$last")) return void this.order.push(id);
+        const targetIdx = this.order.indexOf(after);
+        if (-1 === targetIdx) return void this.order.push(id);
+        this.order.splice(targetIdx + 1, 0, id);
+    }
+    reposition(id, targetId, position) {
+        this.order = this.order.filter((oid)=>oid !== id);
+        if ("before" === position) this.insertBefore(id, targetId);
+        else this.insertAfter(id, targetId);
+    }
+    removeDescendants(parentId) {
+        const children = Array.from(this.map.values()).filter((p)=>p.parent === parentId);
+        for (const child of children){
+            this.map.delete(child.id);
+            this.order = this.order.filter((oid)=>oid !== child.id);
+            this.removeDescendants(child.id);
+        }
+    }
+    constructor(){
+        this.map = new Map();
+        this.order = [];
+        this.queue = [];
+        this.listeners = new Set();
+        this.priorities = new Map();
+        this.positioned = new Set();
+        this.lookup = new Map();
+        this.scheduleFlush = debounce(()=>{
+            this.processQueue();
+        }, 0);
     }
-
-    // Stable-sort the order array by priority, but only for properties
-    // that were NOT explicitly positioned via before/after. Explicitly
-    // positioned properties keep their placement.
-    this.order.sort((a, b) => {
-      if (this.positioned.has(a) || this.positioned.has(b)) {
-        return 0;
-      }
-      return (this.priorities.get(a) ?? 0) - (this.priorities.get(b) ?? 0);
-    });
-    const properties = this.allProperties;
-    for (const listener of this.listeners) {
-      listener(properties);
-    }
-  }
-  executeAdd(property, options) {
-    if (options.after || options.before) {
-      this.positioned.add(property.id);
-    }
-    const exists = this.map.has(property.id);
-    if (exists) {
-      // Merge into existing property. Keep the original priority so
-      // that a secondary config overriding a primary property doesn't
-      // cause the re-sort to move it after all primary properties.
-      const existing = this.map.get(property.id);
-      this.map.set(property.id, {
-        ...existing,
-        ...property
-      });
-      if (options.after) {
-        this.reposition(property.id, options.after, "after");
-      } else if (options.before) {
-        this.reposition(property.id, options.before, "before");
-      }
-      return;
-    }
-    this.map.set(property.id, property);
-    // Set priority only for new properties — not merges (handled above).
-    this.priorities.set(property.id, options.priority ?? 0);
-    if (options.after) {
-      this.insertAfter(property.id, options.after);
-    } else if (options.before) {
-      this.insertBefore(property.id, options.before);
-    } else {
-      this.order.push(property.id);
-    }
-  }
-  executeRemove(id) {
-    if (!this.map.has(id)) {
-      return;
-    }
-    this.map.delete(id);
-    this.priorities.delete(id);
-    this.positioned.delete(id);
-    this.order = this.order.filter(oid => oid !== id);
-    // Note: we intentionally do NOT call removeDescendants here.
-    // React's component lifecycle ensures that when a parent Property
-    // unmounts, all child Properties unmount too — each triggering its
-    // own removeProperty call. Calling removeDescendants would wipe
-    // children that belong to OTHER still-mounted configs sharing the
-    // same parent ID (e.g., id="pageSettings" used by both primary
-    // and secondary configs).
-  }
-  executeReplace(oldId, newProperty) {
-    const idx = this.order.indexOf(oldId);
-    if (idx === -1) {
-      return;
-    }
-    this.map.delete(oldId);
-    this.map.set(newProperty.id, newProperty);
-    this.order[idx] = newProperty.id;
-    this.removeDescendants(oldId);
-  }
-  insertBefore(id, before) {
-    if (before.endsWith("$first")) {
-      this.order.unshift(id);
-      return;
-    }
-    const targetIdx = this.order.indexOf(before);
-    if (targetIdx === -1) {
-      this.order.push(id);
-      return;
-    }
-    this.order.splice(targetIdx, 0, id);
-  }
-  insertAfter(id, after) {
-    if (after.endsWith("$last")) {
-      this.order.push(id);
-      return;
-    }
-    const targetIdx = this.order.indexOf(after);
-    if (targetIdx === -1) {
-      this.order.push(id);
-      return;
-    }
-    this.order.splice(targetIdx + 1, 0, id);
-  }
-  reposition(id, targetId, position) {
-    this.order = this.order.filter(oid => oid !== id);
-    if (position === "before") {
-      this.insertBefore(id, targetId);
-    } else {
-      this.insertAfter(id, targetId);
-    }
-  }
-  removeDescendants(parentId) {
-    const children = Array.from(this.map.values()).filter(p => p.parent === parentId);
-    for (const child of children) {
-      this.map.delete(child.id);
-      this.order = this.order.filter(oid => oid !== child.id);
-      this.removeDescendants(child.id);
-    }
-  }
 }
+export { PropertyStore };
 
 //# sourceMappingURL=PropertyStore.js.map