xmlui 0.7.20 → 0.7.22

package/dist/scripts/src/components/ComponentProvider.js

@@ -4,110 +4,108 @@ exports.ComponentRegistry = void 0;
 exports.ComponentProvider = ComponentProvider;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
-const Stack_1 = require("@components/Stack/Stack");
-const SpaceFiller_1 = require("@components/SpaceFiller/SpaceFiller");
-const TextArea_1 = require("@components/TextArea/TextArea");
-const NavLink_1 = require("@components/NavLink/NavLink");
-const Link_1 = require("@components/Link/Link");
-const TreeComponent_1 = require("@components/Tree/TreeComponent");
-const Button_1 = require("@components/Button/Button");
-const Heading_1 = require("@components/Heading/Heading");
-const Text_1 = require("@components/Text/Text");
-const Fragment_1 = require("@components-core/Fragment");
-const Table_1 = require("@components/Table/Table");
-const StickyBox_1 = require("@components/StickyBox/StickyBox");
-const Badge_1 = require("@components/Badge/Badge");
-const Avatar_1 = require("@components/Avatar/Avatar");
-const ContentSeparator_1 = require("@components/ContentSeparator/ContentSeparator");
-const Card_1 = require("@components/Card/Card");
-const FlowLayout_1 = require("@components/FlowLayout/FlowLayout");
-const ModalDialog_1 = require("@components/ModalDialog/ModalDialog");
-const NoResult_1 = require("@components/NoResult/NoResult");
-const FileUploadDropZone_1 = require("@components/FileUploadDropZone/FileUploadDropZone");
-const Icon_1 = require("@components/Icon/Icon");
-const Items_1 = require("@components/Items/Items");
-const SelectionStore_1 = require("@components/SelectionStore/SelectionStore");
-const Image_1 = require("@components/Image/Image");
-const PageMetaTitle_1 = require("@components/PageMetaTitle/PageMetaTitle");
-const ProgressBar_1 = require("@components/ProgressBar/ProgressBar");
-const Splitter_1 = require("@components/Splitter/Splitter");
-const Queue_1 = require("@components/Queue/Queue");
-const CompoundComponent_1 = require("@components-core/CompoundComponent");
-const List_1 = require("@components/List/List");
-const PositionedContainer_1 = require("@components/PositionedContainer/PositionedContainer");
-const ChangeListener_1 = require("@components/ChangeListener/ChangeListener");
-const FormItem_1 = require("@components/FormItem/FormItem");
-const TextBox_1 = require("@components/TextBox/TextBox");
-const RealTimeAdapter_1 = require("@components/RealTimeAdapter/RealTimeAdapter");
-const Form_1 = require("@components/Form/Form");
-const EmojiSelector_1 = require("@components/EmojiSelector/EmojiSelector");
-const NumberBox_1 = require("@components/NumberBox/NumberBox");
-const HoverCard_1 = require("@components/HoverCard/HoverCard");
-const App_1 = require("@components/App/App");
-const NavPanel_1 = require("@components/NavPanel/NavPanel");
-const Pages_1 = require("@components/Pages/Pages");
-const Footer_1 = require("@components/Footer/Footer");
-const NavGroup_1 = require("@components/NavGroup/NavGroup");
-const Logo_1 = require("@components/Logo/Logo");
-const RadioGroup_1 = require("@components/RadioGroup/RadioGroup");
-const Slot_1 = require("@components-core/Slot");
-const FileInput_1 = require("@components/FileInput/FileInput");
-const Chart_1 = require("@components/Chart/Chart");
-const Spinner_1 = require("@components/Spinner/Spinner");
-const Markdown_1 = require("@components/Markdown/Markdown");
-const Select_1 = require("@components/Select/Select");
-const ThemeChanger_1 = require("@components/ThemeChanger/ThemeChanger");
-const FormSection_1 = require("@components/FormSection/FormSection");
-const Checkbox_1 = require("@components/Checkbox/Checkbox");
-const Switch_1 = require("@components/Switch/Switch");
-const AppHeader_1 = require("@components/AppHeader/AppHeader");
-const DropdownMenu_1 = require("@components/DropdownMenu/DropdownMenu");
-const Theme_1 = require("@components/Theme/Theme");
+const Stack_1 = require("./Stack/Stack");
+const SpaceFiller_1 = require("./SpaceFiller/SpaceFiller");
+const TextArea_1 = require("./TextArea/TextArea");
+const NavLink_1 = require("./NavLink/NavLink");
+const Link_1 = require("./Link/Link");
+const TreeComponent_1 = require("./Tree/TreeComponent");
+const Button_1 = require("./Button/Button");
+const Heading_1 = require("./Heading/Heading");
+const Text_1 = require("./Text/Text");
+const Fragment_1 = require("../components-core/Fragment");
+const Table_1 = require("./Table/Table");
+const StickyBox_1 = require("./StickyBox/StickyBox");
+const Badge_1 = require("./Badge/Badge");
+const Avatar_1 = require("./Avatar/Avatar");
+const ContentSeparator_1 = require("./ContentSeparator/ContentSeparator");
+const Card_1 = require("./Card/Card");
+const FlowLayout_1 = require("./FlowLayout/FlowLayout");
+const ModalDialog_1 = require("./ModalDialog/ModalDialog");
+const NoResult_1 = require("./NoResult/NoResult");
+const FileUploadDropZone_1 = require("./FileUploadDropZone/FileUploadDropZone");
+const Icon_1 = require("./Icon/Icon");
+const Items_1 = require("./Items/Items");
+const SelectionStore_1 = require("./SelectionStore/SelectionStore");
+const Image_1 = require("./Image/Image");
+const PageMetaTitle_1 = require("./PageMetaTitle/PageMetaTitle");
+const ProgressBar_1 = require("./ProgressBar/ProgressBar");
+const Splitter_1 = require("./Splitter/Splitter");
+const Queue_1 = require("./Queue/Queue");
+const CompoundComponent_1 = require("../components-core/CompoundComponent");
+const List_1 = require("./List/List");
+const PositionedContainer_1 = require("./PositionedContainer/PositionedContainer");
+const ChangeListener_1 = require("./ChangeListener/ChangeListener");
+const FormItem_1 = require("./FormItem/FormItem");
+const TextBox_1 = require("./TextBox/TextBox");
+const RealTimeAdapter_1 = require("./RealTimeAdapter/RealTimeAdapter");
+const Form_1 = require("./Form/Form");
+const EmojiSelector_1 = require("./EmojiSelector/EmojiSelector");
+const NumberBox_1 = require("./NumberBox/NumberBox");
+const HoverCard_1 = require("./HoverCard/HoverCard");
+const App_1 = require("./App/App");
+const NavPanel_1 = require("./NavPanel/NavPanel");
+const Pages_1 = require("./Pages/Pages");
+const Footer_1 = require("./Footer/Footer");
+const NavGroup_1 = require("./NavGroup/NavGroup");
+const Logo_1 = require("./Logo/Logo");
+const RadioGroup_1 = require("./RadioGroup/RadioGroup");
+const Slot_1 = require("../components-core/Slot");
+const FileInput_1 = require("./FileInput/FileInput");
+const Chart_1 = require("./Chart/Chart");
+const Spinner_1 = require("./Spinner/Spinner");
+const Markdown_1 = require("./Markdown/Markdown");
+const Select_1 = require("./Select/Select");
+const ThemeChanger_1 = require("./ThemeChanger/ThemeChanger");
+const FormSection_1 = require("./FormSection/FormSection");
+const Checkbox_1 = require("./Checkbox/Checkbox");
+const Switch_1 = require("./Switch/Switch");
+const AppHeader_1 = require("./AppHeader/AppHeader");
+const DropdownMenu_1 = require("./DropdownMenu/DropdownMenu");
+const Theme_1 = require("./Theme/Theme");
 const lodash_es_1 = require("lodash-es");
-const ComponentRegistryContext_1 = require("@components/ComponentRegistryContext");
-const Column_1 = require("@components/Column/Column");
-const APICall_1 = require("@components-core/action/APICall");
-const FileDownloadAction_1 = require("@components-core/action/FileDownloadAction");
-const FileUploadAction_1 = require("@components-core/action/FileUploadAction");
-const NavigateAction_1 = require("@components-core/action/NavigateAction");
-const TimedAction_1 = require("@components-core/action/TimedAction");
-const ApiLoader_1 = require("@components-core/loader/ApiLoader");
-const ExternalDataLoader_1 = require("@components-core/loader/ExternalDataLoader");
-const MockLoaderRenderer_1 = require("@components-core/loader/MockLoaderRenderer");
-const DataLoader_1 = require("@components-core/loader/DataLoader");
-const DatePicker_1 = require("@components/DatePicker/DatePicker");
-const Redirect_1 = require("@components/Redirect/Redirect");
-const PieChart_1 = require("@components/PieChart/PieChart");
-const BarChart_1 = require("@components/BarChart/BarChart");
-const Map_1 = require("@components/Map/Map");
-const Tabs_1 = require("@components/Tabs/Tabs");
-const Bookmark_1 = require("@components/Bookmark/Bookmark");
-const AppState_1 = require("@components/AppState/AppState");
+const ComponentRegistryContext_1 = require("./ComponentRegistryContext");
+const Column_1 = require("./Column/Column");
+const APICall_1 = require("../components-core/action/APICall");
+const FileDownloadAction_1 = require("../components-core/action/FileDownloadAction");
+const FileUploadAction_1 = require("../components-core/action/FileUploadAction");
+const NavigateAction_1 = require("../components-core/action/NavigateAction");
+const TimedAction_1 = require("../components-core/action/TimedAction");
+const ApiLoader_1 = require("../components-core/loader/ApiLoader");
+const ExternalDataLoader_1 = require("../components-core/loader/ExternalDataLoader");
+const MockLoaderRenderer_1 = require("../components-core/loader/MockLoaderRenderer");
+const DataLoader_1 = require("../components-core/loader/DataLoader");
+const DatePicker_1 = require("./DatePicker/DatePicker");
+const Redirect_1 = require("./Redirect/Redirect");
+const Tabs_1 = require("./Tabs/Tabs");
+const Bookmark_1 = require("./Bookmark/Bookmark");
+const AppState_1 = require("./AppState/AppState");
 const PageHeader_1 = require("./PageHeader/PageHeader");
 const TrendLabel_1 = require("./TrendLabel/TrendLabel");
 const IconInfoCard_1 = require("./IconInfoCard/IconInfoCard");
 const TableHeader_1 = require("./TableHeader/TableHeader");
 const Toolbar_1 = require("./Toolbar/Toolbar");
 const ToolbarButton_1 = require("./ToolbarButton/ToolbarButton");
-const TableOfContents_1 = require("@components/TableOfContents/TableOfContents");
+const TableOfContents_1 = require("./TableOfContents/TableOfContents");
 const Accordion_1 = require("./Accordion/Accordion");
 const Alert_1 = require("./Alert/Alert");
 const OffCanvas_1 = require("./OffCanvas/OffCanvas");
-const XmluiCodeHighlighter_1 = require("@components-core/XmluiCodeHighlighter");
-const TabItem_1 = require("@components/Tabs/TabItem");
-const Range_1 = require("./Range/Range");
-const AccordionItem_1 = require("@components/Accordion/AccordionItem");
+const XmluiCodeHighlighter_1 = require("../components-core/XmluiCodeHighlighter");
+const TabItem_1 = require("./Tabs/TabItem");
+const AccordionItem_1 = require("./Accordion/AccordionItem");
 const Slider_1 = require("./Slider/Slider");
 const ButtonGroup_1 = require("./ButtonGroup/ButtonGroup");
-const Carousel_1 = require("@components/Carousel/Carousel");
-const CarouselItem_1 = require("@components/Carousel/CarouselItem");
-const renderers_1 = require("@components-core/renderers");
-const Breakout_1 = require("@components/Breakout/Breakout");
-const ToneChangerButton_1 = require("@components/ThemeChanger/ToneChangerButton");
-const APICall_2 = require("@components/APICall/APICall");
-const Option_1 = require("@components/Option/Option");
-const AutoComplete_1 = require("@components/AutoComplete/AutoComplete");
+const Carousel_1 = require("./Carousel/Carousel");
+const CarouselItem_1 = require("./Carousel/CarouselItem");
+const renderers_1 = require("../components-core/renderers");
+const Breakout_1 = require("./Breakout/Breakout");
+const ToneChangerButton_1 = require("./ThemeChanger/ToneChangerButton");
+const APICall_2 = require("./APICall/APICall");
+const Option_1 = require("./Option/Option");
+const AutoComplete_1 = require("./AutoComplete/AutoComplete");
 const Backdrop_1 = require("./Backdrop/Backdrop");
+const HtmlTags_1 = require("./HtmlTags/HtmlTags");
+const ColorPicker_1 = require("./ColorPicker/ColorPicker");
 /**
  * The framework has a specialized component concept, the "property holder
  * component." These components only hold property values but do not render
@@ -133,12 +131,12 @@ class ComponentRegistry {
      * `contributes` argument with information about accompanying (app-specific)
      * components that come with a particular app using the registry.
      * @param contributes Information about the components that come with the app
-     * @param componentManager Optional manager object that receives a notification
+     * @param extensionManager Optional manager object that receives a notification
      * about component registrations
      */
-    constructor(contributes = {}, componentManager) {
-        var _a, _b, _c, _d;
-        this.componentManager = componentManager;
+    constructor(contributes = {}, extensionManager) {
+        var _a, _b, _c;
+        this.extensionManager = extensionManager;
         // --- The pool of available components
         this.pool = new Map();
         // --- The pool of available theme variable names
@@ -149,10 +147,39 @@ class ComponentRegistry {
         this.actionFns = new Map();
         // --- The pool of available loader renderers
         this.loaders = new Map();
+        this.extensionRegistered = (extension) => {
+            extension.components.forEach((c) => {
+                if ("type" in c) {
+                    //we handle just the js components for now
+                    this.registerComponentRenderer(c, extension.namespace);
+                }
+            });
+        };
+        this.registerCoreComponent = (component) => {
+            const coreNamespaces = ["#xmlui-core-ns", ""];
+            if ("compoundComponentDef" in component) {
+                this.registerCompoundComponentRenderer(component, ...coreNamespaces);
+            }
+            else {
+                this.registerComponentRenderer(component, ...coreNamespaces);
+            }
+        };
+        this.registerAppComponent = (component) => {
+            const appNamespaces = ["#app-ns", ""];
+            if ("compoundComponentDef" in component) {
+                this.registerCompoundComponentRenderer(component, ...appNamespaces);
+            }
+            else {
+                this.registerComponentRenderer(component, ...appNamespaces);
+            }
+        };
         // --- Registers a renderable component using its renderer function
         // --- and metadata
-        this.registerComponentRenderer = ({ type, renderer, metadata, }) => {
-            this.pool.set(type, { renderer, descriptor: metadata });
+        this.registerComponentRenderer = ({ type, renderer, metadata }, ...namespaces) => {
+            const component = { renderer, descriptor: metadata };
+            namespaces.forEach((ns) => {
+                this.pool.set((ns ? ns + "." : "") + type, component);
+            });
             if (metadata === null || metadata === void 0 ? void 0 : metadata.themeVars) {
                 Object.keys(metadata.themeVars).forEach((key) => this.themeVars.add(key));
             }
@@ -160,229 +187,326 @@ class ComponentRegistry {
                 (0, lodash_es_1.merge)(this.defaultThemeVars, metadata === null || metadata === void 0 ? void 0 : metadata.defaultThemeVars);
             }
         };
-        this.componentManager = componentManager;
+        this.extensionManager = extensionManager;
+        // we register these first, so that core components with the same name can override them (without namespace)
+        (_a = contributes.components) === null || _a === void 0 ? void 0 : _a.forEach((renderer) => {
+            this.registerAppComponent(renderer);
+        });
+        (_b = contributes.compoundComponents) === null || _b === void 0 ? void 0 : _b.forEach((def) => {
+            this.registerAppComponent({ compoundComponentDef: def });
+        });
         if (process.env.VITE_USED_COMPONENTS_Stack !== "false") {
-            this.registerComponentRenderer(Stack_1.stackComponentRenderer);
-            this.registerComponentRenderer(Stack_1.vStackComponentRenderer);
-            this.registerComponentRenderer(Stack_1.hStackComponentRenderer);
-            this.registerComponentRenderer(Stack_1.cvStackComponentRenderer);
-            this.registerComponentRenderer(Stack_1.chStackComponentRenderer);
-        }
-        this.registerComponentRenderer(Slot_1.SlotHolder);
-        this.registerComponentRenderer(dataSourcePropHolder);
-        this.registerComponentRenderer(textNodePropHolder);
-        this.registerComponentRenderer(textNodeCDataPropHolder);
+            this.registerCoreComponent(Stack_1.stackComponentRenderer);
+            this.registerCoreComponent(Stack_1.vStackComponentRenderer);
+            this.registerCoreComponent(Stack_1.hStackComponentRenderer);
+            this.registerCoreComponent(Stack_1.cvStackComponentRenderer);
+            this.registerCoreComponent(Stack_1.chStackComponentRenderer);
+        }
+        this.registerCoreComponent(Slot_1.SlotHolder);
+        this.registerCoreComponent(dataSourcePropHolder);
+        this.registerCoreComponent(textNodePropHolder);
+        this.registerCoreComponent(textNodeCDataPropHolder);
         if (process.env.VITE_USED_COMPONENTS_SpaceFiller !== "false") {
-            this.registerComponentRenderer(SpaceFiller_1.spaceFillerComponentRenderer);
+            this.registerCoreComponent(SpaceFiller_1.spaceFillerComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Textarea !== "false") {
-            this.registerComponentRenderer(TextArea_1.textAreaComponentRenderer);
+            this.registerCoreComponent(TextArea_1.textAreaComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_AppHeader !== "false") {
-            this.registerComponentRenderer(AppHeader_1.appHeaderComponentRenderer);
+            this.registerCoreComponent(AppHeader_1.appHeaderComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Footer !== "false") {
-            this.registerComponentRenderer(Footer_1.footerRenderer);
+            this.registerCoreComponent(Footer_1.footerRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Logo !== "false") {
-            this.registerComponentRenderer(Logo_1.logoComponentRenderer);
+            this.registerCoreComponent(Logo_1.logoComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_NavLink !== "false") {
-            this.registerComponentRenderer(NavLink_1.navLinkComponentRenderer);
+            this.registerCoreComponent(NavLink_1.navLinkComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_NavGroup !== "false") {
-            this.registerComponentRenderer(NavGroup_1.navGroupComponentRenderer);
+            this.registerCoreComponent(NavGroup_1.navGroupComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Link !== "false") {
-            this.registerComponentRenderer(Link_1.localLinkComponentRenderer);
+            this.registerCoreComponent(Link_1.localLinkComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Form !== "false") {
-            this.registerComponentRenderer(Form_1.formComponentRenderer);
-            this.registerComponentRenderer(FormItem_1.formItemComponentRenderer);
+            this.registerCoreComponent(Form_1.formComponentRenderer);
+            this.registerCoreComponent(FormItem_1.formItemComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Tree !== "false") {
-            this.registerComponentRenderer(TreeComponent_1.treeComponentRenderer);
+            this.registerCoreComponent(TreeComponent_1.treeComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Button !== "false") {
-            this.registerComponentRenderer(Button_1.buttonComponentRenderer);
+            this.registerCoreComponent(Button_1.buttonComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Checkbox !== "false") {
-            this.registerComponentRenderer(Checkbox_1.checkboxComponentRenderer);
+            this.registerCoreComponent(Checkbox_1.checkboxComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Switch !== "false") {
-            this.registerComponentRenderer(Switch_1.switchComponentRenderer);
+            this.registerCoreComponent(Switch_1.switchComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Heading !== "false") {
-            this.registerComponentRenderer(Heading_1.headingComponentRenderer);
-            this.registerComponentRenderer(Heading_1.h1ComponentRenderer);
-            this.registerComponentRenderer(Heading_1.h2ComponentRenderer);
-            this.registerComponentRenderer(Heading_1.h3ComponentRenderer);
-            this.registerComponentRenderer(Heading_1.h4ComponentRenderer);
-            this.registerComponentRenderer(Heading_1.h5ComponentRenderer);
-            this.registerComponentRenderer(Heading_1.h6ComponentRenderer);
+            this.registerCoreComponent(Heading_1.headingComponentRenderer);
+            this.registerCoreComponent(Heading_1.h1ComponentRenderer);
+            this.registerCoreComponent(Heading_1.h2ComponentRenderer);
+            this.registerCoreComponent(Heading_1.h3ComponentRenderer);
+            this.registerCoreComponent(Heading_1.h4ComponentRenderer);
+            this.registerCoreComponent(Heading_1.h5ComponentRenderer);
+            this.registerCoreComponent(Heading_1.h6ComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Text !== "false") {
-            this.registerComponentRenderer(Text_1.textComponentRenderer);
+            this.registerCoreComponent(Text_1.textComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Fragment !== "false") {
-            this.registerComponentRenderer(Fragment_1.fragmentComponentRenderer);
+            this.registerCoreComponent(Fragment_1.fragmentComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Table !== "false") {
-            this.registerComponentRenderer(Table_1.tableComponentRenderer);
-            this.registerComponentRenderer(Column_1.columnComponentRenderer);
+            this.registerCoreComponent(Table_1.tableComponentRenderer);
+            this.registerCoreComponent(Column_1.columnComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_List !== "false") {
-            this.registerComponentRenderer(List_1.dynamicHeightListComponentRenderer);
+            this.registerCoreComponent(List_1.dynamicHeightListComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_App !== "false") {
-            this.registerComponentRenderer(App_1.appRenderer);
+            this.registerCoreComponent(App_1.appRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_NavPanel !== "false") {
-            this.registerComponentRenderer(NavPanel_1.navPanelRenderer);
+            this.registerCoreComponent(NavPanel_1.navPanelRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Pages !== "false") {
-            this.registerComponentRenderer(Pages_1.pagesRenderer);
-            this.registerComponentRenderer(Pages_1.pageRenderer);
+            this.registerCoreComponent(Pages_1.pagesRenderer);
+            this.registerCoreComponent(Pages_1.pageRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Redirect !== "false") {
-            this.registerComponentRenderer(Redirect_1.redirectRenderer);
+            this.registerCoreComponent(Redirect_1.redirectRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_StickyBox !== "false") {
-            this.registerComponentRenderer(StickyBox_1.stickyBoxComponentRenderer);
+            this.registerCoreComponent(StickyBox_1.stickyBoxComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Badge !== "false") {
-            this.registerComponentRenderer(Badge_1.badgeComponentRenderer);
+            this.registerCoreComponent(Badge_1.badgeComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Avatar !== "false") {
-            this.registerComponentRenderer(Avatar_1.avatarComponentRenderer);
+            this.registerCoreComponent(Avatar_1.avatarComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_ContentSeparator !== "false") {
-            this.registerComponentRenderer(ContentSeparator_1.contentSeparatorComponentRenderer);
+            this.registerCoreComponent(ContentSeparator_1.contentSeparatorComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Card !== "false") {
-            this.registerComponentRenderer(Card_1.cardComponentRenderer);
+            this.registerCoreComponent(Card_1.cardComponentRenderer);
+        }
+        if (process.env.VITE_USED_COMPONENTS_ColorPicker !== "false") {
+            this.registerCoreComponent(ColorPicker_1.colorPickerComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_FlowLayout !== "false") {
-            this.registerComponentRenderer(FlowLayout_1.flowLayoutComponentRenderer);
+            this.registerCoreComponent(FlowLayout_1.flowLayoutComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_ModalDialog !== "false") {
-            this.registerComponentRenderer(ModalDialog_1.modalViewComponentRenderer);
+            this.registerCoreComponent(ModalDialog_1.modalViewComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_NoResult !== "false") {
-            this.registerComponentRenderer(NoResult_1.noResultComponentRenderer);
+            this.registerCoreComponent(NoResult_1.noResultComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Option !== "false") {
-            this.registerComponentRenderer(Option_1.optionComponentRenderer);
+            this.registerCoreComponent(Option_1.optionComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_TabItem !== "false") {
-            this.registerComponentRenderer(TabItem_1.tabItemComponentRenderer);
+            this.registerCoreComponent(TabItem_1.tabItemComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_AccordionItem !== "false") {
-            this.registerComponentRenderer(AccordionItem_1.accordionItemComponentRenderer);
+            this.registerCoreComponent(AccordionItem_1.accordionItemComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_CarouselItem !== "false") {
-            this.registerComponentRenderer(CarouselItem_1.carouselItemComponentRenderer);
+            this.registerCoreComponent(CarouselItem_1.carouselItemComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_FileUploadDropZone !== "false") {
-            this.registerComponentRenderer(FileUploadDropZone_1.fileUploadDropZoneComponentRenderer);
+            this.registerCoreComponent(FileUploadDropZone_1.fileUploadDropZoneComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Icon !== "false") {
-            this.registerComponentRenderer(Icon_1.iconComponentRenderer);
+            this.registerCoreComponent(Icon_1.iconComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Items !== "false") {
-            this.registerComponentRenderer(Items_1.itemsComponentRenderer);
+            this.registerCoreComponent(Items_1.itemsComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_SelectionStore !== "false") {
-            this.registerComponentRenderer(SelectionStore_1.selectionStoreComponentRenderer);
+            this.registerCoreComponent(SelectionStore_1.selectionStoreComponentRenderer);
         }
         if (process.env.VITE_USED_COMPONENTS_Image !== "false") {
-            this.registerComponentRenderer(Image_1.imageComponentRenderer);
+            this.registerCoreComponent(Image_1.imageComponentRenderer);
         }
         if (process.env.VITE_USER_COMPONENTS_XmluiCodeHightlighter !== "false") {
-            this.registerComponentRenderer(XmluiCodeHighlighter_1.codeComponentRenderer);
+            this.registerCoreComponent(XmluiCodeHighlighter_1.codeComponentRenderer);
         }
         if (process.env.VITE_USER_COMPONENTS_Markdown !== "false") {
-            this.registerComponentRenderer(Markdown_1.markdownComponentRenderer);
+            this.registerCoreComponent(Markdown_1.markdownComponentRenderer);
         }
         if (process.env.VITE_INCLUDE_REST_COMPONENTS !== "false") {
             //TODO, if it proves to be a working solution, make these components skippable, too
-            this.registerComponentRenderer(PageMetaTitle_1.pageMetaTitleComponentRenderer);
-            this.registerComponentRenderer(ProgressBar_1.progressBarComponentRenderer);
-            this.registerComponentRenderer(Splitter_1.splitterComponentRenderer);
-            this.registerComponentRenderer(Splitter_1.vSplitterComponentRenderer);
-            this.registerComponentRenderer(Splitter_1.hSplitterComponentRenderer);
-            this.registerComponentRenderer(Queue_1.queueComponentRenderer);
-            this.registerComponentRenderer(PositionedContainer_1.positionedContainerComponentRenderer);
-            this.registerComponentRenderer(ChangeListener_1.changeListenerComponentRenderer);
-            this.registerComponentRenderer(RealTimeAdapter_1.realTimeAdapterComponentRenderer);
-            this.registerComponentRenderer(TextBox_1.textBoxComponentRenderer);
-            this.registerComponentRenderer(TextBox_1.passwordInputComponentRenderer);
-            this.registerComponentRenderer(EmojiSelector_1.emojiSelectorRenderer);
-            this.registerComponentRenderer(NumberBox_1.numberBoxComponentRenderer);
-            this.registerComponentRenderer(HoverCard_1.hoverCardComponentRenderer);
-            this.registerComponentRenderer(RadioGroup_1.radioGroupRenderer);
-            this.registerComponentRenderer(FileInput_1.fileInputRenderer);
-            this.registerComponentRenderer(DatePicker_1.datePickerComponentRenderer);
-            this.registerComponentRenderer(Spinner_1.spinnerComponentRenderer);
-            this.registerComponentRenderer(Select_1.selectComponentRenderer);
-            this.registerComponentRenderer(AutoComplete_1.autoCompleteComponentRenderer);
-            this.registerComponentRenderer(DropdownMenu_1.dropdownMenuComponentRenderer);
-            this.registerComponentRenderer(ThemeChanger_1.themeChangerButtonComponentRenderer);
-            this.registerComponentRenderer(ToneChangerButton_1.toneChangerButtonComponentRenderer);
-            this.registerCompoundComponentRenderer(FormSection_1.formSectionRenderer);
-            this.registerComponentRenderer(DropdownMenu_1.dropdownMenuComponentRenderer);
-            this.registerComponentRenderer(DropdownMenu_1.menuItemRenderer);
-            this.registerComponentRenderer(DropdownMenu_1.subMenuItemRenderer);
-            this.registerComponentRenderer(DropdownMenu_1.menuSeparatorRenderer);
-            this.registerComponentRenderer(Tabs_1.tabsComponentRenderer);
-            this.registerComponentRenderer(Bookmark_1.bookmarkComponentRenderer);
-            this.registerComponentRenderer(TableOfContents_1.tableOfContentsRenderer);
-            this.registerComponentRenderer(Breakout_1.breakoutComponentRenderer);
-        }
-        this.registerComponentRenderer(Theme_1.themeComponentRenderer);
-        this.registerComponentRenderer(AppState_1.appStateComponentRenderer);
-        this.registerComponentRenderer(APICall_2.apiCallRenderer);
+            this.registerCoreComponent(PageMetaTitle_1.pageMetaTitleComponentRenderer);
+            this.registerCoreComponent(ProgressBar_1.progressBarComponentRenderer);
+            this.registerCoreComponent(Splitter_1.splitterComponentRenderer);
+            this.registerCoreComponent(Splitter_1.vSplitterComponentRenderer);
+            this.registerCoreComponent(Splitter_1.hSplitterComponentRenderer);
+            this.registerCoreComponent(Queue_1.queueComponentRenderer);
+            this.registerCoreComponent(PositionedContainer_1.positionedContainerComponentRenderer);
+            this.registerCoreComponent(ChangeListener_1.changeListenerComponentRenderer);
+            this.registerCoreComponent(RealTimeAdapter_1.realTimeAdapterComponentRenderer);
+            this.registerCoreComponent(TextBox_1.textBoxComponentRenderer);
+            this.registerCoreComponent(TextBox_1.passwordInputComponentRenderer);
+            this.registerCoreComponent(EmojiSelector_1.emojiSelectorRenderer);
+            this.registerCoreComponent(NumberBox_1.numberBoxComponentRenderer);
+            this.registerCoreComponent(HoverCard_1.hoverCardComponentRenderer);
+            this.registerCoreComponent(RadioGroup_1.radioGroupRenderer);
+            this.registerCoreComponent(FileInput_1.fileInputRenderer);
+            this.registerCoreComponent(DatePicker_1.datePickerComponentRenderer);
+            this.registerCoreComponent(Spinner_1.spinnerComponentRenderer);
+            this.registerCoreComponent(Select_1.selectComponentRenderer);
+            this.registerCoreComponent(AutoComplete_1.autoCompleteComponentRenderer);
+            this.registerCoreComponent(DropdownMenu_1.dropdownMenuComponentRenderer);
+            this.registerCoreComponent(ThemeChanger_1.themeChangerButtonComponentRenderer);
+            this.registerCoreComponent(ToneChangerButton_1.toneChangerButtonComponentRenderer);
+            this.registerCoreComponent(FormSection_1.formSectionRenderer);
+            this.registerCoreComponent(DropdownMenu_1.dropdownMenuComponentRenderer);
+            this.registerCoreComponent(DropdownMenu_1.menuItemRenderer);
+            this.registerCoreComponent(DropdownMenu_1.subMenuItemRenderer);
+            this.registerCoreComponent(DropdownMenu_1.menuSeparatorRenderer);
+            this.registerCoreComponent(Tabs_1.tabsComponentRenderer);
+            this.registerCoreComponent(Bookmark_1.bookmarkComponentRenderer);
+            this.registerCoreComponent(TableOfContents_1.tableOfContentsRenderer);
+            this.registerCoreComponent(Breakout_1.breakoutComponentRenderer);
+        }
+        this.registerCoreComponent(Theme_1.themeComponentRenderer);
+        this.registerCoreComponent(AppState_1.appStateComponentRenderer);
+        this.registerCoreComponent(APICall_2.apiCallRenderer);
         // --- Added after tabler-clone review
-        this.registerCompoundComponentRenderer(PageHeader_1.pageHeaderRenderer);
-        this.registerCompoundComponentRenderer(TrendLabel_1.trendLabelRenderer);
-        this.registerCompoundComponentRenderer(IconInfoCard_1.iconInfoCardRenderer);
-        this.registerCompoundComponentRenderer(TableHeader_1.tableHeaderRenderer);
-        this.registerCompoundComponentRenderer(Toolbar_1.toolbarRenderer);
-        this.registerCompoundComponentRenderer(ToolbarButton_1.toolbarButtonRenderer);
+        this.registerCoreComponent(PageHeader_1.pageHeaderRenderer);
+        this.registerCoreComponent(TrendLabel_1.trendLabelRenderer);
+        this.registerCoreComponent(IconInfoCard_1.iconInfoCardRenderer);
+        this.registerCoreComponent(TableHeader_1.tableHeaderRenderer);
+        this.registerCoreComponent(Toolbar_1.toolbarRenderer);
+        this.registerCoreComponent(ToolbarButton_1.toolbarButtonRenderer);
         // --- New Bootstrap-inspired components
-        this.registerComponentRenderer(Carousel_1.carouselComponentRenderer);
-        this.registerComponentRenderer(Accordion_1.accordionComponentRenderer);
-        this.registerComponentRenderer(Alert_1.alertComponentRenderer);
-        this.registerComponentRenderer(OffCanvas_1.offCanvasComponentRenderer);
-        this.registerComponentRenderer(Range_1.rangeComponentRenderer);
-        this.registerComponentRenderer(Slider_1.sliderComponentRenderer);
-        this.registerComponentRenderer(ButtonGroup_1.buttonGroupComponentRenderer);
-        this.registerComponentRenderer(Backdrop_1.backdropComponentRenderer);
+        this.registerCoreComponent(Carousel_1.carouselComponentRenderer);
+        this.registerCoreComponent(Accordion_1.accordionComponentRenderer);
+        this.registerCoreComponent(Alert_1.alertComponentRenderer);
+        this.registerCoreComponent(OffCanvas_1.offCanvasComponentRenderer);
+        this.registerCoreComponent(Slider_1.sliderComponentRenderer);
+        this.registerCoreComponent(ButtonGroup_1.buttonGroupComponentRenderer);
+        this.registerCoreComponent(Backdrop_1.backdropComponentRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlATagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlAbbrTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlAddressTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlAreaTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlArticleTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlAsideTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlAudioTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlBTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlBdiTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlBdoTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlBlockquoteTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlBrTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlButtonTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlCanvasTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlCaptionTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlCiteTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlCodeTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlColTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlColgroupTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDataTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDatalistTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDdTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDelTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDetailsTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDfnTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDialogTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDivTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDlTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlDtTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlEMTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlEmbedTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlFieldsetTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlFigcaptionTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlFigureTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlFooterTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlFormTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlH1TagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlH2TagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlH3TagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlH4TagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlH5TagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlH6TagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlHeaderTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlHrTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlITagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlIframeTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlImgTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlInputTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlInsTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlKbdTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlLabelTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlLegendTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlLiTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlMainTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlMapTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlMarkTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlMenuTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlMeterTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlNavTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlObjectTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlOlTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlOptgroupTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlOptionTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlOutputTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlPTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlParamTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlPictureTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlPreTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlProgressTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlQTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlRpTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlRtTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlRubyTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSampTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSectionTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSelectTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSmallTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSourceTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSpanTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlStrongTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSubTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSummaryTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlSupTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTableTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTbodyTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTdTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTemplateTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTextareaTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTfootTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlThTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTheadTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTimeTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTrTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlTrackTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlUTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlUlTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlVarTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlVideoTagRenderer);
+        this.registerCoreComponent(HtmlTags_1.htmlWbrTagRenderer);
         if (process.env.VITE_USED_COMPONENTS_Chart !== "false") {
-            this.registerComponentRenderer(Chart_1.chartRenderer);
-            this.registerComponentRenderer(PieChart_1.pieChartComponentRenderer);
-            this.registerComponentRenderer(BarChart_1.barChartComponentRenderer);
-            this.registerComponentRenderer(Map_1.mapComponentRenderer);
+            this.registerCoreComponent(Chart_1.chartRenderer);
         }
-        (_a = contributes.components) === null || _a === void 0 ? void 0 : _a.forEach((renderer) => {
-            this.registerComponentRenderer(renderer);
-        });
-        (_b = contributes.compoundComponents) === null || _b === void 0 ? void 0 : _b.forEach((def) => {
-            this.registerCompoundComponentRenderer({ compoundComponentDef: def });
-        });
         this.registerActionFn(APICall_1.apiAction);
         this.registerActionFn(FileDownloadAction_1.downloadAction);
         this.registerActionFn(FileUploadAction_1.uploadAction);
         this.registerActionFn(NavigateAction_1.navigateAction);
         this.registerActionFn(TimedAction_1.timedAction);
-        (_c = contributes.actions) === null || _c === void 0 ? void 0 : _c.forEach((actionRenderer) => {
-            this.registerActionFn(actionRenderer);
-        });
         this.registerLoaderRenderer(ApiLoader_1.apiLoaderRenderer);
         this.registerLoaderRenderer(ExternalDataLoader_1.externalDataLoaderRenderer);
         this.registerLoaderRenderer(MockLoaderRenderer_1.mockLoaderRenderer);
         this.registerLoaderRenderer(DataLoader_1.dataLoaderRenderer);
-        (_d = this.componentManager) === null || _d === void 0 ? void 0 : _d.subscribeToRegistrations(this.registerComponentRenderer);
+        (_c = this.extensionManager) === null || _c === void 0 ? void 0 : _c.subscribeToRegistrations(this.extensionRegistered);
     }
     /**
      * All theme variables used by the registered components.
@@ -447,19 +571,16 @@ class ComponentRegistry {
             this.actionFns.get(componentName) !== undefined);
     }
     // --- Registers a compound component using its definition and metadata
-    registerCompoundComponentRenderer({ compoundComponentDef, metadata, }) {
-        this.pool.set(compoundComponentDef.name, {
+    registerCompoundComponentRenderer({ compoundComponentDef, metadata }, ...namespaces) {
+        const component = {
+            type: compoundComponentDef.name,
             renderer: (rendererContext) => {
                 return ((0, jsx_runtime_1.jsx)(CompoundComponent_1.CompoundComponent, Object.assign({ api: compoundComponentDef.api, scriptCollected: compoundComponentDef.scriptCollected, compound: compoundComponentDef.component }, rendererContext)));
             },
             isCompoundComponent: true,
-        });
-        if (metadata === null || metadata === void 0 ? void 0 : metadata.themeVars) {
-            Object.keys(metadata.themeVars).forEach((key) => this.themeVars.add(key));
-        }
-        if (metadata === null || metadata === void 0 ? void 0 : metadata.defaultThemeVars) {
-            (0, lodash_es_1.merge)(this.defaultThemeVars, metadata === null || metadata === void 0 ? void 0 : metadata.defaultThemeVars);
-        }
+            metadata,
+        };
+        this.registerComponentRenderer(component, ...namespaces);
     }
     // --- Registers an action function using its definition
     registerActionFn({ actionName: functionName, actionFn }) {
@@ -476,7 +597,7 @@ class ComponentRegistry {
      */
     destroy() {
         var _a;
-        (_a = this.componentManager) === null || _a === void 0 ? void 0 : _a.unSubscribeFromRegistrations(this.registerComponentRenderer);
+        (_a = this.extensionManager) === null || _a === void 0 ? void 0 : _a.unSubscribeFromRegistrations(this.extensionRegistered);
     }
 }
 exports.ComponentRegistry = ComponentRegistry;
@@ -485,15 +606,15 @@ exports.ComponentRegistry = ComponentRegistry;
  * component registry. The component ensures that child components are not
  * rendered before the component registry is initialized.
  */
-function ComponentProvider({ children, contributes, componentManager, }) {
-    const [componentRegistry, setComponentRegistry] = (0, react_1.useState)(() => new ComponentRegistry(contributes, componentManager));
+function ComponentProvider({ children, contributes, extensionManager, }) {
+    const [componentRegistry, setComponentRegistry] = (0, react_1.useState)(() => new ComponentRegistry(contributes, extensionManager));
     // --- Make sure the component registry is updated when the contributes or
     // --- component manager changes (e.g., due to HMR).
     (0, react_1.useEffect)(() => {
         setComponentRegistry((prev) => {
             prev.destroy();
-            return new ComponentRegistry(contributes, componentManager);
+            return new ComponentRegistry(contributes, extensionManager);
         });
-    }, [componentManager, contributes]);
+    }, [extensionManager, contributes]);
     return ((0, jsx_runtime_1.jsx)(ComponentRegistryContext_1.ComponentRegistryContext.Provider, { value: componentRegistry, children: children }));
 }