From 79c83acfbeff9bc01c7376d1ff6c4ed180d5c19e Mon Sep 17 00:00:00 2001 From: Andrea Vesterhus Date: Fri, 10 May 2024 12:14:51 +0200 Subject: [PATCH] feat: view selector docs --- .../docs/sidebar/Documentation.md | 47 +++++++++++++ .../docs/sidebar/Examples/Basic.json | 66 +++++++++++++++++++ .../view_selector/docs/tabs/Documentation.md | 47 +++++++++++++ .../docs/tabs/Examples/Basic.json | 66 +++++++++++++++++++ 4 files changed, 226 insertions(+) create mode 100644 packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Documentation.md create mode 100644 packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Examples/Basic.json create mode 100644 packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Documentation.md create mode 100644 packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Examples/Basic.json diff --git a/packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Documentation.md b/packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Documentation.md new file mode 100644 index 000000000..7517ef37b --- /dev/null +++ b/packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Documentation.md @@ -0,0 +1,47 @@ +Use sidebar as primary site and entity navigation. + +### Passing views +Simply pass viewConfig as ViewSelectorItems through `items` attribute. + +```json +"items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "SidebarItem 1", + "viewConfig": {} + } +] +``` + +### Using icons +ViewSelectorItems can also include [eds icons](https://storybook.eds.equinor.com/?path=/docs/icons-iconpreview-docs--docs) before label. Simply pass the name of the icon in the eds_icon field. + +```json {5} +"items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "SidebarItem 1", + "eds_icon": "home", + "viewConfig": {} + } +] +``` + +### subItems / nested views +Every ViewSelectorItem can also receive subItems which allows you to pass viewConfigs and nest views. +```json {5} +"items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "SidebarItem 1", + "subItems": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "Sub Item 1", + "viewConfig": {} + } + ], + "viewConfig": {} + } +] +``` \ No newline at end of file diff --git a/packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Examples/Basic.json b/packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Examples/Basic.json new file mode 100644 index 000000000..1a8bbb681 --- /dev/null +++ b/packages/dm-core-plugins/blueprints/view_selector/docs/sidebar/Examples/Basic.json @@ -0,0 +1,66 @@ +{ + "title": "Basic Example", + "description": "Minimal example of how to configure sidebar plugin", + "note": "", + "showDemo": true, + "entityFilePrefix": "sections", + "blueprint": { + "name": "Section", + "type": "CORE:Blueprint", + "description": "", + "attributes": [ + { + "name": "type", + "type": "dmss://system/SIMOS/BlueprintAttribute", + "attributeType": "string", + "optional": false + } + ] + }, + "entity": { + "type": "./Section", + "_id": "1179c897-df62-445f-87e4-f393b4253936" + }, + "recipe": { + "name": "UiRecipesSelector", + "type": "CORE:UiRecipe", + "plugin": "@development-framework/dm-core-plugins/view_selector/sidebar", + "config": { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorConfig", + "items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "SidebarItem 1", + "viewConfig": { + "type": "CORE:InlineRecipeViewConfig", + "recipe": { + "name": "box", + "type": "CORE:UiRecipe", + "plugin": "custom-box-plugin", + "config": { + "type": "PLUGINS:custom-box-plugin-blueprint", + "content": "Item 1" + } + } + } + }, + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "SidebarItem 2", + "viewConfig": { + "type": "CORE:InlineRecipeViewConfig", + "recipe": { + "name": "box", + "type": "CORE:UiRecipe", + "plugin": "custom-box-plugin", + "config": { + "type": "PLUGINS:custom-box-plugin-blueprint", + "content": "Item 2" + } + } + } + } + ] + } + } +} diff --git a/packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Documentation.md b/packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Documentation.md new file mode 100644 index 000000000..bbf6c6153 --- /dev/null +++ b/packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Documentation.md @@ -0,0 +1,47 @@ +Configure to let users navigate multiple views in separate tab windows. + +### Passing views +Simply pass viewConfig as ViewSelectorItems through `items` attribute. + +```json +"items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "TabItem 1", + "viewConfig": {} + } +] +``` + +### Using icons +ViewSelectorItems can also include [eds icons](https://storybook.eds.equinor.com/?path=/docs/icons-iconpreview-docs--docs) before label. Simply pass the name of the icon in the eds_icon field. + +```json {5} +"items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "Tab Item 1", + "eds_icon": "home", + "viewConfig": {} + } +] +``` + +### subItems / nested views +Every ViewSelectorItem can also receive subItems which allows you to pass viewConfigs and nest views. +```json {5} +"items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "Tab Item 1", + "subItems": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "Sub Item 1", + "viewConfig": {} + } + ], + "viewConfig": {} + } +] +``` \ No newline at end of file diff --git a/packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Examples/Basic.json b/packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Examples/Basic.json new file mode 100644 index 000000000..6bad729db --- /dev/null +++ b/packages/dm-core-plugins/blueprints/view_selector/docs/tabs/Examples/Basic.json @@ -0,0 +1,66 @@ +{ + "title": "Basic Example", + "description": "Minimal example of how to configure tab plugin", + "note": "", + "showDemo": true, + "entityFilePrefix": "sections", + "blueprint": { + "name": "Section", + "type": "CORE:Blueprint", + "description": "", + "attributes": [ + { + "name": "type", + "type": "dmss://system/SIMOS/BlueprintAttribute", + "attributeType": "string", + "optional": false + } + ] + }, + "entity": { + "type": "./Section", + "_id": "1179c897-df62-445f-87e4-f393b4253936" + }, + "recipe": { + "name": "UiRecipesSelector", + "type": "CORE:UiRecipe", + "plugin": "@development-framework/dm-core-plugins/view_selector/tabs", + "config": { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorConfig", + "items": [ + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "Tab 1", + "viewConfig": { + "type": "CORE:InlineRecipeViewConfig", + "recipe": { + "name": "box", + "type": "CORE:UiRecipe", + "plugin": "custom-box-plugin", + "config": { + "type": "PLUGINS:custom-box-plugin-blueprint", + "content": "Item 1" + } + } + } + }, + { + "type": "PLUGINS:dm-core-plugins/view_selector/ViewSelectorItem", + "label": "Tab 2", + "viewConfig": { + "type": "CORE:InlineRecipeViewConfig", + "recipe": { + "name": "box", + "type": "CORE:UiRecipe", + "plugin": "custom-box-plugin", + "config": { + "type": "PLUGINS:custom-box-plugin-blueprint", + "content": "Item 2" + } + } + } + } + ] + } + } +}