@webiny/react-composition 6.3.0-beta.4 → 6.4.0-beta.0

package/Compose.js

@@ -1,83 +1,56 @@
-import React, { useEffect, useRef } from "react";
+import react, { useEffect, useRef } from "react";
 import { useCompositionStore } from "./Context.js";
 import { useCompositionScope } from "./CompositionScope.js";
-export const Compose = props => {
-  const store = useCompositionStore();
-  const {
-    scope,
-    inherit
-  } = useCompositionScope();
-  const targetFn = props.function ?? props.component;
-  if (!targetFn) {
-    console.warn("You must provide a function or a component to compose with!", props);
-    return null;
-  }
-  if (typeof targetFn.original === "undefined") {
-    console.warn(`You must make your function "${targetFn.originalName ?? targetFn.name}" composable, by using the makeDecoratable() function!`);
-    return null;
-  }
-  const decorators = Array.isArray(props.with) ? props.with : [props.with];
-  const currentScope = scope[scope.length - 1] ?? "*";
-
-  // Register synchronously during render so decorators are available immediately.
-  // Pass silent=true to avoid notifying listeners mid-render (which would trigger
-  // setState in other components and cause React warnings).
-  store.register(targetFn.original, decorators, currentScope, inherit, true);
-  return /*#__PURE__*/React.createElement(ComposeEffects, {
-    store: store,
-    target: targetFn.original,
-    decorators: decorators,
-    scope: currentScope,
-    inherit: inherit
-  });
+const Compose = (props)=>{
+    const store = useCompositionStore();
+    const { scope, inherit } = useCompositionScope();
+    const targetFn = props.function ?? props.component;
+    if (!targetFn) {
+        console.warn("You must provide a function or a component to compose with!", props);
+        return null;
+    }
+    if (void 0 === targetFn.original) {
+        console.warn(`You must make your function "${targetFn.originalName ?? targetFn.name}" composable, by using the makeDecoratable() function!`);
+        return null;
+    }
+    const decorators = Array.isArray(props.with) ? props.with : [
+        props.with
+    ];
+    const currentScope = scope[scope.length - 1] ?? "*";
+    store.register(targetFn.original, decorators, currentScope, inherit, true);
+    return /*#__PURE__*/ react.createElement(ComposeEffects, {
+        store: store,
+        target: targetFn.original,
+        decorators: decorators,
+        scope: currentScope,
+        inherit: inherit
+    });
 };
-
-/**
- * Separate component for the effect to avoid re-running the cleanup on every render.
- * This component handles cleanup on unmount and when props change.
- */
-function ComposeEffects({
-  store,
-  target,
-  decorators,
-  scope,
-  inherit
-}) {
-  const prevRef = useRef(null);
-
-  // Tracks the decorators currently live in the store as of the last render.
-  // Updated synchronously during render so it always reflects the most recently
-  // registered decorators, allowing the atomic swap below to remove the right ones.
-  const liveRef = useRef(decorators);
-
-  // On re-render with new decorators: atomically replace the old ones in the store
-  // during render (before React commits). This ensures the store never transiently
-  // holds both old and new HOCs — which would cause useSyncExternalStore subscribers
-  // to render with a doubly-wrapped component and mount inner components twice.
-  if (liveRef.current !== decorators) {
-    store.register(target, decorators, scope, inherit, true, liveRef.current);
-    liveRef.current = decorators;
-  }
-  useEffect(() => {
-    const prev = prevRef.current;
-
-    // On prop change: the render-phase atomic swap already updated the store.
-    // Emit a non-silent notification now that effects have settled so subscribers
-    // re-render with the final, clean composition (old HOCs fully gone).
-    if (prev && (prev.decorators !== decorators || prev.scope !== scope)) {
-      store.notify();
+function ComposeEffects({ store, target, decorators, scope, inherit }) {
+    const prevRef = useRef(null);
+    const liveRef = useRef(decorators);
+    if (liveRef.current !== decorators) {
+        store.register(target, decorators, scope, inherit, true, liveRef.current);
+        liveRef.current = decorators;
     }
-    prevRef.current = {
-      decorators,
-      scope
-    };
-
-    // Cleanup on unmount.
-    return () => {
-      store.unregister(target, decorators, scope);
-    };
-  }, [store, target, decorators, scope]);
-  return null;
+    useEffect(()=>{
+        const prev = prevRef.current;
+        if (prev && (prev.decorators !== decorators || prev.scope !== scope)) store.notify();
+        prevRef.current = {
+            decorators,
+            scope
+        };
+        return ()=>{
+            store.unregister(target, decorators, scope);
+        };
+    }, [
+        store,
+        target,
+        decorators,
+        scope
+    ]);
+    return null;
 }
+export { Compose };
 
 //# sourceMappingURL=Compose.js.map

package/Compose.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useRef","useCompositionStore","useCompositionScope","Compose","props","store","scope","inherit","targetFn","function","component","console","warn","original","originalName","name","decorators","Array","isArray","with","currentScope","length","register","createElement","ComposeEffects","target","prevRef","liveRef","current","prev","notify","unregister"],"sources":["Compose.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport type { DecoratableTypes } from \"./Context.js\";\nimport { useCompositionStore } from \"./Context.js\";\nimport { useCompositionScope } from \"~/CompositionScope.js\";\nimport type {\n    ComposeWith,\n    Decoratable,\n    Decorator,\n    GenericComponent,\n    GenericHook\n} from \"./types.js\";\n\nexport interface ComposeProps {\n    function?: DecoratableTypes;\n    component?: DecoratableTypes;\n    with: ComposeWith;\n}\n\nexport const Compose = (props: ComposeProps) => {\n    const store = useCompositionStore();\n    const { scope, inherit } = useCompositionScope();\n\n    const targetFn = (props.function ?? props.component) as Decoratable;\n\n    if (!targetFn) {\n        console.warn(\"You must provide a function or a component to compose with!\", props);\n        return null;\n    }\n\n    if (typeof targetFn.original === \"undefined\") {\n        console.warn(\n            `You must make your function \"${\n                targetFn.originalName ?? targetFn.name\n            }\" composable, by using the makeDecoratable() function!`\n        );\n        return null;\n    }\n\n    const decorators = (Array.isArray(props.with) ? props.with : [props.with]) as Decorator<\n        GenericComponent | GenericHook\n    >[];\n    const currentScope = scope[scope.length - 1] ?? \"*\";\n\n    // Register synchronously during render so decorators are available immediately.\n    // Pass silent=true to avoid notifying listeners mid-render (which would trigger\n    // setState in other components and cause React warnings).\n    store.register(targetFn.original, decorators, currentScope, inherit, true);\n\n    return (\n        <ComposeEffects\n            store={store}\n            target={targetFn.original}\n            decorators={decorators}\n            scope={currentScope}\n            inherit={inherit}\n        />\n    );\n};\n\n/**\n * Separate component for the effect to avoid re-running the cleanup on every render.\n * This component handles cleanup on unmount and when props change.\n */\nfunction ComposeEffects({\n    store,\n    target,\n    decorators,\n    scope,\n    inherit\n}: {\n    store: ReturnType<typeof useCompositionStore>;\n    target: any;\n    decorators: Decorator<GenericComponent | GenericHook>[];\n    scope: string;\n    inherit: boolean;\n}) {\n    const prevRef = useRef<{\n        decorators: Decorator<GenericComponent | GenericHook>[];\n        scope: string;\n    } | null>(null);\n\n    // Tracks the decorators currently live in the store as of the last render.\n    // Updated synchronously during render so it always reflects the most recently\n    // registered decorators, allowing the atomic swap below to remove the right ones.\n    const liveRef = useRef<Decorator<GenericComponent | GenericHook>[]>(decorators);\n\n    // On re-render with new decorators: atomically replace the old ones in the store\n    // during render (before React commits). This ensures the store never transiently\n    // holds both old and new HOCs — which would cause useSyncExternalStore subscribers\n    // to render with a doubly-wrapped component and mount inner components twice.\n    if (liveRef.current !== decorators) {\n        store.register(target, decorators, scope, inherit, true, liveRef.current);\n        liveRef.current = decorators;\n    }\n\n    useEffect(() => {\n        const prev = prevRef.current;\n\n        // On prop change: the render-phase atomic swap already updated the store.\n        // Emit a non-silent notification now that effects have settled so subscribers\n        // re-render with the final, clean composition (old HOCs fully gone).\n        if (prev && (prev.decorators !== decorators || prev.scope !== scope)) {\n            store.notify();\n        }\n\n        prevRef.current = { decorators, scope };\n\n        // Cleanup on unmount.\n        return () => {\n            store.unregister(target, decorators, scope);\n        };\n    }, [store, target, decorators, scope]);\n\n    return null;\n}\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAEhD,SAASC,mBAAmB;AAC5B,SAASC,mBAAmB;AAe5B,OAAO,MAAMC,OAAO,GAAIC,KAAmB,IAAK;EAC5C,MAAMC,KAAK,GAAGJ,mBAAmB,CAAC,CAAC;EACnC,MAAM;IAAEK,KAAK;IAAEC;EAAQ,CAAC,GAAGL,mBAAmB,CAAC,CAAC;EAEhD,MAAMM,QAAQ,GAAIJ,KAAK,CAACK,QAAQ,IAAIL,KAAK,CAACM,SAAyB;EAEnE,IAAI,CAACF,QAAQ,EAAE;IACXG,OAAO,CAACC,IAAI,CAAC,6DAA6D,EAAER,KAAK,CAAC;IAClF,OAAO,IAAI;EACf;EAEA,IAAI,OAAOI,QAAQ,CAACK,QAAQ,KAAK,WAAW,EAAE;IAC1CF,OAAO,CAACC,IAAI,CACR,gCACIJ,QAAQ,CAACM,YAAY,IAAIN,QAAQ,CAACO,IAAI,wDAE9C,CAAC;IACD,OAAO,IAAI;EACf;EAEA,MAAMC,UAAU,GAAIC,KAAK,CAACC,OAAO,CAACd,KAAK,CAACe,IAAI,CAAC,GAAGf,KAAK,CAACe,IAAI,GAAG,CAACf,KAAK,CAACe,IAAI,CAErE;EACH,MAAMC,YAAY,GAAGd,KAAK,CAACA,KAAK,CAACe,MAAM,GAAG,CAAC,CAAC,IAAI,GAAG;;EAEnD;EACA;EACA;EACAhB,KAAK,CAACiB,QAAQ,CAACd,QAAQ,CAACK,QAAQ,EAAEG,UAAU,EAAEI,YAAY,EAAEb,OAAO,EAAE,IAAI,CAAC;EAE1E,oBACIT,KAAA,CAAAyB,aAAA,CAACC,cAAc;IACXnB,KAAK,EAAEA,KAAM;IACboB,MAAM,EAAEjB,QAAQ,CAACK,QAAS;IAC1BG,UAAU,EAAEA,UAAW;IACvBV,KAAK,EAAEc,YAAa;IACpBb,OAAO,EAAEA;EAAQ,CACpB,CAAC;AAEV,CAAC;;AAED;AACA;AACA;AACA;AACA,SAASiB,cAAcA,CAAC;EACpBnB,KAAK;EACLoB,MAAM;EACNT,UAAU;EACVV,KAAK;EACLC;AAOJ,CAAC,EAAE;EACC,MAAMmB,OAAO,GAAG1B,MAAM,CAGZ,IAAI,CAAC;;EAEf;EACA;EACA;EACA,MAAM2B,OAAO,GAAG3B,MAAM,CAA8CgB,UAAU,CAAC;;EAE/E;EACA;EACA;EACA;EACA,IAAIW,OAAO,CAACC,OAAO,KAAKZ,UAAU,EAAE;IAChCX,KAAK,CAACiB,QAAQ,CAACG,MAAM,EAAET,UAAU,EAAEV,KAAK,EAAEC,OAAO,EAAE,IAAI,EAAEoB,OAAO,CAACC,OAAO,CAAC;IACzED,OAAO,CAACC,OAAO,GAAGZ,UAAU;EAChC;EAEAjB,SAAS,CAAC,MAAM;IACZ,MAAM8B,IAAI,GAAGH,OAAO,CAACE,OAAO;;IAE5B;IACA;IACA;IACA,IAAIC,IAAI,KAAKA,IAAI,CAACb,UAAU,KAAKA,UAAU,IAAIa,IAAI,CAACvB,KAAK,KAAKA,KAAK,CAAC,EAAE;MAClED,KAAK,CAACyB,MAAM,CAAC,CAAC;IAClB;IAEAJ,OAAO,CAACE,OAAO,GAAG;MAAEZ,UAAU;MAAEV;IAAM,CAAC;;IAEvC;IACA,OAAO,MAAM;MACTD,KAAK,CAAC0B,UAAU,CAACN,MAAM,EAAET,UAAU,EAAEV,KAAK,CAAC;IAC/C,CAAC;EACL,CAAC,EAAE,CAACD,KAAK,EAAEoB,MAAM,EAAET,UAAU,EAAEV,KAAK,CAAC,CAAC;EAEtC,OAAO,IAAI;AACf","ignoreList":[]}
+{"version":3,"file":"Compose.js","sources":["../src/Compose.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport type { DecoratableTypes } from \"./Context.js\";\nimport { useCompositionStore } from \"./Context.js\";\nimport { useCompositionScope } from \"~/CompositionScope.js\";\nimport type {\n    ComposeWith,\n    Decoratable,\n    Decorator,\n    GenericComponent,\n    GenericHook\n} from \"./types.js\";\n\nexport interface ComposeProps {\n    function?: DecoratableTypes;\n    component?: DecoratableTypes;\n    with: ComposeWith;\n}\n\nexport const Compose = (props: ComposeProps) => {\n    const store = useCompositionStore();\n    const { scope, inherit } = useCompositionScope();\n\n    const targetFn = (props.function ?? props.component) as Decoratable;\n\n    if (!targetFn) {\n        console.warn(\"You must provide a function or a component to compose with!\", props);\n        return null;\n    }\n\n    if (typeof targetFn.original === \"undefined\") {\n        console.warn(\n            `You must make your function \"${\n                targetFn.originalName ?? targetFn.name\n            }\" composable, by using the makeDecoratable() function!`\n        );\n        return null;\n    }\n\n    const decorators = (Array.isArray(props.with) ? props.with : [props.with]) as Decorator<\n        GenericComponent | GenericHook\n    >[];\n    const currentScope = scope[scope.length - 1] ?? \"*\";\n\n    // Register synchronously during render so decorators are available immediately.\n    // Pass silent=true to avoid notifying listeners mid-render (which would trigger\n    // setState in other components and cause React warnings).\n    store.register(targetFn.original, decorators, currentScope, inherit, true);\n\n    return (\n        <ComposeEffects\n            store={store}\n            target={targetFn.original}\n            decorators={decorators}\n            scope={currentScope}\n            inherit={inherit}\n        />\n    );\n};\n\n/**\n * Separate component for the effect to avoid re-running the cleanup on every render.\n * This component handles cleanup on unmount and when props change.\n */\nfunction ComposeEffects({\n    store,\n    target,\n    decorators,\n    scope,\n    inherit\n}: {\n    store: ReturnType<typeof useCompositionStore>;\n    target: any;\n    decorators: Decorator<GenericComponent | GenericHook>[];\n    scope: string;\n    inherit: boolean;\n}) {\n    const prevRef = useRef<{\n        decorators: Decorator<GenericComponent | GenericHook>[];\n        scope: string;\n    } | null>(null);\n\n    // Tracks the decorators currently live in the store as of the last render.\n    // Updated synchronously during render so it always reflects the most recently\n    // registered decorators, allowing the atomic swap below to remove the right ones.\n    const liveRef = useRef<Decorator<GenericComponent | GenericHook>[]>(decorators);\n\n    // On re-render with new decorators: atomically replace the old ones in the store\n    // during render (before React commits). This ensures the store never transiently\n    // holds both old and new HOCs — which would cause useSyncExternalStore subscribers\n    // to render with a doubly-wrapped component and mount inner components twice.\n    if (liveRef.current !== decorators) {\n        store.register(target, decorators, scope, inherit, true, liveRef.current);\n        liveRef.current = decorators;\n    }\n\n    useEffect(() => {\n        const prev = prevRef.current;\n\n        // On prop change: the render-phase atomic swap already updated the store.\n        // Emit a non-silent notification now that effects have settled so subscribers\n        // re-render with the final, clean composition (old HOCs fully gone).\n        if (prev && (prev.decorators !== decorators || prev.scope !== scope)) {\n            store.notify();\n        }\n\n        prevRef.current = { decorators, scope };\n\n        // Cleanup on unmount.\n        return () => {\n            store.unregister(target, decorators, scope);\n        };\n    }, [store, target, decorators, scope]);\n\n    return null;\n}\n"],"names":["Compose","props","store","useCompositionStore","scope","inherit","useCompositionScope","targetFn","console","decorators","Array","currentScope","ComposeEffects","target","prevRef","useRef","liveRef","useEffect","prev"],"mappings":";;;AAkBO,MAAMA,UAAU,CAACC;IACpB,MAAMC,QAAQC;IACd,MAAM,EAAEC,KAAK,EAAEC,OAAO,EAAE,GAAGC;IAE3B,MAAMC,WAAYN,MAAM,QAAQ,IAAIA,MAAM,SAAS;IAEnD,IAAI,CAACM,UAAU;QACXC,QAAQ,IAAI,CAAC,+DAA+DP;QAC5E,OAAO;IACX;IAEA,IAAI,AAA6B,WAAtBM,SAAS,QAAQ,EAAkB;QAC1CC,QAAQ,IAAI,CACR,CAAC,6BAA6B,EAC1BD,SAAS,YAAY,IAAIA,SAAS,IAAI,CACzC,sDAAsD,CAAC;QAE5D,OAAO;IACX;IAEA,MAAME,aAAcC,MAAM,OAAO,CAACT,MAAM,IAAI,IAAIA,MAAM,IAAI,GAAG;QAACA,MAAM,IAAI;KAAC;IAGzE,MAAMU,eAAeP,KAAK,CAACA,MAAM,MAAM,GAAG,EAAE,IAAI;IAKhDF,MAAM,QAAQ,CAACK,SAAS,QAAQ,EAAEE,YAAYE,cAAcN,SAAS;IAErE,OAAO,WAAP,GACI,oBAACO,gBAAcA;QACX,OAAOV;QACP,QAAQK,SAAS,QAAQ;QACzB,YAAYE;QACZ,OAAOE;QACP,SAASN;;AAGrB;AAMA,SAASO,eAAe,EACpBV,KAAK,EACLW,MAAM,EACNJ,UAAU,EACVL,KAAK,EACLC,OAAO,EAOV;IACG,MAAMS,UAAUC,OAGN;IAKV,MAAMC,UAAUD,OAAoDN;IAMpE,IAAIO,QAAQ,OAAO,KAAKP,YAAY;QAChCP,MAAM,QAAQ,CAACW,QAAQJ,YAAYL,OAAOC,SAAS,MAAMW,QAAQ,OAAO;QACxEA,QAAQ,OAAO,GAAGP;IACtB;IAEAQ,UAAU;QACN,MAAMC,OAAOJ,QAAQ,OAAO;QAK5B,IAAII,QAASA,CAAAA,KAAK,UAAU,KAAKT,cAAcS,KAAK,KAAK,KAAKd,KAAI,GAC9DF,MAAM,MAAM;QAGhBY,QAAQ,OAAO,GAAG;YAAEL;YAAYL;QAAM;QAGtC,OAAO;YACHF,MAAM,UAAU,CAACW,QAAQJ,YAAYL;QACzC;IACJ,GAAG;QAACF;QAAOW;QAAQJ;QAAYL;KAAM;IAErC,OAAO;AACX"}

package/CompositionScope.js

@@ -1,27 +1,25 @@
-import React from "react";
-const CompositionScopeContext = /*#__PURE__*/React.createContext(undefined);
-export const CompositionScope = ({
-  name,
-  inherit = false,
-  children
-}) => {
-  const parentScope = useCompositionScope();
-  return /*#__PURE__*/React.createElement(CompositionScopeContext.Provider, {
-    value: {
-      scope: [...parentScope.scope, name],
-      inherit
-    }
-  }, children);
+import react from "react";
+const CompositionScopeContext = /*#__PURE__*/ react.createContext(void 0);
+const CompositionScope = ({ name, inherit = false, children })=>{
+    const parentScope = useCompositionScope();
+    return /*#__PURE__*/ react.createElement(CompositionScopeContext.Provider, {
+        value: {
+            scope: [
+                ...parentScope.scope,
+                name
+            ],
+            inherit
+        }
+    }, children);
 };
-export function useCompositionScope() {
-  const context = React.useContext(CompositionScopeContext);
-  if (!context) {
-    return {
-      scope: [],
-      inherit: false
+function useCompositionScope() {
+    const context = react.useContext(CompositionScopeContext);
+    if (!context) return {
+        scope: [],
+        inherit: false
     };
-  }
-  return context;
+    return context;
 }
+export { CompositionScope, useCompositionScope };
 
 //# sourceMappingURL=CompositionScope.js.map

package/CompositionScope.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","CompositionScopeContext","createContext","undefined","CompositionScope","name","inherit","children","parentScope","useCompositionScope","createElement","Provider","value","scope","context","useContext"],"sources":["CompositionScope.tsx"],"sourcesContent":["import React from \"react\";\n\nexport interface CompositionScopeContext {\n    inherit: boolean;\n    scope: string[];\n}\n\nconst CompositionScopeContext = React.createContext<CompositionScopeContext | undefined>(undefined);\n\ninterface CompositionScopeProps {\n    name: string;\n    /**\n     * Use this prop on components that are used to register decorators.\n     * Components are inherited at the time of registration, and then cached.\n     */\n    inherit?: boolean;\n    children: React.ReactNode;\n}\n\nexport const CompositionScope = ({ name, inherit = false, children }: CompositionScopeProps) => {\n    const parentScope = useCompositionScope();\n\n    return (\n        <CompositionScopeContext.Provider value={{ scope: [...parentScope.scope, name], inherit }}>\n            {children}\n        </CompositionScopeContext.Provider>\n    );\n};\n\nexport function useCompositionScope() {\n    const context = React.useContext(CompositionScopeContext);\n\n    if (!context) {\n        return { scope: [], inherit: false };\n    }\n\n    return context;\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAOzB,MAAMC,uBAAuB,gBAAGD,KAAK,CAACE,aAAa,CAAsCC,SAAS,CAAC;AAYnG,OAAO,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,IAAI;EAAEC,OAAO,GAAG,KAAK;EAAEC;AAAgC,CAAC,KAAK;EAC5F,MAAMC,WAAW,GAAGC,mBAAmB,CAAC,CAAC;EAEzC,oBACIT,KAAA,CAAAU,aAAA,CAACT,uBAAuB,CAACU,QAAQ;IAACC,KAAK,EAAE;MAAEC,KAAK,EAAE,CAAC,GAAGL,WAAW,CAACK,KAAK,EAAER,IAAI,CAAC;MAAEC;IAAQ;EAAE,GACrFC,QAC6B,CAAC;AAE3C,CAAC;AAED,OAAO,SAASE,mBAAmBA,CAAA,EAAG;EAClC,MAAMK,OAAO,GAAGd,KAAK,CAACe,UAAU,CAACd,uBAAuB,CAAC;EAEzD,IAAI,CAACa,OAAO,EAAE;IACV,OAAO;MAAED,KAAK,EAAE,EAAE;MAAEP,OAAO,EAAE;IAAM,CAAC;EACxC;EAEA,OAAOQ,OAAO;AAClB","ignoreList":[]}
+{"version":3,"file":"CompositionScope.js","sources":["../src/CompositionScope.tsx"],"sourcesContent":["import React from \"react\";\n\nexport interface CompositionScopeContext {\n    inherit: boolean;\n    scope: string[];\n}\n\nconst CompositionScopeContext = React.createContext<CompositionScopeContext | undefined>(undefined);\n\ninterface CompositionScopeProps {\n    name: string;\n    /**\n     * Use this prop on components that are used to register decorators.\n     * Components are inherited at the time of registration, and then cached.\n     */\n    inherit?: boolean;\n    children: React.ReactNode;\n}\n\nexport const CompositionScope = ({ name, inherit = false, children }: CompositionScopeProps) => {\n    const parentScope = useCompositionScope();\n\n    return (\n        <CompositionScopeContext.Provider value={{ scope: [...parentScope.scope, name], inherit }}>\n            {children}\n        </CompositionScopeContext.Provider>\n    );\n};\n\nexport function useCompositionScope() {\n    const context = React.useContext(CompositionScopeContext);\n\n    if (!context) {\n        return { scope: [], inherit: false };\n    }\n\n    return context;\n}\n"],"names":["CompositionScopeContext","React","undefined","CompositionScope","name","inherit","children","parentScope","useCompositionScope","context"],"mappings":";AAOA,MAAMA,0BAA0B,WAAHA,GAAGC,MAAAA,aAAmB,CAAsCC;AAYlF,MAAMC,mBAAmB,CAAC,EAAEC,IAAI,EAAEC,UAAU,KAAK,EAAEC,QAAQ,EAAyB;IACvF,MAAMC,cAAcC;IAEpB,OAAO,WAAP,GACI,oBAACR,wBAAwB,QAAQ;QAAC,OAAO;YAAE,OAAO;mBAAIO,YAAY,KAAK;gBAAEH;aAAK;YAAEC;QAAQ;OACnFC;AAGb;AAEO,SAASE;IACZ,MAAMC,UAAUR,MAAAA,UAAgB,CAACD;IAEjC,IAAI,CAACS,SACD,OAAO;QAAE,OAAO,EAAE;QAAE,SAAS;IAAM;IAGvC,OAAOA;AACX"}

package/Context.js

@@ -1,92 +1,54 @@
-import React, { createContext, useContext, useRef, useSyncExternalStore } from "react";
+import react, { createContext, useContext, useRef, useSyncExternalStore } from "react";
 import { useCompositionScope } from "./CompositionScope.js";
 import { CompositionStore } from "./domain/CompositionStore.js";
-export function compose(...fns) {
-  return decoratee => {
-    return fns.reduceRight((decoratee, decorator) => decorator(decoratee), decoratee);
-  };
+function compose(...fns) {
+    return (decoratee)=>fns.reduceRight((decoratee, decorator)=>decorator(decoratee), decoratee);
 }
-
-/**
- * @deprecated Use `Decorator` instead.
- */
-
-const CompositionStoreContext = /*#__PURE__*/createContext(undefined);
-export const CompositionProvider = ({
-  decorators = [],
-  children
-}) => {
-  const storeRef = useRef(null);
-  if (storeRef.current === null) {
-    const store = new CompositionStore();
-    // Pre-register decorators from props.
-    for (const [decoratable, hocs] of decorators) {
-      store.register(decoratable.original, hocs);
+const CompositionStoreContext = /*#__PURE__*/ createContext(void 0);
+const CompositionProvider = ({ decorators = [], children })=>{
+    const storeRef = useRef(null);
+    if (null === storeRef.current) {
+        const store = new CompositionStore();
+        for (const [decoratable, hocs] of decorators)store.register(decoratable.original, hocs);
+        storeRef.current = store;
     }
-    storeRef.current = store;
-  }
-  return /*#__PURE__*/React.createElement(CompositionStoreContext.Provider, {
-    value: storeRef.current
-  }, children);
+    return /*#__PURE__*/ react.createElement(CompositionStoreContext.Provider, {
+        value: storeRef.current
+    }, children);
 };
-export function useCompositionStore() {
-  const store = useContext(CompositionStoreContext);
-  if (!store) {
-    throw new Error(`You're missing a <CompositionProvider> higher up in your component hierarchy!`);
-  }
-  return store;
+function useCompositionStore() {
+    const store = useContext(CompositionStoreContext);
+    if (!store) throw new Error("You're missing a <CompositionProvider> higher up in your component hierarchy!");
+    return store;
 }
-export function useOptionalCompositionStore() {
-  return useContext(CompositionStoreContext);
+function useOptionalCompositionStore() {
+    return useContext(CompositionStoreContext);
 }
-export function useComponent(baseFunction) {
-  const store = useOptionalCompositionStore();
-  const scope = useCompositionScope();
-
-  // Subscribe to store changes so we re-render when compositions change.
-  useSyncExternalStore(store ? store.subscribe : noopSubscribe, store ? store.getSnapshot : noopGetSnapshot);
-  if (!store) {
-    return baseFunction;
-  }
-  const result = store.getComponent(baseFunction, scope.scope) || baseFunction;
-  return result;
+function useComponent(baseFunction) {
+    const store = useOptionalCompositionStore();
+    const scope = useCompositionScope();
+    useSyncExternalStore(store ? store.subscribe : noopSubscribe, store ? store.getSnapshot : noopGetSnapshot);
+    if (!store) return baseFunction;
+    const result = store.getComponent(baseFunction, scope.scope) || baseFunction;
+    return result;
 }
-const noopSubscribe = () => () => {};
-const noopGetSnapshot = () => 0;
-
-// Legacy compatibility — kept for any external consumers.
-
-/**
- * This hook will throw an error if composition context doesn't exist.
- */
-export function useComposition() {
-  const store = useCompositionStore();
-  return {
-    composeComponent: (component, hocs, scope = "*", inherit = false) => {
-      return store.register(component, hocs, scope, inherit);
-    },
-    getComponent: (component, scope) => {
-      return store.getComponent(component, scope);
-    }
-  };
+const noopSubscribe = ()=>()=>{};
+const noopGetSnapshot = ()=>0;
+function useComposition() {
+    const store = useCompositionStore();
+    return {
+        composeComponent: (component, hocs, scope = "*", inherit = false)=>store.register(component, hocs, scope, inherit),
+        getComponent: (component, scope)=>store.getComponent(component, scope)
+    };
 }
-
-/**
- * This hook will not throw an error if composition context doesn't exist.
- */
-export function useOptionalComposition() {
-  const store = useOptionalCompositionStore();
-  if (!store) {
-    return undefined;
-  }
-  return {
-    composeComponent: (component, hocs, scope = "*", inherit = false) => {
-      return store.register(component, hocs, scope, inherit);
-    },
-    getComponent: (component, scope) => {
-      return store.getComponent(component, scope);
-    }
-  };
+function useOptionalComposition() {
+    const store = useOptionalCompositionStore();
+    if (!store) return;
+    return {
+        composeComponent: (component, hocs, scope = "*", inherit = false)=>store.register(component, hocs, scope, inherit),
+        getComponent: (component, scope)=>store.getComponent(component, scope)
+    };
 }
+export { CompositionProvider, compose, useComponent, useComposition, useCompositionStore, useOptionalComposition, useOptionalCompositionStore };
 
 //# sourceMappingURL=Context.js.map

package/Context.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","useRef","useSyncExternalStore","useCompositionScope","CompositionStore","compose","fns","decoratee","reduceRight","decorator","CompositionStoreContext","undefined","CompositionProvider","decorators","children","storeRef","current","store","decoratable","hocs","register","original","createElement","Provider","value","useCompositionStore","Error","useOptionalCompositionStore","useComponent","baseFunction","scope","subscribe","noopSubscribe","getSnapshot","noopGetSnapshot","result","getComponent","useComposition","composeComponent","component","inherit","useOptionalComposition"],"sources":["Context.tsx"],"sourcesContent":["import type { ComponentType } from \"react\";\nimport React, { createContext, useContext, useRef, useSyncExternalStore } from \"react\";\nimport { useCompositionScope } from \"~/CompositionScope.js\";\nimport { CompositionStore } from \"~/domain/CompositionStore.js\";\n\nimport type {\n    ComposeWith,\n    Decoratable,\n    DecoratableComponent,\n    DecoratableHook,\n    Decorator,\n    Enumerable,\n    GenericComponent,\n    GenericHook\n} from \"~/types.js\";\n\nexport function compose<T>(...fns: Decorator<T>[]) {\n    return (decoratee: T): T => {\n        return fns.reduceRight((decoratee, decorator) => decorator(decoratee), decoratee) as T;\n    };\n}\n\n/**\n * @deprecated Use `Decorator` instead.\n */\nexport interface HigherOrderComponent<TProps = any, TOutput = TProps> {\n    (Component: GenericComponent<TProps>): GenericComponent<TOutput>;\n}\n\nexport type DecoratableTypes = DecoratableComponent | DecoratableHook;\n\nconst CompositionStoreContext = createContext<CompositionStore | undefined>(undefined);\n\nexport type DecoratorsTuple = [Decoratable, Decorator<any>[]];\nexport type DecoratorsCollection = Array<DecoratorsTuple>;\n\ninterface CompositionProviderProps {\n    decorators?: DecoratorsCollection;\n    children: React.ReactNode;\n}\n\nexport const CompositionProvider = ({ decorators = [], children }: CompositionProviderProps) => {\n    const storeRef = useRef<CompositionStore | null>(null);\n    if (storeRef.current === null) {\n        const store = new CompositionStore();\n        // Pre-register decorators from props.\n        for (const [decoratable, hocs] of decorators) {\n            store.register(decoratable.original as ComponentType<unknown>, hocs);\n        }\n        storeRef.current = store;\n    }\n\n    return (\n        <CompositionStoreContext.Provider value={storeRef.current}>\n            {children}\n        </CompositionStoreContext.Provider>\n    );\n};\n\nexport function useCompositionStore(): CompositionStore {\n    const store = useContext(CompositionStoreContext);\n    if (!store) {\n        throw new Error(\n            `You're missing a <CompositionProvider> higher up in your component hierarchy!`\n        );\n    }\n    return store;\n}\n\nexport function useOptionalCompositionStore(): CompositionStore | undefined {\n    return useContext(CompositionStoreContext);\n}\n\nexport function useComponent<T>(baseFunction: T) {\n    const store = useOptionalCompositionStore();\n    const scope = useCompositionScope();\n\n    // Subscribe to store changes so we re-render when compositions change.\n    useSyncExternalStore(\n        store ? store.subscribe : noopSubscribe,\n        store ? store.getSnapshot : noopGetSnapshot\n    );\n\n    if (!store) {\n        return baseFunction;\n    }\n\n    const result = store.getComponent(baseFunction as any, scope.scope) || baseFunction;\n\n    return result as T;\n}\n\nconst noopSubscribe = () => () => {};\nconst noopGetSnapshot = () => 0;\n\n// Legacy compatibility — kept for any external consumers.\n\ninterface CompositionContextValue {\n    composeComponent(\n        component: ComponentType<unknown>,\n        hocs: Enumerable<ComposeWith>,\n        scope?: string,\n        inherit?: boolean\n    ): () => void;\n    getComponent(\n        component: ComponentType<unknown>,\n        scope: string[]\n    ): GenericComponent | GenericHook | undefined;\n}\n\n/**\n * This hook will throw an error if composition context doesn't exist.\n */\nexport function useComposition(): CompositionContextValue {\n    const store = useCompositionStore();\n\n    return {\n        composeComponent: (component, hocs, scope = \"*\", inherit = false) => {\n            return store.register(component, hocs as any[], scope, inherit);\n        },\n        getComponent: (component, scope) => {\n            return store.getComponent(component, scope);\n        }\n    };\n}\n\n/**\n * This hook will not throw an error if composition context doesn't exist.\n */\nexport function useOptionalComposition(): CompositionContextValue | undefined {\n    const store = useOptionalCompositionStore();\n    if (!store) {\n        return undefined;\n    }\n\n    return {\n        composeComponent: (component, hocs, scope = \"*\", inherit = false) => {\n            return store.register(component, hocs as any[], scope, inherit);\n        },\n        getComponent: (component, scope) => {\n            return store.getComponent(component, scope);\n        }\n    };\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Context.js","sources":["../src/Context.tsx"],"sourcesContent":["import type { ComponentType } from \"react\";\nimport React, { createContext, useContext, useRef, useSyncExternalStore } from \"react\";\nimport { useCompositionScope } from \"~/CompositionScope.js\";\nimport { CompositionStore } from \"~/domain/CompositionStore.js\";\n\nimport type {\n    ComposeWith,\n    Decoratable,\n    DecoratableComponent,\n    DecoratableHook,\n    Decorator,\n    Enumerable,\n    GenericComponent,\n    GenericHook\n} from \"~/types.js\";\n\nexport function compose<T>(...fns: Decorator<T>[]) {\n    return (decoratee: T): T => {\n        return fns.reduceRight((decoratee, decorator) => decorator(decoratee), decoratee) as T;\n    };\n}\n\n/**\n * @deprecated Use `Decorator` instead.\n */\nexport interface HigherOrderComponent<TProps = any, TOutput = TProps> {\n    (Component: GenericComponent<TProps>): GenericComponent<TOutput>;\n}\n\nexport type DecoratableTypes = DecoratableComponent | DecoratableHook;\n\nconst CompositionStoreContext = createContext<CompositionStore | undefined>(undefined);\n\nexport type DecoratorsTuple = [Decoratable, Decorator<any>[]];\nexport type DecoratorsCollection = Array<DecoratorsTuple>;\n\ninterface CompositionProviderProps {\n    decorators?: DecoratorsCollection;\n    children: React.ReactNode;\n}\n\nexport const CompositionProvider = ({ decorators = [], children }: CompositionProviderProps) => {\n    const storeRef = useRef<CompositionStore | null>(null);\n    if (storeRef.current === null) {\n        const store = new CompositionStore();\n        // Pre-register decorators from props.\n        for (const [decoratable, hocs] of decorators) {\n            store.register(decoratable.original as ComponentType<unknown>, hocs);\n        }\n        storeRef.current = store;\n    }\n\n    return (\n        <CompositionStoreContext.Provider value={storeRef.current}>\n            {children}\n        </CompositionStoreContext.Provider>\n    );\n};\n\nexport function useCompositionStore(): CompositionStore {\n    const store = useContext(CompositionStoreContext);\n    if (!store) {\n        throw new Error(\n            `You're missing a <CompositionProvider> higher up in your component hierarchy!`\n        );\n    }\n    return store;\n}\n\nexport function useOptionalCompositionStore(): CompositionStore | undefined {\n    return useContext(CompositionStoreContext);\n}\n\nexport function useComponent<T>(baseFunction: T) {\n    const store = useOptionalCompositionStore();\n    const scope = useCompositionScope();\n\n    // Subscribe to store changes so we re-render when compositions change.\n    useSyncExternalStore(\n        store ? store.subscribe : noopSubscribe,\n        store ? store.getSnapshot : noopGetSnapshot\n    );\n\n    if (!store) {\n        return baseFunction;\n    }\n\n    const result = store.getComponent(baseFunction as any, scope.scope) || baseFunction;\n\n    return result as T;\n}\n\nconst noopSubscribe = () => () => {};\nconst noopGetSnapshot = () => 0;\n\n// Legacy compatibility — kept for any external consumers.\n\ninterface CompositionContextValue {\n    composeComponent(\n        component: ComponentType<unknown>,\n        hocs: Enumerable<ComposeWith>,\n        scope?: string,\n        inherit?: boolean\n    ): () => void;\n    getComponent(\n        component: ComponentType<unknown>,\n        scope: string[]\n    ): GenericComponent | GenericHook | undefined;\n}\n\n/**\n * This hook will throw an error if composition context doesn't exist.\n */\nexport function useComposition(): CompositionContextValue {\n    const store = useCompositionStore();\n\n    return {\n        composeComponent: (component, hocs, scope = \"*\", inherit = false) => {\n            return store.register(component, hocs as any[], scope, inherit);\n        },\n        getComponent: (component, scope) => {\n            return store.getComponent(component, scope);\n        }\n    };\n}\n\n/**\n * This hook will not throw an error if composition context doesn't exist.\n */\nexport function useOptionalComposition(): CompositionContextValue | undefined {\n    const store = useOptionalCompositionStore();\n    if (!store) {\n        return undefined;\n    }\n\n    return {\n        composeComponent: (component, hocs, scope = \"*\", inherit = false) => {\n            return store.register(component, hocs as any[], scope, inherit);\n        },\n        getComponent: (component, scope) => {\n            return store.getComponent(component, scope);\n        }\n    };\n}\n"],"names":["compose","fns","decoratee","decorator","CompositionStoreContext","createContext","undefined","CompositionProvider","decorators","children","storeRef","useRef","store","CompositionStore","decoratable","hocs","useCompositionStore","useContext","Error","useOptionalCompositionStore","useComponent","baseFunction","scope","useCompositionScope","useSyncExternalStore","noopSubscribe","noopGetSnapshot","result","useComposition","component","inherit","useOptionalComposition"],"mappings":";;;AAgBO,SAASA,QAAW,GAAGC,GAAmB;IAC7C,OAAO,CAACC,YACGD,IAAI,WAAW,CAAC,CAACC,WAAWC,YAAcA,UAAUD,YAAYA;AAE/E;AAWA,MAAME,0BAA0B,WAAHA,GAAGC,cAA4CC;AAUrE,MAAMC,sBAAsB,CAAC,EAAEC,aAAa,EAAE,EAAEC,QAAQ,EAA4B;IACvF,MAAMC,WAAWC,OAAgC;IACjD,IAAID,AAAqB,SAArBA,SAAS,OAAO,EAAW;QAC3B,MAAME,QAAQ,IAAIC;QAElB,KAAK,MAAM,CAACC,aAAaC,KAAK,IAAIP,WAC9BI,MAAM,QAAQ,CAACE,YAAY,QAAQ,EAA4BC;QAEnEL,SAAS,OAAO,GAAGE;IACvB;IAEA,OAAO,WAAP,GACI,oBAACR,wBAAwB,QAAQ;QAAC,OAAOM,SAAS,OAAO;OACpDD;AAGb;AAEO,SAASO;IACZ,MAAMJ,QAAQK,WAAWb;IACzB,IAAI,CAACQ,OACD,MAAM,IAAIM,MACN;IAGR,OAAON;AACX;AAEO,SAASO;IACZ,OAAOF,WAAWb;AACtB;AAEO,SAASgB,aAAgBC,YAAe;IAC3C,MAAMT,QAAQO;IACd,MAAMG,QAAQC;IAGdC,qBACIZ,QAAQA,MAAM,SAAS,GAAGa,eAC1Bb,QAAQA,MAAM,WAAW,GAAGc;IAGhC,IAAI,CAACd,OACD,OAAOS;IAGX,MAAMM,SAASf,MAAM,YAAY,CAACS,cAAqBC,MAAM,KAAK,KAAKD;IAEvE,OAAOM;AACX;AAEA,MAAMF,gBAAgB,IAAM,KAAO;AACnC,MAAMC,kBAAkB,IAAM;AAoBvB,SAASE;IACZ,MAAMhB,QAAQI;IAEd,OAAO;QACH,kBAAkB,CAACa,WAAWd,MAAMO,QAAQ,GAAG,EAAEQ,UAAU,KAAK,GACrDlB,MAAM,QAAQ,CAACiB,WAAWd,MAAeO,OAAOQ;QAE3D,cAAc,CAACD,WAAWP,QACfV,MAAM,YAAY,CAACiB,WAAWP;IAE7C;AACJ;AAKO,SAASS;IACZ,MAAMnB,QAAQO;IACd,IAAI,CAACP,OACD;IAGJ,OAAO;QACH,kBAAkB,CAACiB,WAAWd,MAAMO,QAAQ,GAAG,EAAEQ,UAAU,KAAK,GACrDlB,MAAM,QAAQ,CAACiB,WAAWd,MAAeO,OAAOQ;QAE3D,cAAc,CAACD,WAAWP,QACfV,MAAM,YAAY,CAACiB,WAAWP;IAE7C;AACJ"}

package/createDecorator.js

@@ -1,29 +1,17 @@
-import React from "react";
+import react from "react";
 import { Compose } from "./Compose.js";
-/**
- * Creates a component which, when mounted, registers a Higher Order Component for the given base component.
- * This is particularly useful for decorating (wrapping) existing composable components.
- * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.
- */
-export function createComponentPlugin(Base, hoc) {
-  return createDecorator(Base, hoc);
+function createComponentPlugin(Base, hoc) {
+    return createDecorator(Base, hoc);
 }
-
-// Maybe there's a better way to mark params as non-existent, but for now I left it as `any`.
-// TODO: revisit this type; not sure if `?` can be handled in one clause
-
-const isDecoratableComponent = decoratable => {
-  return "displayName" in decoratable;
-};
-export function createDecorator(Base, hoc) {
-  const DecoratorPlugin = () => /*#__PURE__*/React.createElement(Compose, {
-    component: Base,
-    with: hoc
-  });
-  if (isDecoratableComponent(Base)) {
-    DecoratorPlugin.displayName = Base.displayName;
-  }
-  return DecoratorPlugin;
+const isDecoratableComponent = (decoratable)=>"displayName" in decoratable;
+function createDecorator(Base, hoc) {
+    const DecoratorPlugin = ()=>/*#__PURE__*/ react.createElement(Compose, {
+            component: Base,
+            with: hoc
+        });
+    if (isDecoratableComponent(Base)) DecoratorPlugin.displayName = Base.displayName;
+    return DecoratorPlugin;
 }
+export { createComponentPlugin, createDecorator };
 
 //# sourceMappingURL=createDecorator.js.map

package/createDecorator.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Compose","createComponentPlugin","Base","hoc","createDecorator","isDecoratableComponent","decoratable","DecoratorPlugin","createElement","component","with","displayName"],"sources":["createDecorator.tsx"],"sourcesContent":["import React from \"react\";\nimport type {\n    CanReturnNullOrElement,\n    Decoratable,\n    DecoratableComponent,\n    DecoratableHook,\n    Decorator\n} from \"~/types.js\";\nimport { Compose } from \"~/Compose.js\";\n\ntype GetBaseFunction<T> = T extends DecoratableComponent<infer F> ? F : never;\n\n/**\n * Creates a component which, when mounted, registers a Higher Order Component for the given base component.\n * This is particularly useful for decorating (wrapping) existing composable components.\n * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.\n */\nexport function createComponentPlugin<T extends Decoratable>(\n    Base: T,\n    hoc: T extends DecoratableComponent\n        ? Decorator<CanReturnNullOrElement<GetBaseFunction<T>>>\n        : Decorator<GetBaseFunction<T>>\n) {\n    return createDecorator(Base, hoc);\n}\n\n// Maybe there's a better way to mark params as non-existent, but for now I left it as `any`.\n// TODO: revisit this type; not sure if `?` can be handled in one clause\nexport type GetDecorateeParams<T> = T extends (params?: infer P1) => any\n    ? P1\n    : T extends (params: infer P2) => any\n      ? P2\n      : any;\n\nexport type GetDecoratee<T> =\n    T extends DecoratableHook<infer F> ? F : T extends DecoratableComponent<infer F> ? F : never;\n\nconst isDecoratableComponent = (\n    decoratable: DecoratableComponent | DecoratableHook\n): decoratable is DecoratableComponent => {\n    return \"displayName\" in decoratable;\n};\n\nexport function createDecorator<T extends Decoratable>(\n    Base: T,\n    hoc: T extends DecoratableComponent\n        ? Decorator<CanReturnNullOrElement<GetBaseFunction<T>>>\n        : Decorator<GetBaseFunction<T>>\n) {\n    const DecoratorPlugin = () => <Compose component={Base} with={hoc as any} />;\n    if (isDecoratableComponent(Base)) {\n        DecoratorPlugin.displayName = Base.displayName;\n    }\n    return DecoratorPlugin;\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAQzB,SAASC,OAAO;AAIhB;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,qBAAqBA,CACjCC,IAAO,EACPC,GAEmC,EACrC;EACE,OAAOC,eAAe,CAACF,IAAI,EAAEC,GAAG,CAAC;AACrC;;AAEA;AACA;;AAUA,MAAME,sBAAsB,GACxBC,WAAmD,IACb;EACtC,OAAO,aAAa,IAAIA,WAAW;AACvC,CAAC;AAED,OAAO,SAASF,eAAeA,CAC3BF,IAAO,EACPC,GAEmC,EACrC;EACE,MAAMI,eAAe,GAAGA,CAAA,kBAAMR,KAAA,CAAAS,aAAA,CAACR,OAAO;IAACS,SAAS,EAAEP,IAAK;IAACQ,IAAI,EAAEP;EAAW,CAAE,CAAC;EAC5E,IAAIE,sBAAsB,CAACH,IAAI,CAAC,EAAE;IAC9BK,eAAe,CAACI,WAAW,GAAGT,IAAI,CAACS,WAAW;EAClD;EACA,OAAOJ,eAAe;AAC1B","ignoreList":[]}
+{"version":3,"file":"createDecorator.js","sources":["../src/createDecorator.tsx"],"sourcesContent":["import React from \"react\";\nimport type {\n    CanReturnNullOrElement,\n    Decoratable,\n    DecoratableComponent,\n    DecoratableHook,\n    Decorator\n} from \"~/types.js\";\nimport { Compose } from \"~/Compose.js\";\n\ntype GetBaseFunction<T> = T extends DecoratableComponent<infer F> ? F : never;\n\n/**\n * Creates a component which, when mounted, registers a Higher Order Component for the given base component.\n * This is particularly useful for decorating (wrapping) existing composable components.\n * For more information, visit https://www.webiny.com/docs/admin-area/basics/framework.\n */\nexport function createComponentPlugin<T extends Decoratable>(\n    Base: T,\n    hoc: T extends DecoratableComponent\n        ? Decorator<CanReturnNullOrElement<GetBaseFunction<T>>>\n        : Decorator<GetBaseFunction<T>>\n) {\n    return createDecorator(Base, hoc);\n}\n\n// Maybe there's a better way to mark params as non-existent, but for now I left it as `any`.\n// TODO: revisit this type; not sure if `?` can be handled in one clause\nexport type GetDecorateeParams<T> = T extends (params?: infer P1) => any\n    ? P1\n    : T extends (params: infer P2) => any\n      ? P2\n      : any;\n\nexport type GetDecoratee<T> =\n    T extends DecoratableHook<infer F> ? F : T extends DecoratableComponent<infer F> ? F : never;\n\nconst isDecoratableComponent = (\n    decoratable: DecoratableComponent | DecoratableHook\n): decoratable is DecoratableComponent => {\n    return \"displayName\" in decoratable;\n};\n\nexport function createDecorator<T extends Decoratable>(\n    Base: T,\n    hoc: T extends DecoratableComponent\n        ? Decorator<CanReturnNullOrElement<GetBaseFunction<T>>>\n        : Decorator<GetBaseFunction<T>>\n) {\n    const DecoratorPlugin = () => <Compose component={Base} with={hoc as any} />;\n    if (isDecoratableComponent(Base)) {\n        DecoratorPlugin.displayName = Base.displayName;\n    }\n    return DecoratorPlugin;\n}\n"],"names":["createComponentPlugin","Base","hoc","createDecorator","isDecoratableComponent","decoratable","DecoratorPlugin","Compose"],"mappings":";;AAiBO,SAASA,sBACZC,IAAO,EACPC,GAEmC;IAEnC,OAAOC,gBAAgBF,MAAMC;AACjC;AAaA,MAAME,yBAAyB,CAC3BC,cAEO,iBAAiBA;AAGrB,SAASF,gBACZF,IAAO,EACPC,GAEmC;IAEnC,MAAMI,kBAAkB,kBAAM,oBAACC,SAAOA;YAAC,WAAWN;YAAM,MAAMC;;IAC9D,IAAIE,uBAAuBH,OACvBK,gBAAgB,WAAW,GAAGL,KAAK,WAAW;IAElD,OAAOK;AACX"}

package/decorators.js

@@ -1,71 +1,63 @@
-import React from "react";
+import react from "react";
 import { Compose } from "./Compose.js";
-export function createConditionalDecorator(shouldDecorate, decorator, decoratorProps) {
-  return Original => {
-    const DecoratedComponent = /*#__PURE__*/React.memo(decorator(Original));
-    DecoratedComponent.displayName = Original.displayName;
-    return function ShouldDecorate(props) {
-      if (shouldDecorate(decoratorProps, props)) {
-        // @ts-expect-error
-        return /*#__PURE__*/React.createElement(DecoratedComponent, props);
-      }
-
-      // @ts-expect-error
-      return /*#__PURE__*/React.createElement(Original, props);
+function createConditionalDecorator(shouldDecorate, decorator, decoratorProps) {
+    return (Original)=>{
+        const DecoratedComponent = /*#__PURE__*/ react.memo(decorator(Original));
+        DecoratedComponent.displayName = Original.displayName;
+        return function(props) {
+            if (shouldDecorate(decoratorProps, props)) return /*#__PURE__*/ react.createElement(DecoratedComponent, props);
+            return /*#__PURE__*/ react.createElement(Original, props);
+        };
     };
-  };
 }
-const memoizedComponent = decorator => {
-  return decoratee => {
-    return /*#__PURE__*/React.memo(decorator(decoratee));
-  };
-};
-export function createDecoratorFactory() {
-  return function from(decoratable, shouldDecorate) {
-    return function createDecorator(decorator) {
-      return function DecoratorPlugin(props) {
-        if (shouldDecorate) {
-          const componentDecorator = createConditionalDecorator(shouldDecorate, decorator, props);
-          return /*#__PURE__*/React.createElement(Compose, {
-            function: decoratable,
-            with: componentDecorator
-          });
-        }
-        return /*#__PURE__*/React.createElement(Compose, {
-          function: decoratable,
-          with: memoizedComponent(decorator)
-        });
-      };
+const memoizedComponent = (decorator)=>(decoratee)=>/*#__PURE__*/ react.memo(decorator(decoratee));
+function createDecoratorFactory() {
+    return function(decoratable, shouldDecorate) {
+        return function(decorator) {
+            return function(props) {
+                if (shouldDecorate) {
+                    const componentDecorator = createConditionalDecorator(shouldDecorate, decorator, props);
+                    return /*#__PURE__*/ react.createElement(Compose, {
+                        function: decoratable,
+                        with: componentDecorator
+                    });
+                }
+                return /*#__PURE__*/ react.createElement(Compose, {
+                    function: decoratable,
+                    with: memoizedComponent(decorator)
+                });
+            };
+        };
     };
-  };
 }
-export function createHookDecoratorFactory() {
-  return function from(decoratable) {
-    return function createDecorator(decorator) {
-      return function DecoratorPlugin() {
-        return /*#__PURE__*/React.createElement(Compose, {
-          function: decoratable,
-          with: decorator
-        });
-      };
+function createHookDecoratorFactory() {
+    return function(decoratable) {
+        return function(decorator) {
+            return function() {
+                return /*#__PURE__*/ react.createElement(Compose, {
+                    function: decoratable,
+                    with: decorator
+                });
+            };
+        };
     };
-  };
 }
-export function withDecoratorFactory() {
-  return function WithDecorator(Component, shouldDecorate) {
-    const createDecorator = createDecoratorFactory()(Component, shouldDecorate);
-    return Object.assign(Component, {
-      createDecorator
-    });
-  };
+function withDecoratorFactory() {
+    return function(Component, shouldDecorate) {
+        const createDecorator = createDecoratorFactory()(Component, shouldDecorate);
+        return Object.assign(Component, {
+            createDecorator
+        });
+    };
 }
-export function withHookDecoratorFactory() {
-  return function WithHookDecorator(hook) {
-    const createDecorator = createHookDecoratorFactory()(hook);
-    return Object.assign(hook, {
-      createDecorator
-    });
-  };
+function withHookDecoratorFactory() {
+    return function(hook) {
+        const createDecorator = createHookDecoratorFactory()(hook);
+        return Object.assign(hook, {
+            createDecorator
+        });
+    };
 }
+export { createConditionalDecorator, createDecoratorFactory, createHookDecoratorFactory, withDecoratorFactory, withHookDecoratorFactory };
 
 //# sourceMappingURL=decorators.js.map

package/decorators.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Compose","createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","DecoratedComponent","memo","displayName","ShouldDecorate","props","createElement","memoizedComponent","decoratee","createDecoratorFactory","from","decoratable","createDecorator","DecoratorPlugin","componentDecorator","function","with","createHookDecoratorFactory","withDecoratorFactory","WithDecorator","Component","Object","assign","withHookDecoratorFactory","WithHookDecorator","hook"],"sources":["decorators.tsx"],"sourcesContent":["import React from \"react\";\nimport { Compose } from \"~/Compose.js\";\nimport type { GetDecoratee, GetDecorateeParams } from \"~/createDecorator.js\";\nimport type {\n    DecoratableComponent,\n    GenericComponent,\n    Decorator,\n    GenericHook,\n    DecoratableHook,\n    ComponentDecorator\n} from \"~/types.js\";\n\nexport interface ShouldDecorate<TDecorator = any, TComponent = any> {\n    (decoratorProps: TDecorator, componentProps: TComponent): boolean;\n}\n\nexport function createConditionalDecorator<TDecoratee extends GenericComponent>(\n    shouldDecorate: ShouldDecorate,\n    decorator: Decorator<TDecoratee>,\n    decoratorProps: unknown\n): Decorator<TDecoratee> {\n    return (Original => {\n        const DecoratedComponent = React.memo(decorator(Original));\n        DecoratedComponent.displayName = Original.displayName;\n\n        return function ShouldDecorate(props: unknown) {\n            if (shouldDecorate(decoratorProps, props)) {\n                // @ts-expect-error\n                return <DecoratedComponent {...props} />;\n            }\n\n            // @ts-expect-error\n            return <Original {...props} />;\n        };\n    }) as Decorator<TDecoratee>;\n}\n\nconst memoizedComponent = <T extends GenericComponent>(decorator: Decorator<T>) => {\n    return (decoratee: T) => {\n        return React.memo(decorator(decoratee));\n    };\n};\n\nexport function createDecoratorFactory<TDecorator>() {\n    return function from<TDecoratable extends DecoratableComponent>(\n        decoratable: TDecoratable,\n        shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>>\n    ) {\n        return function createDecorator(decorator: ComponentDecorator<GetDecoratee<TDecoratable>>) {\n            return function DecoratorPlugin(props: TDecorator) {\n                if (shouldDecorate) {\n                    const componentDecorator = createConditionalDecorator<GenericComponent>(\n                        shouldDecorate,\n                        decorator as unknown as Decorator<GenericComponent>,\n                        props\n                    );\n\n                    return <Compose function={decoratable} with={componentDecorator} />;\n                }\n\n                return (\n                    <Compose\n                        function={decoratable}\n                        with={memoizedComponent(\n                            decorator as unknown as Decorator<GenericComponent>\n                        )}\n                    />\n                );\n            };\n        };\n    };\n}\n\nexport function createHookDecoratorFactory() {\n    return function from<TDecoratable extends DecoratableHook>(decoratable: TDecoratable) {\n        return function createDecorator(decorator: Decorator<GetDecoratee<TDecoratable>>) {\n            return function DecoratorPlugin() {\n                return (\n                    <Compose\n                        function={decoratable}\n                        with={decorator as unknown as Decorator<GenericHook>}\n                    />\n                );\n            };\n        };\n    };\n}\n\nexport function withDecoratorFactory<TDecorator>() {\n    return function WithDecorator<TDecoratable extends DecoratableComponent>(\n        Component: TDecoratable,\n        shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>>\n    ) {\n        const createDecorator = createDecoratorFactory<TDecorator>()(Component, shouldDecorate);\n\n        return Object.assign(Component, { createDecorator }) as TDecoratable & {\n            createDecorator: typeof createDecorator;\n        };\n    };\n}\n\nexport function withHookDecoratorFactory() {\n    return function WithHookDecorator<TDecoratable extends DecoratableHook>(hook: TDecoratable) {\n        const createDecorator = createHookDecoratorFactory()(hook);\n\n        return Object.assign(hook, { createDecorator }) as unknown as DecoratableHook<\n            GenericHook<\n                GetDecorateeParams<GetDecoratee<TDecoratable>>,\n                ReturnType<GetDecoratee<TDecoratable>>\n            >\n        > & { createDecorator: typeof createDecorator };\n    };\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO;AAehB,OAAO,SAASC,0BAA0BA,CACtCC,cAA8B,EAC9BC,SAAgC,EAChCC,cAAuB,EACF;EACrB,OAAQC,QAAQ,IAAI;IAChB,MAAMC,kBAAkB,gBAAGP,KAAK,CAACQ,IAAI,CAACJ,SAAS,CAACE,QAAQ,CAAC,CAAC;IAC1DC,kBAAkB,CAACE,WAAW,GAAGH,QAAQ,CAACG,WAAW;IAErD,OAAO,SAASC,cAAcA,CAACC,KAAc,EAAE;MAC3C,IAAIR,cAAc,CAACE,cAAc,EAAEM,KAAK,CAAC,EAAE;QACvC;QACA,oBAAOX,KAAA,CAAAY,aAAA,CAACL,kBAAkB,EAAKI,KAAQ,CAAC;MAC5C;;MAEA;MACA,oBAAOX,KAAA,CAAAY,aAAA,CAACN,QAAQ,EAAKK,KAAQ,CAAC;IAClC,CAAC;EACL,CAAC;AACL;AAEA,MAAME,iBAAiB,GAAgCT,SAAuB,IAAK;EAC/E,OAAQU,SAAY,IAAK;IACrB,oBAAOd,KAAK,CAACQ,IAAI,CAACJ,SAAS,CAACU,SAAS,CAAC,CAAC;EAC3C,CAAC;AACL,CAAC;AAED,OAAO,SAASC,sBAAsBA,CAAA,EAAe;EACjD,OAAO,SAASC,IAAIA,CAChBC,WAAyB,EACzBd,cAA2F,EAC7F;IACE,OAAO,SAASe,eAAeA,CAACd,SAAyD,EAAE;MACvF,OAAO,SAASe,eAAeA,CAACR,KAAiB,EAAE;QAC/C,IAAIR,cAAc,EAAE;UAChB,MAAMiB,kBAAkB,GAAGlB,0BAA0B,CACjDC,cAAc,EACdC,SAAS,EACTO,KACJ,CAAC;UAED,oBAAOX,KAAA,CAAAY,aAAA,CAACX,OAAO;YAACoB,QAAQ,EAAEJ,WAAY;YAACK,IAAI,EAAEF;UAAmB,CAAE,CAAC;QACvE;QAEA,oBACIpB,KAAA,CAAAY,aAAA,CAACX,OAAO;UACJoB,QAAQ,EAAEJ,WAAY;UACtBK,IAAI,EAAET,iBAAiB,CACnBT,SACJ;QAAE,CACL,CAAC;MAEV,CAAC;IACL,CAAC;EACL,CAAC;AACL;AAEA,OAAO,SAASmB,0BAA0BA,CAAA,EAAG;EACzC,OAAO,SAASP,IAAIA,CAAuCC,WAAyB,EAAE;IAClF,OAAO,SAASC,eAAeA,CAACd,SAAgD,EAAE;MAC9E,OAAO,SAASe,eAAeA,CAAA,EAAG;QAC9B,oBACInB,KAAA,CAAAY,aAAA,CAACX,OAAO;UACJoB,QAAQ,EAAEJ,WAAY;UACtBK,IAAI,EAAElB;QAA+C,CACxD,CAAC;MAEV,CAAC;IACL,CAAC;EACL,CAAC;AACL;AAEA,OAAO,SAASoB,oBAAoBA,CAAA,EAAe;EAC/C,OAAO,SAASC,aAAaA,CACzBC,SAAuB,EACvBvB,cAA2F,EAC7F;IACE,MAAMe,eAAe,GAAGH,sBAAsB,CAAa,CAAC,CAACW,SAAS,EAAEvB,cAAc,CAAC;IAEvF,OAAOwB,MAAM,CAACC,MAAM,CAACF,SAAS,EAAE;MAAER;IAAgB,CAAC,CAAC;EAGxD,CAAC;AACL;AAEA,OAAO,SAASW,wBAAwBA,CAAA,EAAG;EACvC,OAAO,SAASC,iBAAiBA,CAAuCC,IAAkB,EAAE;IACxF,MAAMb,eAAe,GAAGK,0BAA0B,CAAC,CAAC,CAACQ,IAAI,CAAC;IAE1D,OAAOJ,MAAM,CAACC,MAAM,CAACG,IAAI,EAAE;MAAEb;IAAgB,CAAC,CAAC;EAMnD,CAAC;AACL","ignoreList":[]}
+{"version":3,"file":"decorators.js","sources":["../src/decorators.tsx"],"sourcesContent":["import React from \"react\";\nimport { Compose } from \"~/Compose.js\";\nimport type { GetDecoratee, GetDecorateeParams } from \"~/createDecorator.js\";\nimport type {\n    DecoratableComponent,\n    GenericComponent,\n    Decorator,\n    GenericHook,\n    DecoratableHook,\n    ComponentDecorator\n} from \"~/types.js\";\n\nexport interface ShouldDecorate<TDecorator = any, TComponent = any> {\n    (decoratorProps: TDecorator, componentProps: TComponent): boolean;\n}\n\nexport function createConditionalDecorator<TDecoratee extends GenericComponent>(\n    shouldDecorate: ShouldDecorate,\n    decorator: Decorator<TDecoratee>,\n    decoratorProps: unknown\n): Decorator<TDecoratee> {\n    return (Original => {\n        const DecoratedComponent = React.memo(decorator(Original));\n        DecoratedComponent.displayName = Original.displayName;\n\n        return function ShouldDecorate(props: unknown) {\n            if (shouldDecorate(decoratorProps, props)) {\n                // @ts-expect-error\n                return <DecoratedComponent {...props} />;\n            }\n\n            // @ts-expect-error\n            return <Original {...props} />;\n        };\n    }) as Decorator<TDecoratee>;\n}\n\nconst memoizedComponent = <T extends GenericComponent>(decorator: Decorator<T>) => {\n    return (decoratee: T) => {\n        return React.memo(decorator(decoratee));\n    };\n};\n\nexport function createDecoratorFactory<TDecorator>() {\n    return function from<TDecoratable extends DecoratableComponent>(\n        decoratable: TDecoratable,\n        shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>>\n    ) {\n        return function createDecorator(decorator: ComponentDecorator<GetDecoratee<TDecoratable>>) {\n            return function DecoratorPlugin(props: TDecorator) {\n                if (shouldDecorate) {\n                    const componentDecorator = createConditionalDecorator<GenericComponent>(\n                        shouldDecorate,\n                        decorator as unknown as Decorator<GenericComponent>,\n                        props\n                    );\n\n                    return <Compose function={decoratable} with={componentDecorator} />;\n                }\n\n                return (\n                    <Compose\n                        function={decoratable}\n                        with={memoizedComponent(\n                            decorator as unknown as Decorator<GenericComponent>\n                        )}\n                    />\n                );\n            };\n        };\n    };\n}\n\nexport function createHookDecoratorFactory() {\n    return function from<TDecoratable extends DecoratableHook>(decoratable: TDecoratable) {\n        return function createDecorator(decorator: Decorator<GetDecoratee<TDecoratable>>) {\n            return function DecoratorPlugin() {\n                return (\n                    <Compose\n                        function={decoratable}\n                        with={decorator as unknown as Decorator<GenericHook>}\n                    />\n                );\n            };\n        };\n    };\n}\n\nexport function withDecoratorFactory<TDecorator>() {\n    return function WithDecorator<TDecoratable extends DecoratableComponent>(\n        Component: TDecoratable,\n        shouldDecorate?: ShouldDecorate<TDecorator, GetDecorateeParams<GetDecoratee<TDecoratable>>>\n    ) {\n        const createDecorator = createDecoratorFactory<TDecorator>()(Component, shouldDecorate);\n\n        return Object.assign(Component, { createDecorator }) as TDecoratable & {\n            createDecorator: typeof createDecorator;\n        };\n    };\n}\n\nexport function withHookDecoratorFactory() {\n    return function WithHookDecorator<TDecoratable extends DecoratableHook>(hook: TDecoratable) {\n        const createDecorator = createHookDecoratorFactory()(hook);\n\n        return Object.assign(hook, { createDecorator }) as unknown as DecoratableHook<\n            GenericHook<\n                GetDecorateeParams<GetDecoratee<TDecoratable>>,\n                ReturnType<GetDecoratee<TDecoratable>>\n            >\n        > & { createDecorator: typeof createDecorator };\n    };\n}\n"],"names":["createConditionalDecorator","shouldDecorate","decorator","decoratorProps","Original","DecoratedComponent","React","props","memoizedComponent","decoratee","createDecoratorFactory","decoratable","componentDecorator","Compose","createHookDecoratorFactory","withDecoratorFactory","Component","createDecorator","Object","withHookDecoratorFactory","hook"],"mappings":";;AAgBO,SAASA,2BACZC,cAA8B,EAC9BC,SAAgC,EAChCC,cAAuB;IAEvB,OAAQC,CAAAA;QACJ,MAAMC,qBAAqB,WAArBA,GAAqBC,MAAAA,IAAU,CAACJ,UAAUE;QAChDC,mBAAmB,WAAW,GAAGD,SAAS,WAAW;QAErD,OAAO,SAAwBG,KAAc;YACzC,IAAIN,eAAeE,gBAAgBI,QAE/B,OAAO,WAAP,GAAO,oBAACF,oBAAuBE;YAInC,OAAO,WAAP,GAAO,oBAACH,UAAaG;QACzB;IACJ;AACJ;AAEA,MAAMC,oBAAoB,CAA6BN,YAC5C,CAACO,YACG,WAAP,GAAOH,MAAAA,IAAU,CAACJ,UAAUO;AAI7B,SAASC;IACZ,OAAO,SACHC,WAAyB,EACzBV,cAA2F;QAE3F,OAAO,SAAyBC,SAAyD;YACrF,OAAO,SAAyBK,KAAiB;gBAC7C,IAAIN,gBAAgB;oBAChB,MAAMW,qBAAqBZ,2BACvBC,gBACAC,WACAK;oBAGJ,OAAO,WAAP,GAAO,oBAACM,SAAOA;wBAAC,UAAUF;wBAAa,MAAMC;;gBACjD;gBAEA,OAAO,WAAP,GACI,oBAACC,SAAOA;oBACJ,UAAUF;oBACV,MAAMH,kBACFN;;YAIhB;QACJ;IACJ;AACJ;AAEO,SAASY;IACZ,OAAO,SAAoDH,WAAyB;QAChF,OAAO,SAAyBT,SAAgD;YAC5E,OAAO;gBACH,OAAO,WAAP,GACI,oBAACW,SAAOA;oBACJ,UAAUF;oBACV,MAAMT;;YAGlB;QACJ;IACJ;AACJ;AAEO,SAASa;IACZ,OAAO,SACHC,SAAuB,EACvBf,cAA2F;QAE3F,MAAMgB,kBAAkBP,yBAAqCM,WAAWf;QAExE,OAAOiB,OAAO,MAAM,CAACF,WAAW;YAAEC;QAAgB;IAGtD;AACJ;AAEO,SAASE;IACZ,OAAO,SAAiEC,IAAkB;QACtF,MAAMH,kBAAkBH,6BAA6BM;QAErD,OAAOF,OAAO,MAAM,CAACE,MAAM;YAAEH;QAAgB;IAMjD;AACJ"}

package/domain/CompositionStore.js

@@ -1,117 +1,89 @@
 import { compose } from "../Context.js";
-export class CompositionStore {
-  scopes = new Map();
-  version = 0;
-  listeners = new Set();
-  register(component, hocs, scope = "*", inherit = false, silent = false, replaces = []) {
-    const scopeMap = this.scopes.get(scope) || new Map();
-    const recipe = scopeMap.get(component) || {
-      component: component,
-      hocs: []
-    };
-
-    // Idempotent: skip if all HOCs are already registered (handles StrictMode double-render).
-    const newHocs = hocs.filter(hoc => !recipe.hocs.includes(hoc));
-    if (newHocs.length === 0 && replaces.length === 0) {
-      return () => this.unregister(component, hocs, scope);
-    }
-
-    // Atomically remove the HOCs being replaced so the store never transiently
-    // holds both the old and new decorators at the same time. This prevents
-    // useSyncExternalStore subscribers from seeing a doubly-wrapped component
-    // in the window between a render-phase registration and its effect cleanup.
-    const existingHocs = replaces.length ? recipe.hocs.filter(hoc => !replaces.includes(hoc)) : [...recipe.hocs];
-    if (inherit && scope !== "*") {
-      const globalScope = this.scopes.get("*") || new Map();
-      const globalRecipe = globalScope.get(component) || {
-        component: component,
-        hocs: []
-      };
-      // Only prepend global HOCs that aren't already present.
-      const globalHocsToAdd = globalRecipe.hocs.filter(hoc => !existingHocs.includes(hoc));
-      existingHocs.unshift(...globalHocsToAdd);
-    }
-    const finalHocs = [...existingHocs, ...newHocs];
-    scopeMap.set(component, {
-      component: compose(...[...finalHocs].reverse())(component),
-      hocs: finalHocs
-    });
-    this.scopes.set(scope, scopeMap);
-
-    // Bump the version so useSyncExternalStore sees a new snapshot.
-    this.version++;
-
-    // When called during render (silent=true), don't notify listeners —
-    // that would trigger setState in other components mid-render.
-    // Components that render after this point will see the updated snapshot.
-    if (!silent) {
-      this.notifyListeners();
+class CompositionStore {
+    register(component, hocs, scope = "*", inherit = false, silent = false, replaces = []) {
+        const scopeMap = this.scopes.get(scope) || new Map();
+        const recipe = scopeMap.get(component) || {
+            component: component,
+            hocs: []
+        };
+        const newHocs = hocs.filter((hoc)=>!recipe.hocs.includes(hoc));
+        if (0 === newHocs.length && 0 === replaces.length) return ()=>this.unregister(component, hocs, scope);
+        const existingHocs = replaces.length ? recipe.hocs.filter((hoc)=>!replaces.includes(hoc)) : [
+            ...recipe.hocs
+        ];
+        if (inherit && "*" !== scope) {
+            const globalScope = this.scopes.get("*") || new Map();
+            const globalRecipe = globalScope.get(component) || {
+                component: component,
+                hocs: []
+            };
+            const globalHocsToAdd = globalRecipe.hocs.filter((hoc)=>!existingHocs.includes(hoc));
+            existingHocs.unshift(...globalHocsToAdd);
+        }
+        const finalHocs = [
+            ...existingHocs,
+            ...newHocs
+        ];
+        scopeMap.set(component, {
+            component: compose(...[
+                ...finalHocs
+            ].reverse())(component),
+            hocs: finalHocs
+        });
+        this.scopes.set(scope, scopeMap);
+        this.version++;
+        if (!silent) this.notifyListeners();
+        return ()=>this.unregister(component, hocs, scope);
     }
-    return () => this.unregister(component, hocs, scope);
-  }
-  unregister(component, hocs, scope = "*") {
-    const scopeMap = this.scopes.get(scope);
-    if (!scopeMap) {
-      return;
+    unregister(component, hocs, scope = "*") {
+        const scopeMap = this.scopes.get(scope);
+        if (!scopeMap) return;
+        const recipe = scopeMap.get(component);
+        if (!recipe) return;
+        const newHocs = recipe.hocs.filter((hoc)=>!hocs.includes(hoc));
+        if (newHocs.length === recipe.hocs.length) return;
+        if (0 === newHocs.length) scopeMap.delete(component);
+        else scopeMap.set(component, {
+            component: compose(...[
+                ...newHocs
+            ].reverse())(component),
+            hocs: newHocs
+        });
+        this.version++;
+        this.notifyListeners();
     }
-    const recipe = scopeMap.get(component);
-    if (!recipe) {
-      return;
+    getComponent(component, scope = []) {
+        const scopesToResolve = [
+            "*",
+            ...scope
+        ].reverse();
+        for (const s of scopesToResolve){
+            const scopeMap = this.scopes.get(s);
+            if (!scopeMap) continue;
+            const composed = scopeMap.get(component);
+            if (composed) return composed.component;
+        }
     }
-    const newHocs = recipe.hocs.filter(hoc => !hocs.includes(hoc));
-    if (newHocs.length === recipe.hocs.length) {
-      // Nothing was removed.
-      return;
+    notify() {
+        this.version++;
+        this.notifyListeners();
     }
-    if (newHocs.length === 0) {
-      scopeMap.delete(component);
-    } else {
-      scopeMap.set(component, {
-        component: compose(...[...newHocs].reverse())(component),
-        hocs: newHocs
-      });
+    notifyListeners() {
+        for (const listener of this.listeners)listener();
     }
-    this.version++;
-    this.notifyListeners();
-  }
-  getComponent(component, scope = []) {
-    const scopesToResolve = ["*", ...scope].reverse();
-    for (const s of scopesToResolve) {
-      const scopeMap = this.scopes.get(s);
-      if (!scopeMap) {
-        continue;
-      }
-      const composed = scopeMap.get(component);
-      if (composed) {
-        return composed.component;
-      }
-    }
-    return undefined;
-  }
-
-  /**
-   * Bump version and notify listeners without changing store state.
-   * Used after a render-phase atomic swap (silent) to inform subscribers
-   * that the swap has settled and they should re-render with the final state.
-   */
-  notify() {
-    this.version++;
-    this.notifyListeners();
-  }
-  subscribe = listener => {
-    this.listeners.add(listener);
-    return () => {
-      this.listeners.delete(listener);
-    };
-  };
-  getSnapshot = () => {
-    return this.version;
-  };
-  notifyListeners() {
-    for (const listener of this.listeners) {
-      listener();
+    constructor(){
+        this.scopes = new Map();
+        this.version = 0;
+        this.listeners = new Set();
+        this.subscribe = (listener)=>{
+            this.listeners.add(listener);
+            return ()=>{
+                this.listeners.delete(listener);
+            };
+        };
+        this.getSnapshot = ()=>this.version;
     }
-  }
 }
+export { CompositionStore };
 
 //# sourceMappingURL=CompositionStore.js.map

package/domain/CompositionStore.js.map

@@ -1 +1 @@
-{"version":3,"names":["compose","CompositionStore","scopes","Map","version","listeners","Set","register","component","hocs","scope","inherit","silent","replaces","scopeMap","get","recipe","newHocs","filter","hoc","includes","length","unregister","existingHocs","globalScope","globalRecipe","globalHocsToAdd","unshift","finalHocs","set","reverse","notifyListeners","delete","getComponent","scopesToResolve","s","composed","undefined","notify","subscribe","listener","add","getSnapshot"],"sources":["CompositionStore.ts"],"sourcesContent":["import type { ComponentType } from \"react\";\nimport { compose } from \"~/Context.js\";\nimport type { Decorator, GenericComponent, GenericHook } from \"~/types.js\";\n\ninterface ComposedComponent {\n    component: GenericHook | GenericComponent;\n    hocs: Decorator<GenericComponent | GenericHook>[];\n}\n\ntype ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;\ntype ComponentScopes = Map<string, ComposedComponents>;\n\ntype Listener = () => void;\n\nexport class CompositionStore {\n    private scopes: ComponentScopes = new Map();\n    private version = 0;\n    private listeners = new Set<Listener>();\n\n    register(\n        component: ComponentType<unknown>,\n        hocs: Decorator<GenericComponent | GenericHook>[],\n        scope = \"*\",\n        inherit = false,\n        silent = false,\n        replaces: Decorator<GenericComponent | GenericHook>[] = []\n    ): () => void {\n        const scopeMap: ComposedComponents = this.scopes.get(scope) || new Map();\n        const recipe = scopeMap.get(component) || {\n            component: component as any,\n            hocs: [] as Decorator<GenericComponent | GenericHook>[]\n        };\n\n        // Idempotent: skip if all HOCs are already registered (handles StrictMode double-render).\n        const newHocs = hocs.filter(hoc => !recipe.hocs.includes(hoc));\n        if (newHocs.length === 0 && replaces.length === 0) {\n            return () => this.unregister(component, hocs, scope);\n        }\n\n        // Atomically remove the HOCs being replaced so the store never transiently\n        // holds both the old and new decorators at the same time. This prevents\n        // useSyncExternalStore subscribers from seeing a doubly-wrapped component\n        // in the window between a render-phase registration and its effect cleanup.\n        const existingHocs = replaces.length\n            ? recipe.hocs.filter(hoc => !replaces.includes(hoc))\n            : [...recipe.hocs];\n        if (inherit && scope !== \"*\") {\n            const globalScope = this.scopes.get(\"*\") || new Map();\n            const globalRecipe = globalScope.get(component) || {\n                component: component as any,\n                hocs: [] as Decorator<GenericComponent | GenericHook>[]\n            };\n            // Only prepend global HOCs that aren't already present.\n            const globalHocsToAdd = globalRecipe.hocs.filter(\n                (hoc: Decorator<GenericComponent | GenericHook>) => !existingHocs.includes(hoc)\n            );\n            existingHocs.unshift(...globalHocsToAdd);\n        }\n\n        const finalHocs = [...existingHocs, ...newHocs];\n\n        scopeMap.set(component, {\n            component: compose(...[...finalHocs].reverse())(component as any),\n            hocs: finalHocs\n        });\n\n        this.scopes.set(scope, scopeMap);\n\n        // Bump the version so useSyncExternalStore sees a new snapshot.\n        this.version++;\n\n        // When called during render (silent=true), don't notify listeners —\n        // that would trigger setState in other components mid-render.\n        // Components that render after this point will see the updated snapshot.\n        if (!silent) {\n            this.notifyListeners();\n        }\n\n        return () => this.unregister(component, hocs, scope);\n    }\n\n    unregister(\n        component: ComponentType<unknown>,\n        hocs: Decorator<GenericComponent | GenericHook>[],\n        scope = \"*\"\n    ): void {\n        const scopeMap = this.scopes.get(scope);\n        if (!scopeMap) {\n            return;\n        }\n\n        const recipe = scopeMap.get(component);\n        if (!recipe) {\n            return;\n        }\n\n        const newHocs = recipe.hocs.filter(hoc => !hocs.includes(hoc));\n        if (newHocs.length === recipe.hocs.length) {\n            // Nothing was removed.\n            return;\n        }\n\n        if (newHocs.length === 0) {\n            scopeMap.delete(component);\n        } else {\n            scopeMap.set(component, {\n                component: compose(...[...newHocs].reverse())(component as any),\n                hocs: newHocs\n            });\n        }\n\n        this.version++;\n        this.notifyListeners();\n    }\n\n    getComponent(\n        component: ComponentType<unknown>,\n        scope: string[] = []\n    ): GenericComponent | GenericHook | undefined {\n        const scopesToResolve = [\"*\", ...scope].reverse();\n        for (const s of scopesToResolve) {\n            const scopeMap = this.scopes.get(s);\n            if (!scopeMap) {\n                continue;\n            }\n            const composed = scopeMap.get(component);\n            if (composed) {\n                return composed.component;\n            }\n        }\n        return undefined;\n    }\n\n    /**\n     * Bump version and notify listeners without changing store state.\n     * Used after a render-phase atomic swap (silent) to inform subscribers\n     * that the swap has settled and they should re-render with the final state.\n     */\n    notify(): void {\n        this.version++;\n        this.notifyListeners();\n    }\n\n    subscribe = (listener: Listener): (() => void) => {\n        this.listeners.add(listener);\n        return () => {\n            this.listeners.delete(listener);\n        };\n    };\n\n    getSnapshot = (): number => {\n        return this.version;\n    };\n\n    private notifyListeners(): void {\n        for (const listener of this.listeners) {\n            listener();\n        }\n    }\n}\n"],"mappings":"AACA,SAASA,OAAO;AAahB,OAAO,MAAMC,gBAAgB,CAAC;EAClBC,MAAM,GAAoB,IAAIC,GAAG,CAAC,CAAC;EACnCC,OAAO,GAAG,CAAC;EACXC,SAAS,GAAG,IAAIC,GAAG,CAAW,CAAC;EAEvCC,QAAQA,CACJC,SAAiC,EACjCC,IAAiD,EACjDC,KAAK,GAAG,GAAG,EACXC,OAAO,GAAG,KAAK,EACfC,MAAM,GAAG,KAAK,EACdC,QAAqD,GAAG,EAAE,EAChD;IACV,MAAMC,QAA4B,GAAG,IAAI,CAACZ,MAAM,CAACa,GAAG,CAACL,KAAK,CAAC,IAAI,IAAIP,GAAG,CAAC,CAAC;IACxE,MAAMa,MAAM,GAAGF,QAAQ,CAACC,GAAG,CAACP,SAAS,CAAC,IAAI;MACtCA,SAAS,EAAEA,SAAgB;MAC3BC,IAAI,EAAE;IACV,CAAC;;IAED;IACA,MAAMQ,OAAO,GAAGR,IAAI,CAACS,MAAM,CAACC,GAAG,IAAI,CAACH,MAAM,CAACP,IAAI,CAACW,QAAQ,CAACD,GAAG,CAAC,CAAC;IAC9D,IAAIF,OAAO,CAACI,MAAM,KAAK,CAAC,IAAIR,QAAQ,CAACQ,MAAM,KAAK,CAAC,EAAE;MAC/C,OAAO,MAAM,IAAI,CAACC,UAAU,CAACd,SAAS,EAAEC,IAAI,EAAEC,KAAK,CAAC;IACxD;;IAEA;IACA;IACA;IACA;IACA,MAAMa,YAAY,GAAGV,QAAQ,CAACQ,MAAM,GAC9BL,MAAM,CAACP,IAAI,CAACS,MAAM,CAACC,GAAG,IAAI,CAACN,QAAQ,CAACO,QAAQ,CAACD,GAAG,CAAC,CAAC,GAClD,CAAC,GAAGH,MAAM,CAACP,IAAI,CAAC;IACtB,IAAIE,OAAO,IAAID,KAAK,KAAK,GAAG,EAAE;MAC1B,MAAMc,WAAW,GAAG,IAAI,CAACtB,MAAM,CAACa,GAAG,CAAC,GAAG,CAAC,IAAI,IAAIZ,GAAG,CAAC,CAAC;MACrD,MAAMsB,YAAY,GAAGD,WAAW,CAACT,GAAG,CAACP,SAAS,CAAC,IAAI;QAC/CA,SAAS,EAAEA,SAAgB;QAC3BC,IAAI,EAAE;MACV,CAAC;MACD;MACA,MAAMiB,eAAe,GAAGD,YAAY,CAAChB,IAAI,CAACS,MAAM,CAC3CC,GAA8C,IAAK,CAACI,YAAY,CAACH,QAAQ,CAACD,GAAG,CAClF,CAAC;MACDI,YAAY,CAACI,OAAO,CAAC,GAAGD,eAAe,CAAC;IAC5C;IAEA,MAAME,SAAS,GAAG,CAAC,GAAGL,YAAY,EAAE,GAAGN,OAAO,CAAC;IAE/CH,QAAQ,CAACe,GAAG,CAACrB,SAAS,EAAE;MACpBA,SAAS,EAAER,OAAO,CAAC,GAAG,CAAC,GAAG4B,SAAS,CAAC,CAACE,OAAO,CAAC,CAAC,CAAC,CAACtB,SAAgB,CAAC;MACjEC,IAAI,EAAEmB;IACV,CAAC,CAAC;IAEF,IAAI,CAAC1B,MAAM,CAAC2B,GAAG,CAACnB,KAAK,EAAEI,QAAQ,CAAC;;IAEhC;IACA,IAAI,CAACV,OAAO,EAAE;;IAEd;IACA;IACA;IACA,IAAI,CAACQ,MAAM,EAAE;MACT,IAAI,CAACmB,eAAe,CAAC,CAAC;IAC1B;IAEA,OAAO,MAAM,IAAI,CAACT,UAAU,CAACd,SAAS,EAAEC,IAAI,EAAEC,KAAK,CAAC;EACxD;EAEAY,UAAUA,CACNd,SAAiC,EACjCC,IAAiD,EACjDC,KAAK,GAAG,GAAG,EACP;IACJ,MAAMI,QAAQ,GAAG,IAAI,CAACZ,MAAM,CAACa,GAAG,CAACL,KAAK,CAAC;IACvC,IAAI,CAACI,QAAQ,EAAE;MACX;IACJ;IAEA,MAAME,MAAM,GAAGF,QAAQ,CAACC,GAAG,CAACP,SAAS,CAAC;IACtC,IAAI,CAACQ,MAAM,EAAE;MACT;IACJ;IAEA,MAAMC,OAAO,GAAGD,MAAM,CAACP,IAAI,CAACS,MAAM,CAACC,GAAG,IAAI,CAACV,IAAI,CAACW,QAAQ,CAACD,GAAG,CAAC,CAAC;IAC9D,IAAIF,OAAO,CAACI,MAAM,KAAKL,MAAM,CAACP,IAAI,CAACY,MAAM,EAAE;MACvC;MACA;IACJ;IAEA,IAAIJ,OAAO,CAACI,MAAM,KAAK,CAAC,EAAE;MACtBP,QAAQ,CAACkB,MAAM,CAACxB,SAAS,CAAC;IAC9B,CAAC,MAAM;MACHM,QAAQ,CAACe,GAAG,CAACrB,SAAS,EAAE;QACpBA,SAAS,EAAER,OAAO,CAAC,GAAG,CAAC,GAAGiB,OAAO,CAAC,CAACa,OAAO,CAAC,CAAC,CAAC,CAACtB,SAAgB,CAAC;QAC/DC,IAAI,EAAEQ;MACV,CAAC,CAAC;IACN;IAEA,IAAI,CAACb,OAAO,EAAE;IACd,IAAI,CAAC2B,eAAe,CAAC,CAAC;EAC1B;EAEAE,YAAYA,CACRzB,SAAiC,EACjCE,KAAe,GAAG,EAAE,EACsB;IAC1C,MAAMwB,eAAe,GAAG,CAAC,GAAG,EAAE,GAAGxB,KAAK,CAAC,CAACoB,OAAO,CAAC,CAAC;IACjD,KAAK,MAAMK,CAAC,IAAID,eAAe,EAAE;MAC7B,MAAMpB,QAAQ,GAAG,IAAI,CAACZ,MAAM,CAACa,GAAG,CAACoB,CAAC,CAAC;MACnC,IAAI,CAACrB,QAAQ,EAAE;QACX;MACJ;MACA,MAAMsB,QAAQ,GAAGtB,QAAQ,CAACC,GAAG,CAACP,SAAS,CAAC;MACxC,IAAI4B,QAAQ,EAAE;QACV,OAAOA,QAAQ,CAAC5B,SAAS;MAC7B;IACJ;IACA,OAAO6B,SAAS;EACpB;;EAEA;AACJ;AACA;AACA;AACA;EACIC,MAAMA,CAAA,EAAS;IACX,IAAI,CAAClC,OAAO,EAAE;IACd,IAAI,CAAC2B,eAAe,CAAC,CAAC;EAC1B;EAEAQ,SAAS,GAAIC,QAAkB,IAAmB;IAC9C,IAAI,CAACnC,SAAS,CAACoC,GAAG,CAACD,QAAQ,CAAC;IAC5B,OAAO,MAAM;MACT,IAAI,CAACnC,SAAS,CAAC2B,MAAM,CAACQ,QAAQ,CAAC;IACnC,CAAC;EACL,CAAC;EAEDE,WAAW,GAAGA,CAAA,KAAc;IACxB,OAAO,IAAI,CAACtC,OAAO;EACvB,CAAC;EAEO2B,eAAeA,CAAA,EAAS;IAC5B,KAAK,MAAMS,QAAQ,IAAI,IAAI,CAACnC,SAAS,EAAE;MACnCmC,QAAQ,CAAC,CAAC;IACd;EACJ;AACJ","ignoreList":[]}
+{"version":3,"file":"domain/CompositionStore.js","sources":["../../src/domain/CompositionStore.ts"],"sourcesContent":["import type { ComponentType } from \"react\";\nimport { compose } from \"~/Context.js\";\nimport type { Decorator, GenericComponent, GenericHook } from \"~/types.js\";\n\ninterface ComposedComponent {\n    component: GenericHook | GenericComponent;\n    hocs: Decorator<GenericComponent | GenericHook>[];\n}\n\ntype ComposedComponents = Map<ComponentType<unknown>, ComposedComponent>;\ntype ComponentScopes = Map<string, ComposedComponents>;\n\ntype Listener = () => void;\n\nexport class CompositionStore {\n    private scopes: ComponentScopes = new Map();\n    private version = 0;\n    private listeners = new Set<Listener>();\n\n    register(\n        component: ComponentType<unknown>,\n        hocs: Decorator<GenericComponent | GenericHook>[],\n        scope = \"*\",\n        inherit = false,\n        silent = false,\n        replaces: Decorator<GenericComponent | GenericHook>[] = []\n    ): () => void {\n        const scopeMap: ComposedComponents = this.scopes.get(scope) || new Map();\n        const recipe = scopeMap.get(component) || {\n            component: component as any,\n            hocs: [] as Decorator<GenericComponent | GenericHook>[]\n        };\n\n        // Idempotent: skip if all HOCs are already registered (handles StrictMode double-render).\n        const newHocs = hocs.filter(hoc => !recipe.hocs.includes(hoc));\n        if (newHocs.length === 0 && replaces.length === 0) {\n            return () => this.unregister(component, hocs, scope);\n        }\n\n        // Atomically remove the HOCs being replaced so the store never transiently\n        // holds both the old and new decorators at the same time. This prevents\n        // useSyncExternalStore subscribers from seeing a doubly-wrapped component\n        // in the window between a render-phase registration and its effect cleanup.\n        const existingHocs = replaces.length\n            ? recipe.hocs.filter(hoc => !replaces.includes(hoc))\n            : [...recipe.hocs];\n        if (inherit && scope !== \"*\") {\n            const globalScope = this.scopes.get(\"*\") || new Map();\n            const globalRecipe = globalScope.get(component) || {\n                component: component as any,\n                hocs: [] as Decorator<GenericComponent | GenericHook>[]\n            };\n            // Only prepend global HOCs that aren't already present.\n            const globalHocsToAdd = globalRecipe.hocs.filter(\n                (hoc: Decorator<GenericComponent | GenericHook>) => !existingHocs.includes(hoc)\n            );\n            existingHocs.unshift(...globalHocsToAdd);\n        }\n\n        const finalHocs = [...existingHocs, ...newHocs];\n\n        scopeMap.set(component, {\n            component: compose(...[...finalHocs].reverse())(component as any),\n            hocs: finalHocs\n        });\n\n        this.scopes.set(scope, scopeMap);\n\n        // Bump the version so useSyncExternalStore sees a new snapshot.\n        this.version++;\n\n        // When called during render (silent=true), don't notify listeners —\n        // that would trigger setState in other components mid-render.\n        // Components that render after this point will see the updated snapshot.\n        if (!silent) {\n            this.notifyListeners();\n        }\n\n        return () => this.unregister(component, hocs, scope);\n    }\n\n    unregister(\n        component: ComponentType<unknown>,\n        hocs: Decorator<GenericComponent | GenericHook>[],\n        scope = \"*\"\n    ): void {\n        const scopeMap = this.scopes.get(scope);\n        if (!scopeMap) {\n            return;\n        }\n\n        const recipe = scopeMap.get(component);\n        if (!recipe) {\n            return;\n        }\n\n        const newHocs = recipe.hocs.filter(hoc => !hocs.includes(hoc));\n        if (newHocs.length === recipe.hocs.length) {\n            // Nothing was removed.\n            return;\n        }\n\n        if (newHocs.length === 0) {\n            scopeMap.delete(component);\n        } else {\n            scopeMap.set(component, {\n                component: compose(...[...newHocs].reverse())(component as any),\n                hocs: newHocs\n            });\n        }\n\n        this.version++;\n        this.notifyListeners();\n    }\n\n    getComponent(\n        component: ComponentType<unknown>,\n        scope: string[] = []\n    ): GenericComponent | GenericHook | undefined {\n        const scopesToResolve = [\"*\", ...scope].reverse();\n        for (const s of scopesToResolve) {\n            const scopeMap = this.scopes.get(s);\n            if (!scopeMap) {\n                continue;\n            }\n            const composed = scopeMap.get(component);\n            if (composed) {\n                return composed.component;\n            }\n        }\n        return undefined;\n    }\n\n    /**\n     * Bump version and notify listeners without changing store state.\n     * Used after a render-phase atomic swap (silent) to inform subscribers\n     * that the swap has settled and they should re-render with the final state.\n     */\n    notify(): void {\n        this.version++;\n        this.notifyListeners();\n    }\n\n    subscribe = (listener: Listener): (() => void) => {\n        this.listeners.add(listener);\n        return () => {\n            this.listeners.delete(listener);\n        };\n    };\n\n    getSnapshot = (): number => {\n        return this.version;\n    };\n\n    private notifyListeners(): void {\n        for (const listener of this.listeners) {\n            listener();\n        }\n    }\n}\n"],"names":["CompositionStore","component","hocs","scope","inherit","silent","replaces","scopeMap","Map","recipe","newHocs","hoc","existingHocs","globalScope","globalRecipe","globalHocsToAdd","finalHocs","compose","scopesToResolve","s","composed","listener","Set"],"mappings":";AAcO,MAAMA;IAKT,SACIC,SAAiC,EACjCC,IAAiD,EACjDC,QAAQ,GAAG,EACXC,UAAU,KAAK,EACfC,SAAS,KAAK,EACdC,WAAwD,EAAE,EAChD;QACV,MAAMC,WAA+B,IAAI,CAAC,MAAM,CAAC,GAAG,CAACJ,UAAU,IAAIK;QACnE,MAAMC,SAASF,SAAS,GAAG,CAACN,cAAc;YACtC,WAAWA;YACX,MAAM,EAAE;QACZ;QAGA,MAAMS,UAAUR,KAAK,MAAM,CAACS,CAAAA,MAAO,CAACF,OAAO,IAAI,CAAC,QAAQ,CAACE;QACzD,IAAID,AAAmB,MAAnBA,QAAQ,MAAM,IAAUJ,AAAoB,MAApBA,SAAS,MAAM,EACvC,OAAO,IAAM,IAAI,CAAC,UAAU,CAACL,WAAWC,MAAMC;QAOlD,MAAMS,eAAeN,SAAS,MAAM,GAC9BG,OAAO,IAAI,CAAC,MAAM,CAACE,CAAAA,MAAO,CAACL,SAAS,QAAQ,CAACK,QAC7C;eAAIF,OAAO,IAAI;SAAC;QACtB,IAAIL,WAAWD,AAAU,QAAVA,OAAe;YAC1B,MAAMU,cAAc,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,QAAQ,IAAIL;YAChD,MAAMM,eAAeD,YAAY,GAAG,CAACZ,cAAc;gBAC/C,WAAWA;gBACX,MAAM,EAAE;YACZ;YAEA,MAAMc,kBAAkBD,aAAa,IAAI,CAAC,MAAM,CAC5C,CAACH,MAAmD,CAACC,aAAa,QAAQ,CAACD;YAE/EC,aAAa,OAAO,IAAIG;QAC5B;QAEA,MAAMC,YAAY;eAAIJ;eAAiBF;SAAQ;QAE/CH,SAAS,GAAG,CAACN,WAAW;YACpB,WAAWgB,WAAW;mBAAID;aAAU,CAAC,OAAO,IAAIf;YAChD,MAAMe;QACV;QAEA,IAAI,CAAC,MAAM,CAAC,GAAG,CAACb,OAAOI;QAGvB,IAAI,CAAC,OAAO;QAKZ,IAAI,CAACF,QACD,IAAI,CAAC,eAAe;QAGxB,OAAO,IAAM,IAAI,CAAC,UAAU,CAACJ,WAAWC,MAAMC;IAClD;IAEA,WACIF,SAAiC,EACjCC,IAAiD,EACjDC,QAAQ,GAAG,EACP;QACJ,MAAMI,WAAW,IAAI,CAAC,MAAM,CAAC,GAAG,CAACJ;QACjC,IAAI,CAACI,UACD;QAGJ,MAAME,SAASF,SAAS,GAAG,CAACN;QAC5B,IAAI,CAACQ,QACD;QAGJ,MAAMC,UAAUD,OAAO,IAAI,CAAC,MAAM,CAACE,CAAAA,MAAO,CAACT,KAAK,QAAQ,CAACS;QACzD,IAAID,QAAQ,MAAM,KAAKD,OAAO,IAAI,CAAC,MAAM,EAErC;QAGJ,IAAIC,AAAmB,MAAnBA,QAAQ,MAAM,EACdH,SAAS,MAAM,CAACN;aAEhBM,SAAS,GAAG,CAACN,WAAW;YACpB,WAAWgB,WAAW;mBAAIP;aAAQ,CAAC,OAAO,IAAIT;YAC9C,MAAMS;QACV;QAGJ,IAAI,CAAC,OAAO;QACZ,IAAI,CAAC,eAAe;IACxB;IAEA,aACIT,SAAiC,EACjCE,QAAkB,EAAE,EACsB;QAC1C,MAAMe,kBAAkB;YAAC;eAAQf;SAAM,CAAC,OAAO;QAC/C,KAAK,MAAMgB,KAAKD,gBAAiB;YAC7B,MAAMX,WAAW,IAAI,CAAC,MAAM,CAAC,GAAG,CAACY;YACjC,IAAI,CAACZ,UACD;YAEJ,MAAMa,WAAWb,SAAS,GAAG,CAACN;YAC9B,IAAImB,UACA,OAAOA,SAAS,SAAS;QAEjC;IAEJ;IAOA,SAAe;QACX,IAAI,CAAC,OAAO;QACZ,IAAI,CAAC,eAAe;IACxB;IAaQ,kBAAwB;QAC5B,KAAK,MAAMC,YAAY,IAAI,CAAC,SAAS,CACjCA;IAER;;aA/IQ,MAAM,GAAoB,IAAIb;aAC9B,OAAO,GAAG;aACV,SAAS,GAAG,IAAIc;aA8HxB,SAAS,GAAG,CAACD;YACT,IAAI,CAAC,SAAS,CAAC,GAAG,CAACA;YACnB,OAAO;gBACH,IAAI,CAAC,SAAS,CAAC,MAAM,CAACA;YAC1B;QACJ;aAEA,WAAW,GAAG,IACH,IAAI,CAAC,OAAO;;AAQ3B"}

package/index.js

@@ -6,5 +6,3 @@ export * from "./createDecorator.js";
 export * from "./decorators.js";
 export * from "./CompositionScope.js";
 export { CompositionStore } from "./domain/CompositionStore.js";
-
-//# sourceMappingURL=index.js.map

package/makeComposable.js

@@ -1,14 +1,11 @@
 import { createContext } from "react";
 import { makeDecoratable } from "./makeDecoratable.js";
-const ComposableContext = /*#__PURE__*/createContext([]);
+const ComposableContext = /*#__PURE__*/ createContext([]);
 ComposableContext.displayName = "ComposableContext";
-const nullRenderer = () => null;
-
-/**
- * @deprecated Use `makeDecoratable` instead.
- */
-export function makeComposable(name, Component) {
-  return makeDecoratable(name, Component ?? nullRenderer);
+const nullRenderer = ()=>null;
+function makeComposable(name, Component) {
+    return makeDecoratable(name, Component ?? nullRenderer);
 }
+export { makeComposable };
 
 //# sourceMappingURL=makeComposable.js.map

package/makeComposable.js.map

@@ -1 +1 @@
-{"version":3,"names":["createContext","makeDecoratable","ComposableContext","displayName","nullRenderer","makeComposable","name","Component"],"sources":["makeComposable.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { GenericComponent } from \"~/types.js\";\nimport { makeDecoratable } from \"~/makeDecoratable.js\";\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nconst nullRenderer = () => null;\n\n/**\n * @deprecated Use `makeDecoratable` instead.\n */\nexport function makeComposable<T extends GenericComponent>(name: string, Component?: T) {\n    return makeDecoratable(name, Component ?? nullRenderer);\n}\n"],"mappings":"AAAA,SAASA,aAAa,QAAQ,OAAO;AAErC,SAASC,eAAe;AAExB,MAAMC,iBAAiB,gBAAGF,aAAa,CAAW,EAAE,CAAC;AACrDE,iBAAiB,CAACC,WAAW,GAAG,mBAAmB;AAEnD,MAAMC,YAAY,GAAGA,CAAA,KAAM,IAAI;;AAE/B;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAA6BC,IAAY,EAAEC,SAAa,EAAE;EACpF,OAAON,eAAe,CAACK,IAAI,EAAEC,SAAS,IAAIH,YAAY,CAAC;AAC3D","ignoreList":[]}
+{"version":3,"file":"makeComposable.js","sources":["../src/makeComposable.tsx"],"sourcesContent":["import { createContext } from \"react\";\nimport type { GenericComponent } from \"~/types.js\";\nimport { makeDecoratable } from \"~/makeDecoratable.js\";\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nconst nullRenderer = () => null;\n\n/**\n * @deprecated Use `makeDecoratable` instead.\n */\nexport function makeComposable<T extends GenericComponent>(name: string, Component?: T) {\n    return makeDecoratable(name, Component ?? nullRenderer);\n}\n"],"names":["ComposableContext","createContext","nullRenderer","makeComposable","name","Component","makeDecoratable"],"mappings":";;AAIA,MAAMA,oBAAoB,WAAHA,GAAGC,cAAwB,EAAE;AACpDD,kBAAkB,WAAW,GAAG;AAEhC,MAAME,eAAe,IAAM;AAKpB,SAASC,eAA2CC,IAAY,EAAEC,SAAa;IAClF,OAAOC,gBAAgBF,MAAMC,aAAaH;AAC9C"}

package/makeDecoratable.js

@@ -1,90 +1,90 @@
-import React, { createContext, useContext, useMemo } from "react";
+import react, { createContext, useContext, useMemo } from "react";
 import { useComponent } from "./Context.js";
 import { withDecoratorFactory, withHookDecoratorFactory } from "./decorators.js";
-class DecoratableErrorBoundary extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      hasError: false,
-      error: undefined
-    };
-  }
-  static getDerivedStateFromError(error) {
-    return {
-      hasError: true,
-      error
-    };
-  }
-  componentDidCatch(error, errorInfo) {
-    console.groupCollapsed(`%cCOMPONENT ERROR%c: "${this.props.name}" failed to render.`, "color:red", "color:default");
-    console.error(error, errorInfo);
-    console.groupEnd();
-  }
-  render() {
-    if (this.state.hasError) {
-      return /*#__PURE__*/React.createElement("div", {
-        style: {
-          padding: "8px 12px",
-          border: "1px solid #e53e3e",
-          borderRadius: 4,
-          background: "#fff5f5",
-          color: "#c53030",
-          fontSize: 13
-        }
-      }, /*#__PURE__*/React.createElement("strong", null, this.props.name), ": ", this.state.error?.message);
+class DecoratableErrorBoundary extends react.Component {
+    constructor(props){
+        super(props);
+        this.state = {
+            hasError: false,
+            error: void 0
+        };
+    }
+    static getDerivedStateFromError(error) {
+        return {
+            hasError: true,
+            error
+        };
+    }
+    componentDidCatch(error, errorInfo) {
+        console.groupCollapsed(`%cCOMPONENT ERROR%c: "${this.props.name}" failed to render.`, "color:red", "color:default");
+        console.error(error, errorInfo);
+        console.groupEnd();
+    }
+    render() {
+        if (this.state.hasError) return /*#__PURE__*/ react.createElement("div", {
+            style: {
+                padding: "8px 12px",
+                border: "1px solid #e53e3e",
+                borderRadius: 4,
+                background: "#fff5f5",
+                color: "#c53030",
+                fontSize: 13
+            }
+        }, /*#__PURE__*/ react.createElement("strong", null, this.props.name), ": ", this.state.error?.message);
+        return this.props.children;
     }
-    return this.props.children;
-  }
 }
-const ComposableContext = /*#__PURE__*/createContext([]);
+const ComposableContext = /*#__PURE__*/ createContext([]);
 ComposableContext.displayName = "ComposableContext";
 function useComposableParents() {
-  const context = useContext(ComposableContext);
-  if (!context) {
-    return [];
-  }
-  return context;
+    const context = useContext(ComposableContext);
+    if (!context) return [];
+    return context;
 }
-const nullRenderer = () => null;
+const nullRenderer = ()=>null;
 function makeDecoratableComponent(name, Component = nullRenderer) {
-  const Decoratable = props => {
-    const parents = useComposableParents();
-    const ComposedComponent = useComponent(Component);
-    const context = useMemo(() => [...parents, name], [parents, name]);
-    return /*#__PURE__*/React.createElement(ComposableContext.Provider, {
-      value: context
-    }, /*#__PURE__*/React.createElement(DecoratableErrorBoundary, {
-      name: name
-    }, /*#__PURE__*/React.createElement(ComposedComponent, props, props.children)));
-  };
-  const staticProps = {
-    original: Component,
-    originalName: name,
-    displayName: `Decoratable<${name}>`
-  };
-  return withDecoratorFactory()(Object.assign(Decoratable, staticProps));
+    const Decoratable = (props)=>{
+        const parents = useComposableParents();
+        const ComposedComponent = useComponent(Component);
+        const context = useMemo(()=>[
+                ...parents,
+                name
+            ], [
+            parents,
+            name
+        ]);
+        return /*#__PURE__*/ react.createElement(ComposableContext.Provider, {
+            value: context
+        }, /*#__PURE__*/ react.createElement(DecoratableErrorBoundary, {
+            name: name
+        }, /*#__PURE__*/ react.createElement(ComposedComponent, props, props.children)));
+    };
+    const staticProps = {
+        original: Component,
+        originalName: name,
+        displayName: `Decoratable<${name}>`
+    };
+    return withDecoratorFactory()(Object.assign(Decoratable, staticProps));
 }
-export function makeDecoratableHook(hook) {
-  const decoratableHook = params => {
-    const composedHook = useComponent(hook);
-    return composedHook(params);
-  };
-  decoratableHook.original = hook;
-  return withHookDecoratorFactory()(decoratableHook);
+function makeDecoratableHook(hook) {
+    const decoratableHook = (params)=>{
+        const composedHook = useComponent(hook);
+        return composedHook(params);
+    };
+    decoratableHook.original = hook;
+    return withHookDecoratorFactory()(decoratableHook);
 }
-export function createVoidComponent() {
-  // oxlint-disable-next-line typescript/no-unused-vars
-  return props => {
-    return null;
-  };
+function createVoidComponent() {
+    return (props)=>null;
 }
-export function makeDecoratable(hookOrName, Component) {
-  if (Component) {
-    const component = makeDecoratableComponent(hookOrName, /*#__PURE__*/React.memo(Component));
-    component.original.displayName = hookOrName;
-    return component;
-  }
-  return makeDecoratableHook(hookOrName);
+function makeDecoratable(hookOrName, Component) {
+    if (Component) {
+        const component = makeDecoratableComponent(hookOrName, /*#__PURE__*/ react.memo(Component));
+        component.original.displayName = hookOrName;
+        return component;
+    }
+    return makeDecoratableHook(hookOrName);
 }
+export { createVoidComponent, makeDecoratable, makeDecoratableHook };
 
 //# sourceMappingURL=makeDecoratable.js.map

package/makeDecoratable.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","useContext","useMemo","useComponent","withDecoratorFactory","withHookDecoratorFactory","DecoratableErrorBoundary","Component","constructor","props","state","hasError","error","undefined","getDerivedStateFromError","componentDidCatch","errorInfo","console","groupCollapsed","name","groupEnd","render","createElement","style","padding","border","borderRadius","background","color","fontSize","message","children","ComposableContext","displayName","useComposableParents","context","nullRenderer","makeDecoratableComponent","Decoratable","parents","ComposedComponent","Provider","value","staticProps","original","originalName","Object","assign","makeDecoratableHook","hook","decoratableHook","params","composedHook","createVoidComponent","makeDecoratable","hookOrName","component","memo"],"sources":["makeDecoratable.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from \"react\";\nimport type { ErrorInfo } from \"react\";\nimport { useComponent } from \"./Context.js\";\nimport type {\n    DecoratableComponent,\n    DecoratableHook,\n    GenericComponent,\n    GenericHook\n} from \"~/types.js\";\nimport { withDecoratorFactory, withHookDecoratorFactory } from \"~/decorators.js\";\n\ninterface ErrorBoundaryProps {\n    name: string;\n    children: React.ReactNode;\n}\n\ninterface ErrorBoundaryState {\n    hasError: boolean;\n    error: Error | undefined;\n}\n\nclass DecoratableErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n    constructor(props: ErrorBoundaryProps) {\n        super(props);\n        this.state = { hasError: false, error: undefined };\n    }\n\n    static getDerivedStateFromError(error: Error): ErrorBoundaryState {\n        return { hasError: true, error };\n    }\n\n    override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n        console.groupCollapsed(\n            `%cCOMPONENT ERROR%c: \"${this.props.name}\" failed to render.`,\n            \"color:red\",\n            \"color:default\"\n        );\n        console.error(error, errorInfo);\n        console.groupEnd();\n    }\n\n    override render() {\n        if (this.state.hasError) {\n            return (\n                <div\n                    style={{\n                        padding: \"8px 12px\",\n                        border: \"1px solid #e53e3e\",\n                        borderRadius: 4,\n                        background: \"#fff5f5\",\n                        color: \"#c53030\",\n                        fontSize: 13\n                    }}\n                >\n                    <strong>{this.props.name}</strong>: {this.state.error?.message}\n                </div>\n            );\n        }\n        return this.props.children;\n    }\n}\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nfunction useComposableParents() {\n    const context = useContext(ComposableContext);\n    if (!context) {\n        return [];\n    }\n\n    return context;\n}\n\nconst nullRenderer = () => null;\n\nfunction makeDecoratableComponent<T extends GenericComponent>(\n    name: string,\n    Component: T = nullRenderer as unknown as T\n) {\n    const Decoratable = (props: React.ComponentProps<T>): React.JSX.Element | null => {\n        const parents = useComposableParents();\n        const ComposedComponent = useComponent(Component) as GenericComponent<\n            React.ComponentProps<T>\n        >;\n\n        const context = useMemo(() => [...parents, name], [parents, name]);\n\n        return (\n            <ComposableContext.Provider value={context}>\n                <DecoratableErrorBoundary name={name}>\n                    <ComposedComponent {...props}>{props.children}</ComposedComponent>\n                </DecoratableErrorBoundary>\n            </ComposableContext.Provider>\n        );\n    };\n\n    const staticProps = {\n        original: Component,\n        originalName: name,\n        displayName: `Decoratable<${name}>`\n    };\n\n    return withDecoratorFactory()(\n        Object.assign(Decoratable, staticProps) as DecoratableComponent<\n            typeof Component & typeof staticProps\n        >\n    );\n}\n\nexport function makeDecoratableHook<T extends GenericHook>(hook: T) {\n    const decoratableHook = (params: Parameters<T>) => {\n        const composedHook = useComponent(hook);\n\n        return composedHook(params) as DecoratableHook<T>;\n    };\n\n    decoratableHook.original = hook;\n\n    return withHookDecoratorFactory()(decoratableHook as DecoratableHook<T>);\n}\n\nexport function createVoidComponent<T>() {\n    // oxlint-disable-next-line typescript/no-unused-vars\n    return (props: T): React.JSX.Element | null => {\n        return null;\n    };\n}\n\nexport function makeDecoratable<T extends GenericHook>(\n    hook: T\n): ReturnType<typeof makeDecoratableHook<T>>;\nexport function makeDecoratable<T extends GenericComponent>(\n    name: string,\n    Component: T\n): ReturnType<typeof makeDecoratableComponent<T>>;\nexport function makeDecoratable(hookOrName: any, Component?: any) {\n    if (Component) {\n        const component = makeDecoratableComponent(hookOrName, React.memo(Component));\n        component.original.displayName = hookOrName;\n        return component;\n    }\n\n    return makeDecoratableHook(hookOrName);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"makeDecoratable.js","sources":["../src/makeDecoratable.tsx"],"sourcesContent":["import React, { createContext, useContext, useMemo } from \"react\";\nimport type { ErrorInfo } from \"react\";\nimport { useComponent } from \"./Context.js\";\nimport type {\n    DecoratableComponent,\n    DecoratableHook,\n    GenericComponent,\n    GenericHook\n} from \"~/types.js\";\nimport { withDecoratorFactory, withHookDecoratorFactory } from \"~/decorators.js\";\n\ninterface ErrorBoundaryProps {\n    name: string;\n    children: React.ReactNode;\n}\n\ninterface ErrorBoundaryState {\n    hasError: boolean;\n    error: Error | undefined;\n}\n\nclass DecoratableErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {\n    constructor(props: ErrorBoundaryProps) {\n        super(props);\n        this.state = { hasError: false, error: undefined };\n    }\n\n    static getDerivedStateFromError(error: Error): ErrorBoundaryState {\n        return { hasError: true, error };\n    }\n\n    override componentDidCatch(error: Error, errorInfo: ErrorInfo) {\n        console.groupCollapsed(\n            `%cCOMPONENT ERROR%c: \"${this.props.name}\" failed to render.`,\n            \"color:red\",\n            \"color:default\"\n        );\n        console.error(error, errorInfo);\n        console.groupEnd();\n    }\n\n    override render() {\n        if (this.state.hasError) {\n            return (\n                <div\n                    style={{\n                        padding: \"8px 12px\",\n                        border: \"1px solid #e53e3e\",\n                        borderRadius: 4,\n                        background: \"#fff5f5\",\n                        color: \"#c53030\",\n                        fontSize: 13\n                    }}\n                >\n                    <strong>{this.props.name}</strong>: {this.state.error?.message}\n                </div>\n            );\n        }\n        return this.props.children;\n    }\n}\n\nconst ComposableContext = createContext<string[]>([]);\nComposableContext.displayName = \"ComposableContext\";\n\nfunction useComposableParents() {\n    const context = useContext(ComposableContext);\n    if (!context) {\n        return [];\n    }\n\n    return context;\n}\n\nconst nullRenderer = () => null;\n\nfunction makeDecoratableComponent<T extends GenericComponent>(\n    name: string,\n    Component: T = nullRenderer as unknown as T\n) {\n    const Decoratable = (props: React.ComponentProps<T>): React.JSX.Element | null => {\n        const parents = useComposableParents();\n        const ComposedComponent = useComponent(Component) as GenericComponent<\n            React.ComponentProps<T>\n        >;\n\n        const context = useMemo(() => [...parents, name], [parents, name]);\n\n        return (\n            <ComposableContext.Provider value={context}>\n                <DecoratableErrorBoundary name={name}>\n                    <ComposedComponent {...props}>{props.children}</ComposedComponent>\n                </DecoratableErrorBoundary>\n            </ComposableContext.Provider>\n        );\n    };\n\n    const staticProps = {\n        original: Component,\n        originalName: name,\n        displayName: `Decoratable<${name}>`\n    };\n\n    return withDecoratorFactory()(\n        Object.assign(Decoratable, staticProps) as DecoratableComponent<\n            typeof Component & typeof staticProps\n        >\n    );\n}\n\nexport function makeDecoratableHook<T extends GenericHook>(hook: T) {\n    const decoratableHook = (params: Parameters<T>) => {\n        const composedHook = useComponent(hook);\n\n        return composedHook(params) as DecoratableHook<T>;\n    };\n\n    decoratableHook.original = hook;\n\n    return withHookDecoratorFactory()(decoratableHook as DecoratableHook<T>);\n}\n\nexport function createVoidComponent<T>() {\n    // oxlint-disable-next-line typescript/no-unused-vars\n    return (props: T): React.JSX.Element | null => {\n        return null;\n    };\n}\n\nexport function makeDecoratable<T extends GenericHook>(\n    hook: T\n): ReturnType<typeof makeDecoratableHook<T>>;\nexport function makeDecoratable<T extends GenericComponent>(\n    name: string,\n    Component: T\n): ReturnType<typeof makeDecoratableComponent<T>>;\nexport function makeDecoratable(hookOrName: any, Component?: any) {\n    if (Component) {\n        const component = makeDecoratableComponent(hookOrName, React.memo(Component));\n        component.original.displayName = hookOrName;\n        return component;\n    }\n\n    return makeDecoratableHook(hookOrName);\n}\n"],"names":["DecoratableErrorBoundary","React","props","undefined","error","errorInfo","console","ComposableContext","createContext","useComposableParents","context","useContext","nullRenderer","makeDecoratableComponent","name","Component","Decoratable","parents","ComposedComponent","useComponent","useMemo","staticProps","withDecoratorFactory","Object","makeDecoratableHook","hook","decoratableHook","params","composedHook","withHookDecoratorFactory","createVoidComponent","makeDecoratable","hookOrName","component"],"mappings":";;;AAqBA,MAAMA,iCAAiCC,MAAAA,SAAe;IAClD,YAAYC,KAAyB,CAAE;QACnC,KAAK,CAACA;QACN,IAAI,CAAC,KAAK,GAAG;YAAE,UAAU;YAAO,OAAOC;QAAU;IACrD;IAEA,OAAO,yBAAyBC,KAAY,EAAsB;QAC9D,OAAO;YAAE,UAAU;YAAMA;QAAM;IACnC;IAES,kBAAkBA,KAAY,EAAEC,SAAoB,EAAE;QAC3DC,QAAQ,cAAc,CAClB,CAAC,sBAAsB,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,EAC7D,aACA;QAEJA,QAAQ,KAAK,CAACF,OAAOC;QACrBC,QAAQ,QAAQ;IACpB;IAES,SAAS;QACd,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,EACnB,OAAO,WAAP,GACI,oBAAC;YACG,OAAO;gBACH,SAAS;gBACT,QAAQ;gBACR,cAAc;gBACd,YAAY;gBACZ,OAAO;gBACP,UAAU;YACd;yBAEA,oBAAC,gBAAQ,IAAI,CAAC,KAAK,CAAC,IAAI,GAAU,MAAG,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;QAInE,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ;IAC9B;AACJ;AAEA,MAAMC,oBAAoB,WAAHA,GAAGC,cAAwB,EAAE;AACpDD,kBAAkB,WAAW,GAAG;AAEhC,SAASE;IACL,MAAMC,UAAUC,WAAWJ;IAC3B,IAAI,CAACG,SACD,OAAO,EAAE;IAGb,OAAOA;AACX;AAEA,MAAME,eAAe,IAAM;AAE3B,SAASC,yBACLC,IAAY,EACZC,YAAeH,YAA4B;IAE3C,MAAMI,cAAc,CAACd;QACjB,MAAMe,UAAUR;QAChB,MAAMS,oBAAoBC,aAAaJ;QAIvC,MAAML,UAAUU,QAAQ,IAAM;mBAAIH;gBAASH;aAAK,EAAE;YAACG;YAASH;SAAK;QAEjE,OAAO,WAAP,GACI,oBAACP,kBAAkB,QAAQ;YAAC,OAAOG;yBAC/B,oBAACV,0BAAwBA;YAAC,MAAMc;yBAC5B,oBAACI,mBAAsBhB,OAAQA,MAAM,QAAQ;IAI7D;IAEA,MAAMmB,cAAc;QAChB,UAAUN;QACV,cAAcD;QACd,aAAa,CAAC,YAAY,EAAEA,KAAK,CAAC,CAAC;IACvC;IAEA,OAAOQ,uBACHC,OAAO,MAAM,CAACP,aAAaK;AAInC;AAEO,SAASG,oBAA2CC,IAAO;IAC9D,MAAMC,kBAAkB,CAACC;QACrB,MAAMC,eAAeT,aAAaM;QAElC,OAAOG,aAAaD;IACxB;IAEAD,gBAAgB,QAAQ,GAAGD;IAE3B,OAAOI,2BAA2BH;AACtC;AAEO,SAASI;IAEZ,OAAO,CAAC5B,QACG;AAEf;AASO,SAAS6B,gBAAgBC,UAAe,EAAEjB,SAAe;IAC5D,IAAIA,WAAW;QACX,MAAMkB,YAAYpB,yBAAyBmB,YAAY,WAAZA,GAAY/B,MAAAA,IAAU,CAACc;QAClEkB,UAAU,QAAQ,CAAC,WAAW,GAAGD;QACjC,OAAOC;IACX;IAEA,OAAOT,oBAAoBQ;AAC/B"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/react-composition",
-	"version": "6.3.0-beta.4",
+	"version": "6.4.0-beta.0",
 	"type": "module",
 	"exports": {
 		".": "./index.js",
@@ -24,13 +24,13 @@
 	},
 	"devDependencies": {
 		"@testing-library/react": "16.3.2",
-		"@webiny/build-tools": "6.3.0-beta.4",
+		"@webiny/build-tools": "6.4.0-beta.0",
 		"typescript": "6.0.3",
-		"vitest": "4.1.5"
+		"vitest": "4.1.6"
 	},
 	"publishConfig": {
 		"access": "public",
 		"directory": "dist"
 	},
-	"gitHead": "7cefe15431dbd65504e1f58147dc9e55bcbfa693"
+	"gitHead": "a545d7529828af07d08d49c3da1bcb967483b9ce"
 }

package/types.js

@@ -1,3 +0,0 @@
-export {};
-
-//# sourceMappingURL=types.js.map

package/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["CompositionStore"],"sources":["index.ts"],"sourcesContent":["export * from \"./Context.js\";\nexport * from \"./Compose.js\";\nexport * from \"./makeComposable.js\";\nexport * from \"./makeDecoratable.js\";\nexport * from \"./createDecorator.js\";\nexport * from \"./decorators.js\";\nexport * from \"./CompositionScope.js\";\nexport { CompositionStore } from \"./domain/CompositionStore.js\";\nexport type * from \"./types.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,gBAAgB","ignoreList":[]}

package/types.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sources":["types.ts"],"sourcesContent":["import type React from \"react\";\n\nexport type GenericHook<TParams = any, TReturn = any> = (...args: TParams[]) => TReturn;\n\nexport type GenericComponent<T = any> = React.FunctionComponent<T>;\n\nexport type ComposedFunction = GenericHook;\n\nexport type Decorator<T> = (decoratee: T) => T;\n\n/**\n * Some decoratable components will always return `null`, by design.\n * To allow you to decorate these components, we must tell TS that the decorator is allowed to return not just `null`\n * (which is inferred from the component type), but also a JSX.Element.\n */\nexport type ComponentDecorator<T> = (decoratee: T) => CanReturnNullOrElement<T>;\n\n/**\n * @deprecated\n */\nexport type ComposableFC<T> = T & {\n    displayName?: string;\n    original: T;\n    originalName: string;\n};\n\nexport type Enumerable<T> = T extends Array<infer D> ? Array<D> : never;\n\nexport type ComposeWith =\n    | Decorator<GenericComponent>\n    | Decorator<GenericComponent>[]\n    | Decorator<GenericHook>\n    | Decorator<GenericHook>[];\n\nexport type DecoratableHook<T extends GenericHook = GenericHook> = T & {\n    original: T;\n    originalName: string;\n};\n\nexport type DecoratableComponent<T = GenericComponent> = T & {\n    original: T;\n    originalName: string;\n    displayName: string;\n};\n\nexport type Decoratable = DecoratableComponent | DecoratableHook;\n\n/**\n * @internal Add `null` to the ReturnType of the given function.\n */\nexport type CanReturnNullOrElement<T> = T extends (...args: any) => any\n    ? (...args: Parameters<T>) => React.JSX.Element | null\n    : never;\n"],"mappings":"","ignoreList":[]}