feat: view selector docs

equinor · May 10, 2024 · 5445f79 · 5445f79
1 parent af27b61
commit 5445f79
Show file tree

Hide file tree

Showing 4 changed files with 226 additions and 0 deletions.
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
@@ -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": {}
+  }
+]
+```
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
@@ -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
@@ -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": {}
+  }
+]
+```
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
@@ -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"
+              }
+            }
+          }
+        }
+      ]
+    }
+  }
+}