React Grid: Filter Component

<!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="Filter components allow you to add your own filter types to AG Grid. Use them when the Provided Filters do not meet your requirements. 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: Filter Component | AG Grid</title><link rel="canonical" href="https://www.ag-grid.com/react-data-grid/component-filter/"><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/component-filter/"><meta property="og:type" content="website"><meta property="og:title" content="React Grid: Filter Component | AG Grid"><meta property="og:description" content="Filter components allow you to add your own filter types to AG Grid. Use them when the Provided Filters do not meet your requirements. 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/component-filter/"><meta name="twitter:title" content="React Grid: Filter Component | AG Grid"><meta name="twitter:description" content="Filter components allow you to add your own filter types to AG Grid. Use them when the Provided Filters do not meet your requirements. 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} .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> <link rel="stylesheet" href="/_astro/DocsExampleRunner.b6J30Pzg.css"> <style>._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} ._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} </style> <style>._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} ._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)} ._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} ._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} ._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} ._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)} </style><script type="module" src="/_astro/hoisted.D12oPI3R.js"></script><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>._tableRow_119gq_4{border-top:1px solid var(--color-border-secondary)}._tableRow_119gq_4:last-child{border-bottom:1px solid var(--color-border-secondary)}[data-dark-mode=true] ._tableRow_119gq_4{border-top-color:var(--color-util-gray-400);border-bottom-color:var(--color-util-gray-400)}._apiReference_119gq_18{border-bottom:none}._propertyNameDescription_119gq_25{width:100%;padding:0}._propertyNameDescription_119gq_25>div,._propertyNameDescription_119gq_25>div:last-child{border:none} </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><link rel="stylesheet" href="/_astro/ApiReference_module.Cf7T-Rsp.css"></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="SsCzP" prefix="r8" component-url="/_astro/HeaderNav.DeNiJgOx.js" component-export="HeaderNav" renderer-url="/_astro/client.5kNSwotS.js" props="{"currentPath":[0,"/react-data-grid/component-filter/"],"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="Z2gFcW1" 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,"component-filter"],"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 _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>Filtering</span></button><div id="Filtering" 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/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 _isActive_1ilfl_172"><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"><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="true" class="rah-static rah-static--height-zero " style="height:0;overflow:hidden"><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"><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="ZdNJ46" prefix="r1" component-url="/_astro/Header.BT5yBZus.js" component-export="Header" renderer-url="/_astro/client.5kNSwotS.js" props="{"title":[0,"Filter Component"],"framework":[0,"react"],"isEnterprise":[0],"path":[0,"/react-data-grid/component-filter/"],"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>Filter Component</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>Filter components allow you to add your own filter types to AG Grid. Use them when the Provided Filters do not meet your requirements.</p></div> <a href="https://www.youtube.com/watch?v=98JVaTcoexc" target="_blank"> <div class="_ytContainer_1faha_18"> <img src="https://img.youtube.com/vi/98JVaTcoexc/0.jpg" alt="React Custom Filter 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><p>The example below shows two custom filters. The first is on the <code>Athlete</code> column and demonstrates a filter with "fuzzy" matching and the second is on the <code>Year</code> column with preset options.</p><div class="container example-runner-outer" style="min-height:574px" 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-component-filter-custom-filter" 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="Z2puB2Q" component-url="/_astro/DocsExampleRunner.B1rKQvsw.js" component-export="DocsExampleRunner" renderer-url="/_astro/client.5kNSwotS.js" props="{"title":[0,"Filter Component"],"name":[0,"custom-filter"],"exampleHeight":[0],"typescriptOnly":[0],"suppressDarkMode":[0],"pageName":[0,"component-filter"],"isDev":[0,false]}" ssr="" client="only" opts="{"name":"DocsExampleRunner","value":"react"}"></astro-island> </div> <script>(function(){const pageName = "component-filter"; const exampleName = "custom-filter"; const loadingLogoId = "loading-component-filter-custom-filter"; const loadingIFrameId = "loading-frame-component-filter-custom-filter"; 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="implementing-a-filter-component"> Implementing a Filter Component <a aria-label="Heading link" href="#implementing-a-filter-component" 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><p>Custom filter components are controlled components, which receive a filter model as part of the props, and pass model updates back to the grid via the <code>onModelChange</code> callback. A filter model of <code>null</code> means that no filter is applied (the filter displays as inactive). Note that the filter is applied immediately when <code>onModelChange</code> is called.</p><p>To implement the filtering logic, a custom filter needs to implement the <code>doesFilterPass</code> callback, and provide it to the <code>useGridFilter</code> hook.</p><pre class="code language-jsx"><code><span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> model<span class="token punctuation">,</span> onModelChange<span class="token punctuation">,</span> getValue <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token keyword">const</span> doesFilterPass <span class="token operator">=</span> <span class="token function">useCallback</span><span class="token punctuation">(</span><span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> node <span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token comment">// filtering logic</span> <span class="token keyword">return</span> <span class="token function">getValue</span><span class="token punctuation">(</span>node<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">contains</span><span class="token punctuation">(</span>model<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>model<span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// register filter callbacks with the grid</span> <span class="token function">useGridFilter</span><span class="token punctuation">(</span><span class="token punctuation">{</span> doesFilterPass <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>div</span><span class="token punctuation">></span></span><span class="token plain-text"> </span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text<span class="token punctuation">"</span></span> <span class="token attr-name">value</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span>model <span class="token operator">||</span> <span class="token string">''</span><span class="token punctuation">}</span></span> <span class="token attr-name">onChange</span><span class="token script language-javascript"><span class="token script-punctuation punctuation">=</span><span class="token punctuation">{</span><span class="token punctuation">(</span><span class="token parameter"><span class="token punctuation">{</span> <span class="token literal-property property">target</span><span class="token operator">:</span> <span class="token punctuation">{</span> value <span class="token punctuation">}</span><span class="token punctuation">}</span></span><span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token function">onModelChange</span><span class="token punctuation">(</span>value <span class="token operator">===</span> <span class="token string">''</span> <span class="token operator">?</span> <span class="token keyword">null</span> <span class="token operator">:</span> value<span class="token punctuation">)</span><span class="token punctuation">}</span></span> <span class="token punctuation">/></span></span><span class="token plain-text"> </span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> <span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre><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></article><article></article><h2 id="custom-filter-parameters"> Custom Filter Parameters <a aria-label="Heading link" href="#custom-filter-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><h3 id="filter-props"> Filter Props <a aria-label="Heading link" href="#filter-props" 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>The following props are passed to the custom filter components (<code>CustomFilterProps</code> interface). If custom props are provided via the <code>colDef.filterParams</code> property, these will be additionally added to the props object, overriding items of the same name if a name clash exists.</p><astro-island uid="1eodxs" prefix="r17" component-url="/_astro/InterfaceDocumentation.DalJCPSB.js" component-export="InterfaceDocumentation" renderer-url="/_astro/client.5kNSwotS.js" props="{"interfaceName":[0,"CustomFilterProps"],"framework":[0,"react"],"model":[0,{"type":[0,"properties"],"properties":[0,{"CustomFilterProps":[0,{"model":[0,{"definition":[0,{"description":[0," The current filter model for the component. "]}],"detailsCode":[0],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** The current filter model for the component. */"],"comment":[0,"The current filter model for the component."]}],"type":[0,{"returnType":[0,"TModel | null"],"optional":[0,false]}]}],"propertyType":[0,"TModel | null"]}],"onModelChange":[0,{"definition":[0,{"description":[0," Callback that should be called every time the model in the component changes. "]}],"detailsCode":[0,"onModelChange = (model: TModel | null) => void;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Callback that should be called every time the model in the component changes. */"],"comment":[0,"Callback that should be called every time the model in the component changes."]}],"type":[0,{"arguments":[0,{"model":[0,"TModel | null"]}],"returnType":[0,"void"],"optional":[0,false]}]}],"propertyType":[0,"Function"]}],"onUiChange":[0,{"definition":[0,{"description":[0," Callback that can be optionally called every time the filter UI changes. The grid will respond with emitting a FilterModifiedEvent. Apart from emitting the event, the grid takes no further action.\n "]}],"detailsCode":[0,"onUiChange = () => void;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Callback that can be optionally called every time the filter UI changes.\n * The grid will respond with emitting a FilterModifiedEvent.\n * Apart from emitting the event, the grid takes no further action.\n */"],"comment":[0,"Callback that can be optionally called every time the filter UI changes.\nThe grid will respond with emitting a FilterModifiedEvent.\nApart from emitting the event, the grid takes no further action."]}],"type":[0,{"arguments":[0,{}],"returnType":[0,"void"],"optional":[0,false]}]}],"propertyType":[0,"Function"]}],"column":[0,{"definition":[0,{"description":[0," The column this filter is for. "]}],"detailsCode":[0],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** The column this filter is for. */"],"comment":[0,"The column this filter is for."]}],"type":[0,{"returnType":[0,"Column"],"optional":[0,false]}]}],"propertyType":[0,"Column"]}],"colDef":[0,{"definition":[0,{"description":[0," The column definition for the column. "]}],"detailsCode":[0],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** The column definition for the column. */"],"comment":[0,"The column definition for the column."]}],"type":[0,{"returnType":[0,"ColDef<TData>"],"optional":[0,false]}]}],"propertyType":[0,"ColDef"]}],"getValue":[0,{"definition":[0,{"description":[0," Get the cell value for the given row node and column, which can be the column ID, definition, or `Column` object. If no column is provided, the column this filter is on will be used.\n "]}],"detailsCode":[0,"getValue = (\n node: <a href=\"/react-data-grid/row-object/\" target=\"_self\" rel=\"noreferrer\">IRowNode</a><<span/>TData>,\n column?: string | <a href=\"/react-data-grid/column-properties/\" target=\"_self\" rel=\"noreferrer\">ColDef</a><<span/>TData, TValue> | <a href=\"/react-data-grid/column-object/\" target=\"_self\" rel=\"noreferrer\">Column</a><<span/>TValue>\n) => TValue | null | undefined;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Get the cell value for the given row node and column, which can be the column ID, definition, or `Column` object.\n * If no column is provided, the column this filter is on will be used.\n */"],"comment":[0,"Get the cell value for the given row node and column, which can be the column ID, definition, or `Column` object.\nIf no column is provided, the column this filter is on will be used."]}],"type":[0,{"arguments":[0,{"node":[0,"IRowNode<TData>"],"column?":[0,"string | ColDef<TData, TValue> | Column<TValue>"]}],"returnType":[0,"TValue | null | undefined"],"optional":[0,false]}]}],"propertyType":[0,"Function"]}],"doesRowPassOtherFilter":[0,{"definition":[0,{"description":[0," A function callback, call with a node to be told whether the node passes all filters except the current filter. This is useful if you want to only present to the user values that this filter can filter given the status of the other filters. The set filter uses this to remove from the list, items that are no longer available due to the state of other filters (like Excel type filtering).\n "]}],"detailsCode":[0,"doesRowPassOtherFilter = (\n rowNode: <a href=\"/react-data-grid/row-object/\" target=\"_self\" rel=\"noreferrer\">IRowNode</a><<span/>TData>\n) => boolean;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** A function callback, call with a node to be told whether the node passes all filters except the current filter.\n * This is useful if you want to only present to the user values that this filter can filter given the status of the other filters.\n * The set filter uses this to remove from the list,\n * items that are no longer available due to the state of other filters (like Excel type filtering).\n */"],"comment":[0,"A function callback, call with a node to be told whether the node passes all filters except the current filter.\nThis is useful if you want to only present to the user values that this filter can filter given the status of the other filters.\nThe set filter uses this to remove from the list,\nitems that are no longer available due to the state of other filters (like Excel type filtering)."]}],"type":[0,{"arguments":[0,{"rowNode":[0,"IRowNode<TData>"]}],"returnType":[0,"boolean"],"optional":[0,false]}]}],"propertyType":[0,"Function"]}],"api":[0,{"definition":[0,{"description":[0," The grid api. "]}],"detailsCode":[0],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** The grid api. */"],"comment":[0,"The grid api."]}],"type":[0,{"returnType":[0,"GridApi<TData>"],"optional":[0,false]}]}],"propertyType":[0,"GridApi"]}],"context":[0,{"definition":[0,{"description":[0," Application context as set on `gridOptions.context`. "]}],"detailsCode":[0],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Application context as set on `gridOptions.context`. */"],"comment":[0,"Application context as set on `gridOptions.context`."]}],"type":[0,{"returnType":[0,"TContext"],"optional":[0,false]}]}],"propertyType":[0,"TContext"]}]}]}],"meta":[0,{"displayName":[0,"CustomFilterProps"],"description":[0,""]}]}],"config":[0,{"description":[0,""],"hideHeader":[0,true]}],"isInline":[0,true]}" ssr="" client="load" opts="{"name":"InterfaceDocumentation","value":true}" await-children=""><div class="_apiReferenceOuter_1ktqz_20 _isInline_1ktqz_24"><table class="_apiReference_1ktqz_20 _apiReference_119gq_18 no-zebra"><colgroup><col/><col/></colgroup><tbody><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-model" class="_name_1ktqz_160 side-menu-exclude"><span>model</span><a aria-label="Link to model property" href="#reference-CustomFilterProps-model" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><span class="_metaValue_1ktqz_242">TModel | null</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> The current filter model for the component. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-onModelChange" class="_name_1ktqz_160 side-menu-exclude"><span>on<wbr />Model<wbr />Change</span><a aria-label="Link to onModelChange property" href="#reference-CustomFilterProps-onModelChange" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about onModelChange"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Callback that should be called every time the model in the component changes. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-onUiChange" class="_name_1ktqz_160 side-menu-exclude"><span>on<wbr />Ui<wbr />Change</span><a aria-label="Link to onUiChange property" href="#reference-CustomFilterProps-onUiChange" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about onUiChange"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Callback that can be optionally called every time the filter UI changes. The grid will respond with emitting a FilterModifiedEvent. Apart from emitting the event, the grid takes no further action. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-column" class="_name_1ktqz_160 side-menu-exclude"><span>column</span><a aria-label="Link to column property" href="#reference-CustomFilterProps-column" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><a class="_metaValue_1ktqz_242" href="/react-data-grid/column-object/" target="_self" rel="noreferrer">Column</a></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> The column this filter is for. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-colDef" class="_name_1ktqz_160 side-menu-exclude"><span>col<wbr />Def</span><a aria-label="Link to colDef property" href="#reference-CustomFilterProps-colDef" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><a class="_metaValue_1ktqz_242" href="/react-data-grid/column-properties/" target="_self" rel="noreferrer">ColDef</a></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> The column definition for the column. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-getValue" class="_name_1ktqz_160 side-menu-exclude"><span>get<wbr />Value</span><a aria-label="Link to getValue property" href="#reference-CustomFilterProps-getValue" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about getValue"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Get the cell value for the given row node and column, which can be the column ID, definition, or <code>Column</code> object. If no column is provided, the column this filter is on will be used. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-doesRowPassOtherFilter" class="_name_1ktqz_160 side-menu-exclude"><span>does<wbr />Row<wbr />Pass<wbr />Other<wbr />Filter</span><a aria-label="Link to doesRowPassOtherFilter property" href="#reference-CustomFilterProps-doesRowPassOtherFilter" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about doesRowPassOtherFilter"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> A function callback, call with a node to be told whether the node passes all filters except the current filter. This is useful if you want to only present to the user values that this filter can filter given the status of the other filters. The set filter uses this to remove from the list, items that are no longer available due to the state of other filters (like Excel type filtering). </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-api" class="_name_1ktqz_160 side-menu-exclude"><span>api</span><a aria-label="Link to api property" href="#reference-CustomFilterProps-api" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><a class="_metaValue_1ktqz_242" href="/react-data-grid/grid-api/" target="_self" rel="noreferrer">GridApi</a></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> The grid api. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterProps-context" class="_name_1ktqz_160 side-menu-exclude"><span>context</span><a aria-label="Link to context property" href="#reference-CustomFilterProps-context" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><span class="_metaValue_1ktqz_242">TContext</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Application context as set on <code>gridOptions.context</code>. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr></tbody></table></div></astro-island><h3 id="filter-callbacks"> Filter Callbacks <a aria-label="Heading link" href="#filter-callbacks" 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>The following callbacks can be passed to the <code>useGridFilter</code> hook (<code>CustomFilterCallbacks</code> interface). The hook must be used for filters to work. The <code>doesFilterPass</code> callback is mandatory, but all others are optional.</p><p>Note that <code>doesFilterPass</code> is only called with the <a href="/react-data-grid/row-models/">Client-Side Row Model</a>. If being used exclusively with other row models, it can just return <code>true</code> as the filtering logic is performed on the server.</p><astro-island uid="1XjNY6" prefix="r18" component-url="/_astro/InterfaceDocumentation.DalJCPSB.js" component-export="InterfaceDocumentation" renderer-url="/_astro/client.5kNSwotS.js" props="{"interfaceName":[0,"CustomFilterCallbacks"],"framework":[0,"react"],"model":[0,{"type":[0,"properties"],"properties":[0,{"CustomFilterCallbacks":[0,{"doesFilterPass":[0,{"definition":[0,{"description":[0," The grid will ask each active filter, in turn, whether each row in the grid passes. If any filter fails, then the row will be excluded from the final set. The method is provided a params object with attributes node (the rodNode the grid creates that wraps the data) and data (the data object that you provided to the grid for that row). Note that this is only called for the Client-Side Row Model, and can just return `true` if being used exclusively with other row models.\n "]}],"detailsCode":[0,"doesFilterPass = (\n params: IDoesFilterPassParams\n) => boolean;\n\ninterface IDoesFilterPassParams&lt;TData = any&gt; {\n // The row node in question. \n node: <a href=\"/react-data-grid/row-object/\" target=\"_self\" rel=\"noreferrer\">IRowNode</a><<span/>TData>;\n // The data part of the row node in question. \n data: TData;\n}"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** The grid will ask each active filter, in turn, whether each row in the grid passes. If any\n * filter fails, then the row will be excluded from the final set. The method is provided a\n * params object with attributes node (the rodNode the grid creates that wraps the data) and data\n * (the data object that you provided to the grid for that row). Note that this is only called for the\n * Client-Side Row Model, and can just return `true` if being used exclusively with other row models.\n */"],"comment":[0,"The grid will ask each active filter, in turn, whether each row in the grid passes. If any\nfilter fails, then the row will be excluded from the final set. The method is provided a\nparams object with attributes node (the rodNode the grid creates that wraps the data) and data\n(the data object that you provided to the grid for that row). Note that this is only called for the\nClient-Side Row Model, and can just return `true` if being used exclusively with other row models."]}],"type":[0,{"arguments":[0,{"params":[0,"IDoesFilterPassParams"]}],"returnType":[0,"boolean"],"optional":[0,false]}]}],"propertyType":[0,"Function"]}],"onNewRowsLoaded":[0,{"definition":[0,{"description":[0," Optional: Gets called when new rows are inserted into the grid. If the filter needs to change its state after rows are loaded, it can do it here. For example the set filters uses this to update the list of available values to select from (e.g. 'Ireland', 'UK' etc for Country filter). To get the list of available values from within this method from the Client Side Row Model, use `gridApi.forEachLeafNode(callback)`.\n "]}],"detailsCode":[0,"onNewRowsLoaded = () => void;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Optional: Gets called when new rows are inserted into the grid. If the filter needs to change its\n * state after rows are loaded, it can do it here. For example the set filters uses this\n * to update the list of available values to select from (e.g. 'Ireland', 'UK' etc for\n * Country filter). To get the list of available values from within this method from the\n * Client Side Row Model, use `gridApi.forEachLeafNode(callback)`.\n */"],"comment":[0,"Optional: Gets called when new rows are inserted into the grid. If the filter needs to change its\nstate after rows are loaded, it can do it here. For example the set filters uses this\nto update the list of available values to select from (e.g. 'Ireland', 'UK' etc for\nCountry filter). To get the list of available values from within this method from the\nClient Side Row Model, use `gridApi.forEachLeafNode(callback)`."]}],"type":[0,{"arguments":[0,{}],"returnType":[0,"void"],"optional":[0,true]}]}],"propertyType":[0,"Function"]}],"onAnyFilterChanged":[0,{"definition":[0,{"description":[0," Optional: Called whenever any filter is changed. "]}],"detailsCode":[0,"onAnyFilterChanged = () => void;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Optional: Called whenever any filter is changed. */"],"comment":[0,"Optional: Called whenever any filter is changed."]}],"type":[0,{"arguments":[0,{}],"returnType":[0,"void"],"optional":[0,true]}]}],"propertyType":[0,"Function"]}],"getModelAsString":[0,{"definition":[0,{"description":[0," Optional: Used by AG Grid when rendering floating filters and there isn't a floating filter associated for this filter, this will happen if you create a custom filter and NOT a custom floating filter.\n "]}],"detailsCode":[0,"getModelAsString = (model: any) => string;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Optional: Used by AG Grid when rendering floating filters and there isn't a floating filter\n * associated for this filter, this will happen if you create a custom filter and NOT a custom floating\n * filter.\n */"],"comment":[0,"Optional: Used by AG Grid when rendering floating filters and there isn't a floating filter\nassociated for this filter, this will happen if you create a custom filter and NOT a custom floating\nfilter."]}],"type":[0,{"arguments":[0,{"model":[0,"any"]}],"returnType":[0,"string"],"optional":[0,true]}]}],"propertyType":[0,"Function"]}],"afterGuiAttached":[0,{"definition":[0,{"description":[0," Optional: A hook to perform any necessary operation just after the GUI for this component has been rendered on the screen. If a parent popup is closed and reopened (e.g. for filters), this method is called each time the component is shown. This is useful for any logic that requires attachment before executing, such as putting focus on a particular DOM element.\n "]}],"detailsCode":[0,"afterGuiAttached = (\n params?: IAfterGuiAttachedParams\n) => void;\n\ninterface IAfterGuiAttachedParams {\n // Where this component is attached to. \n container?: ContainerType;\n // Call this to hide the popup.\n // i.e useful if your component has an action button and you want to hide the popup after it is pressed.\n hidePopup?: () => void;\n // Set to `true` to not have the component focus its default item. \n suppressFocus?: boolean;\n}\n\ntype ContainerType = \n 'columnMenu' \n | 'contextMenu' \n | 'toolPanel' \n | 'floatingFilter' \n | 'columnFilter'\n"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Optional: A hook to perform any necessary operation just after the GUI for this component has been rendered on the screen.\n * If a parent popup is closed and reopened (e.g. for filters), this method is called each time the component is shown.\n * This is useful for any logic that requires attachment before executing, such as putting focus on a particular DOM element.\n */"],"comment":[0,"Optional: A hook to perform any necessary operation just after the GUI for this component has been rendered on the screen.\nIf a parent popup is closed and reopened (e.g. for filters), this method is called each time the component is shown.\nThis is useful for any logic that requires attachment before executing, such as putting focus on a particular DOM element."]}],"type":[0,{"arguments":[0,{"params?":[0,"IAfterGuiAttachedParams"]}],"returnType":[0,"void"],"optional":[0,true]}]}],"propertyType":[0,"Function"]}],"afterGuiDetached":[0,{"definition":[0,{"description":[0," Optional: A hook to perform any necessary operation just after the GUI for this component has been removed from the screen. If a parent popup is opened and closed (e.g. for filters), this method is called each time the component is hidden. This is useful for any logic to reset the UI state back to the model before the component is reopened.\n "]}],"detailsCode":[0,"afterGuiDetached = () => void;"],"gridOpProp":[0,{"meta":[0,{"all":[0,"/** Optional: A hook to perform any necessary operation just after the GUI for this component has been removed from the screen.\n * If a parent popup is opened and closed (e.g. for filters), this method is called each time the component is hidden.\n * This is useful for any logic to reset the UI state back to the model before the component is reopened.\n */"],"comment":[0,"Optional: A hook to perform any necessary operation just after the GUI for this component has been removed from the screen.\nIf a parent popup is opened and closed (e.g. for filters), this method is called each time the component is hidden.\nThis is useful for any logic to reset the UI state back to the model before the component is reopened."]}],"type":[0,{"arguments":[0,{}],"returnType":[0,"void"],"optional":[0,true]}]}],"propertyType":[0,"Function"]}]}]}],"meta":[0,{"displayName":[0,"CustomFilterCallbacks"],"description":[0,""]}]}],"config":[0,{"description":[0,""],"hideHeader":[0,true]}],"isInline":[0,true]}" ssr="" client="load" opts="{"name":"InterfaceDocumentation","value":true}" await-children=""><div class="_apiReferenceOuter_1ktqz_20 _isInline_1ktqz_24"><table class="_apiReference_1ktqz_20 _apiReference_119gq_18 no-zebra"><colgroup><col/><col/></colgroup><tbody><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterCallbacks-doesFilterPass" class="_name_1ktqz_160 side-menu-exclude"><span>does<wbr />Filter<wbr />Pass</span><a aria-label="Link to doesFilterPass property" href="#reference-CustomFilterCallbacks-doesFilterPass" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about doesFilterPass"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> The grid will ask each active filter, in turn, whether each row in the grid passes. If any filter fails, then the row will be excluded from the final set. The method is provided a params object with attributes node (the rodNode the grid creates that wraps the data) and data (the data object that you provided to the grid for that row). Note that this is only called for the Client-Side Row Model, and can just return <code>true</code> if being used exclusively with other row models. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterCallbacks-onNewRowsLoaded" class="_name_1ktqz_160 side-menu-exclude"><span>on<wbr />New<wbr />Rows<wbr />Loaded</span><a aria-label="Link to onNewRowsLoaded property" href="#reference-CustomFilterCallbacks-onNewRowsLoaded" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about onNewRowsLoaded"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Optional: Gets called when new rows are inserted into the grid. If the filter needs to change its state after rows are loaded, it can do it here. For example the set filters uses this to update the list of available values to select from (e.g. 'Ireland', 'UK' etc for Country filter). To get the list of available values from within this method from the Client Side Row Model, use <code>gridApi.forEachLeafNode(callback)</code>. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterCallbacks-onAnyFilterChanged" class="_name_1ktqz_160 side-menu-exclude"><span>on<wbr />Any<wbr />Filter<wbr />Changed</span><a aria-label="Link to onAnyFilterChanged property" href="#reference-CustomFilterCallbacks-onAnyFilterChanged" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about onAnyFilterChanged"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Optional: Called whenever any filter is changed. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterCallbacks-getModelAsString" class="_name_1ktqz_160 side-menu-exclude"><span>get<wbr />Model<wbr />As<wbr />String</span><a aria-label="Link to getModelAsString property" href="#reference-CustomFilterCallbacks-getModelAsString" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about getModelAsString"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Optional: Used by AG Grid when rendering floating filters and there isn't a floating filter associated for this filter, this will happen if you create a custom filter and NOT a custom floating filter. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterCallbacks-afterGuiAttached" class="_name_1ktqz_160 side-menu-exclude"><span>after<wbr />Gui<wbr />Attached</span><a aria-label="Link to afterGuiAttached property" href="#reference-CustomFilterCallbacks-afterGuiAttached" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about afterGuiAttached"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Optional: A hook to perform any necessary operation just after the GUI for this component has been rendered on the screen. If a parent popup is closed and reopened (e.g. for filters), this method is called each time the component is shown. This is useful for any logic that requires attachment before executing, such as putting focus on a particular DOM element. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr><tr class="_tableRow_119gq_4"><td class="_propertyNameDescription_119gq_25"><div class="_propertyRow_1ktqz_79"><div class="_leftColumn_1ktqz_130"><div id="reference-CustomFilterCallbacks-afterGuiDetached" class="_name_1ktqz_160 side-menu-exclude"><span>after<wbr />Gui<wbr />Detached</span><a aria-label="Link to afterGuiDetached property" href="#reference-CustomFilterCallbacks-afterGuiDetached" class="_docsHeaderIcon_15ivl_1 _linkIcon_1ktqz_176"><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></div><div class="_metaItem_1ktqz_218"><div class="_metaRow_1ktqz_229"><button class="_seeMore_1ktqz_322 button-style-none" aria-label="See more details about afterGuiDetached"><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="M23.763 9.763 16 17.525 8.237 9.763l-2.474 2.474L16 22.475l10.237-10.238-2.474-2.474Z"></path><path d="M32 32V0H0v32h32Z" style="fill:none"></path></svg></button><span class="_metaValue_1ktqz_242 undefined">Function</span></div></div></div><div class="_rightColumn_1ktqz_141"><div role="presentation"> Optional: A hook to perform any necessary operation just after the GUI for this component has been removed from the screen. If a parent popup is opened and closed (e.g. for filters), this method is called each time the component is hidden. This is useful for any logic to reset the UI state back to the model before the component is reopened. </div><div class="_actions_1ktqz_295"></div></div></div></td></tr></tbody></table></div></astro-island><h2 id="associating-floating-filter"> Associating Floating Filter <a aria-label="Heading link" href="#associating-floating-filter" 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 create your own filter you have two options to get floating filters working for that filter:</p><ol><li>You can create your own <a href="/react-data-grid/component-floating-filter/">Custom Floating Filter</a>.</li><li>You can implement the <code>getModelAsString()</code> method in your custom filter. If you implement this method and don't provide a custom floating filter, AG Grid will automatically provide a read-only version of a floating filter. See <a href="/react-data-grid/component-floating-filter/#example-custom-filter-and-read-only-floating-filter">Custom Filter And Read-Only Floating Filter</a>.</li></ol><p>If you don't provide either of these two options for your custom filter, the display area for the floating filter will be empty.</p><h2 id="custom-filters-containing-a-popup-element"> Custom Filters Containing a Popup Element <a aria-label="Heading link" href="#custom-filters-containing-a-popup-element" 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>Sometimes you will need to create custom components for your filters that also contain popup elements. This is the case for Date Filter as it pops up a Date Picker. If the library you use anchors the popup element outside of the parent filter, then when you click on it the grid will think you clicked outside of the filter and hence close the column menu.</p><p>There are two ways you can get fix this problem:</p><ul><li>Add a mouse click listener to your floating element and set it to <code>preventDefault()</code>. This way, the click event will not bubble up to the grid. This is the best solution, but you can only do this if you are writing the component yourself.</li><li>Add the <code>ag-custom-component-popup</code> CSS class to your floating element. An example of this usage can be found here: <a href="/react-data-grid/filter-date/#custom-selection-component">Custom Date Component</a></li></ul><h2 id="accessing-the-component-instance"> Accessing the Component Instance <a aria-label="Heading link" href="#accessing-the-component-instance" 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>AG Grid allows you to get a reference to the filter instances via <code>api.getColumnFilterInstance(colKey)</code>. This returns a wrapper component that matches the provided grid filter components that implement <code>IFilter</code>. To get the React custom filter component, the helper function <code>getInstance</code> can be used with this. As React components are created asynchronously, it is necessary to use a callback for both methods.</p><pre class="code language-ts"><code><span class="token comment">// let's assume a React component as follows</span> <span class="token keyword">export</span> <span class="token keyword">default</span> <span class="token function">forwardRef</span><span class="token punctuation">(</span><span class="token punctuation">(</span>props<span class="token punctuation">,</span> ref<span class="token punctuation">)</span> <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token function">useImperativeHandle</span><span class="token punctuation">(</span>ref<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 keyword">return</span> <span class="token punctuation">{</span> <span class="token operator">...</span> <span class="token comment">// required filter methods</span> <span class="token comment">// put a custom method on the filter</span> <span class="token function">myMethod</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// does something</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 operator">...</span> <span class="token comment">// rest of component</span> <span class="token punctuation">}</span> <span class="token comment">// later in your app, if you want to execute myMethod()...</span> <span class="token function">laterOnInYourApplicationSomewhere</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token comment">// get reference to the AG Grid Filter component on name column</span> api<span class="token punctuation">.</span><span class="token function">getColumnFilterInstance</span><span class="token punctuation">(</span><span class="token string">'name'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">then</span><span class="token punctuation">(</span>filterInstance <span class="token operator">=></span> <span class="token punctuation">{</span> <span class="token function">getInstance</span><span class="token punctuation">(</span>filterInstance<span class="token punctuation">,</span> comp <span class="token operator">=></span> <span class="token keyword">if</span> <span class="token punctuation">(</span>comp <span class="token operator">!=</span> <span class="token keyword">null</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> comp<span class="token punctuation">.</span><span class="token function">myMethod</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 punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre><p>The example below illustrates how a custom filter component can be accessed and methods on it invoked:</p><div class="container example-runner-outer" style="min-height:519px" 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-component-filter-filter-component" 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="ZJjdAJ" component-url="/_astro/DocsExampleRunner.B1rKQvsw.js" component-export="DocsExampleRunner" renderer-url="/_astro/client.5kNSwotS.js" props="{"title":[0,"Filter Component Instance"],"name":[0,"filter-component"],"exampleHeight":[0,445],"typescriptOnly":[0],"suppressDarkMode":[0],"pageName":[0,"component-filter"],"isDev":[0,false]}" ssr="" client="only" opts="{"name":"DocsExampleRunner","value":"react"}"></astro-island> </div> <script>(function(){const pageName = "component-filter"; const exampleName = "filter-component"; const loadingLogoId = "loading-component-filter-filter-component"; const loadingIFrameId = "loading-frame-component-filter-filter-component"; 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></article></div></div><astro-island uid="Z1Ari1g" 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,"Filter Component"]}],[0,{"depth":[0,2],"slug":[0,"implementing-a-filter-component"],"text":[0,"Implementing a Filter Component"]}],[0,{"depth":[0,2],"slug":[0,"custom-filter-parameters"],"text":[0,"Custom Filter Parameters"]}],[0,{"depth":[0,3],"slug":[0,"filter-props"],"text":[0,"Filter Props"]}],[0,{"depth":[0,3],"slug":[0,"filter-callbacks"],"text":[0,"Filter Callbacks"]}],[0,{"depth":[0,2],"slug":[0,"associating-floating-filter"],"text":[0,"Associating Floating Filter"]}],[0,{"depth":[0,2],"slug":[0,"custom-filters-containing-a-popup-element"],"text":[0,"Custom Filters Containing a Popup Element"]}],[0,{"depth":[0,2],"slug":[0,"accessing-the-component-instance"],"text":[0,"Accessing the Component Instance"]}]]],"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">Filter聽Component</a></li><li class="_level2_tnl9m_119"><a href="#implementing-a-filter-component" class="nav-link">Implementing a Filter聽Component</a></li><li class="_level2_tnl9m_119"><a href="#custom-filter-parameters" class="nav-link">Custom Filter聽Parameters</a></li><li class="_level3_tnl9m_111"><a href="#filter-props" class="nav-link">Filter聽Props</a></li><li class="_level3_tnl9m_111"><a href="#filter-callbacks" class="nav-link">Filter聽Callbacks</a></li><li class="_level2_tnl9m_119"><a href="#associating-floating-filter" class="nav-link">Associating Floating聽Filter</a></li><li class="_level2_tnl9m_119"><a href="#custom-filters-containing-a-popup-element" class="nav-link">Custom Filters Containing a Popup聽Element</a></li><li class="_level2_tnl9m_119"><a href="#accessing-the-component-instance" class="nav-link">Accessing the Component聽Instance</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: Filter Component | AG Grid