@dextinity/cms-admin 2.0.0-canary-20260729062014

package/lib/blocks/factories/createCompositeBlock.d.ts

@@ -0,0 +1,94 @@
+import { type ReactNode } from "react";
+import { type MessageDescriptor } from "react-intl";
+import { type CompositeBlockInterface } from "../helpers/composeBlocks/composeBlocks";
+import type { BlockInterfaceWithOptions } from "../helpers/composeBlocks/types";
+import { BlockCategory, type BlockInterface, type CustomBlockCategory } from "../types";
+interface BlockConfiguration {
+    /**
+     * User facing label displayed above the block.
+     */
+    title?: ReactNode;
+    /**
+     * Render the block as a nested page with a navigation button instead of displaying it inline.
+     */
+    nested?: boolean;
+    /**
+     * The block to render.
+     */
+    block: BlockInterface | BlockInterfaceWithOptions;
+    /**
+     * Hides this block when navigating into a sibling block's sub-route (e.g., when editing items of a list block).
+     */
+    hiddenInSubroute?: boolean;
+    divider?: boolean;
+    /**
+     * Wrap the block within a paper for visual grouping.
+     */
+    paper?: boolean;
+    /**
+     * Conditionally hide the block based on it's current state. Return `true` to hide.
+     */
+    hiddenForState?: (state: unknown) => boolean;
+}
+interface GroupConfiguration {
+    /**
+     * The blocks to render.
+     */
+    blocks: Record<string, BlockConfiguration>;
+    /**
+     * User facing section headline displayed above the group, more prominent than the individual block's titles.
+     */
+    title?: ReactNode;
+    /**
+     * Wrap the group's within a paper for visual grouping.
+     */
+    paper?: boolean;
+}
+interface CreateCompositeBlockOptionsBase {
+    /**
+     * Unique identifier for the block. Must match the name used in the API and Site.
+     */
+    name: string;
+    /**
+     * User-facing label shown in the Add Block Drawer.
+     */
+    displayName: ReactNode;
+    /**
+     * Category under which the block appears in the Add Block Drawer.
+     */
+    category?: BlockCategory | CustomBlockCategory;
+    adminLayout?: "stacked";
+    blocks: Record<string, BlockConfiguration>;
+    /**
+     * Tags used for searching in the Add Block Drawer.
+     */
+    tags?: Array<MessageDescriptor | string>;
+    /**
+     * Function to determine the order of the blocks in the admin component. If a block is not included in the array, it will not be rendered.
+     * @param state The current state of the composite block
+     * @returns An array of block keys in the order they should be rendered in the admin component, if undefined all blocks will be rendered in the order they are defined in the blocks object
+     */
+    visibleOrderedBlocksForState?: (state: unknown) => string[] | undefined;
+}
+type CreateCompositeBlockOptionsWithGroups = Omit<CreateCompositeBlockOptionsBase, "blocks"> & {
+    groups: Record<string, GroupConfiguration>;
+};
+type CreateCompositeBlockOptions = CreateCompositeBlockOptionsBase | CreateCompositeBlockOptionsWithGroups;
+type ExtractCompositeBlocksConfigBase<T extends Record<string, {
+    block: BlockInterface | BlockInterfaceWithOptions;
+}>> = {
+    [K in keyof T]: T[K]["block"];
+};
+type ExtractGroupConfigs<T extends Record<string, GroupConfiguration>> = T[keyof T];
+type AllBlockKeys<T> = T extends Record<string, BlockConfiguration> ? keyof T : never;
+type MergeBlockConfigs<T extends Record<string, BlockConfiguration>> = {
+    [BlockKey in AllBlockKeys<T>]: NonNullable<ExtractBlockConfig<T, BlockKey>>;
+};
+type PickType<T, K extends AllBlockKeys<T>> = T extends {
+    [k in K]?: any;
+} ? T[K] : undefined;
+type ExtractBlockConfig<T extends Record<string, BlockConfiguration>, K extends AllBlockKeys<T>> = PickType<T, K>;
+type ExtractCompositeBlocksConfig<Options extends CreateCompositeBlockOptions> = Options extends CreateCompositeBlockOptionsWithGroups ? ExtractCompositeBlocksConfigBase<MergeBlockConfigs<ExtractGroupConfigs<Options["groups"]>["blocks"]>> : Options extends CreateCompositeBlockOptionsBase ? ExtractCompositeBlocksConfigBase<Options["blocks"]> : never;
+export declare const createCompositeBlock: <Options extends CreateCompositeBlockOptions>(options: Options, override?: (block: CompositeBlockInterface<ExtractCompositeBlocksConfig<Options>>) => CompositeBlockInterface<ExtractCompositeBlocksConfig<Options>>) => CompositeBlockInterface<ExtractCompositeBlocksConfig<Options>>;
+export {};
+//# sourceMappingURL=createCompositeBlock.d.ts.map

package/lib/blocks/factories/createCompositeBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createCompositeBlock.d.ts","sourceRoot":"","sources":["../../../src/blocks/factories/createCompositeBlock.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAAoB,KAAK,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAQtE,OAAO,EAAiB,KAAK,uBAAuB,EAAE,MAAM,wCAAwC,CAAC;AACrG,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AAKhF,OAAO,EAAE,aAAa,EAAsB,KAAK,cAAc,EAAwC,KAAK,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAElJ,UAAU,kBAAkB;IACxB;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;OAEG;IACH,KAAK,EAAE,cAAc,GAAG,yBAAyB,CAAC;IAClD;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,OAAO,CAAC;CAChD;AAED,UAAU,kBAAkB;IACxB;;OAEG;IACH,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC3C;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACnB;AAMD,UAAU,+BAA+B;IACrC;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,WAAW,EAAE,SAAS,CAAC;IACvB;;OAEG;IACH,QAAQ,CAAC,EAAE,aAAa,GAAG,mBAAmB,CAAC;IAC/C,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAC;IAC3C;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,iBAAiB,GAAG,MAAM,CAAC,CAAC;IACzC;;;;OAIG;IACH,4BAA4B,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,MAAM,EAAE,GAAG,SAAS,CAAC;CAC3E;AAED,KAAK,qCAAqC,GAAG,IAAI,CAAC,+BAA+B,EAAE,QAAQ,CAAC,GAAG;IAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,CAAA;CAAE,CAAC;AAE9I,KAAK,2BAA2B,GAAG,+BAA+B,GAAG,qCAAqC,CAAC;AAI3G,KAAK,gCAAgC,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE;IAAE,KAAK,EAAE,cAAc,GAAG,yBAAyB,CAAA;CAAE,CAAC,IAAI;KACpH,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;CAChC,CAAC;AAGF,KAAK,mBAAmB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;AACpF,KAAK,YAAY,CAAC,CAAC,IAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,GAAG,MAAM,CAAC,GAAG,KAAK,CAAC;AACtF,KAAK,iBAAiB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,IAAI;KAClE,QAAQ,IAAI,YAAY,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,kBAAkB,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;CAC9E,CAAC;AAEF,KAAK,QAAQ,CAAC,CAAC,EAAE,CAAC,SAAS,YAAY,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS;KAAG,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,GAAG;CAAE,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC;AAC9F,KAAK,kBAAkB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAAC,EAAE,CAAC,SAAS,YAAY,CAAC,CAAC,CAAC,IAAI,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAElH,KAAK,4BAA4B,CAAC,OAAO,SAAS,2BAA2B,IAAI,OAAO,SAAS,qCAAqC,GAChI,gCAAgC,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GACrG,OAAO,SAAS,+BAA+B,GAC7C,gCAAgC,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,GACnD,KAAK,CAAC;AAEd,eAAO,MAAM,oBAAoB,GAAI,OAAO,SAAS,2BAA2B,EAC5E,SAAS,OAAO,EAChB,WAAW,CACP,KAAK,EAAE,uBAAuB,CAAC,4BAA4B,CAAC,OAAO,CAAC,CAAC,KACpE,uBAAuB,CAAC,4BAA4B,CAAC,OAAO,CAAC,CAAC,KACpE,uBAAuB,CAAC,4BAA4B,CAAC,OAAO,CAAC,CA2P/D,CAAC"}

package/lib/blocks/factories/createCompositeBlock.js

@@ -0,0 +1,308 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { StackPage, StackSwitch, StackSwitchApiContext, SubRoute, useSubRoutePrefix } from "@dextinity/admin";
+import { Divider } from "@mui/material";
+import { Fragment } from "react";
+import { FormattedMessage } from "react-intl";
+import { BlockAdminComponentNestedButton } from "../common/BlockAdminComponentNestedButton";
+import { BlockAdminComponentPaper, useBlockAdminComponentPaper } from "../common/BlockAdminComponentPaper";
+import { BlockAdminComponentSection } from "../common/BlockAdminComponentSection";
+import { BlockAdminComponentSectionGroup } from "../common/BlockAdminComponentSectionGroup";
+import { HiddenInSubroute } from "../common/HiddenInSubroute";
+import { useBlockContext } from "../context/useBlockContext";
+import { composeBlocks } from "../helpers/composeBlocks/composeBlocks";
+import { normalizedBlockConfig } from "../helpers/composeBlocks/utils";
+import { createBlockSkeleton } from "../helpers/createBlockSkeleton";
+import { isBlockInterface } from "../helpers/isBlockInterface";
+import { HoverPreviewComponent } from "../iframebridge/HoverPreviewComponent";
+import { BlockCategory } from "../types";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var hasGroups = function hasGroups(options) {
+  return "groups" in options;
+};
+
+// Inspired by https://dev.to/lucianbc/union-type-merging-in-typescript-9al
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+
+export var createCompositeBlock = function createCompositeBlock(options, override) {
+  var name = options.name,
+    displayName = options.displayName,
+    _options$category = options.category,
+    category = _options$category === void 0 ? BlockCategory.Other : _options$category,
+    tags = options.tags,
+    visibleOrderedBlocksForState = options.visibleOrderedBlocksForState;
+  var groups;
+  if (hasGroups(options)) {
+    groups = options.groups;
+  } else {
+    groups = {
+      "default": {
+        blocks: options.blocks
+      }
+    };
+  }
+  var blockConfigs = Object.values(groups).reduce(function (blocks, group) {
+    return _objectSpread(_objectSpread({}, blocks), group.blocks);
+  }, {});
+  var childTags = Object.values(blockConfigs).reduce(function (acc, blockConfig) {
+    var _normalizedBlockConfi = normalizedBlockConfig(blockConfig.block),
+      _normalizedBlockConfi2 = _slicedToArray(_normalizedBlockConfi, 1),
+      blockInterface = _normalizedBlockConfi2[0];
+    if (isBlockInterface(blockInterface) && blockInterface.tags) {
+      return [].concat(_toConsumableArray(acc), _toConsumableArray(blockInterface.tags));
+    }
+    return acc;
+  }, []);
+
+  // internally use the lower level composeBlocks-api
+  var _composeBlocks = composeBlocks(Object.entries(blockConfigs).reduce(function (a, _ref) {
+      var _ref2 = _slicedToArray(_ref, 2),
+        key = _ref2[0],
+        block = _ref2[1].block;
+      return _objectSpread(_objectSpread({}, a), {}, _defineProperty({}, key, block));
+    }, {})),
+    _composeBlocks$api = _composeBlocks.api,
+    adminComponents = _composeBlocks$api.adminComponents,
+    childBlockCounts = _composeBlocks$api.childBlockCounts,
+    isValids = _composeBlocks$api.isValids,
+    previews = _composeBlocks$api.previews,
+    block = _composeBlocks.block;
+
+  // for easier usage, make sure each blockConfig has the same shape (BlockInterfaceWithOptions)
+  var blockConfigNormalized = Object.entries(blockConfigs).reduce(function (acc, _ref3) {
+    var _ref4 = _slicedToArray(_ref3, 2),
+      key = _ref4[0],
+      value = _ref4[1];
+    return _objectSpread(_objectSpread({}, acc), {}, _defineProperty({}, key, _objectSpread(_objectSpread({}, value), {}, {
+      block: normalizedBlockConfig(value.block)
+    })));
+  }, {});
+  var CompositeBlock = _objectSpread(_objectSpread(_objectSpread({}, createBlockSkeleton()), block), {}, {
+    // merge in the blockMethods provided by the composeBlocks-api
+
+    name: name,
+    displayName: displayName,
+    category: category,
+    tags: tags ? tags : childTags,
+    createPreviewState: function createPreviewState(state, previewContext) {
+      var blockPreviewState = block.createPreviewState(state, previewContext);
+      Object.entries(blockConfigNormalized).forEach(function (_ref5) {
+        var _ref6 = _slicedToArray(_ref5, 2),
+          attr = _ref6[0],
+          block = _ref6[1];
+        var _block$block = _slicedToArray(block.block, 1),
+          extractedBlock = _block$block[0];
+        if (block.nested === true && isBlockInterface(extractedBlock)) {
+          var _previewContext$paren;
+          // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+          var blockState = state[attr];
+
+          // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+          blockPreviewState[attr] = extractedBlock.createPreviewState(blockState, _objectSpread(_objectSpread({}, previewContext), {}, {
+            parentUrl: "".concat((_previewContext$paren = previewContext.parentUrlSubRoute) !== null && _previewContext$paren !== void 0 ? _previewContext$paren : previewContext.parentUrl, "/").concat(attr, "/").concat(attr)
+          }));
+        } else if ((block.nested == null || !block.nested) && isBlockInterface(extractedBlock)) {
+          // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+          var _blockState = state[attr];
+          var embeddedBlockState = extractedBlock.createPreviewState(_blockState, _objectSpread(_objectSpread({}, previewContext), {}, {
+            parentUrlSubRoute: "".concat(previewContext.parentUrl, "/").concat(attr),
+            parentUrl: "".concat(previewContext.parentUrl)
+          }));
+          // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+          blockPreviewState[attr] = _objectSpread(_objectSpread({}, embeddedBlockState), {}, {
+            adminMeta: {
+              route: "".concat(previewContext.parentUrl, "#").concat(attr)
+            }
+          });
+        }
+      });
+      // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+      return _objectSpread(_objectSpread({}, blockPreviewState), {}, {
+        adminMeta: {
+          route: previewContext.parentUrl
+        }
+      });
+    },
+    AdminComponent: function AdminComponent(_ref7) {
+      var state = _ref7.state,
+        updateState = _ref7.updateState;
+      var urlPrefix = useSubRoutePrefix();
+      var isInPaper = useBlockAdminComponentPaper();
+      var blockAdminComponents = adminComponents({
+        state: state,
+        updateState: updateState
+      });
+      var context = useBlockContext();
+      var blockPreviews = previews(state, context);
+      var blockChildBlockCounts = childBlockCounts(state);
+      var blockIsValids = isValids(state);
+      var nestedBlocks = Object.entries(blockConfigNormalized).filter(function (_ref8) {
+        var _ref9 = _slicedToArray(_ref8, 2),
+          nested = _ref9[1].nested;
+        return nested === true;
+      });
+      var renderBlock = function renderBlock(blockKey, group) {
+        var _blockConfigNormalize = blockConfigNormalized[blockKey],
+          _blockConfigNormalize2 = _slicedToArray(_blockConfigNormalize.block, 1),
+          block = _blockConfigNormalize2[0],
+          title = _blockConfigNormalize.title,
+          nested = _blockConfigNormalize.nested,
+          hiddenInSubroute = _blockConfigNormalize.hiddenInSubroute,
+          divider = _blockConfigNormalize.divider,
+          paper = _blockConfigNormalize.paper,
+          hiddenForState = _blockConfigNormalize.hiddenForState;
+        if (hiddenForState !== null && hiddenForState !== void 0 && hiddenForState(state)) {
+          return null;
+        }
+        var sectionVariant = group.paper ? "dense" : "normal";
+        var showDivider = divider && (isInPaper || group.paper);
+        var children;
+        if (nested) {
+          children = /*#__PURE__*/_jsx(StackSwitchApiContext.Consumer, {
+            children: function children(stackApi) {
+              return /*#__PURE__*/_jsx(HoverPreviewComponent, {
+                componentSlug: "".concat(blockKey, "/").concat(blockKey),
+                children: /*#__PURE__*/_jsx(BlockAdminComponentNestedButton, {
+                  displayName: isBlockInterface(block) ? block.displayName : /*#__PURE__*/_jsx(FormattedMessage, {
+                    id: "comet.blocks.createCompositeBlock.settings",
+                    defaultMessage: "Settings"
+                  }),
+                  preview: blockPreviews[blockKey],
+                  count: blockChildBlockCounts[blockKey],
+                  onClick: function onClick() {
+                    return stackApi.activatePage(blockKey, blockKey);
+                  },
+                  isValid: blockIsValids[blockKey]
+                })
+              }, blockKey);
+            }
+          });
+        } else {
+          children = /*#__PURE__*/_jsx(HoverPreviewComponent, {
+            componentSlug: "#".concat(blockKey),
+            children: /*#__PURE__*/_jsx(SubRoute, {
+              path: "".concat(urlPrefix, "/").concat(blockKey),
+              children: blockAdminComponents[blockKey]
+            })
+          }, blockKey);
+        }
+        var Container = nested || hiddenInSubroute ? HiddenInSubroute : Fragment;
+        if (paper) {
+          return /*#__PURE__*/_jsx(Container, {
+            children: /*#__PURE__*/_jsx(BlockAdminComponentSection, {
+              title: block.definesOwnTitle ? null : title,
+              variant: sectionVariant,
+              disableBottomMargin: showDivider,
+              children: /*#__PURE__*/_jsx(BlockAdminComponentPaper, {
+                disablePadding: block.definesOwnPadding,
+                children: children
+              })
+            })
+          }, blockKey);
+        }
+        return /*#__PURE__*/_jsxs(Container, {
+          children: [/*#__PURE__*/_jsx(BlockAdminComponentSection, {
+            title: block.definesOwnTitle ? null : title,
+            variant: sectionVariant,
+            disableBottomMargin: showDivider,
+            children: children
+          }), showDivider && /*#__PURE__*/_jsx(Divider, {})]
+        }, blockKey);
+      };
+      return /*#__PURE__*/_jsx(StackSwitch, {
+        disableForcePromptRoute: true,
+        children: [/*#__PURE__*/_jsx(StackPage, {
+          name: "initial",
+          children: Object.entries(groups).map(function (_ref0) {
+            var _visibleOrderedBlocks;
+            var _ref1 = _slicedToArray(_ref0, 2),
+              groupKey = _ref1[0],
+              group = _ref1[1];
+            var title = group.title,
+              paper = group.paper,
+              blocks = group.blocks;
+            var blockKeys = (_visibleOrderedBlocks = visibleOrderedBlocksForState === null || visibleOrderedBlocksForState === void 0 ? void 0 : visibleOrderedBlocksForState(state)) !== null && _visibleOrderedBlocks !== void 0 ? _visibleOrderedBlocks : Object.keys(blocks);
+            var children = blockKeys.map(function (blockKey) {
+              return /*#__PURE__*/_jsx(Fragment, {
+                children: renderBlock(blockKey, group)
+              }, blockKey);
+            });
+            var hiddenInSubroute = Object.values(blocks).every(function (blockConfig) {
+              return blockConfig.hiddenInSubroute || blockConfig.nested;
+            });
+            var Container = hiddenInSubroute ? HiddenInSubroute : Fragment;
+            if (paper) {
+              var definesOwnPadding = Object.values(blocks).every(function (blockConfig) {
+                var _normalizedBlockConfi3 = normalizedBlockConfig(blockConfig.block),
+                  _normalizedBlockConfi4 = _slicedToArray(_normalizedBlockConfi3, 1),
+                  blockInterface = _normalizedBlockConfi4[0];
+                return blockInterface.definesOwnPadding;
+              });
+              return /*#__PURE__*/_jsx(Container, {
+                children: /*#__PURE__*/_jsx(BlockAdminComponentSectionGroup, {
+                  title: title,
+                  children: /*#__PURE__*/_jsx(BlockAdminComponentPaper, {
+                    disablePadding: definesOwnPadding,
+                    children: children
+                  })
+                })
+              }, groupKey);
+            }
+            return /*#__PURE__*/_jsx(Container, {
+              children: /*#__PURE__*/_jsx(BlockAdminComponentSectionGroup, {
+                title: title,
+                children: children
+              })
+            }, groupKey);
+          })
+        }, "initial")].concat(_toConsumableArray(nestedBlocks.map(function (_ref10) {
+          var _ref11 = _slicedToArray(_ref10, 2),
+            key = _ref11[0],
+            title = _ref11[1].title;
+          var block = blockConfigNormalized[key].block[0];
+
+          // @TODO: change literal string "Settings" on next line to: <FormattedMessage id="comet.blocks.createCompositeBlock.settings" defaultMessage="Settings" />
+          // when https://github.com/vivid-planet/comet/pull/340 is fixed
+          return /*#__PURE__*/_jsx(StackPage, {
+            name: key,
+            title: title ? title : isBlockInterface(block) ? block.displayName : "Settings",
+            children: blockAdminComponents[key]
+          }, key);
+        })))
+      });
+    },
+    resolveDependencyPath: function resolveDependencyPath(state, jsonPath) {
+      var key = jsonPath.split(".")[0];
+      var route = [];
+      var childPath = block.resolveDependencyPath(state, jsonPath);
+      if (blockConfigNormalized[key].nested) {
+        route.push(key, key);
+      } else if (childPath.length > 0) {
+        route.push(key);
+      }
+      route.push(childPath);
+      return route.join("/");
+    }
+  });
+  // allows to "fine-tune" the block with the product of the factory as argument
+  // @TODO: this override-fn should be the 2nd argument (1st argument are factory-options) in every block factory!
+  if (override) {
+    return override(CompositeBlock);
+  }
+  return CompositeBlock;
+};

package/lib/blocks/factories/createListBlock.d.ts

@@ -0,0 +1,59 @@
+import type { FunctionComponent, ReactNode } from "react";
+import { type MessageDescriptor } from "react-intl";
+import type { BlockInterface, BlockState } from "../types";
+type DefaultAdditionalItemFields = {};
+export type ListBlockItem<T extends BlockInterface, AdditionalItemFields extends Record<string, unknown> = DefaultAdditionalItemFields> = {
+    [key: string]: unknown;
+    key: string;
+    visible: boolean;
+    props: BlockState<T>;
+    selected: boolean;
+    slideIn: boolean;
+} & AdditionalItemFields;
+export interface ListBlockState<T extends BlockInterface, AdditionalItemFields extends Record<string, unknown> = DefaultAdditionalItemFields> {
+    blocks: ListBlockItem<T, AdditionalItemFields>[];
+}
+export interface ListBlockFragment<AdditionalItemFields extends Record<string, unknown> = DefaultAdditionalItemFields> {
+    blocks: Array<{
+        [key: string]: unknown;
+        key: string;
+        visible: boolean;
+        props: any;
+    } & AdditionalItemFields>;
+}
+export interface ListBlockOutput<AdditionalItemFields extends Record<string, unknown> = DefaultAdditionalItemFields> {
+    blocks: Array<{
+        [key: string]: unknown;
+        key: string;
+        visible: boolean;
+        props: any;
+    } & AdditionalItemFields>;
+}
+export interface ListBlockAdditionalItemField<Value = unknown> {
+    defaultValue: Value;
+}
+interface CreateListBlockOptions<T extends BlockInterface, AdditionalItemFields extends Record<string, unknown>> {
+    name: string;
+    displayName?: ReactNode;
+    itemName?: ReactNode;
+    itemsName?: ReactNode;
+    block: T;
+    minVisibleBlocks?: number;
+    maxVisibleBlocks?: number;
+    createDefaultListEntry?: boolean;
+    additionalItemFields?: {
+        [Key in keyof AdditionalItemFields]: ListBlockAdditionalItemField<AdditionalItemFields[Key]>;
+    };
+    AdditionalItemContextMenuItems?: FunctionComponent<{
+        item: ListBlockItem<T, AdditionalItemFields>;
+        onChange: (item: ListBlockItem<T, AdditionalItemFields>) => void;
+        onMenuClose: () => void;
+    }>;
+    AdditionalItemContent?: FunctionComponent<{
+        item: ListBlockItem<T, AdditionalItemFields>;
+    }>;
+    tags?: Array<MessageDescriptor | string>;
+}
+export declare function createListBlock<T extends BlockInterface, AdditionalItemFields extends Record<string, unknown> = DefaultAdditionalItemFields>({ name, block, displayName, itemName, itemsName, minVisibleBlocks, maxVisibleBlocks, createDefaultListEntry, additionalItemFields, AdditionalItemContextMenuItems, AdditionalItemContent, tags, }: CreateListBlockOptions<T, AdditionalItemFields>, override?: (block: BlockInterface<ListBlockFragment<AdditionalItemFields>, ListBlockState<T, AdditionalItemFields>, ListBlockOutput<AdditionalItemFields>>) => BlockInterface<ListBlockFragment<AdditionalItemFields>, ListBlockState<T, AdditionalItemFields>, ListBlockOutput<AdditionalItemFields>>): BlockInterface<ListBlockFragment<AdditionalItemFields>, ListBlockState<T, AdditionalItemFields>, ListBlockOutput<AdditionalItemFields>>;
+export {};
+//# sourceMappingURL=createListBlock.d.ts.map

package/lib/blocks/factories/createListBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createListBlock.d.ts","sourceRoot":"","sources":["../../../src/blocks/factories/createListBlock.tsx"],"names":[],"mappings":"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"}