> For the complete documentation index, see [llms.txt](https://docs.gridmate.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.gridmate.io/package-reference/components-library/gm-user-grid.md).

# GM - User Grid

## **Documentation**

GridMate's User Grid component presents a powerful solution, providing users with customizable grids packed with robust features:

* Efficient data filtering and sorting,
* Record grouping,
* Layout customization,
* Actions on multiple records,
* Formula field creation,
* Inline Editing
* Import/Export
* Dynamic Interactions
* ...and much more

This tool optimizes data management and productivity, empowering users to efficiently organize and manipulate their Standard/Custom Object data through easy configuration.

**Use case:** Display a grid of opportunities to maintain easily the pipeline for a Salesman. see [GM - User Grid](/product-tour/user-grid.md).

## **Specification**

<table data-full-width="true"><thead><tr><th width="175.33333333333331">Property</th><th width="162">Type</th><th>Description</th></tr></thead><tbody><tr><td>recordId</td><td>String</td><td>recordId to use. Keep this empty if you want to use the current record</td></tr><tr><td>UserGrid Id*</td><td>String</td><td>Id of the User Grid to use.</td></tr><tr><td>Inline Label</td><td>String</td><td>Inline label. Override the label instead of using the label of the user grid.</td></tr><tr><td>Inline Filter</td><td>String</td><td><p>Json string to define inline filter criteria. This filter will be added on the top of what is defined on the grid.</p><p></p><p>See <a href="/pages/-MEstkhme84gnGFcsCxP">GM - RelatedList Grid</a> <strong>Filter</strong> property for more details.  </p></td></tr><tr><td>height</td><td>String</td><td>Set the grid height.</td></tr><tr><td>Grid Height</td><td>Integer</td><td><p>Set the grid height. Set this property if you want to control the height and show up components after the grid. </p><p>The user has to scroll vertically to see more records.</p><p></p><p> If the value is set 9999, The grid will use the remaining space on the page even if the user resizes the window. This behavior is relevant to build a responsive app page.</p></td></tr><tr><td>Split Width</td><td>Integer</td><td>Set the split view width. Applicable only the split view is enabled</td></tr><tr><td>Density</td><td>String</td><td>Grid density : <strong>comfy</strong> | <strong>compact</strong>. Currently the density is applied only to the toolbar. The compact layout is more for inline Grids.</td></tr><tr><td>Disable Refresh View</td><td>String</td><td>Check this option if you want to disable the view refresh after an update.</td></tr><tr><td>Enable Dynamic Interactions(Beta)</td><td>String</td><td>Check this option if you want to enable dynamic interactions.</td></tr><tr><td>Enable Toggle Fullscreen</td><td>String</td><td>Check this option if you want to enable toggle fullscreen.</td></tr><tr><td>Disable Navigation</td><td>String</td><td>Hide the navigation to the grid.</td></tr><tr><td>Auto Select 1st Row</td><td>Boolean</td><td>Check this option if you want to select the first row automatically. Applicable only if dynamic interaction or split view is enabled</td></tr></tbody></table>

## **API Reference**

{% tabs fullWidth="true" %}
{% tab title="UserDataGridComponent.design" %}

```xml
<design:component label="GM - User Grid">
    <design:attribute name="recordId" label="recordId" 
                      description="recordId to use. Keep this empty if you want to use the current record"/>                                                         

    <design:attribute name="userGridId" label="UserGrid Id or Developer Name" 
                      description="GM - UserGrid Id or Developer Name to use"/>   

    <design:attribute name="displayLabel" label="Inline Label" 
                      description="Inline label. Override the label instead of using the label of the user grid"/>        

    <design:attribute name="adminFilter" label="Inline Filter" 
                      description="Json string to define inline filter criteria"/>        
    
    <design:attribute name="height" label="Grid Height" 
                      description="Set the grid height"/>                            

    <design:attribute name="density" label="Density" 
                      description="Grid density : comfy | compact"/>  
    
    <design:attribute name="inline" label="Disable Refresh View" 
                      description="Check this option if you want to disable the view refresh after an update"/>              

    <design:attribute name="canInteract" label="Enable Dynamic Interactions(Beta)" 
                      description="Check this option if you want to enable dynamic interactions"/>           

    <design:attribute name="canToggleFullscreen" label="Enable Toggle Fullscreen" 
                      description="Check this option if you want to enable toggle fullscreen"/>   

    <design:attribute name="noNavigation" label="Disable Navigation" 
                      description="Hide the navigation to the grid"/> 
</design:component>
```

{% endtab %}
{% endtabs %}