@webiny/react-properties 0.0.0-unstable.7f63ea0744 → 0.0.0-unstable.81ae05e56b

package/README.md

@@ -1,65 +1,11 @@
-# React Properties
+# @webiny/react-properties
 
-[![](https://img.shields.io/npm/dw/@webiny/react-properties.svg)](https://www.npmjs.com/package/@webiny/react-properties)
-[![](https://img.shields.io/npm/v/@webiny/react-properties.svg)](https://www.npmjs.com/package/@webiny/react-properties)
-[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
-[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
+> [!NOTE]
+> This package is part of the [Webiny](https://www.webiny.com) monorepo.
+> It’s **included in every Webiny project by default** and is not meant to be used as a standalone package.
 
-A tiny React properties framework, to build dynamic data objects using React components, which can be customized after initial creation. The usage is very similar to how you write XML data structures, but in this case you're using actual React.
+📘 **Documentation:** [https://www.webiny.com/docs](https://www.webiny.com/docs)
 
-## Basic Example
+---
 
-```jsx
-import React, { useCallback } from "react";
-import { Properties, Property, toObject } from "@webiny/react-properties";
-
-const View = () => {
-  const onChange = useCallback(properties => {
-    console.log(toObject(properties));
-  }, []);
-
-  return (
-    <Properties onChange={onChange}>
-      <Property name={"group"}>
-        <Property name={"name"} value={"layout"} />
-        <Property name={"label"} value={"Layout"} />
-        <Property name={"toolbar"}>
-          <Property name={"name"} value={"basic"} />
-        </Property>
-      </Property>
-      <Property name={"group"}>
-        <Property name={"name"} value={"heroes"} />
-        <Property name={"label"} value={"Heroes"} />
-        <Property name={"toolbar"}>
-          <Property name={"name"} value={"heroes"} />
-        </Property>
-      </Property>
-    </Properties>
-  );
-};
-```
-
-Output:
-
-```json
-{
-  "group": [
-    {
-      "name": "layout",
-      "label": "Layout",
-      "toolbar": {
-        "name": "basic"
-      }
-    },
-    {
-      "name": "heroes",
-      "label": "Heroes",
-      "toolbar": {
-        "name": "heroes"
-      }
-    }
-  ]
-}
-```
-
-For more examples, check out the test files.
+_This README file is automatically generated during the publish process._

package/createConfigurableComponent.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import type { Property } from "./index.js";
+export interface WithConfigProps {
+    children: React.ReactNode;
+    onProperties?(properties: Property[]): void;
+}
+export interface ConfigProps {
+    children: React.ReactNode;
+    priority?: "primary" | "secondary";
+}
+export declare function createConfigurableComponent<TConfig>(name: string): {
+    WithConfig: ({ onProperties, children }: WithConfigProps) => React.JSX.Element;
+    Config: ({ priority, children }: ConfigProps) => React.JSX.Element;
+    useConfig: <TExtra extends object>() => TConfig & TExtra;
+};

package/createConfigurableComponent.js

@@ -0,0 +1,112 @@
+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 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
+    };
+    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
+  };
+}
+
+//# sourceMappingURL=createConfigurableComponent.js.map

package/createConfigurableComponent.js.map

@@ -0,0 +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":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAEpF,SAASC,OAAO,EAAEC,eAAe,QAAQ,2BAA2B;AAGpE,SAASC,UAAU,EAAEC,QAAQ;AAC7B,SAASC,cAAc;AACvB,SAASC,wBAAwB;;AAEjC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,SAAS,GACVC,WAA4B,IAC7BC,aAAa,IAAI;EACb,OAAO,SAASC,SAASA,CAAC;IAAEC;EAAS,CAAC,EAAE;IACpC,oBACIhB,KAAA,CAAAiB,aAAA,CAACH,aAAa,QACTD,WAAW,EACXG,QACU,CAAC;EAExB,CAAC;AACL,CAAC;AAgBL,OAAO,SAASE,2BAA2BA,CAAUC,IAAY,EAAE;EAC/D,MAAMC,kBAAkB,GAAGb,eAAe,CACtC,GAAGY,IAAI,sBAAsB,EAC7B,CAAC;IAAEH;EAA2B,CAAC,KAAK;IAChC,oBAAOhB,KAAA,CAAAiB,aAAA,CAAAjB,KAAA,CAAAqB,QAAA,QAAGL,QAAW,CAAC;EAC1B,CACJ,CAAC;EAED,MAAMM,oBAAoB,GAAGf,eAAe,CACxC,GAAGY,IAAI,wBAAwB,EAC/B,CAAC;IAAEH;EAA2B,CAAC,KAAK;IAChC,oBAAOhB,KAAA,CAAAiB,aAAA,CAAAjB,KAAA,CAAAqB,QAAA,QAAGL,QAAW,CAAC;EAC1B,CACJ,CAAC;EAED,MAAMO,MAAM,GAAGA,CAAC;IAAEC,QAAQ,GAAG,SAAS;IAAER;EAAsB,CAAC,KAAK;IAChE,IAAIQ,QAAQ,KAAK,SAAS,EAAE;MACxB,oBAAOxB,KAAA,CAAAiB,aAAA,CAACX,OAAO;QAACmB,SAAS,EAAEL,kBAAmB;QAACM,IAAI,EAAEd,SAAS,CAACI,QAAQ;MAAE,CAAE,CAAC;IAChF;IACA,oBAAOhB,KAAA,CAAAiB,aAAA,CAACX,OAAO;MAACmB,SAAS,EAAEH,oBAAqB;MAACI,IAAI,EAAEd,SAAS,CAACI,QAAQ;IAAE,CAAE,CAAC;EAClF,CAAC;EAMD,MAAMW,cAAc,GAAG;IAAEC,UAAU,EAAE;EAAG,CAAC;EAEzC,MAAMC,WAAW,gBAAG7B,KAAK,CAAC8B,aAAa,CAAcH,cAAc,CAAC;;EAEpE;AACJ;AACA;AACA;AACA;AACA;EACI,MAAMI,eAAe,gBAAG/B,KAAK,CAACgC,IAAI,CAAC,SAASD,eAAeA,CAAA,EAAG;IAC1D,oBACI/B,KAAA,CAAAiB,aAAA,CAAAjB,KAAA,CAAAqB,QAAA,qBACIrB,KAAA,CAAAiB,aAAA,CAACG,kBAAkB,MAAE,CAAC,eACtBpB,KAAA,CAAAiB,aAAA,CAACN,wBAAwB;MAACa,QAAQ,EAAE;IAAE,gBAClCxB,KAAA,CAAAiB,aAAA,CAACK,oBAAoB,MAAE,CACD,CAC5B,CAAC;EAEX,CAAC,CAAC;EAEF,MAAMW,UAAU,GAAGA,CAAC;IAAEC,YAAY;IAAElB;EAA0B,CAAC,KAAK;IAChE;IACA;IACA;IACA;IACA;IACA,MAAM,CAACY,UAAU,EAAEO,aAAa,CAAC,GAAG9B,QAAQ,CAAoB,IAAI,CAAC;IACrE,MAAM+B,kBAAkB,GAAGR,UAAU,IAAI,EAAE;IAC3ClB,cAAc,CAACS,IAAI,EAAEiB,kBAAkB,CAAC;IACxC,MAAMC,OAAO,GAAG;MAAET,UAAU,EAAEQ;IAAmB,CAAC;IAElDjC,SAAS,CAAC,MAAM;MACZ,IAAIyB,UAAU,KAAK,IAAI,IAAI,OAAOM,YAAY,KAAK,UAAU,EAAE;QAC3DA,YAAY,CAACN,UAAU,CAAC;MAC5B;IACJ,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;IAEhB,MAAMU,YAAY,GAAGrC,WAAW,CAAE2B,UAAsB,IAAK;MACzDO,aAAa,CAACP,UAAU,CAAC;IAC7B,CAAC,EAAE,EAAE,CAAC;IAEN,oBACI5B,KAAA,CAAAiB,aAAA,CAACY,WAAW,CAACU,QAAQ;MAACC,KAAK,EAAEH;IAAQ,gBAIjCrC,KAAA,CAAAiB,aAAA,CAACT,UAAU;MAACW,IAAI,EAAEA,IAAK;MAACsB,QAAQ,EAAEH;IAAa,gBAC3CtC,KAAA,CAAAiB,aAAA,CAACc,eAAe,MAAE,CACV,CAAC,EAIZH,UAAU,KAAK,IAAI,GAAGZ,QAAQ,GAAG,IAChB,CAAC;EAE/B,CAAC;EAED,SAAS0B,SAASA,CAAA,EAA4C;IAC1D,MAAM;MAAEd;IAAW,CAAC,GAAG1B,UAAU,CAAC2B,WAAW,CAAC;IAC9C,OAAOzB,OAAO,CAAC,MAAMK,QAAQ,CAAmBmB,UAAU,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAC9E;EAEA,OAAO;IACHK,UAAU;IACVV,MAAM;IACNmB;EACJ,CAAC;AACL","ignoreList":[]}

package/domain/PropertyStore.d.ts

@@ -0,0 +1,51 @@
+import type { Property } from "../Properties.js";
+interface AddPropertyOptions {
+    after?: string;
+    before?: string;
+    priority?: number;
+}
+type Listener = (properties: Property[]) => void;
+export declare class PropertyStore {
+    private map;
+    private order;
+    private queue;
+    private listeners;
+    private priorities;
+    /** Properties that were explicitly positioned via before/after. */
+    private positioned;
+    /**
+     * Synchronous lookup map — written immediately on addProperty (before debounce),
+     * so useAncestor can find properties during render.
+     */
+    private lookup;
+    private scheduleFlush;
+    get allProperties(): Property[];
+    subscribe(listener: Listener): () => void;
+    /**
+     * 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: string): Property[];
+    /**
+     * Find a property by ID from the synchronous lookup map.
+     */
+    getById(id: string): Property | undefined;
+    /**
+     * Register a property in the synchronous lookup map during render,
+     * so useAncestor can find it before the debounced queue flushes.
+     */
+    registerLookup(property: Property): void;
+    addProperty(property: Property, options?: AddPropertyOptions): void;
+    removeProperty(id: string): void;
+    replaceProperty(oldId: string, newProperty: Property): void;
+    private processQueue;
+    private executeAdd;
+    private executeRemove;
+    private executeReplace;
+    private insertBefore;
+    private insertAfter;
+    private reposition;
+    private removeDescendants;
+}
+export {};

package/domain/PropertyStore.js

@@ -0,0 +1,229 @@
+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;
+      }
+    }
+
+    // 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);
+    }
+  }
+}
+
+//# sourceMappingURL=PropertyStore.js.map

package/domain/PropertyStore.js.map

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

package/domain/index.d.ts

@@ -0,0 +1 @@
+export { PropertyStore } from "./PropertyStore.js";

package/domain/index.js

@@ -0,0 +1,3 @@
+export { PropertyStore } from "./PropertyStore.js";
+
+//# sourceMappingURL=index.js.map

package/domain/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PropertyStore"],"sources":["index.ts"],"sourcesContent":["export { PropertyStore } from \"./PropertyStore.js\";\n"],"mappings":"AAAA,SAASA,aAAa","ignoreList":[]}

package/index.d.ts

@@ -1,2 +1,7 @@
-export * from "./utils";
-export * from "./Properties";
+export * from "./utils.js";
+export * from "./Properties.js";
+export * from "./useDebugConfig.js";
+export * from "./useIdGenerator.js";
+export * from "./createConfigurableComponent.js";
+export * from "./domain/index.js";
+export { DevToolsSection } from "./DevToolsSection.js";

package/index.js

@@ -1,27 +1,9 @@
-"use strict";
+export * from "./utils.js";
+export * from "./Properties.js";
+export * from "./useDebugConfig.js";
+export * from "./useIdGenerator.js";
+export * from "./createConfigurableComponent.js";
+export * from "./domain/index.js";
+export { DevToolsSection } from "./DevToolsSection.js";
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _utils = require("./utils");
-Object.keys(_utils).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _utils[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _utils[key];
-    }
-  });
-});
-var _Properties = require("./Properties");
-Object.keys(_Properties).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _Properties[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _Properties[key];
-    }
-  });
-});
+//# sourceMappingURL=index.js.map

package/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./utils\";\nexport * from \"./Properties\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":["DevToolsSection"],"sources":["index.ts"],"sourcesContent":["export * from \"./utils.js\";\nexport * from \"./Properties.js\";\nexport * from \"./useDebugConfig.js\";\nexport * from \"./useIdGenerator.js\";\nexport * from \"./createConfigurableComponent.js\";\nexport * from \"./domain/index.js\";\nexport { DevToolsSection } from \"./DevToolsSection.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,eAAe","ignoreList":[]}

package/package.json

@@ -1,6 +1,7 @@
 {
 	"name": "@webiny/react-properties",
-	"version": "0.0.0-unstable.7f63ea0744",
+	"version": "0.0.0-unstable.81ae05e56b",
+	"type": "module",
 	"main": "index.js",
 	"repository": {
 		"type": "git",
@@ -10,25 +11,21 @@
 	"author": "Webiny Ltd",
 	"license": "MIT",
 	"dependencies": {
-		"@babel/runtime": "7.20.13",
-		"@types/react": "17.0.39",
-		"nanoid": "3.3.4",
-		"react": "17.0.2"
+		"@types/react": "18.3.28",
+		"@webiny/react-composition": "0.0.0-unstable.81ae05e56b",
+		"lodash": "4.17.23",
+		"nanoid": "5.1.7",
+		"react": "18.3.1"
 	},
 	"devDependencies": {
-		"@testing-library/react": "^12.1.5",
-		"@webiny/cli": "^0.0.0-unstable.7f63ea0744",
-		"@webiny/project-utils": "^0.0.0-unstable.7f63ea0744",
-		"@webiny/react-composition": "^0.0.0-unstable.7f63ea0744",
-		"prettier": "^2.8.3"
+		"@testing-library/react": "16.3.2",
+		"@webiny/build-tools": "0.0.0-unstable.81ae05e56b",
+		"prettier": "3.6.2",
+		"vitest": "4.1.0"
 	},
 	"publishConfig": {
 		"access": "public",
 		"directory": "dist"
 	},
-	"scripts": {
-		"build": "yarn webiny run build",
-		"watch": "yarn webiny run watch"
-	},
-	"gitHead": "7f63ea0744c9e31977e5dabb95538d22b4db585c"
+	"gitHead": "81ae05e56bcc774d1e077ca615a0005e736aa5a6"
 }