@genesislcap/foundation-entity-management 14.150.1 → 14.151.0

package/dist/custom-elements.json

@@ -89,7 +89,27 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/list/index.ts",
+      "path": "src/components/components.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "loadRemotes"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "loadRemotes",
+          "declaration": {
+            "name": "loadRemotes",
+            "module": "src/components/components.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/index.ts",
       "declarations": [],
       "exports": [
         {
@@ -97,176 +117,206 @@
           "name": "*",
           "declaration": {
             "name": "*",
-            "package": "./list"
+            "package": "./components"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/list/list.styles.ts",
+      "path": "src/entities/entities.styles.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "listStyles",
-          "default": "css`\n  :host {\n    contain: content;\n  }\n\n  :host,\n  fast-router {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    height: 100%;\n  }\n\n  .container {\n    display: flex;\n    flex-direction: column;\n    height: inherit;\n    width: 100%;\n  }\n`"
+          "name": "styles",
+          "default": "css`\n  :host {\n    contain: content;\n  }\n\n  .container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n  }\n\n  foundation-form {\n    height: 100%;\n    overflow-y: auto;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n  }\n\n  .title {\n    margin-left: 1px;\n  }\n\n  :host::part(header) {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n\n  .search-container {\n    display: flex;\n    align-items: center;\n  }\n\n  .search-container zero-search-bar {\n    width: 500px;\n  }\n`",
+          "description": "Defines the css of the entity component as an ElementStyles object"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "listStyles",
+          "name": "styles",
           "declaration": {
-            "name": "listStyles",
-            "module": "src/list/list.styles.ts"
+            "name": "styles",
+            "module": "src/entities/entities.styles.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/list/list.template.ts",
+      "path": "src/entities/entities.template.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "listTemplate",
-          "default": "html<List>`\n  <div class=\"container\">\n    ${when(\n      (x) => x.enableFilterBar,\n      html<List>`\n        <zero-filter-bar\n          resource=${(x) => x.resourceName}\n          only=${(x) => x.columns?.map((colDef) => colDef.field).filter((field) => !!field)}\n          labels=${(x) => x.columns?.map((colDef) => colDef.headerName || '')}\n          target=\"datasource\"\n        ></zero-filter-bar>\n      `,\n    )}\n    <zero-grid-pro\n      ${ref('grid')}\n      auto-cell-renderer-by-type\n      rowSelection=\"single\"\n      rowHeight=\"36\"\n      headerHeight=\"36\"\n      persist-column-state-key=${(x) => x.persistColumnStateKey}\n      ?only-template-col-defs=${(x) => !!x.columns}\n      readOnlyEdit=\"true\"\n      tooltipMouseTrack=\"true\"\n      tooltipShowDelay=\"0\"\n      async-add=${(x) => x.asyncAdd}\n      async-remove=${(x) => x.asyncRemove}\n      async-update=${(x) => x.asyncUpdate}\n      enable-cell-flashing=${(x) => x.enableCellFlashing}\n      enable-row-flashing=${(x) => x.enableRowFlashing}\n      header-case-type=${(x) => x.headerCaseType}\n    >\n      <grid-pro-genesis-datasource\n        ${ref('datasource')}\n        :deferredGridOptions=${(x) => x.gridOptions}\n        criteria=${(x) => x.datasourceConfig?.criteria}\n        fields=${(x) => x.datasourceConfig?.fields}\n        is-snapshot=${(x) => x.datasourceConfig?.isSnapshot}\n        max-rows=${(x) => x.datasourceConfig?.maxRows}\n        max-view=${(x) => x.datasourceConfig?.maxView}\n        moving-view=${(x) => x.datasourceConfig?.movingView}\n        order-by=${(x) => x.datasourceConfig?.orderBy}\n        polling-interval=${(x) => x.datasourceConfig?.pollingInterval}\n        resource-name=${(x) => x.resourceName}\n        reverse=${(x) => x.datasourceConfig?.reverse}\n      ></grid-pro-genesis-datasource>\n      ${repeat(\n        (x) => x.columns,\n        html`\n          <grid-pro-column :definition=${(x) => x}></grid-pro-column>\n        `,\n      )}\n      ${repeat(\n        (x) => x.actionButtonsConfig,\n        html`\n          <grid-pro-column :definition=${(x) => x}></grid-pro-column>\n        `,\n      )}\n    </zero-grid-pro>\n  </div>\n`"
+          "name": "template",
+          "default": "html<EntityManagement>`\n  <div class=\"container\">\n    <slot name=\"header\" part=\"header\">${(x) => x.headerTempalate}</slot>\n    <entity-list\n      title=${(x) => x.title}\n      async-add=${(x) => x.asyncAdd}\n      async-remove=${(x) => x.asyncRemove}\n      async-update=${(x) => x.asyncUpdate}\n      enable-cell-flashing=${(x) => x.enableCellFlashing}\n      enable-row-flashing=${(x) => x.enableRowFlashing}\n      persist-column-state-key=${(x) => x.persistColumnStateKey}\n      size-columns-to-fit=${(x) => x.sizeColumnsToFit}\n      enable-filter-bar=${(x) => x.enableFilterBar}\n      resourceName=${(x) => x.resourceName}\n      :deleteEvent=${(x) => x.deleteEvent}\n      :updateEvent=${(x) => x.updateEvent}\n      :gridOptions=${(x) => x.gridOptions}\n      :columns=${(x) => x.columns}\n      :datasourceConfig=${(x) => x.datasourceConfig}\n      data-test-id=\"entity-list\"\n      hide-edit=${(x) => x.hideEdit}\n      hide-delete=${(x) => x.hideDelete}\n      header-case-type=${(x) => x.headerCaseType}\n    >\n      <slot name=\"header\" slot=\"header\">${defaultHeader}</slot>\n    </entity-list>\n    <zero-modal\n      ${ref('editEntityModal')}\n      position=${(x) => x.modalPosition}\n      :onCloseCallback=${(x) => x.closeModal.bind(x)}\n      data-test-id=\"edit-entity-modal\"\n    >\n      <div slot=\"top\" data-test-id=\"dialog-title\">${(x) => x.editDialogTitle}</div>\n\n      <slot name=\"edit\">\n        ${when(\n          (x) => x.editModalVisible,\n          html<EntityManagement>`\n            <foundation-form\n              part=\"form\"\n              :renderers=${(x) => x.formRenderers}\n              resourceName=${(x) => x.formResourceName}\n              :data=${(x) => x.editedEntity}\n              :uischema=${(x) => x.formUiSchema}\n              readonly=${(x) => x.readonly}\n              @submit-success=${(x, c) => x.submitEntityChanges(c.event as CustomEvent)}\n            ></foundation-form>\n          `,\n        )}\n      </slot>\n    </zero-modal>\n  </div>\n`",
+          "description": "Defines the html of the entity component as a ViewTemplate object"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "listTemplate",
+          "name": "template",
           "declaration": {
-            "name": "listTemplate",
-            "module": "src/list/list.template.ts"
+            "name": "template",
+            "module": "src/entities/entities.template.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/list/list.ts",
+      "path": "src/entities/entities.ts",
       "declarations": [
         {
           "kind": "class",
-          "description": "",
-          "name": "List",
+          "description": "Main class which defines the entity management functionality",
+          "name": "EntityManagement",
           "members": [
             {
               "kind": "field",
-              "name": "resourceName",
+              "name": "connect",
               "type": {
-                "text": "string"
+                "text": "Connect"
               },
-              "default": "''"
+              "privacy": "protected",
+              "description": "DI connect object which is used to interact with the backend."
             },
             {
               "kind": "field",
-              "name": "title",
+              "name": "resourceName",
               "type": {
                 "text": "string"
               },
-              "default": "''"
+              "description": "Name of the backend resource which contain the entities to manage",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "persistColumnStateKey",
+              "name": "readEvent",
               "type": {
                 "text": "string"
               }
             },
             {
               "kind": "field",
-              "name": "sizeColumnsToFit",
+              "name": "readEventFn",
               "type": {
-                "text": "boolean"
+                "text": "(...args) => {}"
               }
             },
             {
               "kind": "field",
-              "name": "enableFilterBar",
+              "name": "readonly",
               "type": {
                 "text": "boolean"
               }
             },
             {
               "kind": "field",
-              "name": "asyncAdd",
+              "name": "updateEvent",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false"
+              "description": "Name of the event handler on the Genesis server which handles updating the entity",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "asyncRemove",
+              "name": "deleteEvent",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false"
+              "description": "Name of the event handler on the Genesis server which handles deleting the entity",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "asyncUpdate",
+              "name": "createEvent",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "true"
+              "description": "Name of the event handler on the Genesis server which handles creating an entity",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "enableCellFlashing",
+              "name": "title",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "default": "false"
+              "description": "Title of the grid",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "enableRowFlashing",
+              "name": "entityLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Label for the entity which has usages such as being shown in the title of the modal wen editing the entity",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "asyncAdd",
               "type": {
                 "text": "boolean"
               },
-              "default": "false"
+              "default": "false",
+              "description": "Whether to use the `applyTransactionAsync` function for *add* transactions",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "hideEdit",
+              "name": "asyncRemove",
               "type": {
                 "text": "boolean"
               },
-              "default": "false"
+              "default": "false",
+              "description": "Whether to use the `applyTransactionAsync` function for *remove* transactions",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "hideDelete",
+              "name": "asyncUpdate",
               "type": {
                 "text": "boolean"
               },
-              "default": "false"
+              "default": "true",
+              "description": "Whether to use the `applyTransactionAsync` function for *update* transactions",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "headerCaseType",
+              "name": "enableCellFlashing",
               "type": {
-                "text": "GridProCaseType"
-              }
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If false, will disable cell flashing for all cells by default, unless otherwise defined in custom colDef",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "grid",
+              "name": "enableRowFlashing",
               "type": {
-                "text": "ZeroGridPro"
+                "text": "boolean"
               },
+              "default": "false",
+              "description": "If true, will enable row flashing for all rows for `add` transactions",
               "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "datasource",
+              "name": "persistColumnStateKey",
               "type": {
-                "text": "GridProGenesisDatasource"
+                "text": "string"
               },
+              "description": "This attribute controls whether and how the entity manager stores the state of the columns when the user edits them. Omit this attribute to disable the functionality, set it to a unique value to enable it.",
               "privacy": "public"
             },
             {
@@ -274,108 +324,281 @@
               "name": "gridOptions",
               "type": {
                 "text": "GridOptions"
-              }
+              },
+              "description": "GridOptions to be passed down from application",
+              "privacy": "public"
             },
             {
               "kind": "field",
               "name": "columns",
               "type": {
                 "text": "ColDef[]"
-              }
+              },
+              "description": "Array which holds the column definitions.",
+              "privacy": "public"
             },
             {
               "kind": "field",
               "name": "datasourceConfig",
               "type": {
                 "text": "DatasourceConfiguration"
-              }
+              },
+              "description": "The configuration which is used when interacting with the resource on the backend",
+              "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "actionButtonsConfig",
+              "name": "formUiSchema",
               "type": {
-                "text": "array"
-              },
-              "default": "[]"
+                "text": "any"
+              }
             },
             {
               "kind": "field",
-              "name": "deleteEvent",
+              "name": "createFormUiSchema",
               "type": {
-                "text": "string"
+                "text": "any"
               }
             },
             {
               "kind": "field",
-              "name": "updateEvent",
+              "name": "updateFormUiSchema",
               "type": {
-                "text": "string"
+                "text": "any"
               }
             },
             {
               "kind": "field",
-              "name": "connect",
+              "name": "formRenderers",
               "type": {
-                "text": "Connect"
+                "text": "RendererEntry[]"
               },
-              "privacy": "protected"
+              "default": "renderers",
+              "description": "Array with renderers used by foundation-forms",
+              "privacy": "public"
             },
             {
-              "kind": "method",
-              "name": "onCellEditingStopped",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "CellEditRequestEvent"
-                  }
-                }
-              ]
+              "kind": "field",
+              "name": "selectedEntity",
+              "type": {
+                "text": "any"
+              },
+              "description": "Reference to the currently selected entity from the grid.",
+              "privacy": "public"
             },
             {
-              "kind": "method",
-              "name": "handleFilterChanged",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "e"
-                }
-              ]
+              "kind": "field",
+              "name": "editedEntity",
+              "type": {
+                "text": "any"
+              },
+              "description": "Disables the form while enabled to stop the user dispatching a large number of duplicate events",
+              "privacy": "public"
             },
             {
-              "kind": "method",
-              "name": "handleFilterCleared",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "e"
-                }
-              ]
+              "kind": "field",
+              "name": "submitting",
+              "type": {
+                "text": "boolean"
+              }
             },
             {
-              "kind": "method",
-              "name": "select",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "e"
-                }
-              ]
+              "kind": "field",
+              "name": "defaultEntityValues",
+              "type": {
+                "text": "any"
+              }
             },
             {
               "kind": "field",
-              "name": "edit",
-              "privacy": "private"
+              "name": "editDialogTitle",
+              "type": {
+                "text": "string"
+              },
+              "description": "String which contains the text of the popup modal when the user is adding or editing an entity"
             },
             {
-              "kind": "method",
-              "name": "delete",
-              "parameters": [
+              "kind": "field",
+              "name": "editModalVisible",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "kind": "method",
+              "name": "editModalVisibleChanged"
+            },
+            {
+              "kind": "field",
+              "name": "editEntityModal",
+              "type": {
+                "text": "any"
+              },
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "sizeColumnsToFit",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "enableFilterBar",
+              "type": {
+                "text": "boolean"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "hideEdit",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "hideDelete",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "kind": "field",
+              "name": "enableSearchBar",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "This attribute controls whether to enable the search-bar.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "headerCaseType",
+              "type": {
+                "text": "GridProCaseType"
+              },
+              "description": "The case type to use for the header names. If not set, the default CONSTANT_CASE will be used.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "searchBarConfig",
+              "type": {
+                "text": "AvailableOption[]"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "modalPosition",
+              "type": {
+                "text": "'centre' | 'left' | 'right'"
+              },
+              "default": "'right'",
+              "description": "Determines where the modal dialog will appear on screen",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "deepClone",
+              "return": {
+                "type": {
+                  "text": "Node"
+                }
+              },
+              "description": "Override the deepClone method to ensure that observable attributes are cloned",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "submitEntityChanges",
+              "privacy": "public",
+              "parameters": [
                 {
-                  "name": "e"
+                  "name": "e",
+                  "type": {
+                    "text": "CustomEvent"
+                  },
+                  "description": "CustomEvent which contains the payload for the entity to submit to the backend\n\nEmits an event upon error"
+                }
+              ],
+              "description": "Event handler for when the user submits the action for the currently open form, either editing or adding the entity"
+            },
+            {
+              "kind": "method",
+              "name": "readEntity",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "CustomEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "closeModal",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "headerTempalate",
+              "readonly": true
+            },
+            {
+              "kind": "method",
+              "name": "searchChanged",
+              "privacy": "public",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "CustomEvent<Array<SelectedOption>>"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "criteriaChanged",
+              "privacy": "public",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "CustomEvent<string>"
+                  }
                 }
               ]
+            },
+            {
+              "kind": "method",
+              "name": "submitFailureNotification",
+              "privacy": "public",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "CustomEvent"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "confirmDelete"
+            },
+            {
+              "kind": "method",
+              "name": "showDeleteConfirmation",
+              "privacy": "private"
             }
           ],
           "attributes": [
@@ -384,37 +607,62 @@
               "type": {
                 "text": "string"
               },
-              "default": "''",
+              "description": "Name of the backend resource which contain the entities to manage",
               "fieldName": "resourceName"
             },
             {
-              "name": "title",
+              "name": "readEvent",
               "type": {
                 "text": "string"
               },
-              "default": "''",
-              "fieldName": "title"
+              "fieldName": "readEvent"
             },
             {
-              "name": "persist-column-state-key",
+              "type": {
+                "text": "boolean"
+              },
+              "fieldName": "readonly"
+            },
+            {
+              "name": "updateEvent",
               "type": {
                 "text": "string"
               },
-              "fieldName": "persistColumnStateKey"
+              "description": "Name of the event handler on the Genesis server which handles updating the entity",
+              "fieldName": "updateEvent"
             },
             {
-              "name": "size-columns-to-fit",
+              "name": "deleteEvent",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "fieldName": "sizeColumnsToFit"
+              "description": "Name of the event handler on the Genesis server which handles deleting the entity",
+              "fieldName": "deleteEvent"
             },
             {
-              "name": "enable-filter-bar",
+              "name": "createEvent",
               "type": {
-                "text": "boolean"
+                "text": "string"
               },
-              "fieldName": "enableFilterBar"
+              "description": "Name of the event handler on the Genesis server which handles creating an entity",
+              "fieldName": "createEvent"
+            },
+            {
+              "name": "title",
+              "type": {
+                "text": "string"
+              },
+              "description": "Title of the grid",
+              "fieldName": "title"
+            },
+            {
+              "name": "entityLabel",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "Label for the entity which has usages such as being shown in the title of the modal wen editing the entity",
+              "fieldName": "entityLabel"
             },
             {
               "name": "async-add",
@@ -422,6 +670,7 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "Whether to use the `applyTransactionAsync` function for *add* transactions",
               "fieldName": "asyncAdd"
             },
             {
@@ -430,6 +679,7 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "Whether to use the `applyTransactionAsync` function for *remove* transactions",
               "fieldName": "asyncRemove"
             },
             {
@@ -438,6 +688,7 @@
                 "text": "boolean"
               },
               "default": "true",
+              "description": "Whether to use the `applyTransactionAsync` function for *update* transactions",
               "fieldName": "asyncUpdate"
             },
             {
@@ -446,6 +697,7 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "If false, will disable cell flashing for all cells by default, unless otherwise defined in custom colDef",
               "fieldName": "enableCellFlashing"
             },
             {
@@ -454,8 +706,31 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "If true, will enable row flashing for all rows for `add` transactions",
               "fieldName": "enableRowFlashing"
             },
+            {
+              "name": "persist-column-state-key",
+              "type": {
+                "text": "string"
+              },
+              "description": "This attribute controls whether and how the entity manager stores the state of the columns when the user edits them. Omit this attribute to disable the functionality, set it to a unique value to enable it.",
+              "fieldName": "persistColumnStateKey"
+            },
+            {
+              "name": "size-columns-to-fit",
+              "type": {
+                "text": "boolean"
+              },
+              "fieldName": "sizeColumnsToFit"
+            },
+            {
+              "name": "enable-filter-bar",
+              "type": {
+                "text": "boolean"
+              },
+              "fieldName": "enableFilterBar"
+            },
             {
               "name": "hide-edit",
               "type": {
@@ -472,178 +747,199 @@
               "default": "false",
               "fieldName": "hideDelete"
             },
+            {
+              "name": "enable-search-bar",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "This attribute controls whether to enable the search-bar.",
+              "fieldName": "enableSearchBar"
+            },
             {
               "name": "header-case-type",
               "type": {
                 "text": "GridProCaseType"
               },
+              "description": "The case type to use for the header names. If not set, the default CONSTANT_CASE will be used.",
               "fieldName": "headerCaseType"
+            },
+            {
+              "name": "modal-position",
+              "type": {
+                "text": "'centre' | 'left' | 'right'"
+              },
+              "default": "'right'",
+              "description": "Determines where the modal dialog will appear on screen",
+              "fieldName": "modalPosition"
+            }
+          ],
+          "mixins": [
+            {
+              "name": "LifecycleMixin",
+              "package": "@genesislcap/foundation-utils"
             }
           ],
           "superclass": {
             "name": "FASTElement",
             "package": "@microsoft/fast-element"
           },
-          "tagName": "entity-list",
+          "tagName": "entity-management",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "List",
+          "name": "EntityManagement",
           "declaration": {
-            "name": "List",
-            "module": "src/list/list.ts"
+            "name": "EntityManagement",
+            "module": "src/entities/entities.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "entity-list",
+          "name": "entity-management",
           "declaration": {
-            "name": "List",
-            "module": "src/list/list.ts"
+            "name": "EntityManagement",
+            "module": "src/entities/entities.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/entities/entities.styles.ts",
-      "declarations": [
+      "path": "src/entities/index.ts",
+      "declarations": [],
+      "exports": [
         {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css`\n  :host {\n    contain: content;\n  }\n\n  .container {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n  }\n\n  foundation-form {\n    height: 100%;\n    overflow-y: auto;\n    display: flex;\n    flex-direction: column;\n    justify-content: space-between;\n  }\n\n  .title {\n    margin-left: 1px;\n  }\n\n  :host::part(header) {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n  }\n\n  .search-container {\n    display: flex;\n    align-items: center;\n  }\n\n  .search-container zero-search-bar {\n    width: 500px;\n  }\n`",
-          "description": "Defines the css of the entity component as an ElementStyles object"
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./entities"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./entities.template"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "package": "./entities.styles"
+          }
         }
-      ],
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/list/index.ts",
+      "declarations": [],
       "exports": [
         {
           "kind": "js",
-          "name": "styles",
+          "name": "*",
           "declaration": {
-            "name": "styles",
-            "module": "src/entities/entities.styles.ts"
+            "name": "*",
+            "package": "./list"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/entities/entities.template.ts",
+      "path": "src/list/list.styles.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "template",
-          "default": "html<EntityManagement>`\n  <div class=\"container\">\n    <slot name=\"header\" part=\"header\">${(x) => x.headerTempalate}</slot>\n    <entity-list\n      title=${(x) => x.title}\n      async-add=${(x) => x.asyncAdd}\n      async-remove=${(x) => x.asyncRemove}\n      async-update=${(x) => x.asyncUpdate}\n      enable-cell-flashing=${(x) => x.enableCellFlashing}\n      enable-row-flashing=${(x) => x.enableRowFlashing}\n      persist-column-state-key=${(x) => x.persistColumnStateKey}\n      size-columns-to-fit=${(x) => x.sizeColumnsToFit}\n      enable-filter-bar=${(x) => x.enableFilterBar}\n      resourceName=${(x) => x.resourceName}\n      :deleteEvent=${(x) => x.deleteEvent}\n      :updateEvent=${(x) => x.updateEvent}\n      :gridOptions=${(x) => x.gridOptions}\n      :columns=${(x) => x.columns}\n      :datasourceConfig=${(x) => x.datasourceConfig}\n      data-test-id=\"entity-list\"\n      hide-edit=${(x) => x.hideEdit}\n      hide-delete=${(x) => x.hideDelete}\n      header-case-type=${(x) => x.headerCaseType}\n    >\n      <slot name=\"header\" slot=\"header\">${defaultHeader}</slot>\n    </entity-list>\n    <zero-modal\n      ${ref('editEntityModal')}\n      position=${(x) => x.modalPosition}\n      :onCloseCallback=${(x) => x.closeModal.bind(x)}\n      data-test-id=\"edit-entity-modal\"\n    >\n      <div slot=\"top\" data-test-id=\"dialog-title\">${(x) => x.editDialogTitle}</div>\n\n      <slot name=\"edit\">\n        ${when(\n          (x) => x.editModalVisible,\n          html<EntityManagement>`\n            <foundation-form\n              part=\"form\"\n              :renderers=${(x) => x.formRenderers}\n              resourceName=${(x) => x.formResourceName}\n              :data=${(x) => x.editedEntity}\n              :uischema=${(x) => x.formUiSchema}\n              readonly=${(x) => x.readonly}\n              @submit-success=${(x, c) => x.submitEntityChanges(c.event as CustomEvent)}\n            ></foundation-form>\n          `,\n        )}\n      </slot>\n    </zero-modal>\n  </div>\n`",
-          "description": "Defines the html of the entity component as a ViewTemplate object"
+          "name": "listStyles",
+          "default": "css`\n  :host {\n    contain: content;\n  }\n\n  :host,\n  fast-router {\n    display: flex;\n    flex-direction: column;\n    width: 100%;\n    height: 100%;\n  }\n\n  .container {\n    display: flex;\n    flex-direction: column;\n    height: inherit;\n    width: 100%;\n  }\n`"
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "template",
+          "name": "listStyles",
           "declaration": {
-            "name": "template",
-            "module": "src/entities/entities.template.ts"
+            "name": "listStyles",
+            "module": "src/list/list.styles.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/entities/entities.ts",
+      "path": "src/list/list.template.ts",
       "declarations": [
         {
-          "kind": "class",
-          "description": "Main class which defines the entity management functionality",
-          "name": "EntityManagement",
-          "members": [
-            {
-              "kind": "field",
-              "name": "connect",
-              "type": {
-                "text": "Connect"
-              },
-              "privacy": "protected",
-              "description": "DI connect object which is used to interact with the backend."
-            },
-            {
-              "kind": "field",
-              "name": "resourceName",
-              "type": {
-                "text": "string"
-              },
-              "description": "Name of the backend resource which contain the entities to manage",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "readEvent",
-              "type": {
-                "text": "string"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "readEventFn",
-              "type": {
-                "text": "(...args) => {}"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "readonly",
-              "type": {
-                "text": "boolean"
-              }
-            },
+          "kind": "variable",
+          "name": "listTemplate",
+          "default": "html<List>`\n  <div class=\"container\">\n    ${when(\n      (x) => x.enableFilterBar,\n      html<List>`\n        <zero-filter-bar\n          resource=${(x) => x.resourceName}\n          only=${(x) => x.columns?.map((colDef) => colDef.field).filter((field) => !!field)}\n          labels=${(x) => x.columns?.map((colDef) => colDef.headerName || '')}\n          target=\"datasource\"\n        ></zero-filter-bar>\n      `,\n    )}\n    <zero-grid-pro\n      ${ref('grid')}\n      auto-cell-renderer-by-type\n      rowSelection=\"single\"\n      rowHeight=\"36\"\n      headerHeight=\"36\"\n      persist-column-state-key=${(x) => x.persistColumnStateKey}\n      ?only-template-col-defs=${(x) => !!x.columns}\n      readOnlyEdit=\"true\"\n      tooltipMouseTrack=\"true\"\n      tooltipShowDelay=\"0\"\n      async-add=${(x) => x.asyncAdd}\n      async-remove=${(x) => x.asyncRemove}\n      async-update=${(x) => x.asyncUpdate}\n      enable-cell-flashing=${(x) => x.enableCellFlashing}\n      enable-row-flashing=${(x) => x.enableRowFlashing}\n      header-case-type=${(x) => x.headerCaseType}\n    >\n      <grid-pro-genesis-datasource\n        ${ref('datasource')}\n        :deferredGridOptions=${(x) => x.gridOptions}\n        criteria=${(x) => x.datasourceConfig?.criteria}\n        fields=${(x) => x.datasourceConfig?.fields}\n        is-snapshot=${(x) => x.datasourceConfig?.isSnapshot}\n        max-rows=${(x) => x.datasourceConfig?.maxRows}\n        max-view=${(x) => x.datasourceConfig?.maxView}\n        moving-view=${(x) => x.datasourceConfig?.movingView}\n        order-by=${(x) => x.datasourceConfig?.orderBy}\n        polling-interval=${(x) => x.datasourceConfig?.pollingInterval}\n        resource-name=${(x) => x.resourceName}\n        reverse=${(x) => x.datasourceConfig?.reverse}\n      ></grid-pro-genesis-datasource>\n      ${repeat(\n        (x) => x.columns,\n        html`\n          <grid-pro-column :definition=${(x) => x}></grid-pro-column>\n        `,\n      )}\n      ${repeat(\n        (x) => x.actionButtonsConfig,\n        html`\n          <grid-pro-column :definition=${(x) => x}></grid-pro-column>\n        `,\n      )}\n    </zero-grid-pro>\n  </div>\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "listTemplate",
+          "declaration": {
+            "name": "listTemplate",
+            "module": "src/list/list.template.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/list/list.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "List",
+          "members": [
             {
               "kind": "field",
-              "name": "updateEvent",
+              "name": "resourceName",
               "type": {
                 "text": "string"
               },
-              "description": "Name of the event handler on the Genesis server which handles updating the entity",
-              "privacy": "public"
+              "default": "''"
             },
             {
               "kind": "field",
-              "name": "deleteEvent",
+              "name": "title",
               "type": {
                 "text": "string"
               },
-              "description": "Name of the event handler on the Genesis server which handles deleting the entity",
-              "privacy": "public"
+              "default": "''"
             },
             {
               "kind": "field",
-              "name": "createEvent",
+              "name": "persistColumnStateKey",
               "type": {
                 "text": "string"
-              },
-              "description": "Name of the event handler on the Genesis server which handles creating an entity",
-              "privacy": "public"
+              }
             },
             {
               "kind": "field",
-              "name": "title",
+              "name": "sizeColumnsToFit",
               "type": {
-                "text": "string"
-              },
-              "description": "Title of the grid",
-              "privacy": "public"
+                "text": "boolean"
+              }
             },
             {
               "kind": "field",
-              "name": "entityLabel",
+              "name": "enableFilterBar",
               "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "Label for the entity which has usages such as being shown in the title of the modal wen editing the entity",
-              "privacy": "public"
+                "text": "boolean"
+              }
             },
             {
               "kind": "field",
@@ -651,9 +947,7 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "Whether to use the `applyTransactionAsync` function for *add* transactions",
-              "privacy": "public"
+              "default": "false"
             },
             {
               "kind": "field",
@@ -661,9 +955,7 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "Whether to use the `applyTransactionAsync` function for *remove* transactions",
-              "privacy": "public"
+              "default": "false"
             },
             {
               "kind": "field",
@@ -671,9 +963,7 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "true",
-              "description": "Whether to use the `applyTransactionAsync` function for *update* transactions",
-              "privacy": "public"
+              "default": "true"
             },
             {
               "kind": "field",
@@ -681,9 +971,7 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "If false, will disable cell flashing for all cells by default, unless otherwise defined in custom colDef",
-              "privacy": "public"
+              "default": "false"
             },
             {
               "kind": "field",
@@ -691,297 +979,154 @@
               "type": {
                 "text": "boolean"
               },
-              "default": "false",
-              "description": "If true, will enable row flashing for all rows for `add` transactions",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "persistColumnStateKey",
-              "type": {
-                "text": "string"
-              },
-              "description": "This attribute controls whether and how the entity manager stores the state of the columns when the user edits them. Omit this attribute to disable the functionality, set it to a unique value to enable it.",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "gridOptions",
-              "type": {
-                "text": "GridOptions"
-              },
-              "description": "GridOptions to be passed down from application",
-              "privacy": "public"
+              "default": "false"
             },
             {
               "kind": "field",
-              "name": "columns",
+              "name": "hideEdit",
               "type": {
-                "text": "ColDef[]"
+                "text": "boolean"
               },
-              "description": "Array which holds the column definitions.",
-              "privacy": "public"
+              "default": "false"
             },
             {
               "kind": "field",
-              "name": "datasourceConfig",
+              "name": "hideDelete",
               "type": {
-                "text": "DatasourceConfiguration"
+                "text": "boolean"
               },
-              "description": "The configuration which is used when interacting with the resource on the backend",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "formUiSchema",
-              "type": {
-                "text": "any"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "createFormUiSchema",
-              "type": {
-                "text": "any"
-              }
+              "default": "false"
             },
             {
               "kind": "field",
-              "name": "updateFormUiSchema",
+              "name": "headerCaseType",
               "type": {
-                "text": "any"
+                "text": "GridProCaseType"
               }
             },
             {
               "kind": "field",
-              "name": "formRenderers",
-              "type": {
-                "text": "RendererEntry[]"
-              },
-              "default": "renderers",
-              "description": "Array with renderers used by foundation-forms",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "selectedEntity",
+              "name": "grid",
               "type": {
-                "text": "any"
+                "text": "ZeroGridPro"
               },
-              "description": "Reference to the currently selected entity from the grid.",
               "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "editedEntity",
+              "name": "datasource",
               "type": {
-                "text": "any"
+                "text": "GridProGenesisDatasource"
               },
-              "description": "Disables the form while enabled to stop the user dispatching a large number of duplicate events",
               "privacy": "public"
             },
             {
               "kind": "field",
-              "name": "submitting",
-              "type": {
-                "text": "boolean"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "defaultEntityValues",
+              "name": "gridOptions",
               "type": {
-                "text": "any"
+                "text": "GridOptions"
               }
             },
             {
               "kind": "field",
-              "name": "editDialogTitle",
-              "type": {
-                "text": "string"
-              },
-              "description": "String which contains the text of the popup modal when the user is adding or editing an entity"
-            },
-            {
-              "kind": "field",
-              "name": "editModalVisible",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "kind": "method",
-              "name": "editModalVisibleChanged"
-            },
-            {
-              "kind": "field",
-              "name": "editEntityModal",
-              "type": {
-                "text": "any"
-              },
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "sizeColumnsToFit",
+              "name": "columns",
               "type": {
-                "text": "boolean"
+                "text": "ColDef[]"
               }
             },
             {
               "kind": "field",
-              "name": "enableFilterBar",
+              "name": "datasourceConfig",
               "type": {
-                "text": "boolean"
+                "text": "DatasourceConfiguration"
               }
             },
             {
               "kind": "field",
-              "name": "hideEdit",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "kind": "field",
-              "name": "hideDelete",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            },
-            {
-              "kind": "field",
-              "name": "enableSearchBar",
+              "name": "actionButtonsConfig",
               "type": {
-                "text": "boolean"
+                "text": "array"
               },
-              "default": "false"
+              "default": "[]"
             },
             {
               "kind": "field",
-              "name": "headerCaseType",
+              "name": "deleteEvent",
               "type": {
-                "text": "GridProCaseType"
-              },
-              "description": "The case type to use for the header names. If not set, the default CONSTANT_CASE will be used.",
-              "privacy": "public"
+                "text": "string"
+              }
             },
             {
               "kind": "field",
-              "name": "searchBarConfig",
+              "name": "updateEvent",
               "type": {
-                "text": "AvailableOption[]"
+                "text": "string"
               }
             },
             {
               "kind": "field",
-              "name": "modalPosition",
+              "name": "connect",
               "type": {
-                "text": "'centre' | 'left' | 'right'"
-              },
-              "default": "'right'",
-              "description": "Determines where the modal dialog will appear on screen",
-              "privacy": "public"
-            },
-            {
-              "kind": "method",
-              "name": "deepClone",
-              "return": {
-                "type": {
-                  "text": "Node"
-                }
-              },
-              "description": "Override the deepClone method to ensure that observable attributes are cloned",
-              "privacy": "public"
-            },
-            {
-              "kind": "method",
-              "name": "submitEntityChanges",
-              "privacy": "public",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "CustomEvent"
-                  },
-                  "description": "CustomEvent which contains the payload for the entity to submit to the backend\n\nEmits an event upon error"
-                }
-              ],
-              "description": "Event handler for when the user submits the action for the currently open form, either editing or adding the entity"
+                "text": "Connect"
+              },
+              "privacy": "protected"
             },
             {
               "kind": "method",
-              "name": "readEntity",
+              "name": "onCellEditingStopped",
               "privacy": "private",
               "parameters": [
                 {
-                  "name": "e",
+                  "name": "event",
                   "type": {
-                    "text": "CustomEvent"
+                    "text": "CellEditRequestEvent"
                   }
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "closeModal",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "headerTempalate",
-              "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "searchChanged",
-              "privacy": "public",
+              "name": "handleFilterChanged",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "event",
-                  "type": {
-                    "text": "CustomEvent<Array<SelectedOption>>"
-                  }
+                  "name": "e"
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "criteriaChanged",
-              "privacy": "public",
+              "name": "handleFilterCleared",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "e",
-                  "type": {
-                    "text": "CustomEvent<string>"
-                  }
+                  "name": "e"
                 }
               ]
             },
             {
               "kind": "method",
-              "name": "submitFailureNotification",
-              "privacy": "public",
+              "name": "select",
+              "privacy": "private",
               "parameters": [
                 {
-                  "name": "e",
-                  "type": {
-                    "text": "CustomEvent"
-                  }
+                  "name": "e"
                 }
               ]
             },
             {
-              "kind": "method",
-              "name": "confirmDelete"
+              "kind": "field",
+              "name": "edit",
+              "privacy": "private"
             },
             {
               "kind": "method",
-              "name": "showDeleteConfirmation",
-              "privacy": "private"
+              "name": "delete",
+              "parameters": [
+                {
+                  "name": "e"
+                }
+              ]
             }
           ],
           "attributes": [
@@ -990,62 +1135,37 @@
               "type": {
                 "text": "string"
               },
-              "description": "Name of the backend resource which contain the entities to manage",
+              "default": "''",
               "fieldName": "resourceName"
             },
             {
-              "name": "readEvent",
-              "type": {
-                "text": "string"
-              },
-              "fieldName": "readEvent"
-            },
-            {
-              "type": {
-                "text": "boolean"
-              },
-              "fieldName": "readonly"
-            },
-            {
-              "name": "updateEvent",
-              "type": {
-                "text": "string"
-              },
-              "description": "Name of the event handler on the Genesis server which handles updating the entity",
-              "fieldName": "updateEvent"
-            },
-            {
-              "name": "deleteEvent",
+              "name": "title",
               "type": {
                 "text": "string"
               },
-              "description": "Name of the event handler on the Genesis server which handles deleting the entity",
-              "fieldName": "deleteEvent"
+              "default": "''",
+              "fieldName": "title"
             },
             {
-              "name": "createEvent",
+              "name": "persist-column-state-key",
               "type": {
                 "text": "string"
               },
-              "description": "Name of the event handler on the Genesis server which handles creating an entity",
-              "fieldName": "createEvent"
+              "fieldName": "persistColumnStateKey"
             },
             {
-              "name": "title",
+              "name": "size-columns-to-fit",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "description": "Title of the grid",
-              "fieldName": "title"
+              "fieldName": "sizeColumnsToFit"
             },
             {
-              "name": "entityLabel",
+              "name": "enable-filter-bar",
               "type": {
-                "text": "string"
+                "text": "boolean"
               },
-              "default": "''",
-              "description": "Label for the entity which has usages such as being shown in the title of the modal wen editing the entity",
-              "fieldName": "entityLabel"
+              "fieldName": "enableFilterBar"
             },
             {
               "name": "async-add",
@@ -1053,7 +1173,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Whether to use the `applyTransactionAsync` function for *add* transactions",
               "fieldName": "asyncAdd"
             },
             {
@@ -1062,7 +1181,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Whether to use the `applyTransactionAsync` function for *remove* transactions",
               "fieldName": "asyncRemove"
             },
             {
@@ -1071,7 +1189,6 @@
                 "text": "boolean"
               },
               "default": "true",
-              "description": "Whether to use the `applyTransactionAsync` function for *update* transactions",
               "fieldName": "asyncUpdate"
             },
             {
@@ -1080,7 +1197,6 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If false, will disable cell flashing for all cells by default, unless otherwise defined in custom colDef",
               "fieldName": "enableCellFlashing"
             },
             {
@@ -1089,31 +1205,8 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "If true, will enable row flashing for all rows for `add` transactions",
               "fieldName": "enableRowFlashing"
             },
-            {
-              "name": "persist-column-state-key",
-              "type": {
-                "text": "string"
-              },
-              "description": "This attribute controls whether and how the entity manager stores the state of the columns when the user edits them. Omit this attribute to disable the functionality, set it to a unique value to enable it.",
-              "fieldName": "persistColumnStateKey"
-            },
-            {
-              "name": "size-columns-to-fit",
-              "type": {
-                "text": "boolean"
-              },
-              "fieldName": "sizeColumnsToFit"
-            },
-            {
-              "name": "enable-filter-bar",
-              "type": {
-                "text": "boolean"
-              },
-              "fieldName": "enableFilterBar"
-            },
             {
               "name": "hide-edit",
               "type": {
@@ -1130,127 +1223,37 @@
               "default": "false",
               "fieldName": "hideDelete"
             },
-            {
-              "name": "enable-search-bar",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "enableSearchBar"
-            },
             {
               "name": "header-case-type",
               "type": {
                 "text": "GridProCaseType"
               },
-              "description": "The case type to use for the header names. If not set, the default CONSTANT_CASE will be used.",
               "fieldName": "headerCaseType"
-            },
-            {
-              "name": "modal-position",
-              "type": {
-                "text": "'centre' | 'left' | 'right'"
-              },
-              "default": "'right'",
-              "description": "Determines where the modal dialog will appear on screen",
-              "fieldName": "modalPosition"
-            }
-          ],
-          "mixins": [
-            {
-              "name": "LifecycleMixin",
-              "package": "@genesislcap/foundation-utils"
             }
           ],
           "superclass": {
             "name": "FASTElement",
             "package": "@microsoft/fast-element"
           },
-          "tagName": "entity-management",
+          "tagName": "entity-list",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "EntityManagement",
+          "name": "List",
           "declaration": {
-            "name": "EntityManagement",
-            "module": "src/entities/entities.ts"
+            "name": "List",
+            "module": "src/list/list.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "entity-management",
-          "declaration": {
-            "name": "EntityManagement",
-            "module": "src/entities/entities.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/entities/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./entities"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./entities.template"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "*",
-          "declaration": {
-            "name": "*",
-            "package": "./entities.styles"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/components.ts",
-      "declarations": [
-        {
-          "kind": "function",
-          "name": "loadRemotes"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "loadRemotes",
-          "declaration": {
-            "name": "loadRemotes",
-            "module": "src/components/components.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/components/index.ts",
-      "declarations": [],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "*",
+          "name": "entity-list",
           "declaration": {
-            "name": "*",
-            "package": "./components"
+            "name": "List",
+            "module": "src/list/list.ts"
           }
         }
       ]
@@ -1952,6 +1955,8 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "This attribute controls whether to enable the search-bar.",
+              "privacy": "public",
               "inheritedFrom": {
                 "name": "EntityManagement",
                 "module": "src/entities/entities.ts"
@@ -2355,6 +2360,7 @@
                 "text": "boolean"
               },
               "default": "false",
+              "description": "This attribute controls whether to enable the search-bar.",
               "fieldName": "enableSearchBar",
               "inheritedFrom": {
                 "name": "EntityManagement",
@@ -2439,7 +2445,7 @@
           "type": {
             "text": "ViewTemplate"
           },
-          "default": "html<Users>`\n  <entity-management\n    resourceName=${(x) => x.resourceName}\n    title=\"User Management\"\n    :gridOptions=${(x) => x.gridOptions}\n    entityLabel=\"User\"\n    createEvent=\"${(x) => x.createEvent}\"\n    :readEventFn=${(x) => (user) => x.readUserData(user)}\n    updateEvent=\"${(x) => x.updateEvent}\"\n    deleteEvent=\"${(x) => x.deleteEvent}\"\n    entityLabel=\"User Details\"\n    :updateFormUiSchema=${(x) =>\n      editUserSchema(\n        true,\n        x.allAccessType,\n        x.entityID,\n        x.entityLabel,\n        x.entityLabelKey,\n        x.availableEntitiesEndpoint,\n        x.additionalUpdateFields,\n      )}\n    :createFormUiSchema=${(x) =>\n      editUserSchema(\n        false,\n        x.allAccessType,\n        x.entityID,\n        x.entityLabel,\n        x.entityLabelKey,\n        x.availableEntitiesEndpoint,\n        x.additionalCreateFields,\n      )}\n    persist-column-state-key=${(x) => x.persistColumnStateKey}\n    size-columns-to-fit\n    :columns=${(x) => [...x.columns, ...x.entityColumn(), x.statusColumn()]}\n    :datasourceConfig=${(x) => x.datasourceConfig}\n  ></entity-management>\n`"
+          "default": "html<Users>`\n  <entity-management\n    resourceName=${(x) => x.resourceName}\n    title=\"User Management\"\n    :gridOptions=${(x) => x.gridOptions}\n    createEvent=\"${(x) => x.createEvent}\"\n    :readEventFn=${(x) => (user) => x.readUserData(user)}\n    updateEvent=\"${(x) => x.updateEvent}\"\n    deleteEvent=\"${(x) => x.deleteEvent}\"\n    entityLabel=\"User Details\"\n    enable-search-bar=\"${(x) => x.enableSearchBar}\"\n    :updateFormUiSchema=${(x) =>\n      editUserSchema(\n        true,\n        x.allAccessType,\n        x.entityID,\n        x.entityLabel,\n        x.entityLabelKey,\n        x.availableEntitiesEndpoint,\n        x.additionalUpdateFields,\n      )}\n    :createFormUiSchema=${(x) =>\n      editUserSchema(\n        false,\n        x.allAccessType,\n        x.entityID,\n        x.entityLabel,\n        x.entityLabelKey,\n        x.availableEntitiesEndpoint,\n        x.additionalCreateFields,\n      )}\n    persist-column-state-key=${(x) => x.persistColumnStateKey}\n    size-columns-to-fit\n    :columns=${(x) => [...x.columns, ...x.entityColumn(), x.statusColumn()]}\n    :datasourceConfig=${(x) => x.datasourceConfig}\n  ></entity-management>\n`"
         }
       ],
       "exports": [
@@ -2482,6 +2488,16 @@
               "description": "This attribute controls whether and how the user manager stores the state of the columns when the user edits them. Defaulted to `entity_users_management`.",
               "privacy": "public"
             },
+            {
+              "kind": "field",
+              "name": "enableSearchBar",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "This attribute controls whether to enable the search-bar.",
+              "privacy": "public"
+            },
             {
               "kind": "field",
               "name": "gridOptions",
@@ -2574,6 +2590,15 @@
               "default": "'entity_users_management'",
               "description": "This attribute controls whether and how the user manager stores the state of the columns when the user edits them. Defaulted to `entity_users_management`.",
               "fieldName": "persistColumnStateKey"
+            },
+            {
+              "name": "enable-search-bar",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "This attribute controls whether to enable the search-bar.",
+              "fieldName": "enableSearchBar"
             }
           ],
           "mixins": [