From 2c5a49ec61ebcbe488c641a8727e1a0e64e9d6ce Mon Sep 17 00:00:00 2001 From: Philipp Hugenroth Date: Mon, 29 Jan 2024 15:48:06 +0100 Subject: [PATCH] Adjust style Signed-off-by: Philipp Hugenroth --- .../architecture/03-extensions.md | 2 +- .../building-plugins/04-built-in-data-refs.md | 96 ++++++++++--------- 2 files changed, 52 insertions(+), 46 deletions(-) diff --git a/docs/frontend-system/architecture/03-extensions.md b/docs/frontend-system/architecture/03-extensions.md index cfbabdf9bc..cdee6acb2a 100644 --- a/docs/frontend-system/architecture/03-extensions.md +++ b/docs/frontend-system/architecture/03-extensions.md @@ -135,7 +135,7 @@ const extension = createExtension({ We provide default `coreExtensionData`, which provides commonly used `ExtensionDataRef`s - e.g. for `React.JSX.Element` and `RouteRef`. They can be used when creating your own extension. For example, the React Element extension data that we defined above is already provided as `coreExtensionData.reactElement`. - +For a full list and explanations of all types of core extension data, see the [core extension data reference](../building-plugins/04-built-in-data-refs.md). --> ### Optional Extension Data diff --git a/docs/frontend-system/building-plugins/04-built-in-data-refs.md b/docs/frontend-system/building-plugins/04-built-in-data-refs.md index 16ded9a9fd..c338dddc4a 100644 --- a/docs/frontend-system/building-plugins/04-built-in-data-refs.md +++ b/docs/frontend-system/building-plugins/04-built-in-data-refs.md @@ -6,39 +6,33 @@ sidebar_label: Built-in data refs description: Configuring or overriding built-in extension data references --- +> **NOTE: The new frontend system is in alpha and is only supported by a small number of plugins.** + To have a better understanding of extension data references please read [extension data section the extensions architecture documentation](../architecture/03-extensions.md#extension-data) first. ## Built-in extension data references -### Frontend Plugin API +Data references help to define the input & output of an extension. A data ref is uniquely identified through there `id`. Through the data ref strong typing is enforced for the input/output of the extension. -#### Core Extension Data +### Core Extension Data -| namespace | name | type | id | -| :-------: | :----------: | :---------: | :-----------------: | -| - | reactElement | JSX.Element | `core.reactElement` | -| - | routePath | string | `core.routing.path` | -| - | routeRef | RouteRef | `core.routing.ref` | +Commonly used `ExtensionDataRef`s for extensions. -#### +| namespace | name | type | id | +| :-------: | :----------: | :-----------: | :-----------------: | +| - | reactElement | `JSX.Element` | `core.reactElement` | +| - | routePath | `string` | `core.routing.path` | +| - | routeRef | `RouteRef` | `core.routing.ref` | -| namespace | name | type | id | -| :----------------: | :------------: | :-----------: | :--------------: | -| createApiExtension | factoryDataRef | AnyApiFactory | core.api.factory | +### Core API Data -#### +| namespace | name | type | id | +| :----------------: | :------------: | :-------------: | :----------------: | +| createApiExtension | factoryDataRef | `AnyApiFactory` | `core.api.factory` | -| namespace | name | type | id | -| :---------------------------: | :--------------: | :----------------------------------: | :--------------: | -| createAppRootWrapperExtension | componentDataRef | ComponentType> | app.root.wrapper | +### Core Navigation -#### - -| namespace | name | type | id | -| :-------------------: | :--------------: | :----------------------------------: | :--------------: | -| createRouterExtension | componentDataRef | ComponentType> | app.root.wrapper | - -#### +#### Item Data ```ts type DataType = { @@ -48,11 +42,11 @@ type DataType = { }; ``` -| namespace | name | type | id | -| :--------------------: | :-----------: | :------: | :------------------: | -| createNavItemExtension | targetDataRef | DataType | core.nav-item.target | +| namespace | name | type | id | +| :--------------------: | :-----------: | :--------: | :--------------------: | +| createNavItemExtension | targetDataRef | `DataType` | `core.nav-item.target` | -#### +#### Logo Data ```ts type DataType = { @@ -61,23 +55,23 @@ type DataType = { }; ``` -| namespace | name | type | id | -| :--------------------: | :-----------------: | :----------------------------------: | :-------------------------: | -| createNavLogoExtension | logoElementsDataRef | ComponentType> | core.nav-logo.logo-elements | +| namespace | name | type | id | +| :--------------------: | :-----------------: | :------------------------------------: | :---------------------------: | +| createNavLogoExtension | logoElementsDataRef | `ComponentType>` | `core.nav-logo.logo-elements` | -#### +### Core App Components Data -| namespace | name | type | id | -| :-----------------------: | :--------------: | :----------------------------: | :-------------------------: | -| createSignInPageExtension | componentDataRef | ComponentType | core.sign-in-page.component | +| namespace | name | type | id | +| :-----------------------: | :--------------: | :------------------------------: | :---------------------------: | +| createSignInPageExtension | componentDataRef | `ComponentType` | `core.sign-in-page.component` | -#### +### Core Theme Data -| namespace | name | type | id | -| :------------------: | :----------: | :------: | :--------------: | -| createThemeExtension | themeDataRef | AppTheme | core.theme.theme | +| namespace | name | type | id | +| :------------------: | :----------: | :--------: | :----------------: | +| createThemeExtension | themeDataRef | `AppTheme` | `core.theme.theme` | -#### +### Core Components ```ts type DataType = { @@ -86,12 +80,24 @@ type DataType = { }; ``` -| namespace | name | type | id | -| :----------------------: | :--------------: | :------: | :----------------------: | -| createComponentExtension | componentDataRef | DataType | core.component.component | +| namespace | name | type | id | +| :----------------------: | :--------------: | :--------: | :------------------------: | +| createComponentExtension | componentDataRef | `DataType` | `core.component.component` | -#### +### Core Translation -| namespace | name | type | id | -| :------------------------: | :----------------: | :----------------------------------------: | :--------------------------: | -| createTranslationExtension | translationDataRef | TranslationResource or TranslationMessages | core.translation.translation | +| namespace | name | type | id | +| :------------------------: | :----------------: | :--------------------------------------------: | :----------------------------: | +| createTranslationExtension | translationDataRef | `TranslationResource` or `TranslationMessages` | `core.translation.translation` | + +### App Root + +| namespace | name | type | id | +| :---------------------------: | :--------------: | :------------------------------------: | :----------------: | +| createAppRootWrapperExtension | componentDataRef | `ComponentType>` | `app.root.wrapper` | + +### App Router + +| namespace | name | type | id | +| :-------------------: | :--------------: | :------------------------------------: | :------------------: | +| createRouterExtension | componentDataRef | `ComponentType>` | `app.router.wrapper` |