piral-core 0.14.24-beta.4144 → 0.14.24-beta.4150

package/esm/components/ExtensionSlot.js

@@ -2,17 +2,25 @@ import * as React from 'react';
 import { isfunc } from 'piral-base';
 import { useGlobalState } from '../hooks';
 import { defaultRender, none } from '../utils';
+function defaultOrder(extensions) {
+    return extensions;
+}
 /**
  * The extension slot component to be used when the available
  * extensions of a given name should be rendered at a specific
  * location.
  */
 export function ExtensionSlot(props) {
-    const { name, render = defaultRender, empty, params, children } = props;
+    const { name, render = defaultRender, empty, params, children, noEmptyRender = false, order = defaultOrder } = props;
     const extensions = useGlobalState((s) => s.registry.extensions[name] || none);
-    return render(extensions.length === 0 && isfunc(empty)
+    const isEmpty = extensions.length === 0 && isfunc(empty);
+    const content = isEmpty
         ? [defaultRender(empty(), 'empty')]
-        : extensions.map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, children: children, params: Object.assign(Object.assign({}, defaults), (params || {})) }))));
+        : order(extensions).map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, children: children, params: Object.assign(Object.assign({}, defaults), (params || {})) })));
+    if (isEmpty && noEmptyRender) {
+        return content[0];
+    }
+    return render(content);
 }
 ExtensionSlot.displayName = `ExtensionSlot`;
 //# sourceMappingURL=ExtensionSlot.js.map

package/esm/components/ExtensionSlot.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAG/C;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACxE,MAAM,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC;IAC9E,OAAO,MAAM,CACX,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC;QACtC,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,OAAO,CAAC,CAAC;QACnC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CACxE,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,KAAI,GAAG,GAAG,CAAC,EAAE,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,kCACD,QAAQ,GACR,CAAC,MAAM,IAAI,EAAE,CAAC,IAEnB,CACH,CAAC,CACP,CAAC;AACJ,CAAC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}
+{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAG/C,SAAS,YAAY,CAAC,UAAwC;IAC5D,OAAO,UAAU,CAAC;AACpB,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,GAAG,KAAK,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,CAAC;IACrH,MAAM,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC;IAC9E,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC;IACzD,MAAM,OAAO,GAAG,OAAO;QACrB,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,OAAO,CAAC,CAAC;QACnC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAC/E,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,KAAI,GAAG,GAAG,CAAC,EAAE,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,kCACD,QAAQ,GACR,CAAC,MAAM,IAAI,EAAE,CAAC,IAEnB,CACH,CAAC,CAAC;IAEP,IAAI,OAAO,IAAI,aAAa,EAAE;QAC5B,OAAO,OAAO,CAAC,CAAC,CAAC,CAAC;KACnB;IAED,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC;AACzB,CAAC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}

package/esm/types/api.d.ts

@@ -1,4 +1,4 @@
-import type { ReactElement } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 import type { RouteComponentProps } from 'react-router';
 import type { PiletApi, Pilet, PiletMetadata, EventEmitter, SinglePilet, MultiPilet } from 'piral-base';
 import type { PiletCustomApi, PiralCustomPageMeta } from './custom';
@@ -33,6 +33,10 @@ export interface ExtensionComponentProps<T> extends BaseComponentProps {
      * The provided parameters for showing the extension.
      */
     params: T extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[T] : T extends string ? any : T;
+    /**
+     * The optional children to receive, if any.
+     */
+    children?: ReactNode;
 }
 /**
  * The props that every registered page component obtains.

package/esm/types/extension.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode, ReactElement } from 'react';
 import type { PiralCustomExtensionSlotMap } from './custom';
+import type { ExtensionRegistration } from './state';
 /**
  * The mapping of the existing (known) extension slots.
  */
@@ -18,9 +19,27 @@ export interface BaseExtensionSlotProps<TName, TParams> {
      * for the specified extension.
      */
     empty?(): ReactNode;
+    /**
+     * Determines if the `render` function should be called in case no
+     * components are available for the specified extension.
+     *
+     * If true, `empty` will be called and returned from the slot.
+     * If false, `render` will be called with the result of calling `empty`.
+     * The result of calling `render` will then be returned from the slot.
+     */
+    noEmptyRender?: boolean;
+    /**
+     * Defines the order of the components to render.
+     * May be more convient than using `render` w.r.t. ordering extensions
+     * by their supplied metadata.
+     * @param extensions The registered extensions.
+     * @returns The ordered extensions.
+     */
+    order?(extensions: Array<ExtensionRegistration>): Array<ExtensionRegistration>;
     /**
      * Defines how the provided nodes should be rendered.
      * @param nodes The rendered extension nodes.
+     * @returns The rendered nodes, i.e., an ReactElement.
      */
     render?(nodes: Array<ReactNode>): ReactElement<any, any> | null;
     /**

package/esm/types/state.d.ts

@@ -22,21 +22,39 @@ export declare type WrappedComponent<TProps> = ComponentType<Without<TProps, key
  * The base type for pilet component registration in the global state context.
  */
 export interface BaseRegistration {
+    /**
+     * The pilet registering the component.
+     */
     pilet: string;
 }
 /**
  * The interface modeling the registration of a pilet page component.
  */
 export interface PageRegistration extends BaseRegistration {
+    /**
+     * The registered page component.
+     */
     component: WrappedComponent<PageComponentProps>;
+    /**
+     * The page's associated metadata.
+     */
     meta: PiralPageMeta;
 }
 /**
  * The interface modeling the registration of a pilet extension component.
  */
 export interface ExtensionRegistration extends BaseRegistration {
+    /**
+     * The wrapped registered extension component.
+     */
     component: WrappedComponent<ExtensionComponentProps<string>>;
+    /**
+     * The original extension component that has been registered.
+     */
     reference: any;
+    /**
+     * The default params (i.e., meta) of the extension.
+     */
     defaults: any;
 }
 /**

package/lib/components/ExtensionSlot.js

@@ -5,17 +5,25 @@ const React = require("react");
 const piral_base_1 = require("piral-base");
 const hooks_1 = require("../hooks");
 const utils_1 = require("../utils");
+function defaultOrder(extensions) {
+    return extensions;
+}
 /**
  * The extension slot component to be used when the available
  * extensions of a given name should be rendered at a specific
  * location.
  */
 function ExtensionSlot(props) {
-    const { name, render = utils_1.defaultRender, empty, params, children } = props;
+    const { name, render = utils_1.defaultRender, empty, params, children, noEmptyRender = false, order = defaultOrder } = props;
     const extensions = (0, hooks_1.useGlobalState)((s) => s.registry.extensions[name] || utils_1.none);
-    return render(extensions.length === 0 && (0, piral_base_1.isfunc)(empty)
+    const isEmpty = extensions.length === 0 && (0, piral_base_1.isfunc)(empty);
+    const content = isEmpty
         ? [(0, utils_1.defaultRender)(empty(), 'empty')]
-        : extensions.map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, children: children, params: Object.assign(Object.assign({}, defaults), (params || {})) }))));
+        : order(extensions).map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, children: children, params: Object.assign(Object.assign({}, defaults), (params || {})) })));
+    if (isEmpty && noEmptyRender) {
+        return content[0];
+    }
+    return render(content);
 }
 exports.ExtensionSlot = ExtensionSlot;
 ExtensionSlot.displayName = `ExtensionSlot`;

package/lib/components/ExtensionSlot.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,2CAAoC;AACpC,oCAA0C;AAC1C,oCAA+C;AAG/C;;;;GAIG;AACH,SAAgB,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,qBAAa,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACxE,MAAM,UAAU,GAAG,IAAA,sBAAc,EAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,YAAI,CAAC,CAAC;IAC9E,OAAO,MAAM,CACX,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,IAAA,mBAAM,EAAC,KAAK,CAAC;QACtC,CAAC,CAAC,CAAC,IAAA,qBAAa,EAAC,KAAK,EAAE,EAAE,OAAO,CAAC,CAAC;QACnC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CACxE,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,KAAI,GAAG,GAAG,CAAC,EAAE,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,kCACD,QAAQ,GACR,CAAC,MAAM,IAAI,EAAE,CAAC,IAEnB,CACH,CAAC,CACP,CAAC;AACJ,CAAC;AAjBD,sCAiBC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}
+{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,2CAAoC;AACpC,oCAA0C;AAC1C,oCAA+C;AAG/C,SAAS,YAAY,CAAC,UAAwC;IAC5D,OAAO,UAAU,CAAC;AACpB,CAAC;AAED;;;;GAIG;AACH,SAAgB,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,qBAAa,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,aAAa,GAAG,KAAK,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,CAAC;IACrH,MAAM,UAAU,GAAG,IAAA,sBAAc,EAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,YAAI,CAAC,CAAC;IAC9E,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,IAAA,mBAAM,EAAC,KAAK,CAAC,CAAC;IACzD,MAAM,OAAO,GAAG,OAAO;QACrB,CAAC,CAAC,CAAC,IAAA,qBAAa,EAAC,KAAK,EAAE,EAAE,OAAO,CAAC,CAAC;QACnC,CAAC,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAC/E,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,KAAI,GAAG,GAAG,CAAC,EAAE,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,kCACD,QAAQ,GACR,CAAC,MAAM,IAAI,EAAE,CAAC,IAEnB,CACH,CAAC,CAAC;IAEP,IAAI,OAAO,IAAI,aAAa,EAAE;QAC5B,OAAO,OAAO,CAAC,CAAC,CAAC,CAAC;KACnB;IAED,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC;AACzB,CAAC;AAtBD,sCAsBC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}

package/lib/types/api.d.ts

@@ -1,4 +1,4 @@
-import type { ReactElement } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 import type { RouteComponentProps } from 'react-router';
 import type { PiletApi, Pilet, PiletMetadata, EventEmitter, SinglePilet, MultiPilet } from 'piral-base';
 import type { PiletCustomApi, PiralCustomPageMeta } from './custom';
@@ -33,6 +33,10 @@ export interface ExtensionComponentProps<T> extends BaseComponentProps {
      * The provided parameters for showing the extension.
      */
     params: T extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[T] : T extends string ? any : T;
+    /**
+     * The optional children to receive, if any.
+     */
+    children?: ReactNode;
 }
 /**
  * The props that every registered page component obtains.

package/lib/types/extension.d.ts

@@ -1,5 +1,6 @@
 import type { ReactNode, ReactElement } from 'react';
 import type { PiralCustomExtensionSlotMap } from './custom';
+import type { ExtensionRegistration } from './state';
 /**
  * The mapping of the existing (known) extension slots.
  */
@@ -18,9 +19,27 @@ export interface BaseExtensionSlotProps<TName, TParams> {
      * for the specified extension.
      */
     empty?(): ReactNode;
+    /**
+     * Determines if the `render` function should be called in case no
+     * components are available for the specified extension.
+     *
+     * If true, `empty` will be called and returned from the slot.
+     * If false, `render` will be called with the result of calling `empty`.
+     * The result of calling `render` will then be returned from the slot.
+     */
+    noEmptyRender?: boolean;
+    /**
+     * Defines the order of the components to render.
+     * May be more convient than using `render` w.r.t. ordering extensions
+     * by their supplied metadata.
+     * @param extensions The registered extensions.
+     * @returns The ordered extensions.
+     */
+    order?(extensions: Array<ExtensionRegistration>): Array<ExtensionRegistration>;
     /**
      * Defines how the provided nodes should be rendered.
      * @param nodes The rendered extension nodes.
+     * @returns The rendered nodes, i.e., an ReactElement.
      */
     render?(nodes: Array<ReactNode>): ReactElement<any, any> | null;
     /**

package/lib/types/state.d.ts

@@ -22,21 +22,39 @@ export declare type WrappedComponent<TProps> = ComponentType<Without<TProps, key
  * The base type for pilet component registration in the global state context.
  */
 export interface BaseRegistration {
+    /**
+     * The pilet registering the component.
+     */
     pilet: string;
 }
 /**
  * The interface modeling the registration of a pilet page component.
  */
 export interface PageRegistration extends BaseRegistration {
+    /**
+     * The registered page component.
+     */
     component: WrappedComponent<PageComponentProps>;
+    /**
+     * The page's associated metadata.
+     */
     meta: PiralPageMeta;
 }
 /**
  * The interface modeling the registration of a pilet extension component.
  */
 export interface ExtensionRegistration extends BaseRegistration {
+    /**
+     * The wrapped registered extension component.
+     */
     component: WrappedComponent<ExtensionComponentProps<string>>;
+    /**
+     * The original extension component that has been registered.
+     */
     reference: any;
+    /**
+     * The default params (i.e., meta) of the extension.
+     */
     defaults: any;
 }
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "piral-core",
-  "version": "0.14.24-beta.4144",
+  "version": "0.14.24-beta.4150",
   "description": "The core library for creating a Piral instance.",
   "keywords": [
     "portal",
@@ -63,8 +63,8 @@
   },
   "dependencies": {
     "@dbeining/react-atom": "^4.0.0",
-    "piral-base": "0.14.24-beta.4144",
-    "piral-debug-utils": "0.14.24-beta.4144"
+    "piral-base": "0.14.24-beta.4150",
+    "piral-debug-utils": "0.14.24-beta.4150"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
@@ -91,5 +91,5 @@
     "@libre/atom",
     "@dbeining/react-atom"
   ],
-  "gitHead": "b14c6360d67ae6fc0af29567eaf3011d782fd4b2"
+  "gitHead": "3a3b6461ff039a1751494b6481aefa6fffbf22a7"
 }

package/src/components/ExtensionSlot.test.tsx

@@ -29,6 +29,11 @@ const state = {
           component: StubComponent2,
         },
       ],
+      lol: [
+        {
+          component: StubComponent1,
+        },
+      ],
     },
   },
 };
@@ -67,7 +72,7 @@ describe('Extension Module', () => {
   it('overrides the empty renderer on not available extension', () => {
     const node = mount(<ExtensionSlot name="qxz" empty={() => <StubComponent1 key="empty" />} />);
     expect(node.find(StubComponent1).length).toBe(1);
-    expect(node.find(StubComponent1).length).toBe(1);
+    expect(node.find(StubComponent2).length).toBe(0);
   });
 
   it('overrides the empty renderer on an available extension', () => {
@@ -87,4 +92,30 @@ describe('Extension Module', () => {
     expect(node.find(StubComponent1).length).toBe(1);
     expect(node.find(StubComponent2).length).toBe(1);
   });
+
+  it('does not use the render function with empty when noEmptyRender is set', () => {
+    const node = mount(
+      <ExtensionSlot
+        name="foo"
+        noEmptyRender
+        empty={() => <StubComponent2 key="empty" />}
+        render={(nodes) => <StubComponent1 children={nodes} />}
+      />,
+    );
+    expect(node.find(StubComponent1).length).toBe(0);
+    expect(node.find(StubComponent2).length).toBe(1);
+  });
+
+  it('does use the render function without empty independent if noEmptyRender is set', () => {
+    const node = mount(
+      <ExtensionSlot
+        name="lol"
+        noEmptyRender
+        empty={() => <StubComponent2 key="empty" />}
+        render={(nodes) => <StubComponent1 children={nodes} />}
+      />,
+    );
+    expect(node.find(StubComponent1).length).toBe(2);
+    expect(node.find(StubComponent2).length).toBe(0);
+  });
 });

package/src/components/ExtensionSlot.tsx

@@ -2,7 +2,11 @@ import * as React from 'react';
 import { isfunc } from 'piral-base';
 import { useGlobalState } from '../hooks';
 import { defaultRender, none } from '../utils';
-import { ExtensionSlotProps } from '../types';
+import { ExtensionRegistration, ExtensionSlotProps } from '../types';
+
+function defaultOrder(extensions: Array<ExtensionRegistration>) {
+  return extensions;
+}
 
 /**
  * The extension slot component to be used when the available
@@ -10,22 +14,27 @@ import { ExtensionSlotProps } from '../types';
  * location.
  */
 export function ExtensionSlot<T extends string>(props: ExtensionSlotProps<T>) {
-  const { name, render = defaultRender, empty, params, children } = props;
+  const { name, render = defaultRender, empty, params, children, noEmptyRender = false, order = defaultOrder } = props;
   const extensions = useGlobalState((s) => s.registry.extensions[name] || none);
-  return render(
-    extensions.length === 0 && isfunc(empty)
-      ? [defaultRender(empty(), 'empty')]
-      : extensions.map(({ component: Component, reference, defaults = {} }, i) => (
-          <Component
-            key={`${reference?.displayName || '_'}${i}`}
-            children={children}
-            params={{
-              ...defaults,
-              ...(params || {}),
-            }}
-          />
-        )),
-  );
+  const isEmpty = extensions.length === 0 && isfunc(empty);
+  const content = isEmpty
+    ? [defaultRender(empty(), 'empty')]
+    : order(extensions).map(({ component: Component, reference, defaults = {} }, i) => (
+        <Component
+          key={`${reference?.displayName || '_'}${i}`}
+          children={children}
+          params={{
+            ...defaults,
+            ...(params || {}),
+          }}
+        />
+      ));
+
+  if (isEmpty && noEmptyRender) {
+    return content[0];
+  }
+
+  return render(content);
 }
 
 ExtensionSlot.displayName = `ExtensionSlot`;

package/src/types/api.ts

@@ -1,4 +1,4 @@
-import type { ReactElement } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 import type { RouteComponentProps } from 'react-router';
 import type { PiletApi, Pilet, PiletMetadata, EventEmitter, SinglePilet, MultiPilet } from 'piral-base';
 import type { PiletCustomApi, PiralCustomPageMeta } from './custom';
@@ -37,6 +37,10 @@ export interface ExtensionComponentProps<T> extends BaseComponentProps {
    * The provided parameters for showing the extension.
    */
   params: T extends keyof PiralExtensionSlotMap ? PiralExtensionSlotMap[T] : T extends string ? any : T;
+  /**
+   * The optional children to receive, if any.
+   */
+  children?: ReactNode;
 }
 
 /**
@@ -65,10 +69,10 @@ export interface PiralPageMeta extends PiralCustomPageMeta {}
  * Shorthand for the definition of an extension component.
  */
 export type AnyExtensionComponent<TName> = TName extends keyof PiralExtensionSlotMap
-? AnyComponent<ExtensionComponentProps<TName>>
-: TName extends string
-? AnyComponent<ExtensionComponentProps<any>>
-: AnyComponent<ExtensionComponentProps<TName>>
+  ? AnyComponent<ExtensionComponentProps<TName>>
+  : TName extends string
+  ? AnyComponent<ExtensionComponentProps<any>>
+  : AnyComponent<ExtensionComponentProps<TName>>;
 
 /**
  * Defines the Pilet API from piral-core.

package/src/types/extension.ts

@@ -1,5 +1,6 @@
 import type { ReactNode, ReactElement } from 'react';
 import type { PiralCustomExtensionSlotMap } from './custom';
+import type { ExtensionRegistration } from './state';
 
 /**
  * The mapping of the existing (known) extension slots.
@@ -19,9 +20,27 @@ export interface BaseExtensionSlotProps<TName, TParams> {
    * for the specified extension.
    */
   empty?(): ReactNode;
+  /**
+   * Determines if the `render` function should be called in case no
+   * components are available for the specified extension.
+   *
+   * If true, `empty` will be called and returned from the slot.
+   * If false, `render` will be called with the result of calling `empty`.
+   * The result of calling `render` will then be returned from the slot.
+   */
+  noEmptyRender?: boolean;
+  /**
+   * Defines the order of the components to render.
+   * May be more convient than using `render` w.r.t. ordering extensions
+   * by their supplied metadata.
+   * @param extensions The registered extensions.
+   * @returns The ordered extensions.
+   */
+  order?(extensions: Array<ExtensionRegistration>): Array<ExtensionRegistration>;
   /**
    * Defines how the provided nodes should be rendered.
    * @param nodes The rendered extension nodes.
+   * @returns The rendered nodes, i.e., an ReactElement.
    */
   render?(nodes: Array<ReactNode>): ReactElement<any, any> | null;
   /**

package/src/types/state.ts

@@ -48,6 +48,9 @@ export type WrappedComponent<TProps> = ComponentType<Without<TProps, keyof BaseC
  * The base type for pilet component registration in the global state context.
  */
 export interface BaseRegistration {
+  /**
+   * The pilet registering the component.
+   */
   pilet: string;
 }
 
@@ -55,7 +58,13 @@ export interface BaseRegistration {
  * The interface modeling the registration of a pilet page component.
  */
 export interface PageRegistration extends BaseRegistration {
+  /**
+   * The registered page component.
+   */
   component: WrappedComponent<PageComponentProps>;
+  /**
+   * The page's associated metadata.
+   */
   meta: PiralPageMeta;
 }
 
@@ -63,8 +72,17 @@ export interface PageRegistration extends BaseRegistration {
  * The interface modeling the registration of a pilet extension component.
  */
 export interface ExtensionRegistration extends BaseRegistration {
+  /**
+   * The wrapped registered extension component.
+   */
   component: WrappedComponent<ExtensionComponentProps<string>>;
+  /**
+   * The original extension component that has been registered.
+   */
   reference: any;
+  /**
+   * The default params (i.e., meta) of the extension.
+   */
   defaults: any;
 }