React Grid: Custom Components

<!DOCTYPE html><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet"><html lang="en" data-astro-cid-sckkx6r4 style="--lightModeCSSUrl: url("/images/sun.svg");--darkModeCSSUrl: url("/images/moon.svg");"> <head><meta charset="UTF-8"><meta name="description" content="You can create your own Custom Components to customise the behaviour of the grid. For example you can customise how cells are rendered, how values are edited and also create your own filters. Download AG Grid v33.1.1 today: The best React Table & React Data Grid in the world."><meta name="viewport" content="width=device-width"><link rel="icon" type="image/png" sizes="196x196" href="/_astro/favicon-196.Bimfhk9M.png"><link rel="icon" type="image/png" sizes="192x192" href="/_astro/favicon-192.BPgSS0FN.png"><link rel="icon" type="image/png" sizes="180x180" href="/_astro/favicon-180.DPLMo2LR.png"><link rel="icon" type="image/png" sizes="167x167" href="/_astro/favicon-167.I4Tpyy48.png"><link rel="icon" type="image/png" sizes="152x152" href="/_astro/favicon-152.cc6y96U4.png"><link rel="icon" type="image/png" sizes="128x128" href="/_astro/favicon-128.DBIUHlVo.png"><link rel="icon" type="image/png" sizes="32x32" href="/_astro/favicon-32.WDuB-104.png"><link rel="apple-touch-icon" sizes="180x180" href="/_astro/favicon-180-touch.DLSK8QDR.png"><link rel="apple-touch-icon" sizes="167x167" href="/_astro/favicon-167-touch.BlG15XMf.png"><link rel="apple-touch-icon" sizes="152x152" href="/_astro/favicon-152-touch.Cer8BKXE.png"><meta name="generator" content="Astro v4.16.18"><title>React Grid: Custom Components | AG Grid</title><link rel="canonical" href="https://www.ag-grid.com/react-data-grid/components/"><link rel="sitemap" type="application/xml" title="Sitemap" href="/sitemap-index.xml"><meta property="og:url" content="https://www.ag-grid.com/react-data-grid/components/"><meta property="og:type" content="website"><meta property="og:title" content="React Grid: Custom Components | AG Grid"><meta property="og:description" content="You can create your own Custom Components to customise the behaviour of the grid. For example you can customise how cells are rendered, how values are edited and also create your own filters. Download AG Grid v33.1.1 today: The best React Table & React Data Grid in the world."><meta property="og:image" content="/images/ag-grid-social.png"><meta name="twitter:card" content="summary_large_image"><meta property="twitter:domain" content="www.ag-grid.com"><meta property="twitter:url" content="https://www.ag-grid.com/react-data-grid/components/"><meta name="twitter:title" content="React Grid: Custom Components | AG Grid"><meta name="twitter:description" content="You can create your own Custom Components to customise the behaviour of the grid. For example you can customise how cells are rendered, how values are edited and also create your own filters. Download AG Grid v33.1.1 today: The best React Table & React Data Grid in the world."><meta name="twitter:image" content="/images/ag-grid-social.png"><script>(function(){const googleTagManagerId = "GTM-T7JG534"; (function (w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', googleTagManagerId); })();</script><script defer data-domain="ag-grid.com" src="https://plausible.io/js/script.tagged-events.outbound-links.js"></script> <script> window.plausible = window.plausible || function () { (window.plausible.q = window.plausible.q || []).push(arguments); }; </script><script async type="text/javascript" src="https://secure.inventiveinspired7.com/js/792251.js"></script><noscript><img alt="" src="https://secure.inventiveinspired7.com/792251.png" style="display:none;; --lightModeCSSUrl: url("/images/sun.svg");--darkModeCSSUrl: url("/images/moon.svg");" data-astro-cid-sckkx6r4></noscript><link rel="stylesheet" href="/_astro/example-finance.DQZXqfST.css"> <link rel="stylesheet" href="/_astro/_pageName_.BTiaybtX.css"> <style>._contentViewport_cb2ib_1{display:flex;flex-direction:column;flex-grow:1}@media (min-width: 1052px){._contentViewport_cb2ib_1{flex-direction:row}}@media (min-width: 1475px){._contentViewport_cb2ib_1._noLeftMenu_cb2ib_11 ._docPage_cb2ib_11{width:var(--layout-width-9-12);margin-left:calc(var(--layout-width-3-12) + var(--layout-gap))}}@media (max-width: 1880px){._contentViewport_cb2ib_1._noLeftMenu_cb2ib_11 ._docPage_cb2ib_11{width:var(--layout-width-6-12)}}._contentViewport_cb2ib_1._noLeftMenu_cb2ib_11 ._docPage_cb2ib_11{width:100%}._pageSections_cb2ib_29 li p{padding-bottom:0;margin-bottom:8px}._pageSections_cb2ib_29 article>h2{margin-top:48px}._pageSections_cb2ib_29 article>h3,._pageSections_cb2ib_29 article>h4{margin-top:48px}._pageSections_cb2ib_29 article>h2+h3,._pageSections_cb2ib_29 article>h2+h4,._pageSections_cb2ib_29 article>h3+h4{margin-top:32px}._pageSections_cb2ib_29 article p,._pageSections_cb2ib_29 article>ul,._pageSections_cb2ib_29 article>ol,._pageSections_cb2ib_29 article>table{font-size:var(--text-fs-base);line-height:var(--text-lh-xs)}h2:where(:not(:last-child)),h3:where(:not(:last-child)),h4:where(:not(:last-child)),h5:where(:not(:last-child)),h6:where(:not(:last-child)){margin-top:16px;margin-bottom:8px;letter-spacing:-.015em}ul:where(:not(:last-child)),ol:where(:not(:last-child)),blockquote:where(:not(:last-child)){margin-top:20px;margin-bottom:20px}._docPage_cb2ib_11 enterprise-icon:after{display:inline-block;background-image:url(/images/enterprise.svg);text-indent:-10000px;background-position-y:center;background-repeat:no-repeat;content:"e"}._docPage_cb2ib_11{flex:1 1 0px;width:100%;min-width:0px;padding-top:16px;padding-bottom:64px}@media screen and (max-width: 1475px){._docPage_cb2ib_11{border:none}}@media screen and (min-width: 1052px){._docPage_cb2ib_11{width:var(--layout-width-9-12);padding-top:40px;padding-right:12px}}@media screen and (min-width: 1475px){._docPage_cb2ib_11{width:var(--layout-width-7-12);max-width:var(--layout-width-7-12);padding-right:0}}[data-dark-mode=true] ._docPage_cb2ib_11 h1,[data-dark-mode=true] ._docPage_cb2ib_11 h2,[data-dark-mode=true] ._docPage_cb2ib_11 h3,[data-dark-mode=true] ._docPage_cb2ib_11 h4,[data-dark-mode=true] ._docPage_cb2ib_11 h5,[data-dark-mode=true] ._docPage_cb2ib_11 h6{color:var(--color-fg-primary)}._docPage_cb2ib_11 h1:hover .docs-header-icon,._docPage_cb2ib_11 h2:hover .docs-header-icon,._docPage_cb2ib_11 h3:hover .docs-header-icon,._docPage_cb2ib_11 h4:hover .docs-header-icon,._docPage_cb2ib_11 h5:hover .docs-header-icon,._docPage_cb2ib_11 h6:hover .docs-header-icon{opacity:.5}._docPage_cb2ib_11 .docs-header-icon{position:relative;padding-left:0;margin-left:8px;font-size:inherit;opacity:0;transition:opacity .33s ease-in-out}._docPage_cb2ib_11 .docs-header-icon:hover{opacity:1!important}._docPage_cb2ib_11 .docs-header-icon svg{position:relative;width:.85em;height:.85em;top:-.1em;visibility:visible;fill:var(--color-link)}[data-dark-mode=true] ._docPage_cb2ib_11 a:not(.button){color:var(--color-brand-300)}[data-dark-mode=true] ._docPage_cb2ib_11 a:not(.button):hover{color:var(--color-fg-primary);text-decoration-color:var(--color-brand-300)}._docPage_cb2ib_11 enterprise-icon:after{width:1rem;margin-left:.25rem}._docPage_cb2ib_11 .nav-link p{margin:0}._docPage_cb2ib_11 ul li>p{margin-bottom:.25rem}._pageSections_cb2ib_29>article>table{table-layout:fixed}._pageSections_cb2ib_29>article>p:first-child{font-size:var(--text-fs-lg);margin-bottom:32px;color:var(--color-text-secondary);line-height:var(--text-lh-sm)}._pageSections_cb2ib_29>article>p:first-child code{font-size:.8em}._pageSections_cb2ib_29>article>div *:not([class]) img{max-width:100%}._sideMenu_cb2ib_177{padding-top:36px}#errorCodeText{white-space:pre-wrap}.missing-params-message{display:none} </style> <link rel="stylesheet" href="/_astro/_pageName_.C4NmZ8Kx.css"> <style>._icon_1jqgc_1{fill:var(--icon-color, var(--color-fg-primary));width:var(--icon-size);height:var(--icon-size);transition:fill .25s ease-in-out} ._alert_1p97w_1{--icon-size: 1.5rem;display:flex;gap:8px;align-items:center;padding:8px 8px 8px 12px;background-color:var(--color-util-brand-50);border-radius:var(--radius-md);border:1px solid var(--color-util-brand-100);color:var(--color-util-brand-700);margin-top:20px;margin-bottom:32px}[data-dark-mode=true] ._alert_1p97w_1{background-color:color-mix(in srgb,var(--color-util-brand-50),var(--color-bg-primary) 60%)}._alert_1p97w_1 .icon{align-self:flex-start;position:relative;flex-shrink:0;fill:var(--color-util-brand-700)}._alert_1p97w_1 p :last-child{margin-bottom:0}._alert_1p97w_1 a{font-weight:var(--text-semibold);text-decoration:underline}._alert_1p97w_1 kbd{margin:0;padding-top:.075em;padding-bottom:.25em}._alert_1p97w_1._idea_1p97w_36 .icon{fill:orange}._alert_1p97w_1._warning_1p97w_40{color:var(--color-util-warning-700);background-color:var(--color-util-warning-50);border-color:color-mix(in srgb,var(--color-util-warning-600) 20%,var(--color-bg-primary))}[data-dark-mode=true] ._alert_1p97w_1._warning_1p97w_40{border-color:color-mix(in srgb,var(--color-util-warning-600) 30%,var(--color-bg-primary))}._alert_1p97w_1._warning_1p97w_40 .icon{fill:var(--color-util-warning-700)}._alert_1p97w_1._success_1p97w_52{color:var(--color-success);background-color:color-mix(in srgb,var(--color-success) 6%,var(--color-bg-primary));border-color:color-mix(in srgb,var(--color-success) 20%,var(--color-bg-primary))}[data-dark-mode=true] ._alert_1p97w_1._success_1p97w_52{background-color:color-mix(in srgb,var(--color-success) 10%,var(--color-bg-primary));border-color:color-mix(in srgb,var(--color-success) 28%,var(--color-bg-primary))}._alert_1p97w_1._success_1p97w_52 .icon{fill:var(--color-success)} ._clipboardButtonOuter_8cpmg_1{--clipboard-button-bg: var(--color-code-background);--clipboard-button-fg: var(--color-fg-tertiary);display:flex;align-items:center;position:absolute;top:4px;right:4px;opacity:0;z-index:2;transition:opacity .33s ease-in-out}pre:hover ._clipboardButtonOuter_8cpmg_1,._clipboardButtonOuter_8cpmg_1._hasCopied_8cpmg_13{opacity:1}._clipboardButtonOuter_8cpmg_1:hover{--clipboard-button-fg: var(--color-util-brand-400)}[data-dark-mode=true] ._clipboardButtonOuter_8cpmg_1:hover{--clipboard-button-fg: var(--color-link-hover)}._clipboardButtonOuter_8cpmg_1._hasCopied_8cpmg_13{--clipboard-button-bg: var(--color-util-gray-700);--clipboard-button-fg: var(--color-fg-white)}[data-dark-mode=true] ._clipboardButtonOuter_8cpmg_1._hasCopied_8cpmg_13{--clipboard-button-fg: var(--color-bg-primary)}.example-runner-outer ._clipboardButtonOuter_8cpmg_1{right:20px}._clipboardButton_8cpmg_1,._clipboardButtonCopied_8cpmg_34{display:flex;align-items:center;height:32px;background-color:var(--clipboard-button-bg);border-top:1px solid var(--color-border-primary);border-bottom:1px solid var(--color-border-primary)}._clipboardButton_8cpmg_1{width:calc(32px - var(--radius-sm));border-top-right-radius:var(--radius-sm);border-bottom-right-radius:var(--radius-sm);border-right:1px solid var(--color-border-primary);cursor:pointer;transition:background-color .25s ease-in-out}._clipboardButton_8cpmg_1 svg{--icon-size: 22px;--icon-color: var(--clipboard-button-fg);transition:fill .25s ease-in-out}._clipboardButtonCopiedOuter_8cpmg_57{overflow:hidden}._clipboardButtonCopied_8cpmg_34{font-size:var(--text-fs-sm);font-weight:var(--text-semibold);padding-left:8px;padding-right:8px;border-top-left-radius:var(--radius-sm);border-bottom-left-radius:var(--radius-sm);border-left:1px solid var(--color-border-primary);font-weight:var(--text-regular);color:var(--clipboard-button-fg);transition:background-color .25s ease-in-out,color .25s ease-in-out;cursor:pointer} ._icon_1jqgc_1{fill:var(--icon-color, var(--color-fg-primary));width:var(--icon-size);height:var(--icon-size);transition:fill .25s ease-in-out} ._docsHeaderIcon_15ivl_1{position:relative;padding-left:0;margin-left:8px;font-size:inherit;opacity:0;transition:opacity .33s ease-in-out}._docsHeaderIcon_15ivl_1 svg{position:relative;top:-.1em;width:.85em;height:.85em;visibility:visible;fill:var(--color-link)}._docsHeaderIcon_15ivl_1:hover{opacity:1}h1:hover ._docsHeaderIcon_15ivl_1,h2:hover ._docsHeaderIcon_15ivl_1,h3:hover ._docsHeaderIcon_15ivl_1,h4:hover ._docsHeaderIcon_15ivl_1,h5:hover ._docsHeaderIcon_15ivl_1,h6:hover ._docsHeaderIcon_15ivl_1{opacity:.5}h1:hover ._docsHeaderIcon_15ivl_1:hover,h2:hover ._docsHeaderIcon_15ivl_1:hover,h3:hover ._docsHeaderIcon_15ivl_1:hover,h4:hover ._docsHeaderIcon_15ivl_1:hover,h5:hover ._docsHeaderIcon_15ivl_1:hover,h6:hover ._docsHeaderIcon_15ivl_1:hover{opacity:1} ._container_kzfe6_1{display:flex;flex-direction:column;gap:8px;min-height:800px}._container_kzfe6_1 .ag-root-wrapper{border-bottom-left-radius:0;border-bottom-right-radius:0}._container_kzfe6_1 .ag-group-child-count{opacity:.6666;margin-left:4px}._moduleSnippet_kzfe6_16 pre{margin-top:-9px;border-top-left-radius:0;border-top-right-radius:0}[data-dark-mode=true] ._moduleSnippet_kzfe6_16 pre{border-color:color-mix(in srgb,var(--color-fg-primary) 15%,transparent)} ._cta_13t5y_1{position:relative}._cta_13t5y_1 a,._cta_13t5y_1 button{display:flex;justify-content:center;align-items:center;width:40px;height:40px;border-radius:var(--radius-sm);transition:color .25s ease-in-out,background-color .25s ease-in-out;cursor:pointer}._cta_13t5y_1 a:hover,._cta_13t5y_1 button:hover{background-color:var(--color-util-brand-100)}._cta_13t5y_1 a:focus-visible,._cta_13t5y_1 button:focus-visible{outline:none;box-shadow:0 0 0 4px var(--color-button-primary-shadow-focus),var(--shadow-xs)}._cta_13t5y_1 a svg,._cta_13t5y_1 button svg{--icon-size: 1.25em;fill:var(--color-link);transform:translate(1px,.75px);transition:fill .25s ease-in-out}li:first-child ._cta_13t5y_1 a svg,li:first-child ._cta_13t5y_1 button svg{--icon-size: 1.35em}[data-dark-mode=true] ._cta_13t5y_1 a:hover,[data-dark-mode=true] ._cta_13t5y_1 button:hover{background-color:var(--color-util-brand-50)}@supports (-webkit-touch-callout: none){._cta_13t5y_1 button{display:none}}._tooltip_13t5y_46{--tooltip-background: var(--color-fg-primary);position:absolute;display:block;color:var(--color-bg-primary);top:-44px;left:50%;padding:4px 16px;white-space:nowrap;font-weight:600;background-color:var(--tooltip-background);border-radius:6px;transform:translate(-50%,4px);opacity:0;pointer-events:none;transition-delay:0;transition:opacity .165s ease-in,transform .165s ease-in;z-index:1}._tooltip_13t5y_46:before{content:"";position:absolute;background-color:var(--tooltip-background);width:16px;height:16px;transform:rotate(45deg);bottom:-7px;left:calc(50% - 8px);border-radius:3px;z-index:-1}._cta_13t5y_1:hover ._tooltip_13t5y_46{opacity:1;transform:translate(-50%);transition:opacity .33s ease-in,transform .33s ease-in;transition-delay:.165s}[data-dark-mode=true] ._tooltip_13t5y_46{--tooltip-background: var(--color-bg-secondary);color:var(--color-fg-primary);box-shadow:0 -4px 16px #0006} </style> <style>._container_1d2i5_1{--icon-color: var(--color-enterprise-icon);--icon-size: 18px;display:flex;align-items:center;gap:6px}._container_1d2i5_1 .icon{position:relative;top:-2px}._link_1d2i5_13{opacity:.5;transition:opacity .33s ease-in-out}.ag-row:hover ._link_1d2i5_13{opacity:1}._newTabIcon_1d2i5_21{--icon-size: 14px;margin:2px 2px 0 6px}._configuration_10dtg_1{display:flex;flex-direction:column;gap:16px}._rowModel_10dtg_7,._bundles_10dtg_8,._charts_10dtg_9{display:flex;align-items:center}._rowModel_10dtg_7 ._label_10dtg_13,._bundles_10dtg_8 ._label_10dtg_13,._charts_10dtg_9 ._label_10dtg_13{width:100px;font-weight:var(--text-semibold)}._rowModel_10dtg_7>div,._bundles_10dtg_8>div,._charts_10dtg_9>div{display:flex;gap:32px;margin-left:12px}._rowModel_10dtg_7 label,._bundles_10dtg_8 label,._charts_10dtg_9 label{cursor:pointer;display:flex;align-items:center;gap:6px}._enterpriseIcon_10dtg_35{--icon-size: var(--text-fs-lg);--icon-color: var(--color-enterprise-icon)}._moduleName_zn8z5_1{font-size:13px}._searchBox_83fei_1{position:relative;display:flex;margin-top:16px;border-radius:var(--radius-md);cursor:text}[data-dark-mode=true] ._searchBox_83fei_1 input{background:color-mix(in srgb,var(--color-bg-primary),var(--color-fg-primary) 6%)}[data-dark-mode=true] ._searchBox_83fei_1 input::placeholder{color:#fff9}._searchIcon_83fei_15{--icon-size: 20px;--icon-color: var(--color-fg-secondary);position:absolute;top:10px;left:16px}input[type=search]._searchInput_83fei_23{width:100%;padding:8px 8px 8px 40px}input[type=search]._searchInput_83fei_23::placeholder{color:var(--color-fg-quinary)}input[type=search]._searchInput_83fei_23::-webkit-search-decoration,input[type=search]._searchInput_83fei_23::-webkit-search-cancel-button{display:none} ._form_3saq1_1 .alert{margin:0 0 6px}._licenceWrapper_3saq1_5{margin-top:8px;position:relative}._license_3saq1_10,._licencePlaceholder_3saq1_11{width:100%;height:14.2em;padding:16px;word-break:break-all;font-family:var(--text-monospace-font-family);font-size:15px;line-height:var(--text-lh-base)}._license_3saq1_10{resize:none;border-radius:var(--radius-md);border:1px solid color-mix(in srgb,var(--color-border-secondary),var(--color-border-primary));background-color:var(--color-bg-secondary);color:var(--color-fg-secondary)}._license_3saq1_10::placeholder{opacity:0}[data-dark-mode=true] ._license_3saq1_10{background-color:var(--color-bg-tertiary)}._licencePlaceholder_3saq1_11{position:absolute;top:0;left:0;overflow:hidden;pointer-events:none}._licencePlaceholder_3saq1_11 span{opacity:.5}._licenseData_3saq1_46{display:flex;flex-direction:column;gap:16px;margin-top:16px}._expired_3saq1_53{color:var(--color-negative)}._frameworkLogo_3saq1_57{width:24px;height:24px;border-radius:var(--radius-xs)}._configureItems_3saq1_63{display:flex;align-items:center;flex-wrap:wrap;gap:12px 32px;margin-top:8px}._configureItems_3saq1_63 label{display:flex;align-items:center;gap:12px}._error_3saq1_76{border:1px solid var(--color-input-error);background-color:var(--color-util-warning-100)}._results_3saq1_81{margin-top:32px}._results_3saq1_81 h2{margin-top:48px}._reposTable_3saq1_88 thead{line-height:1.2;vertical-align:bottom}._reposTable_3saq1_88 th:first-child,._reposTable_3saq1_88 td:first-child{padding-left:0}._reposTable_3saq1_88 td{vertical-align:middle;text-transform:capitalize}._reposTable_3saq1_88 ._frameworkLogo_3saq1_57{margin-right:4px}@media screen and (max-width: 900px){._reposTable_3saq1_88 thead{display:none}._reposTable_3saq1_88 tr,._reposTable_3saq1_88 td{display:block;text-align:left}._reposTable_3saq1_88 tr{padding:16px 0}._reposTable_3saq1_88 tr:nth-child(2n){background-color:unset}._reposTable_3saq1_88 td{padding:0;line-height:var(--text-lh-tight);font-weight:var(--text-bold)}._reposTable_3saq1_88 td:not(:last-child){margin-bottom:8px}._reposTable_3saq1_88 td[data-column]:before{content:attr(data-column) ": ";font-weight:var(--text-regular);color:var(--color-fg-secondary)}}@media screen and (min-width: 900px){._reposTable_3saq1_88 th:last-child,._reposTable_3saq1_88 td:last-child{padding-right:0;text-align:right}._reposTable_3saq1_88 [data-column="GitHub Repo"]{width:280px}._reposTable_3saq1_88 [data-column=Framework]{width:140px}}@media screen and (min-width: 1600px){._reposTable_3saq1_88 [data-column="License Type"]{width:160px}}._repoButton_3saq1_151>svg.icon{--icon-size: 1.5em;position:relative;right:4px} </style> <link rel="stylesheet" href="/_astro/DocsExampleRunner.b6J30Pzg.css"> <style>.force-resize-cursor *{cursor:ew-resize!important}@keyframes _fadeIn_1g5nw_1{0%{opacity:0}to{opacity:.8}}@keyframes _fadeOut_1g5nw_1{0%{opacity:.8}to{opacity:0}}@keyframes _scaleFadeInUp_1g5nw_1{0%{opacity:0;transform:translate(-50%,-50%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes _scaleFadeOutDown_1g5nw_1{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.95)}}._overlay_1g5nw_37{background-color:color-mix(in srgb,var(--color-black),var(--color-black) 45%);z-index:1000;position:fixed;inset:0;opacity:.8}[data-dark-mode=true] ._overlay_1g5nw_37{background-color:color-mix(in srgb,var(--color-black),var(--color-bg-primary) 35%);opacity:.8}._overlay_1g5nw_37[data-state=open]{animation:_fadeIn_1g5nw_1 .25s ease-in}._overlay_1g5nw_37[data-state=closed]{animation:_fadeOut_1g5nw_1 .25s ease-in}._content_1g5nw_55{background-color:var(--color-bg-primary);border-radius:8px;box-shadow:#0e121659 0 10px 38px -10px,#0e121633 0 10px 20px -15px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90vw;max-width:464px;max-height:85vh;z-index:1000;overflow:hidden}._content_1g5nw_55:focus{outline:none}._content_1g5nw_55[data-state=open]{animation:_scaleFadeInUp_1g5nw_1 .2s cubic-bezier(.4,0,1,1)}._content_1g5nw_55[data-state=closed]{animation:_scaleFadeOutDown_1g5nw_1 .2s cubic-bezier(1,1,0,.4)}._title_1g5nw_79{margin:0 0 8px;font-size:var(--text-fs-lg);color:var(--color-text-secondary)}._description_1g5nw_86{margin:10px 0 0;color:var(--mauve-11);font-size:15px;line-height:1.5}._contentModal_1g5nw_93{padding:24px}._actions_1g5nw_97{padding:16px;display:flex;justify-content:flex-end;gap:8px;border-top:1px solid var(--color-border-secondary);font-size:14px}._actions_1g5nw_97._noSeparator_1g5nw_105{padding:0 24px 24px;border-top:none}._fullWidth_1g5nw_110{width:100%} </style><script type="module" src="/_astro/hoisted.D12oPI3R.js"></script><style>._enterpriseIcon_ocick_1{position:relative;margin-right:-4px;color:transparent}._enterpriseIcon_ocick_1 svg{--icon-size: 1.15em;position:absolute;left:0;margin:0;fill:var(--color-enterprise-icon);transform:translate(-.05em,.175em)} </style><style>.container[data-astro-cid-rewqq5du]{position:relative}.container[data-astro-cid-rewqq5du] .logomark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(2)} </style><style>._videoSection_1faha_1{display:flex;flex-direction:column;gap:16px;margin-bottom:16px}@media screen and (min-width: 768px){._videoSection_1faha_1{flex-direction:row;align-items:flex-start}}._header_1faha_14 p:first-child{font-size:var(--text-fs-lg)}._ytContainer_1faha_18{position:relative}._ytContainer_1faha_18:before{content:"";position:absolute;margin:auto;inset:0;width:24px;height:24px;background-color:#fff;z-index:0}svg._ytIcon_1faha_35{margin:auto;position:absolute;inset:0;width:75px;height:75px;fill:#e62117}._ytThumbnail_1faha_47{aspect-ratio:16/9;border-radius:var(--radius-md);border:2px solid var(--color-border-secondary);object-fit:cover}@media screen and (max-width: 768px){._ytThumbnail_1faha_47{width:100%}}@media screen and (min-width: 768px){._ytThumbnail_1faha_47{min-width:256px;max-width:16rem}} </style></head> <body data-astro-cid-sckkx6r4 style="--lightModeCSSUrl: url("/images/sun.svg");--darkModeCSSUrl: url("/images/moon.svg");"> <script> const htmlEl = document.querySelector('html'); const localDarkmode = localStorage['documentation:darkmode']; const isOSDarkmode = ( window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ).toString(); if (localDarkmode === undefined) { localStorage.setItem('documentation:darkmode', isOSDarkmode); } htmlEl.classList.add('no-transitions'); htmlEl.dataset.darkMode = localDarkmode !== undefined ? localDarkmode : isOSDarkmode; htmlEl.dataset.agThemeMode = htmlEl.dataset.darkMode === 'true' ? 'dark-blue' : 'light'; htmlEl.offsetHeight; // Trigger a reflow, flushing the CSS changes htmlEl.classList.remove('no-transitions'); </script> <div class="_mainContainer_b2g1f_5" data-astro-cid-sckkx6r4 style="--lightModeCSSUrl: url("/images/sun.svg");--darkModeCSSUrl: url("/images/moon.svg");"> <header class="_header_1agp5_1 site-header"> <div class="_headerInner_1agp5_20 layout-page-max-width"> <style>astro-island,astro-slot,astro-static-slot{display:contents}</style><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event("astro:load"));})();;(()=>{var A=Object.defineProperty;var g=(i,o,a)=>o in i?A(i,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):i[o]=a;var d=(i,o,a)=>g(i,typeof o!="symbol"?o+"":o,a);{let i={0:t=>m(t),1:t=>a(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(a(t)),5:t=>new Set(a(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t),11:t=>1/0*t},o=t=>{let[l,e]=t;return l in i?i[l](e):void 0},a=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([l,e])=>[l,o(e)]));class y extends HTMLElement{constructor(){super(...arguments);d(this,"Component");d(this,"hydrator");d(this,"hydrate",async()=>{var b;if(!this.hydrator||!this.isConnected)return;let e=(b=this.parentElement)==null?void 0:b.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let c=this.querySelectorAll("astro-slot"),n={},h=this.querySelectorAll("template[data-astro-template]");for(let r of h){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of c){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(n[r.getAttribute("name")||"default"]=r.innerHTML)}let p;try{p=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",v=this.getAttribute("component-export");throw v&&(s+=` (export ${v})`),console.error(`[hydrate] Error parsing props for component ${s}`,this.getAttribute("props"),r),r}let u;await this.hydrator(this)(this.Component,p,n,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});d(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),c.disconnect(),this.childrenConnectedCallback()},c=new MutationObserver(()=>{var n;((n=this.lastChild)==null?void 0:n.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});c.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}async start(){let e=JSON.parse(this.getAttribute("opts")),c=this.getAttribute("client");if(Astro[c]===void 0){window.addEventListener(`astro:${c}`,()=>this.start(),{once:!0});return}try{await Astro[c](async()=>{let n=this.getAttribute("renderer-url"),[h,{default:p}]=await Promise.all([import(this.getAttribute("component-url")),n?import(n):()=>()=>{}]),u=this.getAttribute("component-export")||"default";if(!u.includes("."))this.Component=h[u];else{this.Component=h;for(let f of u.split("."))this.Component=this.Component[f]}return this.hydrator=p,this.hydrate},e,this)}catch(n){console.error(`[astro-island] Error hydrating ${this.getAttribute("component-url")}`,n)}}attributeChangedCallback(){this.hydrate()}}d(y,"observedAttributes",["props"]),customElements.get("astro-island")||customElements.define("astro-island",y)}})();</script><astro-island uid="Z1QHyEj" prefix="r4" component-url="/_astro/SiteLogo.CbYHwFyX.js" component-export="SiteLogo" renderer-url="/_astro/client.5kNSwotS.js" props="{}" ssr="" client="load" opts="{"name":"SiteLogo","value":true}" await-children=""><a href="/" aria-label="Home" class="_headerLogo_1agp5_36"><svg xmlns="http://www.w3.org/2000/svg" class="logotype" width="154" height="40" viewBox="0 0 154 40"><style> .logotype path, .logotype rect { fill: #fff; } .logotype.dark-type > path, .logotype.dark-type > rect { fill: #003264; } </style><path d="M147.979,5.6l-0,28.417l-4.768,-0l-0.127,-2.988c-0.7,1.017 -1.59,1.844 -2.67,2.479c-1.081,0.572 -2.416,0.89 -3.942,0.89c-1.335,0 -2.606,-0.254 -3.687,-0.699c-1.144,-0.509 -2.162,-1.144 -2.988,-2.034c-0.826,-0.89 -1.526,-1.971 -1.971,-3.179c-0.508,-1.208 -0.699,-2.606 -0.699,-4.132c-0,-1.526 0.254,-2.924 0.699,-4.196c0.509,-1.271 1.145,-2.352 1.971,-3.242c0.826,-0.89 1.844,-1.589 2.988,-2.098c1.144,-0.509 2.352,-0.763 3.687,-0.763c1.526,0 2.797,0.254 3.878,0.827c1.081,0.572 1.971,1.335 2.67,2.415l-0,-11.633l4.959,-0l-0,-0.064Zm-10.426,24.539c1.653,-0 2.924,-0.572 3.941,-1.653c1.017,-1.081 1.526,-2.543 1.526,-4.323c-0,-1.78 -0.509,-3.179 -1.526,-4.323c-1.017,-1.081 -2.288,-1.653 -3.941,-1.653c-1.59,0 -2.925,0.572 -3.878,1.653c-1.017,1.081 -1.526,2.543 -1.526,4.323c0,1.78 0.509,3.179 1.526,4.259c1.017,1.145 2.288,1.717 3.878,1.717"></path><rect x="119.067" y="5.6" width="4.959" height="5.849"></rect><rect x="119.067" y="14.373" width="4.959" height="19.644"></rect><path d="M108.831,16.979c1.59,-2.352 5.595,-2.606 7.248,-2.606l-0,4.577c-2.035,0 -4.069,0.064 -5.277,0.954c-1.208,0.89 -1.843,2.098 -1.843,3.56l-0,10.553l-4.959,-0l0,-19.644l4.768,-0l0.063,2.606Z"></path><path d="M26.489,28.677l-12.46,-0l-2.162,5.34l-5.467,-0l11.507,-26.955l4.768,0l11.506,26.955l-5.531,-0l-2.161,-5.34Zm-1.717,-4.26l-4.513,-10.998l-4.514,10.998l9.027,0Z"></path><path d="M62.024,18.654l-12.286,0l-0,4.267l6.963,0c-0.219,2.139 -1.021,3.846 -2.406,5.123c-1.385,1.276 -3.208,1.914 -5.469,1.914c-1.288,0 -2.461,-0.231 -3.518,-0.693c-1.058,-0.462 -1.964,-1.113 -2.717,-1.95c-0.753,-0.839 -1.337,-1.848 -1.749,-3.027c-0.414,-1.179 -0.62,-2.486 -0.62,-3.92c-0,-1.433 0.206,-2.739 0.62,-3.919c0.412,-1.178 0.996,-2.187 1.749,-3.026c0.753,-0.838 1.665,-1.488 2.734,-1.95c1.07,-0.462 2.248,-0.693 3.538,-0.693c2.669,-0 4.696,0.642 6.081,1.927l3.284,-3.286c-2.486,-1.934 -5.63,-2.907 -9.439,-2.907c-2.114,-0 -4.023,0.334 -5.723,1.002c-1.703,0.669 -3.161,1.605 -4.376,2.807c-1.216,1.204 -2.151,2.657 -2.807,4.357c-0.657,1.702 -0.985,3.599 -0.985,5.688c-0,2.066 0.334,3.957 1.003,5.67c0.668,1.714 1.61,3.173 2.825,4.375c1.216,1.204 2.673,2.139 4.375,2.808c1.702,0.668 3.597,1.002 5.688,1.002c2.042,0 3.883,-0.334 5.524,-1.002c1.64,-0.669 3.038,-1.604 4.193,-2.808c1.154,-1.202 2.042,-2.661 2.661,-4.375c0.621,-1.713 0.93,-3.604 0.93,-5.67c0,-0.291 -0.007,-0.577 -0.017,-0.856c-0.014,-0.28 -0.032,-0.565 -0.056,-0.858"></path><path d="M100.792,18.654l-12.286,0l-0,4.267l6.963,0c-0.219,2.139 -1.021,3.846 -2.406,5.123c-1.385,1.276 -3.208,1.914 -5.469,1.914c-1.288,0 -2.461,-0.231 -3.518,-0.693c-1.058,-0.462 -1.964,-1.113 -2.717,-1.95c-0.753,-0.839 -1.337,-1.848 -1.749,-3.027c-0.414,-1.179 -0.62,-2.486 -0.62,-3.92c-0,-1.433 0.206,-2.739 0.62,-3.919c0.412,-1.178 0.996,-2.187 1.749,-3.026c0.753,-0.838 1.665,-1.488 2.735,-1.95c1.069,-0.462 2.247,-0.693 3.537,-0.693c2.669,-0 4.697,0.642 6.081,1.927l3.284,-3.286c-2.486,-1.934 -5.63,-2.907 -9.438,-2.907c-2.115,-0 -4.024,0.334 -5.724,1.002c-1.703,0.669 -3.161,1.605 -4.376,2.807c-1.216,1.204 -2.151,2.657 -2.807,4.357c-0.657,1.702 -0.985,3.599 -0.985,5.688c-0,2.066 0.334,3.957 1.003,5.67c0.668,1.714 1.61,3.173 2.825,4.375c1.216,1.204 2.673,2.139 4.375,2.808c1.702,0.668 3.597,1.002 5.689,1.002c2.041,0 3.883,-0.334 5.523,-1.002c1.64,-0.669 3.038,-1.604 4.193,-2.808c1.154,-1.202 2.042,-2.661 2.661,-4.375c0.621,-1.713 0.93,-3.604 0.93,-5.67c0,-0.291 -0.007,-0.577 -0.017,-0.856c-0.014,-0.28 -0.032,-0.565 -0.056,-0.858"></path></svg><svg xmlns="http://www.w3.org/2000/svg" class="logo-mark" width="64" height="48" viewBox="0 0 64 48"><style> .logomark .aqua { fill: #55b4c8; } .logomark .orange { fill: #ff8c00; } .logomark .red { fill: #f00; } .logomark .grey { fill: #b4bebe; } </style><rect class="aqua right-1" x="51" y="10" width="7" height="8"></rect><path class="aqua right-1" d="M58,10l-17,0l-8,8l25,0l0,-8Z"></path><rect class="orange right-2" x="36" y="22" width="7" height="8"></rect><path class="orange right-2" d="M43,30l0,-7.995l-14,-0l-8.008,7.995l22.008,0Z"></path><rect class="red right-3" x="24" y="34" width="7" height="8"></rect><path class="red right-3" d="M13,38.01l4,-4.01l14,0l0,8l-18,0l0,-3.99Z"></path><rect class="grey left-1" x="11" y="6" width="7" height="8"></rect><path class="grey left-1" d="M41,10l-4,4l-26,0l0,-8l30,0l0,4Z"></path><rect class="grey left-2" x="16" y="18" width="7" height="8"></rect><path class="grey left-2" d="M16,26l9,0l8,-8l-17,-0l0,8Z"></path><rect class="grey left-3" x="6" y="30" width="7" height="8"></rect><path class="grey left-3" d="M6,37.988l7,0.012l7.992,-8l-14.992,-0.047l-0,8.035Z"></path></svg></a></astro-island> <astro-island uid="1wil1d" prefix="r5" component-url="/_astro/ProductDropdown.DeOAom3M.js" component-export="ProductDropdown" renderer-url="/_astro/client.5kNSwotS.js" props="{"items":[1,[[0,{"title":[0,"AG Grid"],"description":[0,"Best JavaScript Grid in the World"],"url":[0,"https://www.ag-grid.com"]}],[0,{"title":[0,"AG Charts"],"description":[0,"Best JavaScript Charts in the World"],"url":[0,"https://www.ag-grid.com/charts"]}]]],"children":[0,null]}" ssr="" client="load" opts="{"name":"ProductDropdown","value":true}" await-children=""><div class="_customMenu_zefh0_1 "><button class="_customTrigger_zefh0_23 ">Products<span class="_arrow_zefh0_51"></span></button></div></astro-island> <div class="_docsNavBtnSearchContainer_1agp5_53"> <button id="top-bar-docs-button" class="_mobileNavButton_1agp5_76 button-secondary" type="button" data-toggle="collapse" data-target="#side-nav" aria-controls="side-nav" aria-expanded="false" aria-label="Toggle docs page navigation"> <span>Docs</span> <svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M14 25H28V27H14zM7.17 26L4.59 28.58 6 30 10 26 6 22 4.58 23.41 7.17 26zM14 15H28V17H14zM7.17 16L4.59 18.58 6 20 10 16 6 12 4.58 13.41 7.17 16zM14 5H28V7H14zM7.17 6L4.59 8.58 6 10 10 6 6 2 4.58 3.41 7.17 6z"></path></svg> </button> <astro-island uid="Z1mAAvp" prefix="r7" component-url="/_astro/Search.hHHnN0s7.js" component-export="default" renderer-url="/_astro/client.5kNSwotS.js" props="{}" ssr="" client="load" opts="{"name":"Search","value":true}" await-children=""><div role="button" tabindex="0" class="_headerSearchBox_1bvo1_1" aria-label="Open search with Enter or Space, or use the shortcut Ctrl K while anywhere else in the page."><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29,27.5859l-7.5521-7.5521a11.0177,11.0177,0,1,0-1.4141,1.4141L27.5859,29ZM4,13a9,9,0,1,1,9,9A9.01,9.01,0,0,1,4,13Z"></path></svg><span class="_placeholder_1bvo1_47">Search</span></div></astro-island> </div> <astro-island uid="Z1i98E" prefix="r8" component-url="/_astro/HeaderNav.DeNiJgOx.js" component-export="HeaderNav" renderer-url="/_astro/client.5kNSwotS.js" props="{"currentPath":[0,"/react-data-grid/components/"],"items":[1,[[0,{"title":[0,"AG Charts"],"url":[0,"https://www.ag-grid.com/charts"],"isCollapsed":[0,true]}],[0,{"title":[0,"Demos"],"path":[0,"/example"]}],[0,{"title":[0,"Theme Builder"],"path":[0,"/theme-builder"]}],[0,{"title":[0,"Docs"],"path":[0,"./getting-started"]}],[0,{"title":[0,"API"],"path":[0,"./reference"]}],[0,{"title":[0,"Community"],"path":[0,"/community"]}],[0,{"title":[0,"Pricing"],"path":[0,"/license-pricing"]}],[0,{"title":[0,"GitHub"],"url":[0,"https://github.com/ag-grid/ag-grid"],"icon":[0,"github"],"github":[0,"true"]}]]],"allPaths":[1,[[0,{"title":[0,"AG Charts"],"url":[0,"https://www.ag-grid.com/charts"],"isCollapsed":[0,true]}],[0,{"title":[0,"Demos"],"path":[0,"/example"]}],[0,{"title":[0,"Theme Builder"],"path":[0,"/theme-builder"]}],[0,{"title":[0,"Docs"],"path":[0,"./getting-started"]}],[0,{"title":[0,"API"],"path":[0,"./reference"]}],[0,{"title":[0,"Community"],"path":[0,"/community"]}],[0,{"title":[0,"Pricing"],"path":[0,"/license-pricing"]}],[0,{"title":[0,"GitHub"],"url":[0,"https://github.com/ag-grid/ag-grid"],"icon":[0,"github"],"github":[0,"true"]}],[0,"reference"],[0,"grid-interface"],[0,"grid-options"],[0,"grid-events"],[0,"grid-api"],[0,"grid-state"],[0,"grid-lifecycle"],[0,"column-interface"],[0,"column-properties"],[0,"column-object"],[0,"column-object-group"],[0,"column-events"],[0,"row-interface"],[0,"row-object"],[0,"row-events"],[0,"typescript-generics"],[0,{"title":[0,"Docs"],"path":[0,"/react"]}],[0,{"title":[0,"Docs"],"path":[0,"/angular"]}],[0,{"title":[0,"Docs"],"path":[0,"/vue"]}],[0,{"title":[0,"Docs"],"path":[0,"/javascript"]}]]],"apiPaths":[1,[[0,"reference"],[0,"grid-interface"],[0,"grid-options"],[0,"grid-events"],[0,"grid-api"],[0,"grid-state"],[0,"grid-lifecycle"],[0,"column-interface"],[0,"column-properties"],[0,"column-object"],[0,"column-object-group"],[0,"column-events"],[0,"row-interface"],[0,"row-object"],[0,"row-events"],[0,"typescript-generics"]]]}" ssr="" client="load" opts="{"name":"HeaderNav","value":true}" await-children=""><div class="_mainNav_1agp5_191"><nav class="_mainNavLarge_1agp5_191"><ul class="_navItemList_1agp5_225 list-style-none"><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/example/" aria-label="AG Grid Demos"><span>Demos</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/theme-builder/" aria-label="AG Grid Theme Builder"><span>Theme Builder</span></a></li><li class="_navItem_1agp5_225 _navItemActive_1agp5_243"><a class="_navLink_1agp5_243" href="/react-data-grid/getting-started/" aria-label="AG Grid Docs"><span>Docs</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/react-data-grid/reference/" aria-label="AG Grid API"><span>API</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/community/" aria-label="AG Grid Community"><span>Community</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/license-pricing/" aria-label="AG Grid Pricing"><span>Pricing</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320 _githubItem_1agp5_316"><a class="_navLink_1agp5_243" href="https://github.com/ag-grid/ag-grid" aria-label="AG Grid GitHub"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16,2a14,14,0,0,0-4.43,27.28c.7.13,1-.3,1-.67s0-1.21,0-2.38c-3.89.84-4.71-1.88-4.71-1.88A3.71,3.71,0,0,0,6.24,22.3c-1.27-.86.1-.85.1-.85A2.94,2.94,0,0,1,8.48,22.9a3,3,0,0,0,4.08,1.16,2.93,2.93,0,0,1,.88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4,5.4,0,0,1,1.44-3.76,5,5,0,0,1,.14-3.7s1.17-.38,3.85,1.43a13.3,13.3,0,0,1,7,0c2.67-1.81,3.84-1.43,3.84-1.43a5,5,0,0,1,.14,3.7,5.4,5.4,0,0,1,1.44,3.76c0,5.38-3.27,6.56-6.39,6.91a3.33,3.33,0,0,1,.95,2.59c0,1.87,0,3.38,0,3.84s.25.81,1,.67A14,14,0,0,0,16,2Z"></path></svg><span>GitHub</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320"><button class="_navLink_1agp5_243 button-style-none" aria-label="Dark mode selector"><div class="_icon_1agp5_88 _pseudoIcon_1agp5_324"></div><span>Dark Mode</span></button></li></ul></nav></div><button class="_mobileMenuButton_1agp5_117" type="button" aria-controls="_mainNavSmall_1agp5_1" aria-expanded="false" aria-label="Toggle navigation"><svg xmlns="http://www.w3.org/2000/svg" class="_menuIcon_1agp5_153" width="36" height="36" viewBox="0 0 36 36"><style> .menu-icon rect { fill: #fff; } </style><g class="top"><rect x="2" y="7" width="32" height="2"></rect></g><g class="middle"><rect x="2" y="17" width="32" height="2"></rect></g><g class="bottom"><rect x="2" y="27" width="32" height="2"></rect></g></svg></button><div id="_mainNavSmall_1agp5_1" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><nav class="_mainNav_1agp5_191"><ul class="_navItemList_1agp5_225 list-style-none"><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="https://www.ag-grid.com/charts" aria-label="AG Grid AG Charts"><span>AG Charts</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/example/" aria-label="AG Grid Demos"><span>Demos</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/theme-builder/" aria-label="AG Grid Theme Builder"><span>Theme Builder</span></a></li><li class="_navItem_1agp5_225 _navItemActive_1agp5_243"><a class="_navLink_1agp5_243" href="/react-data-grid/getting-started/" aria-label="AG Grid Docs"><span>Docs</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/react-data-grid/reference/" aria-label="AG Grid API"><span>API</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/community/" aria-label="AG Grid Community"><span>Community</span></a></li><li class="_navItem_1agp5_225"><a class="_navLink_1agp5_243" href="/license-pricing/" aria-label="AG Grid Pricing"><span>Pricing</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320 _githubItem_1agp5_316"><a class="_navLink_1agp5_243" href="https://github.com/ag-grid/ag-grid" aria-label="AG Grid GitHub"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16,2a14,14,0,0,0-4.43,27.28c.7.13,1-.3,1-.67s0-1.21,0-2.38c-3.89.84-4.71-1.88-4.71-1.88A3.71,3.71,0,0,0,6.24,22.3c-1.27-.86.1-.85.1-.85A2.94,2.94,0,0,1,8.48,22.9a3,3,0,0,0,4.08,1.16,2.93,2.93,0,0,1,.88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4,5.4,0,0,1,1.44-3.76,5,5,0,0,1,.14-3.7s1.17-.38,3.85,1.43a13.3,13.3,0,0,1,7,0c2.67-1.81,3.84-1.43,3.84-1.43a5,5,0,0,1,.14,3.7,5.4,5.4,0,0,1,1.44,3.76c0,5.38-3.27,6.56-6.39,6.91a3.33,3.33,0,0,1,.95,2.59c0,1.87,0,3.38,0,3.84s.25.81,1,.67A14,14,0,0,0,16,2Z"></path></svg><span>GitHub</span></a></li><li class="_navItem_1agp5_225 _buttonItem_1agp5_320"><button class="_navLink_1agp5_243 button-style-none" aria-label="Dark mode selector"><div class="_icon_1agp5_88 _pseudoIcon_1agp5_324"></div><span>Dark Mode</span></button></li></ul></nav></div></div></astro-island> </div> </header> <div class="_contentViewport_cb2ib_1 layout-grid"><astro-island uid="1JodhG" prefix="r0" component-url="/_astro/DocsNav.CStiDwTf.js" component-export="DocsNav" renderer-url="/_astro/client.5kNSwotS.js" props="{"menuData":[0,{"sections":[1,[[0,{"title":[0,"Getting Started"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Quick Start"],"path":[0,"getting-started"]}],[0,{"type":[0,"item"],"title":[0,"Key Features"],"path":[0,"key-features"]}],[0,{"type":[0,"item"],"title":[0,"Community vs. Enterprise"],"path":[0,"community-vs-enterprise"]}],[0,{"title":[0,"Setup"],"type":[0,"group"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Installation"],"path":[0,"installation"]}],[0,{"title":[0,"Registering Modules"],"path":[0,"modules"]}],[0,{"title":[0,"Installing Enterprise Licence"],"path":[0,"license-install"]}]]]}],[0,{"title":[0,"Tutorials"],"type":[0,"group"],"children":[1,[[0,{"title":[0,"Creating a Basic Grid"],"path":[0,"deep-dive"]}],[0,{"title":[0,"Best Practices"],"path":[0,"react-hooks"],"frameworks":[1,[[0,"react"]]]}],[0,{"title":[0,"Testing"],"type":[0,"group"],"frameworks":[1,[[0,"angular"],[0,"react"]]],"children":[1,[[0,{"title":[0,"Overview"],"path":[0,"testing"],"frameworks":[1,[[0,"angular"],[0,"react"]]]}],[0,{"type":[0,"item"],"title":[0,"Testing Async"],"path":[0,"testing-async"],"frameworks":[1,[[0,"angular"]]]}],[0,{"title":[0,"Playwright"],"url":[0,"https://blog.ag-grid.com/writing-e2e-tests-for-ag-grid-react-tables-with-playwright/"],"frameworks":[1,[[0,"react"]]]}],[0,{"title":[0,"Cypress"],"url":[0,"https://blog.ag-grid.com/end-to-end-testing-for-ag-grid-in-react-with-cypress/"],"frameworks":[1,[[0,"react"]]]}],[0,{"title":[0,"React Testing Library"],"url":[0,"https://blog.ag-grid.com/unit-testing-ag-grid-react-tables-with-react-testing-library-and-vitest/"],"frameworks":[1,[[0,"react"]]]}]]]}],[0,{"title":[0,"Testing"],"type":[0,"item"],"path":[0,"testing"],"frameworks":[1,[[0,"javascript"],[0,"vue"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=6hxbPqziELk&list=PLsZlhayVgqNwHNHeqpCkSgdRV08xrKtzW&pp=gAQB"],"frameworks":[1,[[0,"react"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=X_Ip_jGDtho&list=PLsZlhayVgqNw6VHFn4j6FcJM5vLACsf0x&pp=gAQB"],"frameworks":[1,[[0,"angular"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=V14w_NFuZB4&list=PLsZlhayVgqNz5iC0wFQDgixcAepFyrWbP&pp=gAQB"],"frameworks":[1,[[0,"vue"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=Ww7-LC6rU6U&list=PLsZlhayVgqNxijfRQxg5Mc6W4MzZHQ9MK&pp=gAQB"],"frameworks":[1,[[0,"javascript"]]]}]]]}],[0,{"title":[0,"Compatibility & Security"],"type":[0,"group"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Compatibility"],"path":[0,"compatibility"]}],[0,{"type":[0,"item"],"title":[0,"Security"],"path":[0,"security"]}],[0,{"type":[0,"item"],"title":[0,"Supported Browsers"],"path":[0,"supported-browsers"]}]]]}]]]}],[0,{"title":[0,"Layout & Styling"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Theming"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"theming"]}],[0,{"type":[0,"item"],"title":[0,"Built-in Themes"],"path":[0,"themes"]}],[0,{"type":[0,"item"],"title":[0,"Theme Parameters"],"path":[0,"theming-parameters"]}],[0,{"type":[0,"item"],"title":[0,"Theme Parts"],"path":[0,"theming-parts"]}],[0,{"type":[0,"item"],"title":[0,"Colors & Dark Mode"],"path":[0,"theming-colors"]}],[0,{"type":[0,"item"],"title":[0,"Fonts"],"path":[0,"theming-fonts"]}],[0,{"type":[0,"item"],"title":[0,"Borders"],"path":[0,"theming-borders"]}],[0,{"type":[0,"item"],"title":[0,"Compactness & Row Height"],"path":[0,"theming-compactness"]}],[0,{"type":[0,"item"],"title":[0,"Selections"],"path":[0,"theming-selections"]}],[0,{"type":[0,"item"],"title":[0,"Headers"],"path":[0,"theming-headers"]}],[0,{"type":[0,"item"],"title":[0,"Icons"],"path":[0,"custom-icons"]}],[0,{"type":[0,"item"],"title":[0,"Tool Panels"],"path":[0,"theming-tool-panels"]}],[0,{"type":[0,"item"],"title":[0,"Inputs & Widgets"],"path":[0,"theming-widgets"]}],[0,{"type":[0,"item"],"title":[0,"Menus & Popups"],"path":[0,"theming-popups"]}],[0,{"type":[0,"item"],"title":[0,"Extending with CSS"],"path":[0,"theming-css"]}],[0,{"type":[0,"item"],"title":[0,"Distributing Shared Themes"],"path":[0,"theming-distribution"]}],[0,{"type":[0,"item"],"title":[0,"Migration from v32"],"path":[0,"theming-migration"]}],[0,{"type":[0,"item"],"title":[0,"Legacy Themes"],"path":[0,"theming-v32"],"childPaths":[1,[[0,"theming-v32-custom-icons"],[0,"theming-v32-customisation"],[0,"theming-v32-customisation-borders"],[0,"theming-v32-customisation-colours"],[0,"theming-v32-customisation-compactness"],[0,"theming-v32-customisation-css"],[0,"theming-v32-customisation-headers"],[0,"theming-v32-customisation-popups"],[0,"theming-v32-customisation-sass"],[0,"theming-v32-customisation-sass-legacy"],[0,"theming-v32-customisation-selections"],[0,"theming-v32-customisation-tool-panels"],[0,"theming-v32-customisation-variables"],[0,"theming-v32-customisation-widgets"],[0,"theming-v32-themes"],[0,"theming-v32-upgrading-to-v28"],[0,"theming-v32-upgrading-to-v28-css"],[0,"theming-v32-upgrading-to-v28-sass"]]]}]]]}],[0,{"type":[0,"item"],"title":[0,"Design System"],"path":[0,"ag-grid-design-system"]}],[0,{"type":[0,"item"],"title":[0,"Grid Layout"],"path":[0,"grid-size"]}]]]}],[0,{"title":[0,"Charting"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Sparklines"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Install Sparklines"],"path":[0,"sparklines-installation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"sparklines-overview"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Area"],"path":[0,"sparklines-area-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Bar"],"path":[0,"sparklines-bar-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Column"],"path":[0,"sparklines-column-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Line"],"path":[0,"sparklines-line-customisation"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Sparkline Data"],"path":[0,"sparklines-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Axis Types"],"path":[0,"sparklines-axis-types"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tooltips"],"path":[0,"sparklines-tooltips"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Points of Interest"],"path":[0,"sparklines-points-of-interest"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Sparklines API"],"path":[0,"sparklines-api-sparkline-options"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Area"],"path":[0,"sparklines-api-sparkline-area"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Bar / Column"],"path":[0,"sparklines-api-sparkline-bar"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Line"],"path":[0,"sparklines-api-sparkline-line"],"isEnterprise":[0,true]}]]]}]]]}],[0,{"type":[0,"group"],"title":[0,"Integrated Charts"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"integrated-charts"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Install Integrated Charts"],"path":[0,"integrated-charts-installation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"User Created Charts"],"path":[0,"integrated-charts-user-created"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Range Chart"],"path":[0,"integrated-charts-range-chart"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Chart"],"path":[0,"integrated-charts-pivot-chart"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Application Created Charts"],"path":[0,"integrated-charts-application-created"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Range Chart API"],"path":[0,"integrated-charts-api-range-chart"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Chart API"],"path":[0,"integrated-charts-api-pivot-chart"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Cross Filter API"],"path":[0,"integrated-charts-api-cross-filter-chart"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Chart Types"],"path":[0,"integrated-charts-chart-types"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Menu"],"path":[0,"integrated-charts-menu"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Tool Panels"],"path":[0,"integrated-charts-chart-tool-panels"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Container"],"path":[0,"integrated-charts-container"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Customisation"],"path":[0,"integrated-charts-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Events"],"path":[0,"integrated-charts-events"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Time Series"],"path":[0,"integrated-charts-time-series"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Save / Restore Charts"],"path":[0,"integrated-charts-api-save-restore-charts"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Image Export"],"path":[0,"integrated-charts-api-downloading-image"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Standalone Charts"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"See AG Charts"],"url":[0,"https://www.ag-grid.com/charts"]}]]]}]]]}],[0,{"title":[0,"Core Features"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Columns"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Configuration"],"path":[0,"configuration"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Column Definitions"],"path":[0,"column-definitions"]}],[0,{"type":[0,"item"],"title":[0,"Updating Definitions"],"path":[0,"column-updating-definitions"]}],[0,{"type":[0,"item"],"title":[0,"Column State"],"path":[0,"column-state"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Column Headers"],"path":[0,"column-headers"]}],[0,{"type":[0,"item"],"title":[0,"Column Groups"],"path":[0,"column-groups"]}],[0,{"type":[0,"item"],"title":[0,"Column Sizing"],"path":[0,"column-sizing"]}],[0,{"type":[0,"item"],"title":[0,"Column Moving"],"path":[0,"column-moving"]}],[0,{"type":[0,"item"],"title":[0,"Column Pinning"],"path":[0,"column-pinning"]}],[0,{"type":[0,"item"],"title":[0,"Column Spanning"],"path":[0,"column-spanning"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Rows"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Data"],"path":[0,"row-ids"]}],[0,{"type":[0,"item"],"title":[0,"Row Sorting"],"path":[0,"row-sorting"]}],[0,{"type":[0,"item"],"title":[0,"Row Numbers"],"path":[0,"row-numbers"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Spanning"],"path":[0,"row-spanning"]}],[0,{"type":[0,"item"],"title":[0,"Row Pinning"],"path":[0,"row-pinning"]}],[0,{"type":[0,"item"],"title":[0,"Row Height"],"path":[0,"row-height"]}],[0,{"type":[0,"item"],"title":[0,"Styling Rows"],"path":[0,"row-styles"]}],[0,{"type":[0,"item"],"title":[0,"Row Pagination"],"path":[0,"row-pagination"]}],[0,{"type":[0,"item"],"title":[0,"Accessing Rows"],"path":[0,"accessing-data"]}],[0,{"type":[0,"item"],"title":[0,"Row Dragging"],"path":[0,"row-dragging"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"External DropZone"],"path":[0,"row-dragging-to-external-dropzone"]}],[0,{"type":[0,"item"],"title":[0,"Grid to Grid"],"path":[0,"row-dragging-to-grid"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Full Width Rows"],"path":[0,"full-width-rows"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Cells"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Cell Content"],"path":[0,"cell-content"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Getting Values"],"path":[0,"value-getters"]}],[0,{"type":[0,"item"],"title":[0,"Text Formatting"],"path":[0,"value-formatters"]}],[0,{"type":[0,"item"],"title":[0,"Cell Components"],"path":[0,"component-cell-renderer"]}],[0,{"type":[0,"item"],"title":[0,"Cell Data Types"],"path":[0,"cell-data-types"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Styling Cells"],"path":[0,"cell-styles"]}],[0,{"type":[0,"item"],"title":[0,"Highlighting Changes"],"path":[0,"change-cell-renderers"]}],[0,{"type":[0,"item"],"title":[0,"Tooltips"],"path":[0,"tooltips"]}],[0,{"type":[0,"item"],"title":[0,"Expressions"],"path":[0,"cell-expressions"]}],[0,{"type":[0,"item"],"title":[0,"View Refresh"],"path":[0,"view-refresh"]}],[0,{"type":[0,"item"],"title":[0,"Reference Data"],"path":[0,"reference-data"]}],[0,{"type":[0,"item"],"title":[0,"Cell Text Selection"],"path":[0,"cell-text-selection"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Filtering"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"filtering-overview"]}],[0,{"type":[0,"item"],"title":[0,"Column Filters"],"path":[0,"filtering"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Text Filter"],"path":[0,"filter-text"]}],[0,{"type":[0,"item"],"title":[0,"Number Filter"],"path":[0,"filter-number"]}],[0,{"type":[0,"item"],"title":[0,"Date Filter"],"path":[0,"filter-date"]}],[0,{"type":[0,"item"],"title":[0,"Set Filter"],"path":[0,"filter-set"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Filter List"],"path":[0,"filter-set-filter-list"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Data Updates"],"path":[0,"filter-set-data-updates"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tree List"],"path":[0,"filter-set-tree-list"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Mini Filter"],"path":[0,"filter-set-mini-filter"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Excel Mode"],"path":[0,"filter-set-excel-mode"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"API"],"path":[0,"filter-set-api"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Multi Filter"],"path":[0,"filter-multi"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filter Conditions"],"path":[0,"filter-conditions"]}],[0,{"type":[0,"item"],"title":[0,"Applying Filters"],"path":[0,"filter-applying"]}],[0,{"type":[0,"item"],"title":[0,"Filter API"],"path":[0,"filter-api"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Custom Column Filters"],"path":[0,"component-filter"]}],[0,{"type":[0,"item"],"title":[0,"Floating Filters"],"path":[0,"floating-filters"]}],[0,{"type":[0,"item"],"title":[0,"Custom Floating Filters"],"path":[0,"component-floating-filter"]}],[0,{"type":[0,"item"],"title":[0,"Advanced Filter"],"path":[0,"filter-advanced"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"External Filter"],"path":[0,"filter-external"]}],[0,{"type":[0,"item"],"title":[0,"Quick Filter"],"path":[0,"filter-quick"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Selection"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Selection"],"path":[0,"row-selection"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Single Row Selection"],"path":[0,"row-selection-single-row"]}],[0,{"type":[0,"item"],"title":[0,"Multi-Row Selection"],"path":[0,"row-selection-multi-row"]}],[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"row-selection-api-reference"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Cell Selection"],"path":[0,"cell-selection"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Range Handle"],"path":[0,"cell-selection-handle"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Fill Handle"],"path":[0,"cell-selection-fill-handle"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"cell-selection-api-reference"],"isEnterprise":[0,true]}]]]}]]]}],[0,{"type":[0,"group"],"title":[0,"Editing"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"cell-editing"]}],[0,{"type":[0,"item"],"title":[0,"Start / Stop Editing"],"path":[0,"cell-editing-start-stop"]}],[0,{"type":[0,"item"],"title":[0,"Parsing Values"],"path":[0,"value-parsers"]}],[0,{"type":[0,"item"],"title":[0,"Saving Values"],"path":[0,"value-setters"]}],[0,{"type":[0,"item"],"title":[0,"Edit Components"],"path":[0,"cell-editors"]}],[0,{"type":[0,"item"],"title":[0,"Provided Cell Editors"],"path":[0,"provided-cell-editors"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Text Editor"],"path":[0,"provided-cell-editors-text"]}],[0,{"type":[0,"item"],"title":[0,"Large Text Editor"],"path":[0,"provided-cell-editors-large-text"]}],[0,{"type":[0,"item"],"title":[0,"Select Editor"],"path":[0,"provided-cell-editors-select"]}],[0,{"type":[0,"item"],"title":[0,"Rich Select Editor"],"path":[0,"provided-cell-editors-rich-select"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Number Editor"],"path":[0,"provided-cell-editors-number"]}],[0,{"type":[0,"item"],"title":[0,"Date Editors"],"path":[0,"provided-cell-editors-date"]}],[0,{"type":[0,"item"],"title":[0,"Checkbox Editor"],"path":[0,"provided-cell-editors-checkbox"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Undo / Redo Edits"],"path":[0,"undo-redo-edits"]}],[0,{"type":[0,"item"],"title":[0,"Full Row"],"path":[0,"cell-editing-full-row"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Updating Data"],"path":[0,"data-update"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Data"],"path":[0,"data-update-row-data"]}],[0,{"type":[0,"item"],"title":[0,"Single Row / Cell"],"path":[0,"data-update-single-row-cell"]}],[0,{"type":[0,"item"],"title":[0,"Transactions"],"path":[0,"data-update-transactions"]}],[0,{"type":[0,"item"],"title":[0,"High Frequency"],"path":[0,"data-update-high-frequency"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Interactivity"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Keyboard Navigation"],"path":[0,"keyboard-navigation"]}],[0,{"type":[0,"item"],"title":[0,"Touch"],"path":[0,"touch"]}],[0,{"type":[0,"item"],"title":[0,"Accessibility (ARIA)"],"path":[0,"accessibility"]}],[0,{"type":[0,"item"],"title":[0,"RTL Text Direction"],"path":[0,"rtl"]}],[0,{"type":[0,"item"],"title":[0,"Localisation"],"path":[0,"localisation"]}]]]}]]]}],[0,{"title":[0,"Advanced Features"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Row Grouping"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"grouping"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Grouping Data"],"path":[0,"grouping-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Group Display Types"],"path":[0,"grouping-display-types"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Single Column"],"path":[0,"grouping-single-group-column"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Multiple Columns"],"path":[0,"grouping-multiple-group-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Group Rows"],"path":[0,"grouping-group-rows"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Row Group Panel"],"path":[0,"grouping-group-panel"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Expanding Groups"],"path":[0,"grouping-opening-groups"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Hierarchy Selection"],"path":[0,"grouping-row-selection"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Sorting"],"path":[0,"grouping-sorting"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Aggregation"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"aggregation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Configure Columns"],"path":[0,"aggregation-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Custom Functions"],"path":[0,"aggregation-custom-functions"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Total Rows"],"path":[0,"aggregation-total-rows"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filtering "],"path":[0,"aggregation-filtering"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Pivoting"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"pivoting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Result Columns"],"path":[0,"pivoting-result-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Column Groups"],"path":[0,"pivoting-column-groups"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Totals"],"path":[0,"pivoting-totals"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Tree Data"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"tree-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Supplying Data"],"path":[0,"tree-data-data"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Data Paths"],"path":[0,"tree-data-paths"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Nested Records"],"path":[0,"tree-data-nesting"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Group Column"],"path":[0,"tree-data-group-column"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Expanding Groups"],"path":[0,"tree-data-opening-groups"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tree Selection"],"path":[0,"tree-data-selection"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filtering"],"path":[0,"tree-data-filtering"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Master Detail"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"master-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Detail Grids"],"path":[0,"master-detail-grids"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Detail Height"],"path":[0,"master-detail-height"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Detail Refresh"],"path":[0,"master-detail-refresh"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Master Rows"],"path":[0,"master-detail-master-rows"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Nesting"],"path":[0,"master-detail-nesting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Custom Detail"],"path":[0,"master-detail-custom-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Other"],"path":[0,"master-detail-other"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Accessories"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Tool Panels"],"path":[0,"tool-panel"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Side Bar"],"path":[0,"side-bar"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Columns Tool Panel"],"path":[0,"tool-panel-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filters Tool Panel"],"path":[0,"tool-panel-filters"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Custom Panel"],"path":[0,"component-tool-panel"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Column Menu"],"path":[0,"column-menu"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Context Menu"],"path":[0,"context-menu"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Menu Item Component"],"path":[0,"component-menu-item"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Status Bar"],"path":[0,"status-bar"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Overlays"],"path":[0,"overlays"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Server-Side Data"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Models"],"path":[0,"row-models"]}],[0,{"type":[0,"item"],"title":[0,"Server-Side Row Model"],"path":[0,"server-side-model"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"server-side-model-api-reference"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Datasource"],"path":[0,"server-side-model-datasource"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Configuration"],"path":[0,"server-side-model-configuration"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Sorting"],"path":[0,"server-side-model-sorting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filtering"],"path":[0,"server-side-model-filtering"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Grouping"],"path":[0,"server-side-model-grouping"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivoting"],"path":[0,"server-side-model-pivoting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pagination"],"path":[0,"server-side-model-pagination"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Selection"],"path":[0,"server-side-model-selection"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Loading Component"],"path":[0,"component-loading-cell-renderer"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Changing Columns"],"path":[0,"server-side-model-changing-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Updating Data"],"path":[0,"server-side-model-updating"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Refresh"],"path":[0,"server-side-model-updating-refresh"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Single Row Updates"],"path":[0,"server-side-model-updating-single-row"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Transactions"],"path":[0,"server-side-model-updating-transactions"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Load Retry"],"path":[0,"server-side-model-retry"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Height"],"path":[0,"server-side-model-row-height"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Master Detail"],"path":[0,"server-side-model-master-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tree Data"],"path":[0,"server-side-model-tree-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example Node.js & MySQL"],"path":[0,"server-side-operations-nodejs"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example GraphQL & MySQL"],"path":[0,"server-side-operations-graphql"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example Java & Oracle"],"path":[0,"server-side-operations-oracle"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example Java & Apache"],"path":[0,"server-side-operations-spark"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Infinite Row Model"],"path":[0,"infinite-scrolling"]}],[0,{"type":[0,"item"],"title":[0,"Viewport Row Model"],"path":[0,"viewport"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Import & Export"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"CSV Export"],"path":[0,"csv-export"]}],[0,{"type":[0,"item"],"title":[0,"Excel Export"],"path":[0,"excel-export"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"excel-export-api"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Styles"],"path":[0,"excel-export-styles"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Formulas"],"path":[0,"excel-export-formulas"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Extra Content"],"path":[0,"excel-export-extra-content"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Customising Content"],"path":[0,"excel-export-customising-content"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Images"],"path":[0,"excel-export-images"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Excel Tables"],"path":[0,"excel-export-tables"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Multiple Sheets"],"path":[0,"excel-export-multiple-sheets"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Rows"],"path":[0,"excel-export-rows"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Columns"],"path":[0,"excel-export-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Freezing Content"],"path":[0,"excel-export-freeze"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Data Types"],"path":[0,"excel-export-data-types"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Hyperlinks"],"path":[0,"excel-export-hyperlinks"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Master Detail"],"path":[0,"excel-export-master-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Page Setup"],"path":[0,"excel-export-page-setup"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Clipboard"],"path":[0,"clipboard"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Drag & Drop"],"path":[0,"drag-and-drop"]}],[0,{"type":[0,"item"],"title":[0,"Printing"],"path":[0,"printing"]}],[0,{"type":[0,"item"],"title":[0,"Import Excel"],"path":[0,"excel-import"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Performance"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"DOM Virtualisation"],"path":[0,"dom-virtualisation"]}],[0,{"type":[0,"item"],"title":[0,"Value Cache"],"path":[0,"value-cache"]}],[0,{"type":[0,"item"],"title":[0,"Row Animation"],"path":[0,"row-animation"]}],[0,{"type":[0,"item"],"title":[0,"Massive Row Count"],"path":[0,"massive-row-count"]}],[0,{"type":[0,"item"],"title":[0,"Scrolling Performance"],"path":[0,"scrolling-performance"]}],[0,{"type":[0,"item"],"title":[0,"NgZone"],"path":[0,"angular-ngzone"],"frameworks":[1,[[0,"angular"]]]}]]]}]]]}],[0,{"type":[0,"item"],"title":[0,"Miscellaneous"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Migration"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 33.1"],"path":[0,"upgrading-to-ag-grid-33-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 33"],"path":[0,"upgrading-to-ag-grid-33"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32.3"],"path":[0,"upgrading-to-ag-grid-32-3"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32.2.1"],"path":[0,"upgrading-to-ag-grid-32-2-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32.1"],"path":[0,"upgrading-to-ag-grid-32-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32"],"path":[0,"upgrading-to-ag-grid-32"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31.3"],"path":[0,"upgrading-to-ag-grid-31-3"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31.2"],"path":[0,"upgrading-to-ag-grid-31-2"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31.1"],"path":[0,"upgrading-to-ag-grid-31-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31"],"path":[0,"upgrading-to-ag-grid-31"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to Older Versions"],"path":[0,"upgrading-to-older-versions"]}],[0,{"type":[0,"item"],"title":[0,"Codemods"],"path":[0,"codemods"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Other"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Context"],"path":[0,"context"]}],[0,{"type":[0,"item"],"title":[0,"Change Detection"],"path":[0,"change-detection"]}],[0,{"type":[0,"item"],"title":[0,"Custom Components"],"path":[0,"components"]}],[0,{"type":[0,"item"],"title":[0,"Aligned Grids"],"path":[0,"aligned-grids"]}]]]}]]]}]]]}],"framework":[0,"react"],"pageName":[0,"components"],"showWhatsNew":[0,true]}" ssr="" client="load" opts="{"name":"DocsNav","value":true}" await-children=""><div id="docs-mobile-nav-collapser" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div id="docs-nav-scroll" class="_docsNavOuter_1ilfl_17"><div class="_docsNavInner_1ilfl_50"><div class="_whatsNewLink_1ilfl_65"><a href="/whats-new">What's New</a></div><div class="_section_1ilfl_92"><h5 class="_sectionTitle_1ilfl_97">Getting Started</h5><a href="/react-data-grid/getting-started/" class="_item_1ilfl_99"><span>Quick Start</span></a><a href="/react-data-grid/key-features/" class="_item_1ilfl_99"><span>Key Features</span></a><a href="/react-data-grid/community-vs-enterprise/" class="_item_1ilfl_99"><span>Community vs. Enterprise</span></a><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Setup</span></button><div id="Setup" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/installation/" class="_item_1ilfl_99"><span>Installation</span></a><a href="/react-data-grid/modules/" class="_item_1ilfl_99"><span>Registering Modules</span></a><a href="/react-data-grid/license-install/" class="_item_1ilfl_99"><span>Installing Enterprise Licence</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Tutorials</span></button><div id="Tutorials" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/deep-dive/" class="_item_1ilfl_99"><span>Creating a Basic Grid</span></a><a href="/react-data-grid/react-hooks/" class="_item_1ilfl_99"><span>Best Practices</span></a><a class="_item_1ilfl_99"><span>Testing</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/testing/" class="_item_1ilfl_99"><span>Overview</span></a><a href="https://blog.ag-grid.com/writing-e2e-tests-for-ag-grid-react-tables-with-playwright/" class="_item_1ilfl_99" target="_blank"><span>Playwright<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 20 20" size="32" class="_icon_1jqgc_1 icon _externalIcon_1ilfl_197"><path d="M14.167 9.833v5a.833.833 0 0 1-.244.589l-.001.001a.833.833 0 0 1-.589.244H4.167a.837.837 0 0 1-.59-.244v-.001a.833.833 0 0 1-.244-.589V5.667c0-.221.088-.433.244-.59a.837.837 0 0 1 .59-.244h5a.833.833 0 0 0 0-1.666h-5a2.5 2.5 0 0 0-2.5 2.5v9.166a2.5 2.5 0 0 0 2.5 2.5h9.166a2.5 2.5 0 0 0 2.5-2.5v-5a.833.833 0 0 0-1.666 0ZM17.5.667h-5a.833.833 0 0 0 0 1.666h2.988l-7.744 7.744a.835.835 0 0 0 1.179 1.179l7.744-7.744V6.5a.833.833 0 0 0 1.666 0V1.499a.833.833 0 0 0-.023-.195l-.003-.012-.008-.029-.003-.011-.013-.038-.006-.016-.005-.012-.004-.01-.005-.012-.007-.015-.005-.01-.004-.008-.009-.019-.02-.036-.007-.01a.808.808 0 0 0-.277-.277l-.011-.007-.026-.015-.009-.005-.037-.018-.015-.007-.012-.005-.01-.004-.012-.005-.016-.006-.01-.003-.009-.003-.019-.007-.04-.011-.04-.009-.041-.008-.042-.005-.042-.003L17.5.667Z"></path></svg></span></a><a href="https://blog.ag-grid.com/end-to-end-testing-for-ag-grid-in-react-with-cypress/" class="_item_1ilfl_99" target="_blank"><span>Cypress<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 20 20" size="32" class="_icon_1jqgc_1 icon _externalIcon_1ilfl_197"><path d="M14.167 9.833v5a.833.833 0 0 1-.244.589l-.001.001a.833.833 0 0 1-.589.244H4.167a.837.837 0 0 1-.59-.244v-.001a.833.833 0 0 1-.244-.589V5.667c0-.221.088-.433.244-.59a.837.837 0 0 1 .59-.244h5a.833.833 0 0 0 0-1.666h-5a2.5 2.5 0 0 0-2.5 2.5v9.166a2.5 2.5 0 0 0 2.5 2.5h9.166a2.5 2.5 0 0 0 2.5-2.5v-5a.833.833 0 0 0-1.666 0ZM17.5.667h-5a.833.833 0 0 0 0 1.666h2.988l-7.744 7.744a.835.835 0 0 0 1.179 1.179l7.744-7.744V6.5a.833.833 0 0 0 1.666 0V1.499a.833.833 0 0 0-.023-.195l-.003-.012-.008-.029-.003-.011-.013-.038-.006-.016-.005-.012-.004-.01-.005-.012-.007-.015-.005-.01-.004-.008-.009-.019-.02-.036-.007-.01a.808.808 0 0 0-.277-.277l-.011-.007-.026-.015-.009-.005-.037-.018-.015-.007-.012-.005-.01-.004-.012-.005-.016-.006-.01-.003-.009-.003-.019-.007-.04-.011-.04-.009-.041-.008-.042-.005-.042-.003L17.5.667Z"></path></svg></span></a><a href="https://blog.ag-grid.com/unit-testing-ag-grid-react-tables-with-react-testing-library-and-vitest/" class="_item_1ilfl_99" target="_blank"><span>React Testing Library<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 20 20" size="32" class="_icon_1jqgc_1 icon _externalIcon_1ilfl_197"><path d="M14.167 9.833v5a.833.833 0 0 1-.244.589l-.001.001a.833.833 0 0 1-.589.244H4.167a.837.837 0 0 1-.59-.244v-.001a.833.833 0 0 1-.244-.589V5.667c0-.221.088-.433.244-.59a.837.837 0 0 1 .59-.244h5a.833.833 0 0 0 0-1.666h-5a2.5 2.5 0 0 0-2.5 2.5v9.166a2.5 2.5 0 0 0 2.5 2.5h9.166a2.5 2.5 0 0 0 2.5-2.5v-5a.833.833 0 0 0-1.666 0ZM17.5.667h-5a.833.833 0 0 0 0 1.666h2.988l-7.744 7.744a.835.835 0 0 0 1.179 1.179l7.744-7.744V6.5a.833.833 0 0 0 1.666 0V1.499a.833.833 0 0 0-.023-.195l-.003-.012-.008-.029-.003-.011-.013-.038-.006-.016-.005-.012-.004-.01-.005-.012-.007-.015-.005-.01-.004-.008-.009-.019-.02-.036-.007-.01a.808.808 0 0 0-.277-.277l-.011-.007-.026-.015-.009-.005-.037-.018-.015-.007-.012-.005-.01-.004-.012-.005-.016-.006-.01-.003-.009-.003-.019-.007-.04-.011-.04-.009-.041-.008-.042-.005-.042-.003L17.5.667Z"></path></svg></span></a></div><a href="https://www.youtube.com/watch?v=6hxbPqziELk&list=PLsZlhayVgqNwHNHeqpCkSgdRV08xrKtzW&pp=gAQB" class="_item_1ilfl_99" target="_blank"><span>Video Tutorials<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 20 20" size="32" class="_icon_1jqgc_1 icon _externalIcon_1ilfl_197"><path d="M14.167 9.833v5a.833.833 0 0 1-.244.589l-.001.001a.833.833 0 0 1-.589.244H4.167a.837.837 0 0 1-.59-.244v-.001a.833.833 0 0 1-.244-.589V5.667c0-.221.088-.433.244-.59a.837.837 0 0 1 .59-.244h5a.833.833 0 0 0 0-1.666h-5a2.5 2.5 0 0 0-2.5 2.5v9.166a2.5 2.5 0 0 0 2.5 2.5h9.166a2.5 2.5 0 0 0 2.5-2.5v-5a.833.833 0 0 0-1.666 0ZM17.5.667h-5a.833.833 0 0 0 0 1.666h2.988l-7.744 7.744a.835.835 0 0 0 1.179 1.179l7.744-7.744V6.5a.833.833 0 0 0 1.666 0V1.499a.833.833 0 0 0-.023-.195l-.003-.012-.008-.029-.003-.011-.013-.038-.006-.016-.005-.012-.004-.01-.005-.012-.007-.015-.005-.01-.004-.008-.009-.019-.02-.036-.007-.01a.808.808 0 0 0-.277-.277l-.011-.007-.026-.015-.009-.005-.037-.018-.015-.007-.012-.005-.01-.004-.012-.005-.016-.006-.01-.003-.009-.003-.019-.007-.04-.011-.04-.009-.041-.008-.042-.005-.042-.003L17.5.667Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Compatibility & Security</span></button><div id="Compatibility & Security" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/compatibility/" class="_item_1ilfl_99"><span>Compatibility</span></a><a href="/react-data-grid/security/" class="_item_1ilfl_99"><span>Security</span></a><a href="/react-data-grid/supported-browsers/" class="_item_1ilfl_99"><span>Supported Browsers</span></a></div></div></div></div></div><hr class="_divider_1ilfl_115"/><div class="_section_1ilfl_92"><h5 class="_sectionTitle_1ilfl_97">Layout & Styling</h5><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Theming</span></button><div id="Theming" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/theming/" class="_item_1ilfl_99"><span>Overview</span></a><a href="/react-data-grid/themes/" class="_item_1ilfl_99"><span>Built-in Themes</span></a><a href="/react-data-grid/theming-parameters/" class="_item_1ilfl_99"><span>Theme Parameters</span></a><a href="/react-data-grid/theming-parts/" class="_item_1ilfl_99"><span>Theme Parts</span></a><a href="/react-data-grid/theming-colors/" class="_item_1ilfl_99"><span>Colors & Dark Mode</span></a><a href="/react-data-grid/theming-fonts/" class="_item_1ilfl_99"><span>Fonts</span></a><a href="/react-data-grid/theming-borders/" class="_item_1ilfl_99"><span>Borders</span></a><a href="/react-data-grid/theming-compactness/" class="_item_1ilfl_99"><span>Compactness & Row Height</span></a><a href="/react-data-grid/theming-selections/" class="_item_1ilfl_99"><span>Selections</span></a><a href="/react-data-grid/theming-headers/" class="_item_1ilfl_99"><span>Headers</span></a><a href="/react-data-grid/custom-icons/" class="_item_1ilfl_99"><span>Icons</span></a><a href="/react-data-grid/theming-tool-panels/" class="_item_1ilfl_99"><span>Tool Panels</span></a><a href="/react-data-grid/theming-widgets/" class="_item_1ilfl_99"><span>Inputs & Widgets</span></a><a href="/react-data-grid/theming-popups/" class="_item_1ilfl_99"><span>Menus & Popups</span></a><a href="/react-data-grid/theming-css/" class="_item_1ilfl_99"><span>Extending with CSS</span></a><a href="/react-data-grid/theming-distribution/" class="_item_1ilfl_99"><span>Distributing Shared Themes</span></a><a href="/react-data-grid/theming-migration/" class="_item_1ilfl_99"><span>Migration from v32</span></a><a href="/react-data-grid/theming-v32/" class="_item_1ilfl_99"><span>Legacy Themes</span></a></div></div></div></div><a href="/react-data-grid/ag-grid-design-system/" class="_item_1ilfl_99"><span>Design System</span></a><a href="/react-data-grid/grid-size/" class="_item_1ilfl_99"><span>Grid Layout</span></a></div><hr class="_divider_1ilfl_115"/><div class="_section_1ilfl_92"><h5 class="_sectionTitle_1ilfl_97">Charting</h5><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Sparklines</span></button><div id="Sparklines" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/sparklines-installation/" class="_item_1ilfl_99"><span>Install Sparklines<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-overview/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/sparklines-area-customisation/" class="_item_1ilfl_99"><span>Area<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-bar-customisation/" class="_item_1ilfl_99"><span>Bar<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-column-customisation/" class="_item_1ilfl_99"><span>Column<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-line-customisation/" class="_item_1ilfl_99"><span>Line<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/sparklines-data/" class="_item_1ilfl_99"><span>Sparkline Data<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-axis-types/" class="_item_1ilfl_99"><span>Axis Types<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-tooltips/" class="_item_1ilfl_99"><span>Tooltips<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-points-of-interest/" class="_item_1ilfl_99"><span>Points of Interest<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-api-sparkline-options/" class="_item_1ilfl_99"><span>Sparklines API<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/sparklines-api-sparkline-area/" class="_item_1ilfl_99"><span>Area<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-api-sparkline-bar/" class="_item_1ilfl_99"><span>Bar / Column<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/sparklines-api-sparkline-line/" class="_item_1ilfl_99"><span>Line<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Integrated Charts</span></button><div id="Integrated Charts" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/integrated-charts/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-installation/" class="_item_1ilfl_99"><span>Install Integrated Charts<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-user-created/" class="_item_1ilfl_99"><span>User Created Charts<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/integrated-charts-range-chart/" class="_item_1ilfl_99"><span>Range Chart<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-pivot-chart/" class="_item_1ilfl_99"><span>Pivot Chart<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/integrated-charts-application-created/" class="_item_1ilfl_99"><span>Application Created Charts<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/integrated-charts-api-range-chart/" class="_item_1ilfl_99"><span>Range Chart API<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-api-pivot-chart/" class="_item_1ilfl_99"><span>Pivot Chart API<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-api-cross-filter-chart/" class="_item_1ilfl_99"><span>Cross Filter API<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/integrated-charts-chart-types/" class="_item_1ilfl_99"><span>Chart Types<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-menu/" class="_item_1ilfl_99"><span>Chart Menu<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-chart-tool-panels/" class="_item_1ilfl_99"><span>Chart Tool Panels<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-container/" class="_item_1ilfl_99"><span>Chart Container<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-customisation/" class="_item_1ilfl_99"><span>Customisation<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-events/" class="_item_1ilfl_99"><span>Chart Events<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-time-series/" class="_item_1ilfl_99"><span>Time Series<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-api-save-restore-charts/" class="_item_1ilfl_99"><span>Save / Restore Charts<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/integrated-charts-api-downloading-image/" class="_item_1ilfl_99"><span>Chart Image Export<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Standalone Charts</span></button><div id="Standalone Charts" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="https://www.ag-grid.com/charts" class="_item_1ilfl_99" target="_blank"><span>See AG Charts<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 20 20" size="32" class="_icon_1jqgc_1 icon _externalIcon_1ilfl_197"><path d="M14.167 9.833v5a.833.833 0 0 1-.244.589l-.001.001a.833.833 0 0 1-.589.244H4.167a.837.837 0 0 1-.59-.244v-.001a.833.833 0 0 1-.244-.589V5.667c0-.221.088-.433.244-.59a.837.837 0 0 1 .59-.244h5a.833.833 0 0 0 0-1.666h-5a2.5 2.5 0 0 0-2.5 2.5v9.166a2.5 2.5 0 0 0 2.5 2.5h9.166a2.5 2.5 0 0 0 2.5-2.5v-5a.833.833 0 0 0-1.666 0ZM17.5.667h-5a.833.833 0 0 0 0 1.666h2.988l-7.744 7.744a.835.835 0 0 0 1.179 1.179l7.744-7.744V6.5a.833.833 0 0 0 1.666 0V1.499a.833.833 0 0 0-.023-.195l-.003-.012-.008-.029-.003-.011-.013-.038-.006-.016-.005-.012-.004-.01-.005-.012-.007-.015-.005-.01-.004-.008-.009-.019-.02-.036-.007-.01a.808.808 0 0 0-.277-.277l-.011-.007-.026-.015-.009-.005-.037-.018-.015-.007-.012-.005-.01-.004-.012-.005-.016-.006-.01-.003-.009-.003-.019-.007-.04-.011-.04-.009-.041-.008-.042-.005-.042-.003L17.5.667Z"></path></svg></span></a></div></div></div></div></div><hr class="_divider_1ilfl_115"/><div class="_section_1ilfl_92"><h5 class="_sectionTitle_1ilfl_97">Core Features</h5><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Columns</span></button><div id="Columns" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/configuration/" class="_item_1ilfl_99"><span>Configuration</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/column-definitions/" class="_item_1ilfl_99"><span>Column Definitions</span></a><a href="/react-data-grid/column-updating-definitions/" class="_item_1ilfl_99"><span>Updating Definitions</span></a><a href="/react-data-grid/column-state/" class="_item_1ilfl_99"><span>Column State</span></a></div><a href="/react-data-grid/column-headers/" class="_item_1ilfl_99"><span>Column Headers</span></a><a href="/react-data-grid/column-groups/" class="_item_1ilfl_99"><span>Column Groups</span></a><a href="/react-data-grid/column-sizing/" class="_item_1ilfl_99"><span>Column Sizing</span></a><a href="/react-data-grid/column-moving/" class="_item_1ilfl_99"><span>Column Moving</span></a><a href="/react-data-grid/column-pinning/" class="_item_1ilfl_99"><span>Column Pinning</span></a><a href="/react-data-grid/column-spanning/" class="_item_1ilfl_99"><span>Column Spanning</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Rows</span></button><div id="Rows" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/row-ids/" class="_item_1ilfl_99"><span>Row Data</span></a><a href="/react-data-grid/row-sorting/" class="_item_1ilfl_99"><span>Row Sorting</span></a><a href="/react-data-grid/row-numbers/" class="_item_1ilfl_99"><span>Row Numbers<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/row-spanning/" class="_item_1ilfl_99"><span>Row Spanning</span></a><a href="/react-data-grid/row-pinning/" class="_item_1ilfl_99"><span>Row Pinning</span></a><a href="/react-data-grid/row-height/" class="_item_1ilfl_99"><span>Row Height</span></a><a href="/react-data-grid/row-styles/" class="_item_1ilfl_99"><span>Styling Rows</span></a><a href="/react-data-grid/row-pagination/" class="_item_1ilfl_99"><span>Row Pagination</span></a><a href="/react-data-grid/accessing-data/" class="_item_1ilfl_99"><span>Accessing Rows</span></a><a href="/react-data-grid/row-dragging/" class="_item_1ilfl_99"><span>Row Dragging</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/row-dragging-to-external-dropzone/" class="_item_1ilfl_99"><span>External DropZone</span></a><a href="/react-data-grid/row-dragging-to-grid/" class="_item_1ilfl_99"><span>Grid to Grid</span></a></div><a href="/react-data-grid/full-width-rows/" class="_item_1ilfl_99"><span>Full Width Rows</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Cells</span></button><div id="Cells" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/cell-content/" class="_item_1ilfl_99"><span>Cell Content</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/value-getters/" class="_item_1ilfl_99"><span>Getting Values</span></a><a href="/react-data-grid/value-formatters/" class="_item_1ilfl_99"><span>Text Formatting</span></a><a href="/react-data-grid/component-cell-renderer/" class="_item_1ilfl_99"><span>Cell Components</span></a><a href="/react-data-grid/cell-data-types/" class="_item_1ilfl_99"><span>Cell Data Types</span></a></div><a href="/react-data-grid/cell-styles/" class="_item_1ilfl_99"><span>Styling Cells</span></a><a href="/react-data-grid/change-cell-renderers/" class="_item_1ilfl_99"><span>Highlighting Changes</span></a><a href="/react-data-grid/tooltips/" class="_item_1ilfl_99"><span>Tooltips</span></a><a href="/react-data-grid/cell-expressions/" class="_item_1ilfl_99"><span>Expressions</span></a><a href="/react-data-grid/view-refresh/" class="_item_1ilfl_99"><span>View Refresh</span></a><a href="/react-data-grid/reference-data/" class="_item_1ilfl_99"><span>Reference Data</span></a><a href="/react-data-grid/cell-text-selection/" class="_item_1ilfl_99"><span>Cell Text Selection</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Filtering</span></button><div id="Filtering" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/filtering-overview/" class="_item_1ilfl_99"><span>Overview</span></a><a href="/react-data-grid/filtering/" class="_item_1ilfl_99"><span>Column Filters</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/filter-text/" class="_item_1ilfl_99"><span>Text Filter</span></a><a href="/react-data-grid/filter-number/" class="_item_1ilfl_99"><span>Number Filter</span></a><a href="/react-data-grid/filter-date/" class="_item_1ilfl_99"><span>Date Filter</span></a><a href="/react-data-grid/filter-set/" class="_item_1ilfl_99"><span>Set Filter<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/filter-set-filter-list/" class="_item_1ilfl_99"><span>Filter List<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-set-data-updates/" class="_item_1ilfl_99"><span>Data Updates<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-set-tree-list/" class="_item_1ilfl_99"><span>Tree List<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-set-mini-filter/" class="_item_1ilfl_99"><span>Mini Filter<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-set-excel-mode/" class="_item_1ilfl_99"><span>Excel Mode<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-set-api/" class="_item_1ilfl_99"><span>API<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/filter-multi/" class="_item_1ilfl_99"><span>Multi Filter<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-conditions/" class="_item_1ilfl_99"><span>Filter Conditions</span></a><a href="/react-data-grid/filter-applying/" class="_item_1ilfl_99"><span>Applying Filters</span></a><a href="/react-data-grid/filter-api/" class="_item_1ilfl_99"><span>Filter API</span></a></div><a href="/react-data-grid/component-filter/" class="_item_1ilfl_99"><span>Custom Column Filters</span></a><a href="/react-data-grid/floating-filters/" class="_item_1ilfl_99"><span>Floating Filters</span></a><a href="/react-data-grid/component-floating-filter/" class="_item_1ilfl_99"><span>Custom Floating Filters</span></a><a href="/react-data-grid/filter-advanced/" class="_item_1ilfl_99"><span>Advanced Filter<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/filter-external/" class="_item_1ilfl_99"><span>External Filter</span></a><a href="/react-data-grid/filter-quick/" class="_item_1ilfl_99"><span>Quick Filter</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Selection</span></button><div id="Selection" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/row-selection/" class="_item_1ilfl_99"><span>Row Selection</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/row-selection-single-row/" class="_item_1ilfl_99"><span>Single Row Selection</span></a><a href="/react-data-grid/row-selection-multi-row/" class="_item_1ilfl_99"><span>Multi-Row Selection</span></a><a href="/react-data-grid/row-selection-api-reference/" class="_item_1ilfl_99"><span>API Reference</span></a></div><a href="/react-data-grid/cell-selection/" class="_item_1ilfl_99"><span>Cell Selection<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/cell-selection-handle/" class="_item_1ilfl_99"><span>Range Handle<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/cell-selection-fill-handle/" class="_item_1ilfl_99"><span>Fill Handle<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/cell-selection-api-reference/" class="_item_1ilfl_99"><span>API Reference<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Editing</span></button><div id="Editing" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/cell-editing/" class="_item_1ilfl_99"><span>Overview</span></a><a href="/react-data-grid/cell-editing-start-stop/" class="_item_1ilfl_99"><span>Start / Stop Editing</span></a><a href="/react-data-grid/value-parsers/" class="_item_1ilfl_99"><span>Parsing Values</span></a><a href="/react-data-grid/value-setters/" class="_item_1ilfl_99"><span>Saving Values</span></a><a href="/react-data-grid/cell-editors/" class="_item_1ilfl_99"><span>Edit Components</span></a><a href="/react-data-grid/provided-cell-editors/" class="_item_1ilfl_99"><span>Provided Cell Editors</span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/provided-cell-editors-text/" class="_item_1ilfl_99"><span>Text Editor</span></a><a href="/react-data-grid/provided-cell-editors-large-text/" class="_item_1ilfl_99"><span>Large Text Editor</span></a><a href="/react-data-grid/provided-cell-editors-select/" class="_item_1ilfl_99"><span>Select Editor</span></a><a href="/react-data-grid/provided-cell-editors-rich-select/" class="_item_1ilfl_99"><span>Rich Select Editor<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/provided-cell-editors-number/" class="_item_1ilfl_99"><span>Number Editor</span></a><a href="/react-data-grid/provided-cell-editors-date/" class="_item_1ilfl_99"><span>Date Editors</span></a><a href="/react-data-grid/provided-cell-editors-checkbox/" class="_item_1ilfl_99"><span>Checkbox Editor</span></a></div><a href="/react-data-grid/undo-redo-edits/" class="_item_1ilfl_99"><span>Undo / Redo Edits</span></a><a href="/react-data-grid/cell-editing-full-row/" class="_item_1ilfl_99"><span>Full Row</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Updating Data</span></button><div id="Updating Data" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/data-update-row-data/" class="_item_1ilfl_99"><span>Row Data</span></a><a href="/react-data-grid/data-update-single-row-cell/" class="_item_1ilfl_99"><span>Single Row / Cell</span></a><a href="/react-data-grid/data-update-transactions/" class="_item_1ilfl_99"><span>Transactions</span></a><a href="/react-data-grid/data-update-high-frequency/" class="_item_1ilfl_99"><span>High Frequency</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Interactivity</span></button><div id="Interactivity" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/keyboard-navigation/" class="_item_1ilfl_99"><span>Keyboard Navigation</span></a><a href="/react-data-grid/touch/" class="_item_1ilfl_99"><span>Touch</span></a><a href="/react-data-grid/accessibility/" class="_item_1ilfl_99"><span>Accessibility (ARIA)</span></a><a href="/react-data-grid/rtl/" class="_item_1ilfl_99"><span>RTL Text Direction</span></a><a href="/react-data-grid/localisation/" class="_item_1ilfl_99"><span>Localisation</span></a></div></div></div></div></div><hr class="_divider_1ilfl_115"/><div class="_section_1ilfl_92"><h5 class="_sectionTitle_1ilfl_97">Advanced Features</h5><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Row Grouping</span></button><div id="Row Grouping" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/grouping/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-data/" class="_item_1ilfl_99"><span>Grouping Data<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-display-types/" class="_item_1ilfl_99"><span>Group Display Types<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/grouping-single-group-column/" class="_item_1ilfl_99"><span>Single Column<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-multiple-group-columns/" class="_item_1ilfl_99"><span>Multiple Columns<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-group-rows/" class="_item_1ilfl_99"><span>Group Rows<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/grouping-group-panel/" class="_item_1ilfl_99"><span>Row Group Panel<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-opening-groups/" class="_item_1ilfl_99"><span>Expanding Groups<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-row-selection/" class="_item_1ilfl_99"><span>Hierarchy Selection<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/grouping-sorting/" class="_item_1ilfl_99"><span>Sorting<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Aggregation</span></button><div id="Aggregation" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/aggregation/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/aggregation-columns/" class="_item_1ilfl_99"><span>Configure Columns<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/aggregation-custom-functions/" class="_item_1ilfl_99"><span>Custom Functions<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/aggregation-total-rows/" class="_item_1ilfl_99"><span>Total Rows<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/aggregation-filtering/" class="_item_1ilfl_99"><span>Filtering <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Pivoting</span></button><div id="Pivoting" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/pivoting/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/pivoting-result-columns/" class="_item_1ilfl_99"><span>Pivot Result Columns<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/pivoting-column-groups/" class="_item_1ilfl_99"><span>Pivot Column Groups<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/pivoting-totals/" class="_item_1ilfl_99"><span>Pivot Totals<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Tree Data</span></button><div id="Tree Data" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/tree-data/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tree-data-data/" class="_item_1ilfl_99"><span>Supplying Data<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/tree-data-paths/" class="_item_1ilfl_99"><span>Data Paths<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tree-data-nesting/" class="_item_1ilfl_99"><span>Nested Records<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/tree-data-group-column/" class="_item_1ilfl_99"><span>Group Column<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tree-data-opening-groups/" class="_item_1ilfl_99"><span>Expanding Groups<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tree-data-selection/" class="_item_1ilfl_99"><span>Tree Selection<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tree-data-filtering/" class="_item_1ilfl_99"><span>Filtering<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Master Detail</span></button><div id="Master Detail" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/master-detail/" class="_item_1ilfl_99"><span>Overview<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-grids/" class="_item_1ilfl_99"><span>Detail Grids<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-height/" class="_item_1ilfl_99"><span>Detail Height<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-refresh/" class="_item_1ilfl_99"><span>Detail Refresh<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-master-rows/" class="_item_1ilfl_99"><span>Master Rows<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-nesting/" class="_item_1ilfl_99"><span>Nesting<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-custom-detail/" class="_item_1ilfl_99"><span>Custom Detail<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/master-detail-other/" class="_item_1ilfl_99"><span>Other<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Accessories</span></button><div id="Accessories" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/tool-panel/" class="_item_1ilfl_99"><span>Tool Panels<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/side-bar/" class="_item_1ilfl_99"><span>Side Bar<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tool-panel-columns/" class="_item_1ilfl_99"><span>Columns Tool Panel<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/tool-panel-filters/" class="_item_1ilfl_99"><span>Filters Tool Panel<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/component-tool-panel/" class="_item_1ilfl_99"><span>Custom Panel<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/column-menu/" class="_item_1ilfl_99"><span>Column Menu<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/context-menu/" class="_item_1ilfl_99"><span>Context Menu<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/component-menu-item/" class="_item_1ilfl_99"><span>Menu Item Component<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/status-bar/" class="_item_1ilfl_99"><span>Status Bar<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/overlays/" class="_item_1ilfl_99"><span>Overlays</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Server-Side Data</span></button><div id="Server-Side Data" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/row-models/" class="_item_1ilfl_99"><span>Row Models</span></a><a href="/react-data-grid/server-side-model/" class="_item_1ilfl_99"><span>Server-Side Row Model<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/server-side-model-api-reference/" class="_item_1ilfl_99"><span>API Reference<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-datasource/" class="_item_1ilfl_99"><span>Datasource<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-configuration/" class="_item_1ilfl_99"><span>Configuration<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-sorting/" class="_item_1ilfl_99"><span>Sorting<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-filtering/" class="_item_1ilfl_99"><span>Filtering<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-grouping/" class="_item_1ilfl_99"><span>Row Grouping<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-pivoting/" class="_item_1ilfl_99"><span>Pivoting<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-pagination/" class="_item_1ilfl_99"><span>Pagination<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-selection/" class="_item_1ilfl_99"><span>Row Selection<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/component-loading-cell-renderer/" class="_item_1ilfl_99"><span>Loading Component<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-changing-columns/" class="_item_1ilfl_99"><span>Changing Columns<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-updating/" class="_item_1ilfl_99"><span>Updating Data<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/server-side-model-updating-refresh/" class="_item_1ilfl_99"><span>Refresh<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-updating-single-row/" class="_item_1ilfl_99"><span>Single Row Updates<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-updating-transactions/" class="_item_1ilfl_99"><span>Transactions<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/server-side-model-retry/" class="_item_1ilfl_99"><span>Load Retry<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-row-height/" class="_item_1ilfl_99"><span>Row Height<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-master-detail/" class="_item_1ilfl_99"><span>Master Detail<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-model-tree-data/" class="_item_1ilfl_99"><span>Tree Data<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-operations-nodejs/" class="_item_1ilfl_99"><span>Example Node.js & MySQL<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-operations-graphql/" class="_item_1ilfl_99"><span>Example GraphQL & MySQL<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-operations-oracle/" class="_item_1ilfl_99"><span>Example Java & Oracle<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/server-side-operations-spark/" class="_item_1ilfl_99"><span>Example Java & Apache<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/infinite-scrolling/" class="_item_1ilfl_99"><span>Infinite Row Model</span></a><a href="/react-data-grid/viewport/" class="_item_1ilfl_99"><span>Viewport Row Model<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Import & Export</span></button><div id="Import & Export" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/csv-export/" class="_item_1ilfl_99"><span>CSV Export</span></a><a href="/react-data-grid/excel-export/" class="_item_1ilfl_99"><span>Excel Export<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><div class="_nestedItems_1ilfl_161"><a href="/react-data-grid/excel-export-api/" class="_item_1ilfl_99"><span>API Reference<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-styles/" class="_item_1ilfl_99"><span>Styles<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-formulas/" class="_item_1ilfl_99"><span>Formulas<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-extra-content/" class="_item_1ilfl_99"><span>Extra Content<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-customising-content/" class="_item_1ilfl_99"><span>Customising Content<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-images/" class="_item_1ilfl_99"><span>Images<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-tables/" class="_item_1ilfl_99"><span>Excel Tables<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-multiple-sheets/" class="_item_1ilfl_99"><span>Multiple Sheets<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-rows/" class="_item_1ilfl_99"><span>Rows<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-columns/" class="_item_1ilfl_99"><span>Columns<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-freeze/" class="_item_1ilfl_99"><span>Freezing Content<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-data-types/" class="_item_1ilfl_99"><span>Data Types<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-hyperlinks/" class="_item_1ilfl_99"><span>Hyperlinks<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-master-detail/" class="_item_1ilfl_99"><span>Master Detail<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/excel-export-page-setup/" class="_item_1ilfl_99"><span>Page Setup<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a></div><a href="/react-data-grid/clipboard/" class="_item_1ilfl_99"><span>Clipboard<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _enterpriseIcon_1ilfl_211"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></a><a href="/react-data-grid/drag-and-drop/" class="_item_1ilfl_99"><span>Drag & Drop</span></a><a href="/react-data-grid/printing/" class="_item_1ilfl_99"><span>Printing</span></a><a href="/react-data-grid/excel-import/" class="_item_1ilfl_99"><span>Import Excel</span></a></div></div></div></div><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Performance</span></button><div id="Performance" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/dom-virtualisation/" class="_item_1ilfl_99"><span>DOM Virtualisation</span></a><a href="/react-data-grid/value-cache/" class="_item_1ilfl_99"><span>Value Cache</span></a><a href="/react-data-grid/row-animation/" class="_item_1ilfl_99"><span>Row Animation</span></a><a href="/react-data-grid/massive-row-count/" class="_item_1ilfl_99"><span>Massive Row Count</span></a><a href="/react-data-grid/scrolling-performance/" class="_item_1ilfl_99"><span>Scrolling Performance</span></a></div></div></div></div></div><hr class="_divider_1ilfl_115"/><div class="_section_1ilfl_92"><h5 class="_sectionTitle_1ilfl_97">Miscellaneous</h5><div class="_group_1ilfl_98"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Migration</span></button><div id="Migration" aria-hidden="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/upgrading-to-ag-grid-33-1/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 33.1</span></a><a href="/react-data-grid/upgrading-to-ag-grid-33/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 33</span></a><a href="/react-data-grid/upgrading-to-ag-grid-32-3/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 32.3</span></a><a href="/react-data-grid/upgrading-to-ag-grid-32-2-1/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 32.2.1</span></a><a href="/react-data-grid/upgrading-to-ag-grid-32-1/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 32.1</span></a><a href="/react-data-grid/upgrading-to-ag-grid-32/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 32</span></a><a href="/react-data-grid/upgrading-to-ag-grid-31-3/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 31.3</span></a><a href="/react-data-grid/upgrading-to-ag-grid-31-2/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 31.2</span></a><a href="/react-data-grid/upgrading-to-ag-grid-31-1/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 31.1</span></a><a href="/react-data-grid/upgrading-to-ag-grid-31/" class="_item_1ilfl_99"><span>Upgrading to AG Grid 31</span></a><a href="/react-data-grid/upgrading-to-older-versions/" class="_item_1ilfl_99"><span>Upgrading to Older Versions</span></a><a href="/react-data-grid/codemods/" class="_item_1ilfl_99"><span>Codemods</span></a></div></div></div></div><div class="_group_1ilfl_98 _isOpen_1ilfl_151"><button class="button-style-none _groupTitle_1ilfl_98"><svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon _groupChevron_1ilfl_137"><path d="M9.763 8.237 17.525 16l-7.762 7.763 2.474 2.474L22.475 16 12.237 5.763 9.763 8.237Z"></path></svg><span>Other</span></button><div id="Other" aria-hidden="false" class="rah-static rah-static--height-auto " style="height:auto;overflow:visible"><div><div class="_groupChildren_1ilfl_156"><a href="/react-data-grid/context/" class="_item_1ilfl_99"><span>Context</span></a><a href="/react-data-grid/change-detection/" class="_item_1ilfl_99"><span>Change Detection</span></a><a href="/react-data-grid/components/" class="_item_1ilfl_99 _isActive_1ilfl_172"><span>Custom Components</span></a><a href="/react-data-grid/aligned-grids/" class="_item_1ilfl_99"><span>Aligned Grids</span></a></div></div></div></div></div></div></div></div></div></astro-island><div id="doc-content" class="_docPage_cb2ib_11"><astro-island uid="Z5kE1V" prefix="r1" component-url="/_astro/Header.BT5yBZus.js" component-export="Header" renderer-url="/_astro/client.5kNSwotS.js" props="{"title":[0,"Custom Components"],"framework":[0,"react"],"isEnterprise":[0],"path":[0,"/react-data-grid/components/"],"menuItems":[1,[[0,{"title":[0,"Getting Started"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Quick Start"],"path":[0,"getting-started"]}],[0,{"type":[0,"item"],"title":[0,"Key Features"],"path":[0,"key-features"]}],[0,{"type":[0,"item"],"title":[0,"Community vs. Enterprise"],"path":[0,"community-vs-enterprise"]}],[0,{"title":[0,"Setup"],"type":[0,"group"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Installation"],"path":[0,"installation"]}],[0,{"title":[0,"Registering Modules"],"path":[0,"modules"]}],[0,{"title":[0,"Installing Enterprise Licence"],"path":[0,"license-install"]}]]]}],[0,{"title":[0,"Tutorials"],"type":[0,"group"],"children":[1,[[0,{"title":[0,"Creating a Basic Grid"],"path":[0,"deep-dive"]}],[0,{"title":[0,"Best Practices"],"path":[0,"react-hooks"],"frameworks":[1,[[0,"react"]]]}],[0,{"title":[0,"Testing"],"type":[0,"group"],"frameworks":[1,[[0,"angular"],[0,"react"]]],"children":[1,[[0,{"title":[0,"Overview"],"path":[0,"testing"],"frameworks":[1,[[0,"angular"],[0,"react"]]]}],[0,{"type":[0,"item"],"title":[0,"Testing Async"],"path":[0,"testing-async"],"frameworks":[1,[[0,"angular"]]]}],[0,{"title":[0,"Playwright"],"url":[0,"https://blog.ag-grid.com/writing-e2e-tests-for-ag-grid-react-tables-with-playwright/"],"frameworks":[1,[[0,"react"]]]}],[0,{"title":[0,"Cypress"],"url":[0,"https://blog.ag-grid.com/end-to-end-testing-for-ag-grid-in-react-with-cypress/"],"frameworks":[1,[[0,"react"]]]}],[0,{"title":[0,"React Testing Library"],"url":[0,"https://blog.ag-grid.com/unit-testing-ag-grid-react-tables-with-react-testing-library-and-vitest/"],"frameworks":[1,[[0,"react"]]]}]]]}],[0,{"title":[0,"Testing"],"type":[0,"item"],"path":[0,"testing"],"frameworks":[1,[[0,"javascript"],[0,"vue"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=6hxbPqziELk&list=PLsZlhayVgqNwHNHeqpCkSgdRV08xrKtzW&pp=gAQB"],"frameworks":[1,[[0,"react"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=X_Ip_jGDtho&list=PLsZlhayVgqNw6VHFn4j6FcJM5vLACsf0x&pp=gAQB"],"frameworks":[1,[[0,"angular"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=V14w_NFuZB4&list=PLsZlhayVgqNz5iC0wFQDgixcAepFyrWbP&pp=gAQB"],"frameworks":[1,[[0,"vue"]]]}],[0,{"type":[0,"item"],"title":[0,"Video Tutorials"],"url":[0,"https://www.youtube.com/watch?v=Ww7-LC6rU6U&list=PLsZlhayVgqNxijfRQxg5Mc6W4MzZHQ9MK&pp=gAQB"],"frameworks":[1,[[0,"javascript"]]]}]]]}],[0,{"title":[0,"Compatibility & Security"],"type":[0,"group"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Compatibility"],"path":[0,"compatibility"]}],[0,{"type":[0,"item"],"title":[0,"Security"],"path":[0,"security"]}],[0,{"type":[0,"item"],"title":[0,"Supported Browsers"],"path":[0,"supported-browsers"]}]]]}]]]}],[0,{"title":[0,"Layout & Styling"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Theming"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"theming"]}],[0,{"type":[0,"item"],"title":[0,"Built-in Themes"],"path":[0,"themes"]}],[0,{"type":[0,"item"],"title":[0,"Theme Parameters"],"path":[0,"theming-parameters"]}],[0,{"type":[0,"item"],"title":[0,"Theme Parts"],"path":[0,"theming-parts"]}],[0,{"type":[0,"item"],"title":[0,"Colors & Dark Mode"],"path":[0,"theming-colors"]}],[0,{"type":[0,"item"],"title":[0,"Fonts"],"path":[0,"theming-fonts"]}],[0,{"type":[0,"item"],"title":[0,"Borders"],"path":[0,"theming-borders"]}],[0,{"type":[0,"item"],"title":[0,"Compactness & Row Height"],"path":[0,"theming-compactness"]}],[0,{"type":[0,"item"],"title":[0,"Selections"],"path":[0,"theming-selections"]}],[0,{"type":[0,"item"],"title":[0,"Headers"],"path":[0,"theming-headers"]}],[0,{"type":[0,"item"],"title":[0,"Icons"],"path":[0,"custom-icons"]}],[0,{"type":[0,"item"],"title":[0,"Tool Panels"],"path":[0,"theming-tool-panels"]}],[0,{"type":[0,"item"],"title":[0,"Inputs & Widgets"],"path":[0,"theming-widgets"]}],[0,{"type":[0,"item"],"title":[0,"Menus & Popups"],"path":[0,"theming-popups"]}],[0,{"type":[0,"item"],"title":[0,"Extending with CSS"],"path":[0,"theming-css"]}],[0,{"type":[0,"item"],"title":[0,"Distributing Shared Themes"],"path":[0,"theming-distribution"]}],[0,{"type":[0,"item"],"title":[0,"Migration from v32"],"path":[0,"theming-migration"]}],[0,{"type":[0,"item"],"title":[0,"Legacy Themes"],"path":[0,"theming-v32"],"childPaths":[1,[[0,"theming-v32-custom-icons"],[0,"theming-v32-customisation"],[0,"theming-v32-customisation-borders"],[0,"theming-v32-customisation-colours"],[0,"theming-v32-customisation-compactness"],[0,"theming-v32-customisation-css"],[0,"theming-v32-customisation-headers"],[0,"theming-v32-customisation-popups"],[0,"theming-v32-customisation-sass"],[0,"theming-v32-customisation-sass-legacy"],[0,"theming-v32-customisation-selections"],[0,"theming-v32-customisation-tool-panels"],[0,"theming-v32-customisation-variables"],[0,"theming-v32-customisation-widgets"],[0,"theming-v32-themes"],[0,"theming-v32-upgrading-to-v28"],[0,"theming-v32-upgrading-to-v28-css"],[0,"theming-v32-upgrading-to-v28-sass"]]]}]]]}],[0,{"type":[0,"item"],"title":[0,"Design System"],"path":[0,"ag-grid-design-system"]}],[0,{"type":[0,"item"],"title":[0,"Grid Layout"],"path":[0,"grid-size"]}]]]}],[0,{"title":[0,"Charting"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Sparklines"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Install Sparklines"],"path":[0,"sparklines-installation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"sparklines-overview"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Area"],"path":[0,"sparklines-area-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Bar"],"path":[0,"sparklines-bar-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Column"],"path":[0,"sparklines-column-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Line"],"path":[0,"sparklines-line-customisation"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Sparkline Data"],"path":[0,"sparklines-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Axis Types"],"path":[0,"sparklines-axis-types"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tooltips"],"path":[0,"sparklines-tooltips"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Points of Interest"],"path":[0,"sparklines-points-of-interest"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Sparklines API"],"path":[0,"sparklines-api-sparkline-options"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Area"],"path":[0,"sparklines-api-sparkline-area"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Bar / Column"],"path":[0,"sparklines-api-sparkline-bar"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Line"],"path":[0,"sparklines-api-sparkline-line"],"isEnterprise":[0,true]}]]]}]]]}],[0,{"type":[0,"group"],"title":[0,"Integrated Charts"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"integrated-charts"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Install Integrated Charts"],"path":[0,"integrated-charts-installation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"User Created Charts"],"path":[0,"integrated-charts-user-created"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Range Chart"],"path":[0,"integrated-charts-range-chart"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Chart"],"path":[0,"integrated-charts-pivot-chart"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Application Created Charts"],"path":[0,"integrated-charts-application-created"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Range Chart API"],"path":[0,"integrated-charts-api-range-chart"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Chart API"],"path":[0,"integrated-charts-api-pivot-chart"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Cross Filter API"],"path":[0,"integrated-charts-api-cross-filter-chart"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Chart Types"],"path":[0,"integrated-charts-chart-types"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Menu"],"path":[0,"integrated-charts-menu"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Tool Panels"],"path":[0,"integrated-charts-chart-tool-panels"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Container"],"path":[0,"integrated-charts-container"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Customisation"],"path":[0,"integrated-charts-customisation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Events"],"path":[0,"integrated-charts-events"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Time Series"],"path":[0,"integrated-charts-time-series"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Save / Restore Charts"],"path":[0,"integrated-charts-api-save-restore-charts"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Chart Image Export"],"path":[0,"integrated-charts-api-downloading-image"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Standalone Charts"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"See AG Charts"],"url":[0,"https://www.ag-grid.com/charts"]}]]]}]]]}],[0,{"title":[0,"Core Features"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Columns"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Configuration"],"path":[0,"configuration"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Column Definitions"],"path":[0,"column-definitions"]}],[0,{"type":[0,"item"],"title":[0,"Updating Definitions"],"path":[0,"column-updating-definitions"]}],[0,{"type":[0,"item"],"title":[0,"Column State"],"path":[0,"column-state"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Column Headers"],"path":[0,"column-headers"]}],[0,{"type":[0,"item"],"title":[0,"Column Groups"],"path":[0,"column-groups"]}],[0,{"type":[0,"item"],"title":[0,"Column Sizing"],"path":[0,"column-sizing"]}],[0,{"type":[0,"item"],"title":[0,"Column Moving"],"path":[0,"column-moving"]}],[0,{"type":[0,"item"],"title":[0,"Column Pinning"],"path":[0,"column-pinning"]}],[0,{"type":[0,"item"],"title":[0,"Column Spanning"],"path":[0,"column-spanning"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Rows"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Data"],"path":[0,"row-ids"]}],[0,{"type":[0,"item"],"title":[0,"Row Sorting"],"path":[0,"row-sorting"]}],[0,{"type":[0,"item"],"title":[0,"Row Numbers"],"path":[0,"row-numbers"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Spanning"],"path":[0,"row-spanning"]}],[0,{"type":[0,"item"],"title":[0,"Row Pinning"],"path":[0,"row-pinning"]}],[0,{"type":[0,"item"],"title":[0,"Row Height"],"path":[0,"row-height"]}],[0,{"type":[0,"item"],"title":[0,"Styling Rows"],"path":[0,"row-styles"]}],[0,{"type":[0,"item"],"title":[0,"Row Pagination"],"path":[0,"row-pagination"]}],[0,{"type":[0,"item"],"title":[0,"Accessing Rows"],"path":[0,"accessing-data"]}],[0,{"type":[0,"item"],"title":[0,"Row Dragging"],"path":[0,"row-dragging"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"External DropZone"],"path":[0,"row-dragging-to-external-dropzone"]}],[0,{"type":[0,"item"],"title":[0,"Grid to Grid"],"path":[0,"row-dragging-to-grid"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Full Width Rows"],"path":[0,"full-width-rows"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Cells"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Cell Content"],"path":[0,"cell-content"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Getting Values"],"path":[0,"value-getters"]}],[0,{"type":[0,"item"],"title":[0,"Text Formatting"],"path":[0,"value-formatters"]}],[0,{"type":[0,"item"],"title":[0,"Cell Components"],"path":[0,"component-cell-renderer"]}],[0,{"type":[0,"item"],"title":[0,"Cell Data Types"],"path":[0,"cell-data-types"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Styling Cells"],"path":[0,"cell-styles"]}],[0,{"type":[0,"item"],"title":[0,"Highlighting Changes"],"path":[0,"change-cell-renderers"]}],[0,{"type":[0,"item"],"title":[0,"Tooltips"],"path":[0,"tooltips"]}],[0,{"type":[0,"item"],"title":[0,"Expressions"],"path":[0,"cell-expressions"]}],[0,{"type":[0,"item"],"title":[0,"View Refresh"],"path":[0,"view-refresh"]}],[0,{"type":[0,"item"],"title":[0,"Reference Data"],"path":[0,"reference-data"]}],[0,{"type":[0,"item"],"title":[0,"Cell Text Selection"],"path":[0,"cell-text-selection"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Filtering"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"filtering-overview"]}],[0,{"type":[0,"item"],"title":[0,"Column Filters"],"path":[0,"filtering"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Text Filter"],"path":[0,"filter-text"]}],[0,{"type":[0,"item"],"title":[0,"Number Filter"],"path":[0,"filter-number"]}],[0,{"type":[0,"item"],"title":[0,"Date Filter"],"path":[0,"filter-date"]}],[0,{"type":[0,"item"],"title":[0,"Set Filter"],"path":[0,"filter-set"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Filter List"],"path":[0,"filter-set-filter-list"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Data Updates"],"path":[0,"filter-set-data-updates"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tree List"],"path":[0,"filter-set-tree-list"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Mini Filter"],"path":[0,"filter-set-mini-filter"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Excel Mode"],"path":[0,"filter-set-excel-mode"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"API"],"path":[0,"filter-set-api"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Multi Filter"],"path":[0,"filter-multi"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filter Conditions"],"path":[0,"filter-conditions"]}],[0,{"type":[0,"item"],"title":[0,"Applying Filters"],"path":[0,"filter-applying"]}],[0,{"type":[0,"item"],"title":[0,"Filter API"],"path":[0,"filter-api"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Custom Column Filters"],"path":[0,"component-filter"]}],[0,{"type":[0,"item"],"title":[0,"Floating Filters"],"path":[0,"floating-filters"]}],[0,{"type":[0,"item"],"title":[0,"Custom Floating Filters"],"path":[0,"component-floating-filter"]}],[0,{"type":[0,"item"],"title":[0,"Advanced Filter"],"path":[0,"filter-advanced"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"External Filter"],"path":[0,"filter-external"]}],[0,{"type":[0,"item"],"title":[0,"Quick Filter"],"path":[0,"filter-quick"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Selection"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Selection"],"path":[0,"row-selection"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Single Row Selection"],"path":[0,"row-selection-single-row"]}],[0,{"type":[0,"item"],"title":[0,"Multi-Row Selection"],"path":[0,"row-selection-multi-row"]}],[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"row-selection-api-reference"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Cell Selection"],"path":[0,"cell-selection"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Range Handle"],"path":[0,"cell-selection-handle"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Fill Handle"],"path":[0,"cell-selection-fill-handle"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"cell-selection-api-reference"],"isEnterprise":[0,true]}]]]}]]]}],[0,{"type":[0,"group"],"title":[0,"Editing"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"cell-editing"]}],[0,{"type":[0,"item"],"title":[0,"Start / Stop Editing"],"path":[0,"cell-editing-start-stop"]}],[0,{"type":[0,"item"],"title":[0,"Parsing Values"],"path":[0,"value-parsers"]}],[0,{"type":[0,"item"],"title":[0,"Saving Values"],"path":[0,"value-setters"]}],[0,{"type":[0,"item"],"title":[0,"Edit Components"],"path":[0,"cell-editors"]}],[0,{"type":[0,"item"],"title":[0,"Provided Cell Editors"],"path":[0,"provided-cell-editors"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Text Editor"],"path":[0,"provided-cell-editors-text"]}],[0,{"type":[0,"item"],"title":[0,"Large Text Editor"],"path":[0,"provided-cell-editors-large-text"]}],[0,{"type":[0,"item"],"title":[0,"Select Editor"],"path":[0,"provided-cell-editors-select"]}],[0,{"type":[0,"item"],"title":[0,"Rich Select Editor"],"path":[0,"provided-cell-editors-rich-select"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Number Editor"],"path":[0,"provided-cell-editors-number"]}],[0,{"type":[0,"item"],"title":[0,"Date Editors"],"path":[0,"provided-cell-editors-date"]}],[0,{"type":[0,"item"],"title":[0,"Checkbox Editor"],"path":[0,"provided-cell-editors-checkbox"]}]]]}],[0,{"type":[0,"item"],"title":[0,"Undo / Redo Edits"],"path":[0,"undo-redo-edits"]}],[0,{"type":[0,"item"],"title":[0,"Full Row"],"path":[0,"cell-editing-full-row"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Updating Data"],"path":[0,"data-update"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Data"],"path":[0,"data-update-row-data"]}],[0,{"type":[0,"item"],"title":[0,"Single Row / Cell"],"path":[0,"data-update-single-row-cell"]}],[0,{"type":[0,"item"],"title":[0,"Transactions"],"path":[0,"data-update-transactions"]}],[0,{"type":[0,"item"],"title":[0,"High Frequency"],"path":[0,"data-update-high-frequency"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Interactivity"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Keyboard Navigation"],"path":[0,"keyboard-navigation"]}],[0,{"type":[0,"item"],"title":[0,"Touch"],"path":[0,"touch"]}],[0,{"type":[0,"item"],"title":[0,"Accessibility (ARIA)"],"path":[0,"accessibility"]}],[0,{"type":[0,"item"],"title":[0,"RTL Text Direction"],"path":[0,"rtl"]}],[0,{"type":[0,"item"],"title":[0,"Localisation"],"path":[0,"localisation"]}]]]}]]]}],[0,{"title":[0,"Advanced Features"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Row Grouping"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"grouping"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Grouping Data"],"path":[0,"grouping-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Group Display Types"],"path":[0,"grouping-display-types"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Single Column"],"path":[0,"grouping-single-group-column"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Multiple Columns"],"path":[0,"grouping-multiple-group-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Group Rows"],"path":[0,"grouping-group-rows"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Row Group Panel"],"path":[0,"grouping-group-panel"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Expanding Groups"],"path":[0,"grouping-opening-groups"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Hierarchy Selection"],"path":[0,"grouping-row-selection"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Sorting"],"path":[0,"grouping-sorting"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Aggregation"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"aggregation"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Configure Columns"],"path":[0,"aggregation-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Custom Functions"],"path":[0,"aggregation-custom-functions"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Total Rows"],"path":[0,"aggregation-total-rows"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filtering "],"path":[0,"aggregation-filtering"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Pivoting"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"pivoting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Result Columns"],"path":[0,"pivoting-result-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Column Groups"],"path":[0,"pivoting-column-groups"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivot Totals"],"path":[0,"pivoting-totals"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Tree Data"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"tree-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Supplying Data"],"path":[0,"tree-data-data"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Data Paths"],"path":[0,"tree-data-paths"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Nested Records"],"path":[0,"tree-data-nesting"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Group Column"],"path":[0,"tree-data-group-column"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Expanding Groups"],"path":[0,"tree-data-opening-groups"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tree Selection"],"path":[0,"tree-data-selection"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filtering"],"path":[0,"tree-data-filtering"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Master Detail"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Overview"],"path":[0,"master-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Detail Grids"],"path":[0,"master-detail-grids"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Detail Height"],"path":[0,"master-detail-height"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Detail Refresh"],"path":[0,"master-detail-refresh"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Master Rows"],"path":[0,"master-detail-master-rows"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Nesting"],"path":[0,"master-detail-nesting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Custom Detail"],"path":[0,"master-detail-custom-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Other"],"path":[0,"master-detail-other"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Accessories"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Tool Panels"],"path":[0,"tool-panel"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Side Bar"],"path":[0,"side-bar"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Columns Tool Panel"],"path":[0,"tool-panel-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filters Tool Panel"],"path":[0,"tool-panel-filters"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Custom Panel"],"path":[0,"component-tool-panel"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Column Menu"],"path":[0,"column-menu"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Context Menu"],"path":[0,"context-menu"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Menu Item Component"],"path":[0,"component-menu-item"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Status Bar"],"path":[0,"status-bar"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Overlays"],"path":[0,"overlays"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Server-Side Data"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Row Models"],"path":[0,"row-models"]}],[0,{"type":[0,"item"],"title":[0,"Server-Side Row Model"],"path":[0,"server-side-model"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"server-side-model-api-reference"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Datasource"],"path":[0,"server-side-model-datasource"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Configuration"],"path":[0,"server-side-model-configuration"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Sorting"],"path":[0,"server-side-model-sorting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Filtering"],"path":[0,"server-side-model-filtering"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Grouping"],"path":[0,"server-side-model-grouping"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pivoting"],"path":[0,"server-side-model-pivoting"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Pagination"],"path":[0,"server-side-model-pagination"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Selection"],"path":[0,"server-side-model-selection"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Loading Component"],"path":[0,"component-loading-cell-renderer"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Changing Columns"],"path":[0,"server-side-model-changing-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Updating Data"],"path":[0,"server-side-model-updating"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Refresh"],"path":[0,"server-side-model-updating-refresh"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Single Row Updates"],"path":[0,"server-side-model-updating-single-row"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Transactions"],"path":[0,"server-side-model-updating-transactions"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Load Retry"],"path":[0,"server-side-model-retry"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Row Height"],"path":[0,"server-side-model-row-height"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Master Detail"],"path":[0,"server-side-model-master-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Tree Data"],"path":[0,"server-side-model-tree-data"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example Node.js & MySQL"],"path":[0,"server-side-operations-nodejs"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example GraphQL & MySQL"],"path":[0,"server-side-operations-graphql"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example Java & Oracle"],"path":[0,"server-side-operations-oracle"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Example Java & Apache"],"path":[0,"server-side-operations-spark"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Infinite Row Model"],"path":[0,"infinite-scrolling"]}],[0,{"type":[0,"item"],"title":[0,"Viewport Row Model"],"path":[0,"viewport"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"group"],"title":[0,"Import & Export"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"CSV Export"],"path":[0,"csv-export"]}],[0,{"type":[0,"item"],"title":[0,"Excel Export"],"path":[0,"excel-export"],"isEnterprise":[0,true],"children":[1,[[0,{"type":[0,"item"],"title":[0,"API Reference"],"path":[0,"excel-export-api"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Styles"],"path":[0,"excel-export-styles"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Formulas"],"path":[0,"excel-export-formulas"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Extra Content"],"path":[0,"excel-export-extra-content"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Customising Content"],"path":[0,"excel-export-customising-content"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Images"],"path":[0,"excel-export-images"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Excel Tables"],"path":[0,"excel-export-tables"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Multiple Sheets"],"path":[0,"excel-export-multiple-sheets"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Rows"],"path":[0,"excel-export-rows"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Columns"],"path":[0,"excel-export-columns"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Freezing Content"],"path":[0,"excel-export-freeze"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Data Types"],"path":[0,"excel-export-data-types"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Hyperlinks"],"path":[0,"excel-export-hyperlinks"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Master Detail"],"path":[0,"excel-export-master-detail"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Page Setup"],"path":[0,"excel-export-page-setup"],"isEnterprise":[0,true]}]]]}],[0,{"type":[0,"item"],"title":[0,"Clipboard"],"path":[0,"clipboard"],"isEnterprise":[0,true]}],[0,{"type":[0,"item"],"title":[0,"Drag & Drop"],"path":[0,"drag-and-drop"]}],[0,{"type":[0,"item"],"title":[0,"Printing"],"path":[0,"printing"]}],[0,{"type":[0,"item"],"title":[0,"Import Excel"],"path":[0,"excel-import"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Performance"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"DOM Virtualisation"],"path":[0,"dom-virtualisation"]}],[0,{"type":[0,"item"],"title":[0,"Value Cache"],"path":[0,"value-cache"]}],[0,{"type":[0,"item"],"title":[0,"Row Animation"],"path":[0,"row-animation"]}],[0,{"type":[0,"item"],"title":[0,"Massive Row Count"],"path":[0,"massive-row-count"]}],[0,{"type":[0,"item"],"title":[0,"Scrolling Performance"],"path":[0,"scrolling-performance"]}],[0,{"type":[0,"item"],"title":[0,"NgZone"],"path":[0,"angular-ngzone"],"frameworks":[1,[[0,"angular"]]]}]]]}]]]}],[0,{"type":[0,"item"],"title":[0,"Miscellaneous"],"children":[1,[[0,{"type":[0,"group"],"title":[0,"Migration"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 33.1"],"path":[0,"upgrading-to-ag-grid-33-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 33"],"path":[0,"upgrading-to-ag-grid-33"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32.3"],"path":[0,"upgrading-to-ag-grid-32-3"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32.2.1"],"path":[0,"upgrading-to-ag-grid-32-2-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32.1"],"path":[0,"upgrading-to-ag-grid-32-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 32"],"path":[0,"upgrading-to-ag-grid-32"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31.3"],"path":[0,"upgrading-to-ag-grid-31-3"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31.2"],"path":[0,"upgrading-to-ag-grid-31-2"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31.1"],"path":[0,"upgrading-to-ag-grid-31-1"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to AG Grid 31"],"path":[0,"upgrading-to-ag-grid-31"]}],[0,{"type":[0,"item"],"title":[0,"Upgrading to Older Versions"],"path":[0,"upgrading-to-older-versions"]}],[0,{"type":[0,"item"],"title":[0,"Codemods"],"path":[0,"codemods"]}]]]}],[0,{"type":[0,"group"],"title":[0,"Other"],"children":[1,[[0,{"type":[0,"item"],"title":[0,"Context"],"path":[0,"context"]}],[0,{"type":[0,"item"],"title":[0,"Change Detection"],"path":[0,"change-detection"]}],[0,{"type":[0,"item"],"title":[0,"Custom Components"],"path":[0,"components"]}],[0,{"type":[0,"item"],"title":[0,"Aligned Grids"],"path":[0,"aligned-grids"]}]]]}]]]}]]]}" ssr="" client="load" opts="{"name":"Header","value":true}" await-children=""><header class="_docsPageHeader_cs9nc_1"><div id="top" class="_docsPageTitle_cs9nc_5"><div class="_pageTitleContainer_cs9nc_20"><div class="_pageTitleGroup_cs9nc_38"><h1><span class="_headerFramework_cs9nc_49">React Data Grid</span>Custom Components</h1></div><div><button type="button" role="combobox" aria-controls="radix-:r1R9:" aria-expanded="false" aria-autocomplete="none" dir="ltr" data-state="closed" tabindex="0" aria-label="Framework selector" class="_trigger_65kp2_1 _large_65kp2_1"><span style="pointer-events:none"><span class="_frameworkItem_192zo_7"><img src="/_astro/react.CtDRhtxt.svg" alt="react logo" class="_frameworkLogo_192zo_1"/>React</span></span><span aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down _chevronDown_65kp2_105"><path d="m6 9 6 6 6-6"></path></svg></span></button><select aria-hidden="true" tabindex="-1" style="position:absolute;border:0;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;word-wrap:normal"></select></div></div></div></header></astro-island><div class="_pageSections_cb2ib_29"><script>(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event("astro:only"));})();</script><article><div class="_videoSection_1faha_1"> <div class="_header_1faha_14"><p>You can create your own Custom Components to customise the behaviour of the grid. For example you can customise how cells are rendered, how values are edited and also create your own filters.</p></div> <a href="https://www.youtube.com/watch?v=eglfpHRpcu0" target="_blank"> <div class="_ytContainer_1faha_18"> <img src="https://img.youtube.com/vi/eglfpHRpcu0/0.jpg" alt="React Custom Components thumbnail" class="_ytThumbnail_1faha_47"> <svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon _ytIcon_1faha_35" xmlns="http://www.w3.org/2000/svg"><path d="M29.41,9.26a3.5,3.5,0,0,0-2.47-2.47C24.76,6.2,16,6.2,16,6.2s-8.76,0-10.94.59A3.5,3.5,0,0,0,2.59,9.26,36.13,36.13,0,0,0,2,16a36.13,36.13,0,0,0,.59,6.74,3.5,3.5,0,0,0,2.47,2.47C7.24,25.8,16,25.8,16,25.8s8.76,0,10.94-.59a3.5,3.5,0,0,0,2.47-2.47A36.13,36.13,0,0,0,30,16,36.13,36.13,0,0,0,29.41,9.26ZM13.2,20.2V11.8L20.47,16Z"></path></svg> </div> </a> </div><div data-meta="[&quot;frameworkComponents&quot;,&quot;cellRendererFramework&quot;]"></div><p>The full list of component types you can provide in the grid are as follows:</p><ul><li><a href="/react-data-grid/component-cell-renderer/">Cell Component</a>: To customise the contents of a cell.</li><li><a href="/react-data-grid/column-headers/#custom-component">Header Component</a>: To customise the header of a column.</li><li><a href="/react-data-grid/column-headers/#inner-header-component">Inner Header Component</a>: To customise the inner header of a column.</li><li><a href="/react-data-grid/column-groups/#custom-group-component">Header Group Component</a>: To customise the header of a column group.</li><li><a href="/react-data-grid/column-groups/#inner-header-group-component">Inner HeaderGroup Component</a>: To customise the inner header component of a column group.</li><li><a href="/react-data-grid/cell-editors/">Edit Component</a>: To customise the editing of a cell.</li><li><a href="/react-data-grid/component-filter/">Filter Component</a>: For custom column filter that appears inside the column menu.</li><li><a href="/react-data-grid/component-floating-filter/">Floating Filter</a>: For custom column floating filter that appears inside the column menu.</li><li><a href="/react-data-grid/filter-date/#custom-selection-component">Date Component</a>: To customise the date selection component in the date filter.</li><li><a href="/react-data-grid/component-menu-item/">Menu Item Component</a>: To customise the items within grid menus.</li><li><a href="/react-data-grid/component-loading-cell-renderer/">Loading Component</a>: To customise the loading cell row when using Server Side row model.</li><li><a href="/react-data-grid/overlays/">Overlay Component</a>: To customise loading and no rows overlay components.</li><li><a href="/react-data-grid/status-bar/">Status Bar Component</a>: For custom status bar components.</li><li><a href="/react-data-grid/component-tool-panel/">Tool Panel Component</a>: For custom tool panel components.</li><li><a href="/react-data-grid/tooltips/">Tooltip Component</a>: For custom cell tooltip components.</li></ul><p>The remainder of this page gives information that is common across all the component types.</p><h2 id="registering-custom-components"> Registering Custom Components <a aria-label="Heading link" href="#registering-custom-components" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><article></article><article></article><article><div class="alert _alert_1p97w_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M17 22L17 14 13 14 13 16 15 16 15 22 12 22 12 24 20 24 20 22 17 22zM16 8a1.5 1.5 0 101.5 1.5A1.5 1.5 0 0016 8z"></path><path d="M16,30A14,14,0,1,1,30,16,14,14,0,0,1,16,30ZM16,4A12,12,0,1,0,28,16,12,12,0,0,0,16,4Z"></path></svg><div><p>In previous versions of the grid, custom components were declared in an imperative way. See <a href="/react-data-grid/upgrading-to-ag-grid-31-1/#migrating-custom-components-to-use-reactivecustomcomponents-option">Migrating to Use reactiveCustomComponents</a> for details on how to migrate to the current format.</p></div></div><p>There are two ways to register custom components:</p><ul><li>Direct reference.</li><li>By name.</li></ul><h3 id="1-by-direct-reference"> 1. By Direct Reference <a aria-label="Heading link" href="#1-by-direct-reference" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h3><p>When registering a React Component by reference you simply pass the Component to the place you want it used (i.e. Cell Renderer, Filter etc).</p><p>In this example we're specifying that we want our React <code>CubeComponent</code> as a Cell Renderer in the <code>Cube</code> column:</p><pre class="code language-jsx"><code><span class="token comment">//...other imports</span> <span class="token keyword">import</span> CubeComponent <span class="token keyword">from</span> <span class="token string">'./CubeComponent'</span><span class="token punctuation">;</span> <span class="token keyword">const</span> <span class="token function-variable function">GridExample</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token comment">// other properties & methods</span> <span class="token keyword">const</span> columnDefs <span class="token operator">=</span> <span class="token function">useMemo</span><span class="token punctuation">(</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">[</span><span class="token punctuation">{</span><span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">'value'</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> CubeComponent<span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token punctuation">(</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">AgGridReact</span></span> <span class="token attr-name">columnDefs</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>columnDefs<span class="token punctuation">}</span></span> <span class="token attr-name">...other</span> <span class="token attr-name">properties</span> <span class="token punctuation">/></span></span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> </code></pre><p>The advantage of referencing Components directly is cleaner code, without the extra level of indirection added when referencing by name.</p><h3 id="2-by-name"> 2. By Name <a aria-label="Heading link" href="#2-by-name" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h3><p>When registering a React component by name you need to first register the component within the grid <code>components</code> property, then reference the component by name where you want it used (i.e. as a Cell Renderer, Filter etc).</p><p>In this example we've registered our React <code>CubeComponent</code> and given it a name of <code>cubeComponent</code> (this can be any name you choose). We then specify that we want the previously registered <code>cubeComponent</code> to be used as a Cell Renderer in the <code>Cube</code> column:</p><pre class="code language-jsx"><code><span class="token comment">//...other imports</span> <span class="token keyword">import</span> CubeComponent <span class="token keyword">from</span> <span class="token string">'./CubeComponent'</span><span class="token punctuation">;</span> <span class="token keyword">const</span> <span class="token function-variable function">GridExample</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token comment">// other properties & methods</span> <span class="token keyword">const</span> components <span class="token operator">=</span> <span class="token function">useMemo</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token literal-property property">cubeComponent</span><span class="token operator">:</span> CubeComponent <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">const</span> columnDefs <span class="token operator">=</span> <span class="token function">useMemo</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">[</span><span class="token punctuation">{</span><span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">'value'</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> <span class="token string">'cubeComponent'</span><span class="token punctuation">}</span><span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token punctuation">(</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">AgGridReact</span></span> <span class="token attr-name">components</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>components<span class="token punctuation">}</span></span> <span class="token attr-name">columnDefs</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>columnDefs<span class="token punctuation">}</span></span> <span class="token attr-name">...other</span> <span class="token attr-name">properties</span> <span class="token punctuation">/></span></span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> </code></pre><p>The advantage of referencing components by name is definitions (eg Column Definitions) can be composed of simple types (ie JSON), which is useful should you wish to persist Column Definitions.</p><div class="alert _alert_1p97w_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M17 22L17 14 13 14 13 16 15 16 15 22 12 22 12 24 20 24 20 22 17 22zM16 8a1.5 1.5 0 101.5 1.5A1.5 1.5 0 0016 8z"></path><path d="M16,30A14,14,0,1,1,30,16,14,14,0,0,1,16,30ZM16,4A12,12,0,1,0,28,16,12,12,0,0,0,16,4Z"></path></svg><div><p>A React Component in this context can be any valid React Component - A Class Based Component, a Hook or even an inline Functional Component. The same rules apply regardless of the type of component used.</p></div></div></article><article></article><div class="container example-runner-outer" style="min-height:654px" data-astro-cid-rewqq5du> <svg xmlns="http://www.w3.org/2000/svg" class="logomark loading" width="64" height="48" viewBox="0 0 64 48" id="loading-components-register" data-astro-cid-rewqq5du="true"><style> .logomark .aqua { fill: #55b4c8; } .logomark .orange { fill: #ff8c00; } .logomark .red { fill: #f00; } .logomark .grey { fill: #b4bebe; } .loading rect { animation-iteration-count: infinite; animation-timing-function: ease-in-out; animation-play-state: paused; } .loading rect[class*='right'] { animation-name: logo-mark-bounce-right; animation-duration: 1.25s; animation-play-state: running; } .loading rect[class*='left'] { animation-name: logo-mark-bounce-left; animation-duration: 1.25s; animation-play-state: running; } .right-2 { animation-delay: calc(1.25s / 6); } .right-3 { animation-delay: calc(1.25s / 6 * 2); } .left-3 { animation-delay: calc(1.25s / 6 * 3); } .left-2 { animation-delay: calc(1.25s / 6 * 4); } .left-1 { animation-delay: calc(1.25s / 6 * 5); } @keyframes logo-mark-bounce-right { 0% { transform: translateX(0%); } 16.6666% { transform: translateX(3px); } 33.3333% { transform: translateX(0); } } @keyframes logo-mark-bounce-left { 0% { transform: translateX(0%); } 16.6666% { transform: translateX(-3px); } 33.3333% { transform: translateX(0); } } </style><rect class="aqua right-1" x="51" y="10" width="7" height="8"></rect><path class="aqua right-1" d="M58,10l-17,0l-8,8l25,0l0,-8Z"></path><rect class="orange right-2" x="36" y="22" width="7" height="8"></rect><path class="orange right-2" d="M43,30l0,-7.995l-14,-0l-8.008,7.995l22.008,0Z"></path><rect class="red right-3" x="24" y="34" width="7" height="8"></rect><path class="red right-3" d="M13,38.01l4,-4.01l14,0l0,8l-18,0l0,-3.99Z"></path><rect class="grey left-1" x="11" y="6" width="7" height="8"></rect><path class="grey left-1" d="M41,10l-4,4l-26,0l0,-8l30,0l0,4Z"></path><rect class="grey left-2" x="16" y="18" width="7" height="8"></rect><path class="grey left-2" d="M16,26l9,0l8,-8l-17,-0l0,8Z"></path><rect class="grey left-3" x="6" y="30" width="7" height="8"></rect><path class="grey left-3" d="M6,37.988l7,0.012l7.992,-8l-14.992,-0.047l-0,8.035Z"></path></svg> <astro-island uid="Z1SzOV9" component-url="/_astro/DocsExampleRunner.B1rKQvsw.js" component-export="DocsExampleRunner" renderer-url="/_astro/client.5kNSwotS.js" props="{"title":[0,"Registering Components"],"name":[0,"register"],"exampleHeight":[0,580],"typescriptOnly":[0],"suppressDarkMode":[0],"pageName":[0,"components"],"isDev":[0,false]}" ssr="" client="only" opts="{"name":"DocsExampleRunner","value":"react"}"></astro-island> </div> <script>(function(){const pageName = "components"; const exampleName = "register"; const loadingLogoId = "loading-components-register"; const loadingIFrameId = "loading-frame-components-register"; window.addEventListener('message', ({ data }) => { const isExample = pageName === data?.pageName && exampleName === data?.exampleName; if (!isExample) return; if (data?.type === 'init') { // FIXME - some pages have the same example on the page twice // this code works, but we should move off IDs so we can handle this case document.querySelectorAll('#' + loadingLogoId).forEach((loadingLogoId) => { loadingLogoId.remove(); }); document.querySelectorAll('#' + loadingIFrameId).forEach((iframe) => { iframe.style.visibility = 'visible'; if (document.documentElement.dataset['darkMode'] === 'true') { iframe.contentDocument.documentElement.dataset.darkMode = true; } }); } }); })();</script><h2 id="providing-additional-parameters"> Providing Additional Parameters <a aria-label="Heading link" href="#providing-additional-parameters" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><p>Each Custom Component gets a set of parameters from the grid. For example, for Cell Component the grid provides, among other things, the value to be rendered. You can provide additional properties to the Custom Component (e.g. what currency symbol to use) by providing additional parameters specific to your application.</p><p>To provide additional parameters, use the property <code>[prop-name]Params</code>, e.g. <code>cellRendererParams</code>.</p><pre class="code language-jsx"><code><span class="token keyword">const</span> <span class="token punctuation">[</span>columnDefs<span class="token punctuation">,</span> setColumnDefs<span class="token punctuation">]</span> <span class="token operator">=</span> <span class="token function">useState</span><span class="token punctuation">(</span><span class="token punctuation">[</span> <span class="token punctuation">{</span> <span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">'price'</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> PriceCellRenderer<span class="token punctuation">,</span> <span class="token literal-property property">cellRendererParams</span><span class="token operator">:</span> <span class="token punctuation">{</span> <span class="token literal-property property">currency</span><span class="token operator">:</span> <span class="token string">'EUR'</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">AgGridReact</span></span> <span class="token attr-name">columnDefs</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>columnDefs<span class="token punctuation">}</span></span> <span class="token punctuation">/></span></span></code></pre><article></article><article><h2 id="mixing-javascript-and-react"> Mixing JavaScript and React <a aria-label="Heading link" href="#mixing-javascript-and-react" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><p>When providing Custom Components you have a choice of the following:</p><ol><li>Provide an AG Grid component as a React Component.</li><li>Provide an AG Grid component in JavaScript (JavaScript Class Components only, not JavaScript Functional Components).</li></ol><p>The following code snippet shows how both JavaScript and React Components can be used at the same time:</p><pre class="code language-jsx"><code><span class="token comment">//...other imports</span> <span class="token keyword">import</span> JavascriptComponent <span class="token keyword">from</span> <span class="token string">'./JavascriptComponent.js'</span><span class="token punctuation">;</span> <span class="token keyword">import</span> ReactComponent <span class="token keyword">from</span> <span class="token string">'./ReactComponent'</span><span class="token punctuation">;</span> <span class="token keyword">const</span> <span class="token function-variable function">GridExample</span> <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token comment">// JS and React components, only need register if looking up by name</span> <span class="token keyword">const</span> components <span class="token operator">=</span> <span class="token function">useMemo</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">(</span><span class="token punctuation">{</span> <span class="token string-property property">'javascriptComponent'</span><span class="token operator">:</span> JavascriptComponent<span class="token punctuation">,</span> <span class="token string-property property">'reactComponent'</span><span class="token operator">:</span> ReactComponent <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">const</span> columnDefs <span class="token operator">=</span> <span class="token function">useMemo</span><span class="token punctuation">(</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">[</span> <span class="token punctuation">{</span> <span class="token literal-property property">headerName</span><span class="token operator">:</span> <span class="token string">"JS Cell"</span><span class="token punctuation">,</span> <span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">"value"</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> <span class="token string">'javascriptComponent'</span><span class="token punctuation">,</span> <span class="token comment">// JS comp by Name</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token literal-property property">headerName</span><span class="token operator">:</span> <span class="token string">"JS Cell"</span><span class="token punctuation">,</span> <span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">"value"</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> JavascriptComponent<span class="token punctuation">,</span> <span class="token comment">// JS comp by Direct Reference</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token literal-property property">headerName</span><span class="token operator">:</span> <span class="token string">"React Cell"</span><span class="token punctuation">,</span> <span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">"value"</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> <span class="token string">'reactComponent'</span><span class="token punctuation">,</span> <span class="token comment">// React comp by Name</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token literal-property property">headerName</span><span class="token operator">:</span> <span class="token string">"React Cell"</span><span class="token punctuation">,</span> <span class="token literal-property property">field</span><span class="token operator">:</span> <span class="token string">"value"</span><span class="token punctuation">,</span> <span class="token literal-property property">cellRenderer</span><span class="token operator">:</span> ReactComponent<span class="token punctuation">,</span> <span class="token comment">// React comp by Direct Reference</span> <span class="token punctuation">}</span> <span class="token punctuation">]</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">return</span> <span class="token punctuation">(</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">AgGridReact</span></span> <span class="token attr-name">components</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>components<span class="token punctuation">}</span></span> <span class="token attr-name">columnDefs</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>columnDefs<span class="token punctuation">}</span></span> <span class="token attr-name">...other</span> <span class="token attr-name">properties</span> <span class="token punctuation">/></span></span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">;</span> </code></pre></article><article></article><article><p>Change the documentation view to <a href="/javascript-data-grid/components/">JavaScript</a> to see how to create a plain JavaScript component.</p></article><h2 id="higher-order-components"> Higher Order Components <a aria-label="Heading link" href="#higher-order-components" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><p>If you use <code>connect</code> to use Redux, or if you're using a Higher Order Component (HOC) to wrap the grid React component, you'll also need to ensure the grid can get access to the newly created component. To do this you need to ensure <code>forwardRef</code> is set:</p><pre class="code language-jsx"><code><span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token function">connect</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter">state</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token keyword">return</span> <span class="token punctuation">{</span> <span class="token literal-property property">currencySymbol</span><span class="token operator">:</span> state<span class="token punctuation">.</span>currencySymbol<span class="token punctuation">,</span> <span class="token literal-property property">exchangeRate</span><span class="token operator">:</span> state<span class="token punctuation">.</span>exchangeRate <span class="token punctuation">}</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token keyword">null</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> <span class="token literal-property property">forwardRef</span><span class="token operator">:</span> <span class="token boolean">true</span> <span class="token punctuation">}</span> <span class="token comment">// must be supplied for react/redux when using AgGridReact</span> <span class="token punctuation">)</span><span class="token punctuation">(</span>PriceRenderer<span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre><h2 id="component-usage"> Component Usage <a aria-label="Heading link" href="#component-usage" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><p>The below table gives a summary of the components, where they are configured and using what attribute.</p><table><thead><tr><th>Component</th><th>Where</th><th>Attribute</th></tr></thead><tbody><tr><td>Cell Component</td><td>Column Definition</td><td>cellRenderer<br/>cellRendererParams<br/>cellRendererSelector</td></tr><tr><td>Editor Component</td><td>Column Definition</td><td>cellEditor<br/>cellEditorParams<br/>cellEditorSelector</td></tr><tr><td>Filter</td><td>Column Definition</td><td>filter<br/>filterParams</td></tr><tr><td>Floating Filter</td><td>Column Definition</td><td>floatingFilter<br/>floatingFilterParams</td></tr><tr><td>Header Component</td><td>Column Definition</td><td>headerComponent<br/>headerComponentParams</td></tr><tr><td>Inner Header Component</td><td>Column Definition</td><td>innerHeaderComponent<br/>innerHeaderComponentParams</td></tr><tr><td>Header Group Component</td><td>Column Definition</td><td>headerGroupComponent<br/>headerGroupComponentParams</td></tr><tr><td>Inner Header Group Component</td><td>Column Definition</td><td>innerHeaderGroupComponent<br/>innerHeaderGroupComponentParams</td></tr><tr><td>Tooltip Component</td><td>Column Definition</td><td>tooltipComponent<br/>tooltipComponentParams</td></tr><tr><td>Group Row Cell Component</td><td>Grid Option</td><td>groupRowRenderer<br/>groupRowRendererParams</td></tr><tr><td>Group Row Inner Cell Component</td><td>cellRendererParams<br/>groupRowRendererParams<br/></td><td>innerRenderer<br/>innerRendererParams</td></tr><tr><td>Detail Cell Component</td><td>Grid Option</td><td>detailCellRenderer<br/>detailCellRendererParams</td></tr><tr><td>Full Width Cell Component</td><td>Grid Option</td><td>fullWidthCellRenderer<br/>fullWidthCellRendererParams</td></tr><tr><td>Loading Cell Component</td><td>Grid Option<br/>Column Definition</td><td>loadingCellRenderer<br/>loadingCellRendererParams</td></tr><tr><td>Loading Overlay</td><td>Grid Option</td><td>loadingOverlayComponent<br/>loadingOverlayComponentParams</td></tr><tr><td>No Rows Overlay</td><td>Grid Option</td><td>noRowsOverlayComponent<br/>noRowsOverlayComponentParams</td></tr><tr><td>Drag and Drop Image</td><td>Grid Option</td><td>dragAndDropImageComponent<br/>dragAndDropImageComponentParams</td></tr><tr><td>Status Bar Component</td><td>Grid Option -> Status Bar</td><td>statusPanel<br/>statusPanelParams</td></tr><tr><td>Tool Panel</td><td>Grid Option -> Side Bar</td><td>toolPanel<br/>toolPanelParams</td></tr><tr><td>Menu Item</td><td>Grid Option -> Menu</td><td>menuItem<br/>menuItemParams</td></tr></tbody></table><h2 id="grid-provided-components"> Grid Provided Components <a aria-label="Heading link" href="#grid-provided-components" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><p>The grid comes with pre-registered components that can be used. Each component provided by the grid starts with the namespaces 'ag' to minimise naming conflicts with user provided components. The full list of grid provided components are in the table below.</p><table><thead><tr><th>Drag And Drop</th><th></th></tr></thead><tbody><tr><td>agDragAndDropImage</td><td>Default cover element when grid parts are being dragged</td></tr></tbody></table><table><thead><tr><th>Date Inputs</th><th></th></tr></thead><tbody><tr><td>agDateInput</td><td>Default date input used by filters</td></tr></tbody></table><table><thead><tr><th>Column Headers</th><th></th></tr></thead><tbody><tr><td>agColumnHeader</td><td>Default column header</td></tr><tr><td>agColumnHeaderGroup</td><td>Default column group header</td></tr></tbody></table><table><thead><tr><th>Column Filters</th><th></th></tr></thead><tbody><tr><td>agSetColumnFilter <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Set filter (default when using AG Grid Enterprise)</td></tr><tr><td>agTextColumnFilter</td><td>Simple text filter (default when using AG Grid Community)</td></tr><tr><td>agNumberColumnFilter</td><td>Number filter</td></tr><tr><td>agDateColumnFilter</td><td>Date filter</td></tr><tr><td>agMultiColumnFilter <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Multi filter</td></tr><tr><td>agGroupColumnFilter <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Group column filter</td></tr></tbody></table><table><thead><tr><th>Floating Filters</th><th></th></tr></thead><tbody><tr><td>agSetColumnFloatingFilter <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Floating set filter</td></tr><tr><td>agTextColumnFloatingFilter</td><td>Floating text filter</td></tr><tr><td>agNumberColumnFloatingFilter</td><td>Floating number filter</td></tr><tr><td>agDateColumnFloatingFilter</td><td>Floating date filter</td></tr><tr><td>agMultiColumnFloatingFilter <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Floating multi filter</td></tr><tr><td>agGroupColumnFloatingFilter <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Floating group column filter</td></tr></tbody></table><table><thead><tr><th>Cell Components</th><th></th></tr></thead><tbody><tr><td>agAnimateShowChangeCellRenderer</td><td>Cell Component that animates value changes</td></tr><tr><td>agAnimateSlideCellRenderer</td><td>Cell Component that animates value changes</td></tr><tr><td>agGroupCellRenderer</td><td>Cell Component for displaying group information</td></tr><tr><td>agLoadingCellRenderer <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Cell Component for loading row when using Enterprise row model</td></tr><tr><td>agSkeletonCellRenderer <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Cell Component for displaying skeleton cells</td></tr><tr><td>agCheckboxCellRenderer</td><td>Cell Component that displays a checkbox for boolean values</td></tr></tbody></table><table><thead><tr><th>Overlays</th><th></th></tr></thead><tbody><tr><td>agLoadingOverlay</td><td>Loading overlay</td></tr><tr><td>agNoRowsOverlay</td><td>No rows overlay</td></tr></tbody></table><table><thead><tr><th>Cell Editors</th><th></th></tr></thead><tbody><tr><td>agTextCellEditor</td><td>Text cell editor</td></tr><tr><td>agSelectCellEditor</td><td>Select cell editor</td></tr><tr><td>agRichSelectCellEditor <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Rich select editor</td></tr><tr><td>agLargeTextCellEditor</td><td>Large text cell editor</td></tr><tr><td>agNumberCellEditor</td><td>Number cell editor</td></tr><tr><td>agDateCellEditor</td><td>Date cell editor</td></tr><tr><td>agDateStringCellEditor</td><td>Date represented as string cell editor</td></tr><tr><td>agCheckboxCellEditor</td><td>Checkbox cell editor</td></tr></tbody></table><table><thead><tr><th>Master Detail</th><th></th></tr></thead><tbody><tr><td>agDetailCellRenderer <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Detail panel for master / detail grid</td></tr></tbody></table><table><thead><tr><th>Column Menu / Context Menu</th><th></th></tr></thead><tbody><tr><td>agMenuItem <span class="_enterpriseIcon_ocick_1">(e)<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 32 32" size="32" class="_icon_1jqgc_1 icon"><path d="M16 2c7.727 0 14 6.273 14 14s-6.273 14-14 14S2 23.727 2 16 8.273 2 16 2Zm.005 3c6.071 0 11 4.929 11 11s-4.929 11-11 11-11-4.929-11-11 4.929-11 11-11Z"></path><path d="M12.226 16.507c0 .549.12 1.05.36 1.502.24.452.554.839.945 1.158.39.32.842.568 1.357.745a4.862 4.862 0 0 0 1.596.267c.746 0 1.393-.174 1.944-.52a6.25 6.25 0 0 0 1.516-1.37l1.81 1.384c-1.33 1.721-3.193 2.58-5.588 2.58-.994 0-1.895-.168-2.702-.504a5.878 5.878 0 0 1-2.049-1.397 6.196 6.196 0 0 1-1.291-2.103 7.422 7.422 0 0 1-.452-2.62c0-.94.164-1.815.492-2.623a6.511 6.511 0 0 1 1.357-2.102 6.189 6.189 0 0 1 2.062-1.397A6.64 6.64 0 0 1 16.192 9c1.117 0 2.062.197 2.834.586.771.391 1.406.901 1.903 1.532a6.04 6.04 0 0 1 1.078 2.128c.221.79.332 1.592.332 2.407v.853H12.226Zm7.559-1.917a5.041 5.041 0 0 0-.254-1.464 3.22 3.22 0 0 0-.678-1.157 3.13 3.13 0 0 0-1.13-.772c-.453-.187-.98-.28-1.585-.28a3.93 3.93 0 0 0-3.633 2.381 3.26 3.26 0 0 0-.279 1.292h7.559Z"></path></svg></span></td><td>Menu item within column or context menu</td></tr></tbody></table><h2 id="overriding-grid-components"> Overriding Grid Components <a aria-label="Heading link" href="#overriding-grid-components" class="_docsHeaderIcon_15ivl_1"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.25,6.76a6,6,0,0,0-8.5,0l1.42,1.42a4,4,0,1,1,5.67,5.67l-8,8a4,4,0,1,1-5.67-5.66l1.41-1.42-1.41-1.42-1.42,1.42a6,6,0,0,0,0,8.5A6,6,0,0,0,17,25a6,6,0,0,0,4.27-1.76l8-8A6,6,0,0,0,29.25,6.76Z"></path><path d="M4.19,24.82a4,4,0,0,1,0-5.67l8-8a4,4,0,0,1,5.67,0A3.94,3.94,0,0,1,19,14a4,4,0,0,1-1.17,2.85L15.71,19l1.42,1.42,2.12-2.12a6,6,0,0,0-8.51-8.51l-8,8a6,6,0,0,0,0,8.51A6,6,0,0,0,7,28a6.07,6.07,0,0,0,4.28-1.76L9.86,24.82A4,4,0,0,1,4.19,24.82Z"></path></svg></a> </h2><p>It is also possible to override components. Where the grid uses a default value, this means the override component will be used instead. The default components, where overriding makes sense, are as follows:</p><ul><li><strong>agDragAndDropImage</strong>: To change the default drag and drop image when dragging grid parts.</li><li><strong>agDateInput</strong>: To change the default date selection across all filters.</li><li><strong>agColumnHeader</strong>: To change the default column header across all columns.</li><li><strong>agColumnGroupHeader</strong>: To change the default column group header across all columns.</li><li><strong>agLoadingCellRenderer</strong>: To change the default loading cell renderer for Enterprise Row Model.</li><li><strong>agSkeletonCellRenderer</strong>: To change the default skeleton loading cell renderer for Enterprise Row Model.</li><li><strong>agLoadingOverlay</strong>: To change the default 'loading' overlay.</li><li><strong>agNoRowsOverlay</strong>: To change the default 'no rows' overlay.</li><li><strong>agCellEditor</strong>: To change the default cell editor.</li><li><strong>agDetailCellRenderer</strong>: To change the default detail panel for master / detail grids.</li><li><strong>agMenuItem</strong>: To change the default menu item for column and context menus.</li></ul><p>To override the default component, register the custom component in the GridOptions <code>components</code> property under the above name.</p><pre class="code language-jsx"><code><span class="token keyword">const</span> components <span class="token operator">=</span> <span class="token function">useMemo</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">(</span> <span class="token punctuation">{</span> <span class="token literal-property property">agDateInput</span><span class="token operator">:</span> CustomDateComponent<span class="token punctuation">,</span> <span class="token literal-property property">agColumnHeader</span><span class="token operator">:</span> CustomHeaderComponent <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">,</span> <span class="token punctuation">[</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span><span class="token class-name">AgGridReact</span></span> <span class="token attr-name">components</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>components<span class="token punctuation">}</span></span> <span class="token attr-name">...other</span> <span class="token attr-name">properties...</span> <span class="token punctuation">/></span></span> </code></pre></article></div></div><astro-island uid="ZnI4Ao" prefix="r2" component-url="/_astro/SideNavigation.j67Zu3Bl.js" component-export="SideNavigation" renderer-url="/_astro/client.5kNSwotS.js" props="{"headings":[1,[[0,{"slug":[0,"top"],"depth":[0,1],"text":[0,"Custom Components"]}],[0,{"depth":[0,2],"slug":[0,"registering-custom-components"],"text":[0,"Registering Custom Components"]}],[0,{"depth":[0,3],"slug":[0,"1-by-direct-reference"],"text":[0,"1. By Direct Reference"]}],[0,{"depth":[0,3],"slug":[0,"2-by-name"],"text":[0,"2. By Name"]}],[0,{"depth":[0,2],"slug":[0,"providing-additional-parameters"],"text":[0,"Providing Additional Parameters"]}],[0,{"depth":[0,2],"slug":[0,"mixing-javascript-and-react"],"text":[0,"Mixing JavaScript and React"]}],[0,{"depth":[0,2],"slug":[0,"higher-order-components"],"text":[0,"Higher Order Components"]}],[0,{"depth":[0,2],"slug":[0,"component-usage"],"text":[0,"Component Usage"]}],[0,{"depth":[0,2],"slug":[0,"grid-provided-components"],"text":[0,"Grid Provided Components"]}],[0,{"depth":[0,2],"slug":[0,"overriding-grid-components"],"text":[0,"Overriding Grid Components"]}]]],"delayedScrollSpy":[0,false]}" ssr="" client="load" opts="{"name":"SideNavigation","value":true}" await-children=""><nav class="_sideNav_tnl9m_1"><div><ul><li class="_level1_tnl9m_106"><a href="#top" class="nav-link">Custom聽Components</a></li><li class="_level2_tnl9m_119"><a href="#registering-custom-components" class="nav-link">Registering Custom聽Components</a></li><li class="_level3_tnl9m_111"><a href="#1-by-direct-reference" class="nav-link">1. By Direct聽Reference</a></li><li class="_level3_tnl9m_111"><a href="#2-by-name" class="nav-link">2. By聽Name</a></li><li class="_level2_tnl9m_119"><a href="#providing-additional-parameters" class="nav-link">Providing Additional聽Parameters</a></li><li class="_level2_tnl9m_119"><a href="#mixing-javascript-and-react" class="nav-link">Mixing JavaScript and聽React</a></li><li class="_level2_tnl9m_119"><a href="#higher-order-components" class="nav-link">Higher Order聽Components</a></li><li class="_level2_tnl9m_119"><a href="#component-usage" class="nav-link">Component聽Usage</a></li><li class="_level2_tnl9m_119"><a href="#grid-provided-components" class="nav-link">Grid Provided聽Components</a></li><li class="_level2_tnl9m_119"><a href="#overriding-grid-components" class="nav-link">Overriding Grid聽Components</a></li></ul></div></nav></astro-island></div> </div> <footer class="_footer_1rqr6_2"><div class="_footerColumns_1rqr6_31 layout-grid"><div class="_menuColumn_1rqr6_43"><div class="_logoContainer_1rqr6_123"><a href="/" aria-label="Home" class="_headerLogo_1agp5_36"><svg xmlns="http://www.w3.org/2000/svg" class="logotype" width="154" height="40" viewBox="0 0 154 40"><style> .logotype path, .logotype rect { fill: #fff; } .logotype.dark-type > path, .logotype.dark-type > rect { fill: #003264; } </style><path d="M147.979,5.6l-0,28.417l-4.768,-0l-0.127,-2.988c-0.7,1.017 -1.59,1.844 -2.67,2.479c-1.081,0.572 -2.416,0.89 -3.942,0.89c-1.335,0 -2.606,-0.254 -3.687,-0.699c-1.144,-0.509 -2.162,-1.144 -2.988,-2.034c-0.826,-0.89 -1.526,-1.971 -1.971,-3.179c-0.508,-1.208 -0.699,-2.606 -0.699,-4.132c-0,-1.526 0.254,-2.924 0.699,-4.196c0.509,-1.271 1.145,-2.352 1.971,-3.242c0.826,-0.89 1.844,-1.589 2.988,-2.098c1.144,-0.509 2.352,-0.763 3.687,-0.763c1.526,0 2.797,0.254 3.878,0.827c1.081,0.572 1.971,1.335 2.67,2.415l-0,-11.633l4.959,-0l-0,-0.064Zm-10.426,24.539c1.653,-0 2.924,-0.572 3.941,-1.653c1.017,-1.081 1.526,-2.543 1.526,-4.323c-0,-1.78 -0.509,-3.179 -1.526,-4.323c-1.017,-1.081 -2.288,-1.653 -3.941,-1.653c-1.59,0 -2.925,0.572 -3.878,1.653c-1.017,1.081 -1.526,2.543 -1.526,4.323c0,1.78 0.509,3.179 1.526,4.259c1.017,1.145 2.288,1.717 3.878,1.717"></path><rect x="119.067" y="5.6" width="4.959" height="5.849"></rect><rect x="119.067" y="14.373" width="4.959" height="19.644"></rect><path d="M108.831,16.979c1.59,-2.352 5.595,-2.606 7.248,-2.606l-0,4.577c-2.035,0 -4.069,0.064 -5.277,0.954c-1.208,0.89 -1.843,2.098 -1.843,3.56l-0,10.553l-4.959,-0l0,-19.644l4.768,-0l0.063,2.606Z"></path><path d="M26.489,28.677l-12.46,-0l-2.162,5.34l-5.467,-0l11.507,-26.955l4.768,0l11.506,26.955l-5.531,-0l-2.161,-5.34Zm-1.717,-4.26l-4.513,-10.998l-4.514,10.998l9.027,0Z"></path><path d="M62.024,18.654l-12.286,0l-0,4.267l6.963,0c-0.219,2.139 -1.021,3.846 -2.406,5.123c-1.385,1.276 -3.208,1.914 -5.469,1.914c-1.288,0 -2.461,-0.231 -3.518,-0.693c-1.058,-0.462 -1.964,-1.113 -2.717,-1.95c-0.753,-0.839 -1.337,-1.848 -1.749,-3.027c-0.414,-1.179 -0.62,-2.486 -0.62,-3.92c-0,-1.433 0.206,-2.739 0.62,-3.919c0.412,-1.178 0.996,-2.187 1.749,-3.026c0.753,-0.838 1.665,-1.488 2.734,-1.95c1.07,-0.462 2.248,-0.693 3.538,-0.693c2.669,-0 4.696,0.642 6.081,1.927l3.284,-3.286c-2.486,-1.934 -5.63,-2.907 -9.439,-2.907c-2.114,-0 -4.023,0.334 -5.723,1.002c-1.703,0.669 -3.161,1.605 -4.376,2.807c-1.216,1.204 -2.151,2.657 -2.807,4.357c-0.657,1.702 -0.985,3.599 -0.985,5.688c-0,2.066 0.334,3.957 1.003,5.67c0.668,1.714 1.61,3.173 2.825,4.375c1.216,1.204 2.673,2.139 4.375,2.808c1.702,0.668 3.597,1.002 5.688,1.002c2.042,0 3.883,-0.334 5.524,-1.002c1.64,-0.669 3.038,-1.604 4.193,-2.808c1.154,-1.202 2.042,-2.661 2.661,-4.375c0.621,-1.713 0.93,-3.604 0.93,-5.67c0,-0.291 -0.007,-0.577 -0.017,-0.856c-0.014,-0.28 -0.032,-0.565 -0.056,-0.858"></path><path d="M100.792,18.654l-12.286,0l-0,4.267l6.963,0c-0.219,2.139 -1.021,3.846 -2.406,5.123c-1.385,1.276 -3.208,1.914 -5.469,1.914c-1.288,0 -2.461,-0.231 -3.518,-0.693c-1.058,-0.462 -1.964,-1.113 -2.717,-1.95c-0.753,-0.839 -1.337,-1.848 -1.749,-3.027c-0.414,-1.179 -0.62,-2.486 -0.62,-3.92c-0,-1.433 0.206,-2.739 0.62,-3.919c0.412,-1.178 0.996,-2.187 1.749,-3.026c0.753,-0.838 1.665,-1.488 2.735,-1.95c1.069,-0.462 2.247,-0.693 3.537,-0.693c2.669,-0 4.697,0.642 6.081,1.927l3.284,-3.286c-2.486,-1.934 -5.63,-2.907 -9.438,-2.907c-2.115,-0 -4.024,0.334 -5.724,1.002c-1.703,0.669 -3.161,1.605 -4.376,2.807c-1.216,1.204 -2.151,2.657 -2.807,4.357c-0.657,1.702 -0.985,3.599 -0.985,5.688c-0,2.066 0.334,3.957 1.003,5.67c0.668,1.714 1.61,3.173 2.825,4.375c1.216,1.204 2.673,2.139 4.375,2.808c1.702,0.668 3.597,1.002 5.689,1.002c2.041,0 3.883,-0.334 5.523,-1.002c1.64,-0.669 3.038,-1.604 4.193,-2.808c1.154,-1.202 2.042,-2.661 2.661,-4.375c0.621,-1.713 0.93,-3.604 0.93,-5.67c0,-0.291 -0.007,-0.577 -0.017,-0.856c-0.014,-0.28 -0.032,-0.565 -0.056,-0.858"></path></svg><svg xmlns="http://www.w3.org/2000/svg" class="logo-mark" width="64" height="48" viewBox="0 0 64 48"><style> .logomark .aqua { fill: #55b4c8; } .logomark .orange { fill: #ff8c00; } .logomark .red { fill: #f00; } .logomark .grey { fill: #b4bebe; } </style><rect class="aqua right-1" x="51" y="10" width="7" height="8"></rect><path class="aqua right-1" d="M58,10l-17,0l-8,8l25,0l0,-8Z"></path><rect class="orange right-2" x="36" y="22" width="7" height="8"></rect><path class="orange right-2" d="M43,30l0,-7.995l-14,-0l-8.008,7.995l22.008,0Z"></path><rect class="red right-3" x="24" y="34" width="7" height="8"></rect><path class="red right-3" d="M13,38.01l4,-4.01l14,0l0,8l-18,0l0,-3.99Z"></path><rect class="grey left-1" x="11" y="6" width="7" height="8"></rect><path class="grey left-1" d="M41,10l-4,4l-26,0l0,-8l30,0l0,4Z"></path><rect class="grey left-2" x="16" y="18" width="7" height="8"></rect><path class="grey left-2" d="M16,26l9,0l8,-8l-17,-0l0,8Z"></path><rect class="grey left-3" x="6" y="30" width="7" height="8"></rect><path class="grey left-3" d="M6,37.988l7,0.012l7.992,-8l-14.992,-0.047l-0,8.035Z"></path></svg></a></div><p class="text-sm">漏 AG Grid Ltd. 2015-2025</p><p class="text-sm">AG Grid Ltd registered in the United Kingdom. Company聽No.聽07318192.</p></div><div class="_menuColumn_1rqr6_43"><h2>Documentation</h2><ul class="list-style-none"><li><a href="/documentation">Getting Started</a></li><li><a href="/changelog">Changelog</a></li><li><a href="/pipeline">Pipeline</a></li><li><a href="/documentation-archive">Documentation Archive</a></li></ul></div><div class="_menuColumn_1rqr6_43"><h2>Support & Community</h2><ul class="list-style-none"><li><a href="https://stackoverflow.com/questions/tagged/ag-grid" target="_blank" rel="noreferrer">Stack Overflow</a></li><li><a href="/license-pricing">License & Pricing</a></li><li><a href="https://ag-grid.zendesk.com/" target="_blank" rel="noreferrer">Support via Zendesk</a></li></ul></div><div class="_menuColumn_1rqr6_43"><h2>The Company</h2><ul class="list-style-none"><li><a href="https://www.ag-grid.com/charts/">AG Charts</a></li><li><a href="/about">About</a></li><li><a href="https://blog.ag-grid.com/?_ga=2.213149716.106872681.1607518091-965402545.1605286673">Blog</a></li><li><a href="/privacy">Privacy Policy</a></li><li><a href="/cookies">Cookies Policy</a></li><li><a href="/sitemap">Sitemap</a></li></ul></div><div class="_menuColumn_1rqr6_43"><h2>Follow</h2><ul class="list-style-none"><li><a href="https://github.com/ag-grid/ag-grid"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M16,2a14,14,0,0,0-4.43,27.28c.7.13,1-.3,1-.67s0-1.21,0-2.38c-3.89.84-4.71-1.88-4.71-1.88A3.71,3.71,0,0,0,6.24,22.3c-1.27-.86.1-.85.1-.85A2.94,2.94,0,0,1,8.48,22.9a3,3,0,0,0,4.08,1.16,2.93,2.93,0,0,1,.88-1.87c-3.1-.36-6.37-1.56-6.37-6.92a5.4,5.4,0,0,1,1.44-3.76,5,5,0,0,1,.14-3.7s1.17-.38,3.85,1.43a13.3,13.3,0,0,1,7,0c2.67-1.81,3.84-1.43,3.84-1.43a5,5,0,0,1,.14,3.7,5.4,5.4,0,0,1,1.44,3.76c0,5.38-3.27,6.56-6.39,6.91a3.33,3.33,0,0,1,.95,2.59c0,1.87,0,3.38,0,3.84s.25.81,1,.67A14,14,0,0,0,16,2Z"></path></svg>GitHub</a></li><li><a href="https://twitter.com/ag_grid"><svg width="1092" height="1075" viewBox="0 0 1092 1075" fill="none" xmlns="http://www.w3.org/2000/svg" size="32" class="_icon_1jqgc_1 icon"><g clip-path="url(#clip0_404_5)"><path d="M622.109 475.189L919.927 129H849.353L590.758 429.591L384.219 129H146L458.328 583.547L146 946.58H216.577L489.661 629.145L707.781 946.58H946L622.091 475.189H622.109ZM525.443 587.552L493.798 542.289L242.007 182.13H350.41L553.608 472.79L585.253 518.053L849.387 895.867H740.984L525.443 587.569V587.552Z"></path></g><defs><clipPath id="clip0_404_5"><rect width="800" height="818" transform="translate(146 129)"></rect></clipPath></defs></svg>X</a></li><li><a href="https://youtube.com/c/ag-grid"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M29.41,9.26a3.5,3.5,0,0,0-2.47-2.47C24.76,6.2,16,6.2,16,6.2s-8.76,0-10.94.59A3.5,3.5,0,0,0,2.59,9.26,36.13,36.13,0,0,0,2,16a36.13,36.13,0,0,0,.59,6.74,3.5,3.5,0,0,0,2.47,2.47C7.24,25.8,16,25.8,16,25.8s8.76,0,10.94-.59a3.5,3.5,0,0,0,2.47-2.47A36.13,36.13,0,0,0,30,16,36.13,36.13,0,0,0,29.41,9.26ZM13.2,20.2V11.8L20.47,16Z"></path></svg>YouTube</a></li><li><a href="https://www.linkedin.com/company/ag-grid"><svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="32" height="32" viewBox="0 0 32 32" aria-hidden="true" class="_icon_1jqgc_1 icon" xmlns="http://www.w3.org/2000/svg"><path d="M26.2,4H5.8C4.8,4,4,4.8,4,5.7v20.5c0,0.9,0.8,1.7,1.8,1.7h20.4c1,0,1.8-0.8,1.8-1.7V5.7C28,4.8,27.2,4,26.2,4z M11.1,24.4 H7.6V13h3.5V24.4z M9.4,11.4c-1.1,0-2.1-0.9-2.1-2.1c0-1.2,0.9-2.1,2.1-2.1c1.1,0,2.1,0.9,2.1,2.1S10.5,11.4,9.4,11.4z M24.5,24.3 H21v-5.6c0-1.3,0-3.1-1.9-3.1c-1.9,0-2.1,1.5-2.1,2.9v5.7h-3.5V13h3.3v1.5h0.1c0.5-0.9,1.7-1.9,3.4-1.9c3.6,0,4.3,2.4,4.3,5.5V24.3z"></path></svg>LinkedIn</a></li></ul></div></div></footer> </body></html>

CINXE.COM

React Grid: Custom Components | AG Grid