@neo4j-ndl/react 4.1.5 → 4.1.6

package/lib/cjs/data-grid/data-grid-nav/data-grid-nav.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-grid-nav.js","sourceRoot":"","sources":["../../../../src/data-grid/data-grid-nav/data-grid-nav.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { isValidInteractiveElement } from './helpers';\nimport { Keys } from './keys';\nimport { Selectors } from './selectors';\n\ntype FocusableElement = HTMLElement | SVGElement;\n\nexport type Config =\n  | {\n      /** Enable debug logs */\n      isDebug?: boolean;\n      /** CSS Selectors being used to find Rows, Row Groups, Cells and Focusable elements */\n      selectors?: Partial<typeof Selectors>;\n      /** How many rows to move when pressing page up/down - Default goes to first/last row */\n      pageUpDown?: number;\n    }\n  | undefined;\n\nexport class DataGridNav {\n  private selectors: Record<keyof typeof Selectors, string>;\n  readonly pageUpDown: number | undefined;\n  private keys: string[] = [];\n  private disabled: boolean;\n  readonly debug: boolean;\n\n  constructor();\n  constructor(config: Config);\n  constructor(config: Config = {}) {\n    const { selectors = {}, pageUpDown, isDebug = false } = config;\n    this.selectors = { ...Selectors, ...selectors };\n    this.pageUpDown = pageUpDown;\n    this.keys = [];\n    this.debug = isDebug;\n    this.disabled = false;\n  }\n\n  private debugLog = (functionName: string, message: string) => {\n    if (this.debug) console.info(`[${functionName}]: ${message}`);\n  };\n\n  /**\n   * Disables the keyboard listener in cases\n   * that elements inside the grid need to use\n   * arrows keys etc., like select dropdowns\n   */\n  public disable() {\n    this.disabled = true;\n  }\n\n  /**\n   * Enables the keyboard listeners\n   */\n  public enable() {\n    this.disabled = false;\n  }\n\n  private isFocusable(el: Element): el is FocusableElement {\n    return el instanceof HTMLElement || el instanceof SVGElement;\n  }\n\n  public focusParentCell(el: Element) {\n    const cell = el.closest(this.selectors.Cell);\n    if (cell && this.isFocusable(cell)) {\n      cell.focus();\n    }\n  }\n\n  /** Used as a keyboard listener for key up */\n  public tableKeyUp() {\n    // TODO: have a cleanup as user can press key\n    //  and then move to another tab, and get back to the same tab\n    // so this will not be empty (the bug exists with .pop)\n    this.keys = [];\n  }\n\n  /** Used as a keyboard listener for key down */\n  public tableKeyDown(e: KeyboardEvent) {\n    this.debugLog('tableKeyDown', `Key pressed: ${e.key}`);\n    if (this.disabled) {\n      this.debugLog('tableKeyDown', 'interaction is disabled');\n      return;\n    }\n    /**\n     * Avoid page scrolling etc.\n     * Enable default behavior for:\n     * Tab, Shift + Tab\n     * TODO: Actually it will be better to just prevent\n     * in ArrowKeys and PageKeys maybe?\n     * Or should the consumer stop propagation?!\n     * Cannot work with preventDefault as it will\n     * first capture the event from an input in cell for example\n     */\n    if (\n      Keys.ArrowDown === e.key ||\n      Keys.ArrowUp === e.key ||\n      Keys.ArrowLeft === e.key ||\n      Keys.ArrowRight === e.key\n    ) {\n      e.preventDefault();\n    }\n\n    /**\n     * Add key to the stack if it's\n     * not the same with the last (long press)\n     */\n    if (this.keys.length === 0 || this.keys[this.keys.length - 1] !== e.key) {\n      this.keys.push(e.key);\n    }\n\n    /**\n     * Need to check if we are inside a grid cell\n     * or not to enable/disable Grid Navigation\n     */\n    if (!(e.target instanceof Element)) return;\n    const cell = e.target.parentElement?.closest(\n      `${this.selectors.Cell},${this.selectors.Row}`,\n    );\n\n    if (!cell) {\n      this.debugLog('tableKeyDown', 'cell not found');\n      return;\n    }\n\n    if (cell.matches(this.selectors.Cell)) {\n      this.debugLog('tableKeyDown', 'event captured in cell');\n      this.cellNavigation(e);\n    } else {\n      this.debugLog('tableKeyDown', 'event captured in grid');\n      this.gridNavigation(e);\n    }\n  }\n\n  /**\n   * Handles the navigation inside a cell\n   */\n  public cellNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) return;\n\n    const cell = e.target.closest(this.selectors.Cell);\n\n    if (!cell) {\n      this.debugLog('cellNavigation', 'cell not found');\n      return;\n    }\n\n    if (this.getValidFocusableChild(cell)) {\n      this.debugLog('cellNavigation', 'valid focusable child found');\n      this.gridNavigation(e);\n      return;\n    }\n\n    const focusableWidgets = cell\n      ? [...cell.querySelectorAll(this.selectors.Focusable)]\n      : [];\n    const widgetIdx = focusableWidgets.findIndex((el) => el === e.target);\n\n    /**\n     * Keys: Escape\n     * Restore grid navigation\n     */\n    if (e.key === Keys.Escape && this.isFocusable(cell)) {\n      cell.focus();\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n\n    /**\n     * Keys: ArrowRight, ArrowDown\n     * Move to the next focusable cell, or the first one\n     *\n     * Arrow Down disabled:\n     * https://github.com/w3c/aria-practices/issues/2739#issuecomment-1613538972\n     */\n    if (e.key === Keys.ArrowRight || e.key === Keys.ArrowDown) {\n      const nextFocusable =\n        widgetIdx === focusableWidgets.length - 1 ? 0 : widgetIdx + 1;\n      const widgetToFocus = focusableWidgets[nextFocusable];\n      if (this.isFocusable(widgetToFocus)) {\n        widgetToFocus.focus();\n      }\n      return;\n    }\n\n    /**\n     * Keys: ArrowLeft, ArrowUp\n     * Move to the previous focusable cell, or the last one\n     *\n     * Arrow Up disabled:\n     * https://github.com/w3c/aria-practices/issues/2739#issuecomment-1613538972\n     */\n    if (e.key === Keys.ArrowLeft || e.key === Keys.ArrowUp) {\n      const previousFocusable =\n        widgetIdx === 0 ? focusableWidgets.length - 1 : widgetIdx - 1;\n      const widgetToFocus = focusableWidgets[previousFocusable];\n      if (this.isFocusable(widgetToFocus)) {\n        widgetToFocus.focus();\n      }\n      return;\n    }\n  }\n\n  /**\n   * Get the valid focusable child of a cell\n   * @return {FocusableElement | null} - The valid focusable child, or null if there are none or multiple focusable children\n   */\n  private getValidFocusableChild(el: Element): FocusableElement | null {\n    const focusableChildren = [\n      ...el.querySelectorAll(this.selectors.Focusable),\n    ];\n    if (\n      focusableChildren.length === 1 &&\n      isValidInteractiveElement(focusableChildren[0]) &&\n      this.isFocusable(focusableChildren[0])\n    ) {\n      return focusableChildren[0];\n    }\n    return null;\n  }\n\n  /**\n   * Handles the navigation outside a cell\n   * on the grid level\n   */\n  public gridNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) return;\n\n    if (this.keys.length === 1) {\n      /**\n       * Keys: Enter\n       * Should move focus inside the cell to the first focusable element:\n       * https://www.w3.org/WAI/ARIA/apg/patterns/grid/#gridNav_inside\n       */\n      if (e.key === Keys.Enter) {\n        const cell = e.target.querySelector(this.selectors.Focusable);\n        if (cell && this.isFocusable(cell)) {\n          // Enter can trigger child elements:\n          // Source: https://www.reddit.com/r/learnjavascript/comments/14kpj24/wrong_keydown_listener_is_called_with_focus/\n          // If the e.preventDefault causes issues, we can offset the execution with setTimeout\n          cell.focus();\n          e.preventDefault();\n        }\n      }\n\n      /**\n       * Keys: ArrowLeft, ArrowRight\n       * Should move focus to the next/previous cell\n       */\n      if (e.key === Keys.ArrowLeft || e.key === Keys.ArrowRight) {\n        const direction = e.key === Keys.ArrowLeft ? 'prev' : 'next';\n        // Get the closest cell we are currently in\n        const cell = e.target.closest(this.selectors.Cell);\n\n        if (cell && cell instanceof Element) {\n          const closeFocusable = this.findUntil(\n            direction,\n            cell,\n            this.selectors.Cell,\n          );\n          if (closeFocusable) {\n            const focusableChild = this.getValidFocusableChild(closeFocusable);\n\n            const toFocus = focusableChild ?? closeFocusable;\n            toFocus.focus();\n            toFocus.scrollIntoView({\n              block: 'nearest',\n              inline: 'nearest',\n            });\n          }\n        }\n      }\n\n      /**\n       * Keys: Up,Down\n       * Should move focus to the same column of the next/previous row\n       */\n      if (e.key === Keys.ArrowDown || e.key === Keys.ArrowUp) {\n        this.verticalCellNavigation(e);\n        return;\n      }\n\n      /**\n       * Keys: PageUp, PageDown\n       * Should move focus to the first/last row\n       * or a predefined number of rows if user provides a value\n       */\n      if (e.key === Keys.PageUp || e.key === Keys.PageDown) {\n        this.pageCellNavigation(e);\n        return;\n      }\n\n      /**\n       * Keys: Home, End\n       * Should move focus to the first/last cell of the current row\n       */\n      if (e.key === Keys.Home || e.key === Keys.End) {\n        const row = e.target.closest(this.selectors.Row) as Element;\n        const rowChildren = [...(row?.children || [])];\n        if (e.key === 'End') rowChildren.reverse();\n        this.focusOnFirstCell(rowChildren);\n      }\n    } else {\n      /**\n       * Keys: Control + Home, Control + End\n       * Should move focus to the first/last cell of the first/last row\n       */\n      const [firstKey, secondKey] = this.keys;\n      if (\n        firstKey === 'Control' &&\n        (secondKey === Keys.Home || secondKey === Keys.End)\n      ) {\n        const row = e.target.closest(this.selectors.Row) as Element;\n        const siblings = row.parentElement?.children;\n\n        if (!siblings) {\n          this.debugLog('cellNavigation', 'siblings not found');\n          return;\n        }\n\n        const rowToFocus =\n          secondKey === Keys.Home ? siblings[0] : siblings[siblings.length - 1];\n        const rowChildren = [...(rowToFocus?.children || [])];\n        if (secondKey === Keys.End) rowChildren.reverse();\n        this.focusOnFirstCell(rowChildren);\n      }\n    }\n  }\n\n  private pageCellNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) return;\n    const row = e.target.closest(this.selectors.Row) as Element;\n    const cell = e.target.closest(this.selectors.Cell) as Element;\n\n    if (row && cell) {\n      const position = this.getColumnIndex(cell);\n\n      if (position === undefined) {\n        this.debugLog('cellNavigation', 'position not found');\n        return;\n      }\n\n      const direction = e.key === Keys.PageUp ? 'prev' : 'next';\n      const siblings = row.parentElement?.children;\n\n      if (!siblings) {\n        this.debugLog('cellNavigation', 'siblings not found');\n        return;\n      }\n\n      // If pageUpDown is defined, we should move that number of rows, or to the closest possible\n      let destinationRow: Element | ChildNode;\n      if (this.pageUpDown) {\n        const methodClbk =\n          direction === 'prev' ? 'previousSibling' : 'nextSibling';\n        let sibling = row[methodClbk];\n        if (sibling === null) return;\n\n        let lastVisitedSibling = sibling;\n\n        for (let i = 0; i < this.pageUpDown - 1 && sibling; i++) {\n          sibling = sibling[methodClbk];\n          if (sibling) {\n            lastVisitedSibling = sibling;\n          }\n        }\n        destinationRow = sibling ? sibling : lastVisitedSibling;\n      } else {\n        destinationRow =\n          direction === 'prev' ? siblings[0] : siblings[siblings.length - 1];\n      }\n      if (!destinationRow || !(destinationRow instanceof Element)) return;\n\n      const child = destinationRow.children[position];\n      if (child && this.isFocusable(child)) {\n        const focusableGrandChild = this.getValidFocusableChild(child);\n        if (focusableGrandChild) {\n          focusableGrandChild.focus();\n        } else {\n          child.focus();\n        }\n      }\n    }\n  }\n\n  private verticalCellNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) return;\n    const row = e.target.closest(this.selectors.Row) as Element;\n    const cell = e.target.closest(this.selectors.Cell) as Element;\n\n    if (row && cell) {\n      const cellPosition = this.getColumnIndex(cell);\n      const rowPosition = this.getRowIndex(row);\n      this.debugLog('gridNavigation', `Initial row position: ${rowPosition}`);\n      this.debugLog('gridNavigation', `Initial cell position: ${cellPosition}`);\n      if (cellPosition === undefined || rowPosition === undefined) {\n        this.debugLog(\n          'verticalCellNavigation',\n          'row or cell position not found',\n        );\n        return;\n      }\n\n      const direction = e.key === Keys.ArrowUp ? 'prev' : 'next';\n\n      /** Find previous rowgroup and focus on the proper cell */\n      if (rowPosition === 0 && direction === 'prev') {\n        const currentRowGroup = row.parentElement?.closest(\n          this.selectors.RowGroup,\n        );\n        const siblingRowGroups = [\n          ...(currentRowGroup?.parentElement?.children || []),\n        ];\n        const currentRowGroupIdx = siblingRowGroups.findIndex(\n          (el) => el === currentRowGroup,\n        );\n        if (currentRowGroupIdx !== 0) {\n          const previousRowGroup = siblingRowGroups[currentRowGroupIdx - 1];\n          const rows = [\n            ...previousRowGroup.querySelectorAll(this.selectors.Row),\n          ];\n          const child = rows[rows.length - 1].children[cellPosition];\n          if (child && this.isFocusable(child)) {\n            const focusableGrandChild = this.getValidFocusableChild(child);\n            if (focusableGrandChild) {\n              focusableGrandChild.focus();\n            } else {\n              child.focus();\n            }\n          }\n          return;\n        }\n      }\n\n      const siblingRows = [\n        ...(row.parentElement?.querySelectorAll(this.selectors.Row) || []),\n      ];\n      /** Find next rowgroup and focus on the proper cell */\n      if (rowPosition === siblingRows.length - 1 && direction === 'next') {\n        const currentRowGroup = row.parentElement?.closest(\n          this.selectors.RowGroup,\n        );\n        const siblingRowGroups = [\n          ...(currentRowGroup?.parentElement?.children || []),\n        ];\n        const currentRowGroupIdx = siblingRowGroups.findIndex(\n          (el) => el === currentRowGroup,\n        );\n        if (currentRowGroupIdx !== siblingRowGroups.length - 1) {\n          const nextRowGroup = siblingRowGroups[currentRowGroupIdx + 1];\n          const rows = [...nextRowGroup.querySelectorAll(this.selectors.Row)];\n          const child = rows[0].children[cellPosition];\n          if (child && this.isFocusable(child)) {\n            const focusableGrandChild = this.getValidFocusableChild(child);\n            if (focusableGrandChild) {\n              focusableGrandChild.focus();\n            } else {\n              child.focus();\n            }\n          }\n          return;\n        }\n        return;\n      }\n\n      /** Navigation in the same rowgroup */\n      const destinationRow = this.findUntil(direction, row, this.selectors.Row);\n      if (!destinationRow) return;\n\n      const child = destinationRow.children[cellPosition];\n      if (child && this.isFocusable(child)) {\n        const focusableGrandChild = this.getValidFocusableChild(child);\n        if (focusableGrandChild) {\n          focusableGrandChild.focus();\n        } else {\n          child.focus();\n        }\n      }\n    }\n  }\n\n  /**\n   * Sending a row `Element` and then the first cell will be focused.\n   *\n   * If you want to focus the last cell then the row children can be passed in\n   * reversed order\n   */\n  private focusOnFirstCell(el: Element[]) {\n    for (let i = 0; i < el.length; i++) {\n      const child = el[i];\n      if (this.isFocusable(child)) {\n        child.focus();\n        return;\n      }\n    }\n  }\n\n  /**\n   * Get the column index of a `cell` based on the first `row` parent.\n   * `cellIndex` could be used, but it's not supported in HTML tables.\n   */\n  private getColumnIndex(cell: Element) {\n    let position = 0;\n    const siblings = cell?.parentNode?.children;\n    if (!siblings) return undefined;\n\n    while (cell !== siblings[position] && siblings[position] !== undefined) {\n      position++;\n    }\n\n    // Cell position find was not possible, maybe should log here\n    if (siblings[position] === undefined) {\n      this.debugLog('getColumnIndex', 'position finding was not successful');\n      return undefined;\n    }\n    return position;\n  }\n\n  /**\n   * Get the row index of a `row` based\n   * on its sibling rows\n   */\n  private getRowIndex(row: Element) {\n    let position = 0;\n    const siblings = row?.parentNode?.children;\n    if (!siblings) return undefined;\n\n    while (row !== siblings[position] && siblings[position] !== undefined) {\n      position++;\n    }\n\n    // Cell position find was not possible\n    if (siblings[position] === undefined) {\n      this.debugLog('getRowIndex', 'position finding was not successful');\n      return undefined;\n    }\n    return position;\n  }\n\n  /**\n   * Equivalent to prevUntil/nextUntil in jQuery\n   * https://api.jquery.com/prevUntil/\n   */\n  private findUntil(\n    direction: 'next' | 'prev',\n    el: Element | ChildNode,\n    matchSelector: string,\n    exitSelector?: string,\n  ): FocusableElement | null {\n    let element: ChildNode = el;\n    const method = direction === 'next' ? 'nextSibling' : 'previousSibling';\n\n    while (element[method]) {\n      const sibling = element[method];\n      if (!sibling) return null;\n      if (\n        exitSelector &&\n        sibling instanceof Element &&\n        sibling.matches(exitSelector)\n      ) {\n        return null;\n      }\n\n      if (sibling instanceof Element && sibling.matches(matchSelector)) {\n        return sibling as FocusableElement;\n      }\n\n      element = sibling;\n    }\n\n    return null;\n  }\n}\n"]}
+{"version":3,"file":"data-grid-nav.js","sourceRoot":"","sources":["../../../../src/data-grid/data-grid-nav/data-grid-nav.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { isValidInteractiveElement } from './helpers';\nimport { Keys } from './keys';\nimport { Selectors } from './selectors';\n\ntype FocusableElement = HTMLElement | SVGElement;\n\nexport type Config =\n  | {\n      /** Enable debug logs */\n      isDebug?: boolean;\n      /** CSS Selectors being used to find Rows, Row Groups, Cells and Focusable elements */\n      selectors?: Partial<typeof Selectors>;\n      /** How many rows to move when pressing page up/down - Default goes to first/last row */\n      pageUpDown?: number;\n    }\n  | undefined;\n\nexport class DataGridNav {\n  private selectors: Record<keyof typeof Selectors, string>;\n  readonly pageUpDown: number | undefined;\n  private keys: string[] = [];\n  private disabled: boolean;\n  readonly debug: boolean;\n\n  constructor();\n  constructor(config: Config);\n  constructor(config: Config = {}) {\n    const { selectors = {}, pageUpDown, isDebug = false } = config;\n    this.selectors = { ...Selectors, ...selectors };\n    this.pageUpDown = pageUpDown;\n    this.keys = [];\n    this.debug = isDebug;\n    this.disabled = false;\n  }\n\n  private debugLog = (functionName: string, message: string) => {\n    if (this.debug) {\n      console.info(`[${functionName}]: ${message}`);\n    }\n  };\n\n  /**\n   * Disables the keyboard listener in cases\n   * that elements inside the grid need to use\n   * arrows keys etc., like select dropdowns\n   */\n  public disable() {\n    this.disabled = true;\n  }\n\n  /**\n   * Enables the keyboard listeners\n   */\n  public enable() {\n    this.disabled = false;\n  }\n\n  private isFocusable(el: Element): el is FocusableElement {\n    return el instanceof HTMLElement || el instanceof SVGElement;\n  }\n\n  public focusParentCell(el: Element) {\n    const cell = el.closest(this.selectors.Cell);\n    if (cell && this.isFocusable(cell)) {\n      cell.focus();\n    }\n  }\n\n  /** Used as a keyboard listener for key up */\n  public tableKeyUp() {\n    // TODO: have a cleanup as user can press key\n    //  and then move to another tab, and get back to the same tab\n    // so this will not be empty (the bug exists with .pop)\n    this.keys = [];\n  }\n\n  /** Used as a keyboard listener for key down */\n  public tableKeyDown(e: KeyboardEvent) {\n    this.debugLog('tableKeyDown', `Key pressed: ${e.key}`);\n    if (this.disabled) {\n      this.debugLog('tableKeyDown', 'interaction is disabled');\n      return;\n    }\n    /**\n     * Avoid page scrolling etc.\n     * Enable default behavior for:\n     * Tab, Shift + Tab\n     * TODO: Actually it will be better to just prevent\n     * in ArrowKeys and PageKeys maybe?\n     * Or should the consumer stop propagation?!\n     * Cannot work with preventDefault as it will\n     * first capture the event from an input in cell for example\n     */\n    if (\n      Keys.ArrowDown === e.key ||\n      Keys.ArrowUp === e.key ||\n      Keys.ArrowLeft === e.key ||\n      Keys.ArrowRight === e.key\n    ) {\n      e.preventDefault();\n    }\n\n    /**\n     * Add key to the stack if it's\n     * not the same with the last (long press)\n     */\n    if (this.keys.length === 0 || this.keys[this.keys.length - 1] !== e.key) {\n      this.keys.push(e.key);\n    }\n\n    /**\n     * Need to check if we are inside a grid cell\n     * or not to enable/disable Grid Navigation\n     */\n    if (!(e.target instanceof Element)) {\n      return;\n    }\n    const cell = e.target.parentElement?.closest(\n      `${this.selectors.Cell},${this.selectors.Row}`,\n    );\n\n    if (!cell) {\n      this.debugLog('tableKeyDown', 'cell not found');\n      return;\n    }\n\n    if (cell.matches(this.selectors.Cell)) {\n      this.debugLog('tableKeyDown', 'event captured in cell');\n      this.cellNavigation(e);\n    } else {\n      this.debugLog('tableKeyDown', 'event captured in grid');\n      this.gridNavigation(e);\n    }\n  }\n\n  /**\n   * Handles the navigation inside a cell\n   */\n  public cellNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) {\n      return;\n    }\n\n    const cell = e.target.closest(this.selectors.Cell);\n\n    if (!cell) {\n      this.debugLog('cellNavigation', 'cell not found');\n      return;\n    }\n\n    if (this.getValidFocusableChild(cell)) {\n      this.debugLog('cellNavigation', 'valid focusable child found');\n      this.gridNavigation(e);\n      return;\n    }\n\n    const focusableWidgets = cell\n      ? [...cell.querySelectorAll(this.selectors.Focusable)]\n      : [];\n    const widgetIdx = focusableWidgets.findIndex((el) => el === e.target);\n\n    /**\n     * Keys: Escape\n     * Restore grid navigation\n     */\n    if (e.key === Keys.Escape && this.isFocusable(cell)) {\n      cell.focus();\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n\n    /**\n     * Keys: ArrowRight, ArrowDown\n     * Move to the next focusable cell, or the first one\n     *\n     * Arrow Down disabled:\n     * https://github.com/w3c/aria-practices/issues/2739#issuecomment-1613538972\n     */\n    if (e.key === Keys.ArrowRight || e.key === Keys.ArrowDown) {\n      const nextFocusable =\n        widgetIdx === focusableWidgets.length - 1 ? 0 : widgetIdx + 1;\n      const widgetToFocus = focusableWidgets[nextFocusable];\n      if (this.isFocusable(widgetToFocus)) {\n        widgetToFocus.focus();\n      }\n      return;\n    }\n\n    /**\n     * Keys: ArrowLeft, ArrowUp\n     * Move to the previous focusable cell, or the last one\n     *\n     * Arrow Up disabled:\n     * https://github.com/w3c/aria-practices/issues/2739#issuecomment-1613538972\n     */\n    if (e.key === Keys.ArrowLeft || e.key === Keys.ArrowUp) {\n      const previousFocusable =\n        widgetIdx === 0 ? focusableWidgets.length - 1 : widgetIdx - 1;\n      const widgetToFocus = focusableWidgets[previousFocusable];\n      if (this.isFocusable(widgetToFocus)) {\n        widgetToFocus.focus();\n      }\n      return;\n    }\n  }\n\n  /**\n   * Get the valid focusable child of a cell\n   * @return {FocusableElement | null} - The valid focusable child, or null if there are none or multiple focusable children\n   */\n  private getValidFocusableChild(el: Element): FocusableElement | null {\n    const focusableChildren = [\n      ...el.querySelectorAll(this.selectors.Focusable),\n    ];\n    if (\n      focusableChildren.length === 1 &&\n      isValidInteractiveElement(focusableChildren[0]) &&\n      this.isFocusable(focusableChildren[0])\n    ) {\n      return focusableChildren[0];\n    }\n    return null;\n  }\n\n  /**\n   * Handles the navigation outside a cell\n   * on the grid level\n   */\n  public gridNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) {\n      return;\n    }\n\n    if (this.keys.length === 1) {\n      /**\n       * Keys: Enter\n       * Should move focus inside the cell to the first focusable element:\n       * https://www.w3.org/WAI/ARIA/apg/patterns/grid/#gridNav_inside\n       */\n      if (e.key === Keys.Enter) {\n        const cell = e.target.querySelector(this.selectors.Focusable);\n        if (cell && this.isFocusable(cell)) {\n          // Enter can trigger child elements:\n          // Source: https://www.reddit.com/r/learnjavascript/comments/14kpj24/wrong_keydown_listener_is_called_with_focus/\n          // If the e.preventDefault causes issues, we can offset the execution with setTimeout\n          cell.focus();\n          e.preventDefault();\n        }\n      }\n\n      /**\n       * Keys: ArrowLeft, ArrowRight\n       * Should move focus to the next/previous cell\n       */\n      if (e.key === Keys.ArrowLeft || e.key === Keys.ArrowRight) {\n        const direction = e.key === Keys.ArrowLeft ? 'prev' : 'next';\n        // Get the closest cell we are currently in\n        const cell = e.target.closest(this.selectors.Cell);\n\n        if (cell && cell instanceof Element) {\n          const closeFocusable = this.findUntil(\n            direction,\n            cell,\n            this.selectors.Cell,\n          );\n          if (closeFocusable) {\n            const focusableChild = this.getValidFocusableChild(closeFocusable);\n\n            const toFocus = focusableChild ?? closeFocusable;\n            toFocus.focus();\n            toFocus.scrollIntoView({\n              block: 'nearest',\n              inline: 'nearest',\n            });\n          }\n        }\n      }\n\n      /**\n       * Keys: Up,Down\n       * Should move focus to the same column of the next/previous row\n       */\n      if (e.key === Keys.ArrowDown || e.key === Keys.ArrowUp) {\n        this.verticalCellNavigation(e);\n        return;\n      }\n\n      /**\n       * Keys: PageUp, PageDown\n       * Should move focus to the first/last row\n       * or a predefined number of rows if user provides a value\n       */\n      if (e.key === Keys.PageUp || e.key === Keys.PageDown) {\n        this.pageCellNavigation(e);\n        return;\n      }\n\n      /**\n       * Keys: Home, End\n       * Should move focus to the first/last cell of the current row\n       */\n      if (e.key === Keys.Home || e.key === Keys.End) {\n        const row = e.target.closest(this.selectors.Row) as Element;\n        const rowChildren = [...(row?.children || [])];\n        if (e.key === 'End') {\n          rowChildren.reverse();\n        }\n        this.focusOnFirstCell(rowChildren);\n      }\n    } else {\n      /**\n       * Keys: Control + Home, Control + End\n       * Should move focus to the first/last cell of the first/last row\n       */\n      const [firstKey, secondKey] = this.keys;\n      if (\n        firstKey === 'Control' &&\n        (secondKey === Keys.Home || secondKey === Keys.End)\n      ) {\n        const row = e.target.closest(this.selectors.Row) as Element;\n        const siblings = row.parentElement?.children;\n\n        if (!siblings) {\n          this.debugLog('cellNavigation', 'siblings not found');\n          return;\n        }\n\n        const rowToFocus =\n          secondKey === Keys.Home ? siblings[0] : siblings[siblings.length - 1];\n        const rowChildren = [...(rowToFocus?.children || [])];\n        if (secondKey === Keys.End) {\n          rowChildren.reverse();\n        }\n        this.focusOnFirstCell(rowChildren);\n      }\n    }\n  }\n\n  private pageCellNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) {\n      return;\n    }\n    const row = e.target.closest(this.selectors.Row) as Element;\n    const cell = e.target.closest(this.selectors.Cell) as Element;\n\n    if (row && cell) {\n      const position = this.getColumnIndex(cell);\n\n      if (position === undefined) {\n        this.debugLog('cellNavigation', 'position not found');\n        return;\n      }\n\n      const direction = e.key === Keys.PageUp ? 'prev' : 'next';\n      const siblings = row.parentElement?.children;\n\n      if (!siblings) {\n        this.debugLog('cellNavigation', 'siblings not found');\n        return;\n      }\n\n      // If pageUpDown is defined, we should move that number of rows, or to the closest possible\n      let destinationRow: Element | ChildNode;\n      if (this.pageUpDown) {\n        const methodClbk =\n          direction === 'prev' ? 'previousSibling' : 'nextSibling';\n        let sibling = row[methodClbk];\n        if (sibling === null) {\n          return;\n        }\n\n        let lastVisitedSibling = sibling;\n\n        for (let i = 0; i < this.pageUpDown - 1 && sibling; i++) {\n          sibling = sibling[methodClbk];\n          if (sibling) {\n            lastVisitedSibling = sibling;\n          }\n        }\n        destinationRow = sibling ? sibling : lastVisitedSibling;\n      } else {\n        destinationRow =\n          direction === 'prev' ? siblings[0] : siblings[siblings.length - 1];\n      }\n      if (!destinationRow || !(destinationRow instanceof Element)) {\n        return;\n      }\n\n      const child = destinationRow.children[position];\n      if (child && this.isFocusable(child)) {\n        const focusableGrandChild = this.getValidFocusableChild(child);\n        if (focusableGrandChild) {\n          focusableGrandChild.focus();\n        } else {\n          child.focus();\n        }\n      }\n    }\n  }\n\n  private verticalCellNavigation(e: KeyboardEvent) {\n    if (!(e.target instanceof Element)) {\n      return;\n    }\n    const row = e.target.closest(this.selectors.Row) as Element;\n    const cell = e.target.closest(this.selectors.Cell) as Element;\n\n    if (row && cell) {\n      const cellPosition = this.getColumnIndex(cell);\n      const rowPosition = this.getRowIndex(row);\n      this.debugLog('gridNavigation', `Initial row position: ${rowPosition}`);\n      this.debugLog('gridNavigation', `Initial cell position: ${cellPosition}`);\n      if (cellPosition === undefined || rowPosition === undefined) {\n        this.debugLog(\n          'verticalCellNavigation',\n          'row or cell position not found',\n        );\n        return;\n      }\n\n      const direction = e.key === Keys.ArrowUp ? 'prev' : 'next';\n\n      /** Find previous rowgroup and focus on the proper cell */\n      if (rowPosition === 0 && direction === 'prev') {\n        const currentRowGroup = row.parentElement?.closest(\n          this.selectors.RowGroup,\n        );\n        const siblingRowGroups = [\n          ...(currentRowGroup?.parentElement?.children || []),\n        ];\n        const currentRowGroupIdx = siblingRowGroups.findIndex(\n          (el) => el === currentRowGroup,\n        );\n        if (currentRowGroupIdx !== 0) {\n          const previousRowGroup = siblingRowGroups[currentRowGroupIdx - 1];\n          const rows = [\n            ...previousRowGroup.querySelectorAll(this.selectors.Row),\n          ];\n          const child = rows[rows.length - 1].children[cellPosition];\n          if (child && this.isFocusable(child)) {\n            const focusableGrandChild = this.getValidFocusableChild(child);\n            if (focusableGrandChild) {\n              focusableGrandChild.focus();\n            } else {\n              child.focus();\n            }\n          }\n          return;\n        }\n      }\n\n      const siblingRows = [\n        ...(row.parentElement?.querySelectorAll(this.selectors.Row) || []),\n      ];\n      /** Find next rowgroup and focus on the proper cell */\n      if (rowPosition === siblingRows.length - 1 && direction === 'next') {\n        const currentRowGroup = row.parentElement?.closest(\n          this.selectors.RowGroup,\n        );\n        const siblingRowGroups = [\n          ...(currentRowGroup?.parentElement?.children || []),\n        ];\n        const currentRowGroupIdx = siblingRowGroups.findIndex(\n          (el) => el === currentRowGroup,\n        );\n        if (currentRowGroupIdx !== siblingRowGroups.length - 1) {\n          const nextRowGroup = siblingRowGroups[currentRowGroupIdx + 1];\n          const rows = [...nextRowGroup.querySelectorAll(this.selectors.Row)];\n          const child = rows[0].children[cellPosition];\n          if (child && this.isFocusable(child)) {\n            const focusableGrandChild = this.getValidFocusableChild(child);\n            if (focusableGrandChild) {\n              focusableGrandChild.focus();\n            } else {\n              child.focus();\n            }\n          }\n          return;\n        }\n        return;\n      }\n\n      /** Navigation in the same rowgroup */\n      const destinationRow = this.findUntil(direction, row, this.selectors.Row);\n      if (!destinationRow) {\n        return;\n      }\n\n      const child = destinationRow.children[cellPosition];\n      if (child && this.isFocusable(child)) {\n        const focusableGrandChild = this.getValidFocusableChild(child);\n        if (focusableGrandChild) {\n          focusableGrandChild.focus();\n        } else {\n          child.focus();\n        }\n      }\n    }\n  }\n\n  /**\n   * Sending a row `Element` and then the first cell will be focused.\n   *\n   * If you want to focus the last cell then the row children can be passed in\n   * reversed order\n   */\n  private focusOnFirstCell(el: Element[]) {\n    for (let i = 0; i < el.length; i++) {\n      const child = el[i];\n      if (this.isFocusable(child)) {\n        child.focus();\n        return;\n      }\n    }\n  }\n\n  /**\n   * Get the column index of a `cell` based on the first `row` parent.\n   * `cellIndex` could be used, but it's not supported in HTML tables.\n   */\n  private getColumnIndex(cell: Element) {\n    let position = 0;\n    const siblings = cell?.parentNode?.children;\n    if (!siblings) {\n      return undefined;\n    }\n\n    while (cell !== siblings[position] && siblings[position] !== undefined) {\n      position++;\n    }\n\n    // Cell position find was not possible, maybe should log here\n    if (siblings[position] === undefined) {\n      this.debugLog('getColumnIndex', 'position finding was not successful');\n      return undefined;\n    }\n    return position;\n  }\n\n  /**\n   * Get the row index of a `row` based\n   * on its sibling rows\n   */\n  private getRowIndex(row: Element) {\n    let position = 0;\n    const siblings = row?.parentNode?.children;\n    if (!siblings) {\n      return undefined;\n    }\n\n    while (row !== siblings[position] && siblings[position] !== undefined) {\n      position++;\n    }\n\n    // Cell position find was not possible\n    if (siblings[position] === undefined) {\n      this.debugLog('getRowIndex', 'position finding was not successful');\n      return undefined;\n    }\n    return position;\n  }\n\n  /**\n   * Equivalent to prevUntil/nextUntil in jQuery\n   * https://api.jquery.com/prevUntil/\n   */\n  private findUntil(\n    direction: 'next' | 'prev',\n    el: Element | ChildNode,\n    matchSelector: string,\n    exitSelector?: string,\n  ): FocusableElement | null {\n    let element: ChildNode = el;\n    const method = direction === 'next' ? 'nextSibling' : 'previousSibling';\n\n    while (element[method]) {\n      const sibling = element[method];\n      if (!sibling) {\n        return null;\n      }\n      if (\n        exitSelector &&\n        sibling instanceof Element &&\n        sibling.matches(exitSelector)\n      ) {\n        return null;\n      }\n\n      if (sibling instanceof Element && sibling.matches(matchSelector)) {\n        return sibling as FocusableElement;\n      }\n\n      element = sibling;\n    }\n\n    return null;\n  }\n}\n"]}

package/lib/cjs/data-grid/data-grid-nav/helpers.js

@@ -27,8 +27,9 @@ exports.isValidInteractiveElement = void 0;
  * @returns true if the element is an interactive element that doesn't disrupt grid navigation
  */
 const isValidInteractiveElement = (element) => {
-    if (!(element instanceof HTMLElement))
+    if (!(element instanceof HTMLElement)) {
         return false;
+    }
     const interactiveTags = new Set(['A', 'BUTTON', 'DETAILS']);
     const interactiveInputTypes = new Set([
         'checkbox',

package/lib/cjs/data-grid/data-grid-nav/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../../src/data-grid/data-grid-nav/helpers.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH;;;;GAIG;AACI,MAAM,yBAAyB,GAAG,CAAC,OAAgB,EAAW,EAAE;IACrE,IAAI,CAAC,CAAC,OAAO,YAAY,WAAW,CAAC;QAAE,OAAO,KAAK,CAAC;IAEpD,MAAM,eAAe,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IAC5D,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC;QACpC,UAAU;QACV,OAAO;QACP,QAAQ;QACR,OAAO;KACR,CAAC,CAAC;IAEH,IAAI,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;QACzC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,OAAO,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;QAChC,MAAM,SAAS,GAAI,OAA4B,CAAC,IAAI,CAAC;QACrD,OAAO,qBAAqB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AArBW,QAAA,yBAAyB,6BAqBpC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\n/**\n * This function checks that an element is interactive and of a type that doesn't disrupt grid navigation.\n * @param element the element to check\n * @returns true if the element is an interactive element that doesn't disrupt grid navigation\n */\nexport const isValidInteractiveElement = (element: Element): boolean => {\n  if (!(element instanceof HTMLElement)) return false;\n\n  const interactiveTags = new Set(['A', 'BUTTON', 'DETAILS']);\n  const interactiveInputTypes = new Set([\n    'checkbox',\n    'radio',\n    'submit',\n    'reset',\n  ]);\n\n  if (interactiveTags.has(element.tagName)) {\n    return true;\n  }\n\n  if (element.tagName === 'INPUT') {\n    const inputType = (element as HTMLInputElement).type;\n    return interactiveInputTypes.has(inputType);\n  }\n\n  return false;\n};\n"]}
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../../src/data-grid/data-grid-nav/helpers.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH;;;;GAIG;AACI,MAAM,yBAAyB,GAAG,CAAC,OAAgB,EAAW,EAAE;IACrE,IAAI,CAAC,CAAC,OAAO,YAAY,WAAW,CAAC,EAAE,CAAC;QACtC,OAAO,KAAK,CAAC;IACf,CAAC;IAED,MAAM,eAAe,GAAG,IAAI,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IAC5D,MAAM,qBAAqB,GAAG,IAAI,GAAG,CAAC;QACpC,UAAU;QACV,OAAO;QACP,QAAQ;QACR,OAAO;KACR,CAAC,CAAC;IAEH,IAAI,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;QACzC,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,OAAO,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;QAChC,MAAM,SAAS,GAAI,OAA4B,CAAC,IAAI,CAAC;QACrD,OAAO,qBAAqB,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;IAC9C,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAvBW,QAAA,yBAAyB,6BAuBpC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\n/**\n * This function checks that an element is interactive and of a type that doesn't disrupt grid navigation.\n * @param element the element to check\n * @returns true if the element is an interactive element that doesn't disrupt grid navigation\n */\nexport const isValidInteractiveElement = (element: Element): boolean => {\n  if (!(element instanceof HTMLElement)) {\n    return false;\n  }\n\n  const interactiveTags = new Set(['A', 'BUTTON', 'DETAILS']);\n  const interactiveInputTypes = new Set([\n    'checkbox',\n    'radio',\n    'submit',\n    'reset',\n  ]);\n\n  if (interactiveTags.has(element.tagName)) {\n    return true;\n  }\n\n  if (element.tagName === 'INPUT') {\n    const inputType = (element as HTMLInputElement).type;\n    return interactiveInputTypes.has(inputType);\n  }\n\n  return false;\n};\n"]}

package/lib/cjs/data-grid/stories/datagrid-component-overriding.story.js

@@ -84,9 +84,7 @@ const Component = () => {
     });
     return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-8", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", as: "div", className: "n-flex n-flex-col n-gap-token-8 n-p-token-24 n-pb-token-16", children: [(0, jsx_runtime_1.jsx)("div", { children: "Current container height: 400px" }), (0, jsx_runtime_1.jsx)("div", { children: "Try updating height with Storybook' s story controls\uD83D\uDC47" })] }), (0, jsx_runtime_1.jsx)("div", { style: {
                     height: '400px',
-                }, children: (0, jsx_runtime_1.jsx)(react_1.DataGrid, { rootProps: {
-                        className: 'n-h-full',
-                    }, isResizable: true, tableInstance: table, components: {
+                }, children: (0, jsx_runtime_1.jsx)(react_1.DataGrid, { className: "n-h-full", isResizable: true, tableInstance: table, components: {
                         Body: (props) => (0, jsx_runtime_1.jsx)(react_1.DataGrid.Body, Object.assign({}, props)),
                         HeaderTitle: ({ cell, children }) => {
                             const { column, id } = cell;

package/lib/cjs/data-grid/stories/datagrid-component-overriding.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"datagrid-component-overriding.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-component-overriding.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DataGrid, Tooltip, Typography } from '@neo4j-ndl/react';\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\n\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst Component = () => {\n  const columnHelper = createColumnHelper<TestDataFormat>();\n\n  const columns = [\n    columnHelper.accessor('name', {\n      cell: (info) => info.getValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Name',\n      maxSize: 300,\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => info.renderValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Age',\n      minSize: 80,\n    }),\n    columnHelper.accessor('cypherCommand', {\n      cell: (info) => info.getValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Cypher Command',\n      minSize: 400,\n      size: 400,\n    }),\n  ];\n\n  const table = useReactTable({\n    columnResizeMode: 'onChange',\n    columns,\n    data: TABLE_DEMO_DATA,\n    debugColumns: true,\n    debugHeaders: true,\n    debugTable: true,\n    defaultColumn: {\n      maxSize: 800,\n      minSize: 80,\n    },\n    enableSorting: true,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    initialState: {\n      pagination: {\n        pageSize: 5,\n      },\n    },\n  });\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-8\">\n      <Typography\n        variant=\"body-medium\"\n        as=\"div\"\n        className=\"n-flex n-flex-col n-gap-token-8 n-p-token-24 n-pb-token-16\"\n      >\n        <div>Current container height: 400px</div>\n        <div>Try updating height with Storybook&apos; s story controls👇</div>\n      </Typography>\n\n      <div\n        style={{\n          height: '400px',\n        }}\n      >\n        <DataGrid\n          rootProps={{\n            className: 'n-h-full',\n          }}\n          isResizable={true}\n          tableInstance={table}\n          components={{\n            Body: (props) => <DataGrid.Body {...props} />,\n            HeaderTitle: ({ cell, children }) => {\n              const { column, id } = cell;\n              const title =\n                typeof column.columnDef.header === 'string'\n                  ? column.columnDef.header\n                  : id;\n              return (\n                <Tooltip type=\"simple\">\n                  <Tooltip.Trigger hasButtonWrapper>\n                    <span>{children}</span>\n                  </Tooltip.Trigger>\n                  <Tooltip.Content>{title}</Tooltip.Content>\n                </Tooltip>\n              );\n            },\n            PaginationNumericButton: ({ isSelected, style, ...restProps }) => {\n              return (\n                <DataGrid.PaginationNumericButton\n                  {...restProps}\n                  isSelected={isSelected}\n                  style={{\n                    ...style,\n                    ...(isSelected && {\n                      backgroundImage:\n                        'linear-gradient(90deg, #00C0FF 0%, #FFCF00 20%, #FC4F4F 40%, #00C0FF 100%)',\n                      backgroundSize: '200% auto',\n                      borderRadius: '10px',\n                      boxShadow: '0 0 20px #eee',\n                    }),\n                  }}\n                />\n              );\n            },\n            TableResults: () => (\n              <DataGrid.TableResults>\n                A table with a fixed height of 100px, custom result section and\n                custom pagination button\n              </DataGrid.TableResults>\n            ),\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"datagrid-component-overriding.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-component-overriding.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DataGrid, Tooltip, Typography } from '@neo4j-ndl/react';\nimport {\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\n\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst Component = () => {\n  const columnHelper = createColumnHelper<TestDataFormat>();\n\n  const columns = [\n    columnHelper.accessor('name', {\n      cell: (info) => info.getValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Name',\n      maxSize: 300,\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => info.renderValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Age',\n      minSize: 80,\n    }),\n    columnHelper.accessor('cypherCommand', {\n      cell: (info) => info.getValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Cypher Command',\n      minSize: 400,\n      size: 400,\n    }),\n  ];\n\n  const table = useReactTable({\n    columnResizeMode: 'onChange',\n    columns,\n    data: TABLE_DEMO_DATA,\n    debugColumns: true,\n    debugHeaders: true,\n    debugTable: true,\n    defaultColumn: {\n      maxSize: 800,\n      minSize: 80,\n    },\n    enableSorting: true,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    initialState: {\n      pagination: {\n        pageSize: 5,\n      },\n    },\n  });\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-8\">\n      <Typography\n        variant=\"body-medium\"\n        as=\"div\"\n        className=\"n-flex n-flex-col n-gap-token-8 n-p-token-24 n-pb-token-16\"\n      >\n        <div>Current container height: 400px</div>\n        <div>Try updating height with Storybook&apos; s story controls👇</div>\n      </Typography>\n\n      <div\n        style={{\n          height: '400px',\n        }}\n      >\n        <DataGrid\n          className=\"n-h-full\"\n          isResizable={true}\n          tableInstance={table}\n          components={{\n            Body: (props) => <DataGrid.Body {...props} />,\n            HeaderTitle: ({ cell, children }) => {\n              const { column, id } = cell;\n              const title =\n                typeof column.columnDef.header === 'string'\n                  ? column.columnDef.header\n                  : id;\n              return (\n                <Tooltip type=\"simple\">\n                  <Tooltip.Trigger hasButtonWrapper>\n                    <span>{children}</span>\n                  </Tooltip.Trigger>\n                  <Tooltip.Content>{title}</Tooltip.Content>\n                </Tooltip>\n              );\n            },\n            PaginationNumericButton: ({ isSelected, style, ...restProps }) => {\n              return (\n                <DataGrid.PaginationNumericButton\n                  {...restProps}\n                  isSelected={isSelected}\n                  style={{\n                    ...style,\n                    ...(isSelected && {\n                      backgroundImage:\n                        'linear-gradient(90deg, #00C0FF 0%, #FFCF00 20%, #FC4F4F 40%, #00C0FF 100%)',\n                      backgroundSize: '200% auto',\n                      borderRadius: '10px',\n                      boxShadow: '0 0 20px #eee',\n                    }),\n                  }}\n                />\n              );\n            },\n            TableResults: () => (\n              <DataGrid.TableResults>\n                A table with a fixed height of 100px, custom result section and\n                custom pagination button\n              </DataGrid.TableResults>\n            ),\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/data-grid/stories/datagrid-in-dialog.story.js

@@ -39,8 +39,9 @@ const actionsColumn = (tableNav) => ({
                     menuPortalTarget: portalTarget,
                     menuPosition: 'fixed',
                     onChange: (e) => {
-                        if (!e)
+                        if (!e) {
                             return;
+                        }
                         setSelected(e);
                     },
                     onKeyDown: (e) => {

package/lib/cjs/data-grid/stories/datagrid-in-dialog.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"datagrid-in-dialog.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-in-dialog.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  DataGrid,\n  type DataGridNav,\n  Dialog,\n  FilledButton,\n  Select,\n  useDataGridContext,\n} from '@neo4j-ndl/react';\nimport {\n  type ColumnDef,\n  type ColumnMeta,\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { useRef, useState } from 'react';\n\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst columnHelper = createColumnHelper<TestDataFormat>();\n\nconst actionsColumn: (tableNav: DataGridNav) => ColumnDef<TestDataFormat> = (\n  tableNav,\n) => ({\n  cell: ({ row }) => {\n    const options = ['Edit', 'Delete', 'View'];\n    const dropdownOptions = options.map((o) => ({ label: o, value: o }));\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const [selected, setSelected] = useState(dropdownOptions[0]);\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const { portalTarget } = useDataGridContext();\n\n    return (\n      <div\n        data-testid={`ndl-actions-cell-row-${row.index}`}\n        className=\"n-flex n-flex-row n-gap-token-8\"\n      >\n        <Select\n          ariaLabel={`actions-select-row-${row.index}`}\n          type=\"select\"\n          selectProps={{\n            menuPortalTarget: portalTarget,\n            menuPosition: 'fixed',\n            onChange: (e) => {\n              if (!e) return;\n              setSelected(e);\n            },\n            onKeyDown: (e) => {\n              // Stop propagation of arrow down to the table, to avoid moving to the next item in the cell\n              if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n                e.stopPropagation();\n              }\n            },\n            onMenuClose: () => {\n              console.info(\n                'Start listening to keyboard events for table navigation',\n              );\n              tableNav.enable();\n            },\n            onMenuOpen: () => {\n              console.info(\n                'Stop listening to keyboard events for table navigation',\n              );\n              tableNav.disable();\n            },\n            options: dropdownOptions,\n            value: selected,\n          }}\n        />\n      </div>\n    );\n  },\n  header: 'Custom Select',\n  id: 'custom-select',\n  minSize: 150,\n});\n\nconst Component = () => {\n  const [data, setData] = useState(TABLE_DEMO_DATA);\n  const [isAgeFilterApplied, setIsAgeFilterApplied] = useState(false);\n\n  const ColumnActions: ColumnMeta<TestDataFormat, unknown> = {\n    columnActions: {\n      actions: [\n        {\n          onClick: () => {\n            if (isAgeFilterApplied) {\n              setData(TABLE_DEMO_DATA);\n              setIsAgeFilterApplied(false);\n              return;\n            } else {\n              const filteredData = data.filter((item) => item.age >= 18);\n              setData(filteredData);\n              setIsAgeFilterApplied(true);\n            }\n          },\n          title: 'Age >= 18',\n        },\n      ],\n    },\n  };\n\n  const regularColumns = [\n    columnHelper.accessor('name', {\n      cell: (cell) => (\n        <DataGrid.InlineEditCell\n          cell={cell}\n          value={cell.getValue()}\n          ariaLabel=\"edit name\"\n        />\n      ),\n      maxSize: 300,\n      meta: {\n        isInlineEditCell: {\n          onEditChange: (newValue, cell) => {\n            setData((oldData) => {\n              return oldData.map((row) => {\n                if (row.name === cell.row.original.name) {\n                  return {\n                    ...row,\n                    name: newValue,\n                  };\n                }\n                return row;\n              });\n            });\n          },\n        },\n      },\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => {\n        return (\n          <DataGrid.DropDownCell\n            cell={info}\n            options={[\n              {\n                label: '12',\n                value: '12',\n              },\n              {\n                label: '32',\n                value: '32',\n              },\n              {\n                label: '37',\n                value: '37',\n              },\n              {\n                label: '39',\n                value: '39',\n              },\n              {\n                label: '51',\n                value: '51',\n              },\n            ]}\n            ariaLabel=\"select age\"\n            portalTarget={document.getElementById('default-menu')}\n          />\n        );\n      },\n      meta: {\n        isDropDownCell: {\n          onChange: (newValue, cell) => {\n            if (newValue === undefined) {\n              // No change\n              return;\n            }\n\n            const parsedValue = parseInt(newValue, 10);\n\n            if (isNaN(parsedValue)) {\n              return;\n            }\n\n            setData((oldData) => {\n              return oldData.map((row) => {\n                if (row.name === cell.row.original.name) {\n                  return {\n                    ...row,\n                    age: parsedValue,\n                  };\n                }\n                return row;\n              });\n            });\n          },\n        },\n        ...ColumnActions,\n      },\n      minSize: 120,\n    }),\n    columnHelper.accessor('cypherCommand', {\n      cell: (info) => info.getValue(),\n      minSize: 400,\n      size: 400,\n    }),\n  ];\n\n  const allColumns = (tableNav: DataGridNav) => [\n    ...regularColumns,\n    actionsColumn(tableNav),\n  ];\n\n  const tableNavRef = useRef<DataGridNav>(null!);\n  const table = useReactTable({\n    columnResizeMode: 'onChange',\n    columns: allColumns(tableNavRef.current),\n    data: data,\n    debugColumns: true,\n    debugHeaders: true,\n    debugTable: true,\n    defaultColumn: {\n      maxSize: 800,\n      minSize: 80,\n    },\n    enableSorting: true,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    initialState: {\n      pagination: {\n        pageSize: 5,\n      },\n    },\n  });\n\n  // Modal code\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const handleClick = () => setIsOpen((prev) => !prev);\n  const handleClose = () => setIsOpen(false);\n\n  // DataGrid code\n  return (\n    <div className=\"n-w-full\">\n      <div className=\"n-flex n-justify-center\">\n        <FilledButton onClick={handleClick}>Open Dialog</FilledButton>\n      </div>\n      <Dialog\n        className=\"n-p-token-8 n-bg-neutral-10 n-max-w-max n-rounded-lg\"\n        htmlAttributes={{\n          id: 'default-menu',\n        }}\n        onClose={handleClose}\n        isOpen={isOpen}\n        hasDisabledCloseButton={true}\n      >\n        <Dialog.Content>\n          <DataGrid\n            portalTarget={document.getElementById('default-menu')}\n            isResizable={true}\n            tableInstance={table}\n            tableNavRef={tableNavRef}\n            isKeyboardNavigable={true}\n            styling={{\n              borderStyle: 'horizontal',\n              hasZebraStriping: false,\n            }}\n          />\n        </Dialog.Content>\n      </Dialog>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"datagrid-in-dialog.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-in-dialog.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  DataGrid,\n  type DataGridNav,\n  Dialog,\n  FilledButton,\n  Select,\n  useDataGridContext,\n} from '@neo4j-ndl/react';\nimport {\n  type ColumnDef,\n  type ColumnMeta,\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { useRef, useState } from 'react';\n\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst columnHelper = createColumnHelper<TestDataFormat>();\n\nconst actionsColumn: (tableNav: DataGridNav) => ColumnDef<TestDataFormat> = (\n  tableNav,\n) => ({\n  cell: ({ row }) => {\n    const options = ['Edit', 'Delete', 'View'];\n    const dropdownOptions = options.map((o) => ({ label: o, value: o }));\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const [selected, setSelected] = useState(dropdownOptions[0]);\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const { portalTarget } = useDataGridContext();\n\n    return (\n      <div\n        data-testid={`ndl-actions-cell-row-${row.index}`}\n        className=\"n-flex n-flex-row n-gap-token-8\"\n      >\n        <Select\n          ariaLabel={`actions-select-row-${row.index}`}\n          type=\"select\"\n          selectProps={{\n            menuPortalTarget: portalTarget,\n            menuPosition: 'fixed',\n            onChange: (e) => {\n              if (!e) {\n                return;\n              }\n              setSelected(e);\n            },\n            onKeyDown: (e) => {\n              // Stop propagation of arrow down to the table, to avoid moving to the next item in the cell\n              if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n                e.stopPropagation();\n              }\n            },\n            onMenuClose: () => {\n              console.info(\n                'Start listening to keyboard events for table navigation',\n              );\n              tableNav.enable();\n            },\n            onMenuOpen: () => {\n              console.info(\n                'Stop listening to keyboard events for table navigation',\n              );\n              tableNav.disable();\n            },\n            options: dropdownOptions,\n            value: selected,\n          }}\n        />\n      </div>\n    );\n  },\n  header: 'Custom Select',\n  id: 'custom-select',\n  minSize: 150,\n});\n\nconst Component = () => {\n  const [data, setData] = useState(TABLE_DEMO_DATA);\n  const [isAgeFilterApplied, setIsAgeFilterApplied] = useState(false);\n\n  const ColumnActions: ColumnMeta<TestDataFormat, unknown> = {\n    columnActions: {\n      actions: [\n        {\n          onClick: () => {\n            if (isAgeFilterApplied) {\n              setData(TABLE_DEMO_DATA);\n              setIsAgeFilterApplied(false);\n              return;\n            } else {\n              const filteredData = data.filter((item) => item.age >= 18);\n              setData(filteredData);\n              setIsAgeFilterApplied(true);\n            }\n          },\n          title: 'Age >= 18',\n        },\n      ],\n    },\n  };\n\n  const regularColumns = [\n    columnHelper.accessor('name', {\n      cell: (cell) => (\n        <DataGrid.InlineEditCell\n          cell={cell}\n          value={cell.getValue()}\n          ariaLabel=\"edit name\"\n        />\n      ),\n      maxSize: 300,\n      meta: {\n        isInlineEditCell: {\n          onEditChange: (newValue, cell) => {\n            setData((oldData) => {\n              return oldData.map((row) => {\n                if (row.name === cell.row.original.name) {\n                  return {\n                    ...row,\n                    name: newValue,\n                  };\n                }\n                return row;\n              });\n            });\n          },\n        },\n      },\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => {\n        return (\n          <DataGrid.DropDownCell\n            cell={info}\n            options={[\n              {\n                label: '12',\n                value: '12',\n              },\n              {\n                label: '32',\n                value: '32',\n              },\n              {\n                label: '37',\n                value: '37',\n              },\n              {\n                label: '39',\n                value: '39',\n              },\n              {\n                label: '51',\n                value: '51',\n              },\n            ]}\n            ariaLabel=\"select age\"\n            portalTarget={document.getElementById('default-menu')}\n          />\n        );\n      },\n      meta: {\n        isDropDownCell: {\n          onChange: (newValue, cell) => {\n            if (newValue === undefined) {\n              // No change\n              return;\n            }\n\n            const parsedValue = parseInt(newValue, 10);\n\n            if (isNaN(parsedValue)) {\n              return;\n            }\n\n            setData((oldData) => {\n              return oldData.map((row) => {\n                if (row.name === cell.row.original.name) {\n                  return {\n                    ...row,\n                    age: parsedValue,\n                  };\n                }\n                return row;\n              });\n            });\n          },\n        },\n        ...ColumnActions,\n      },\n      minSize: 120,\n    }),\n    columnHelper.accessor('cypherCommand', {\n      cell: (info) => info.getValue(),\n      minSize: 400,\n      size: 400,\n    }),\n  ];\n\n  const allColumns = (tableNav: DataGridNav) => [\n    ...regularColumns,\n    actionsColumn(tableNav),\n  ];\n\n  const tableNavRef = useRef<DataGridNav>(null!);\n  const table = useReactTable({\n    columnResizeMode: 'onChange',\n    columns: allColumns(tableNavRef.current),\n    data: data,\n    debugColumns: true,\n    debugHeaders: true,\n    debugTable: true,\n    defaultColumn: {\n      maxSize: 800,\n      minSize: 80,\n    },\n    enableSorting: true,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    getSortedRowModel: getSortedRowModel(),\n    initialState: {\n      pagination: {\n        pageSize: 5,\n      },\n    },\n  });\n\n  // Modal code\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const handleClick = () => setIsOpen((prev) => !prev);\n  const handleClose = () => setIsOpen(false);\n\n  // DataGrid code\n  return (\n    <div className=\"n-w-full\">\n      <div className=\"n-flex n-justify-center\">\n        <FilledButton onClick={handleClick}>Open Dialog</FilledButton>\n      </div>\n      <Dialog\n        className=\"n-p-token-8 n-bg-neutral-10 n-max-w-max n-rounded-lg\"\n        htmlAttributes={{\n          id: 'default-menu',\n        }}\n        onClose={handleClose}\n        isOpen={isOpen}\n        hasDisabledCloseButton={true}\n      >\n        <Dialog.Content>\n          <DataGrid\n            portalTarget={document.getElementById('default-menu')}\n            isResizable={true}\n            tableInstance={table}\n            tableNavRef={tableNavRef}\n            isKeyboardNavigable={true}\n            styling={{\n              borderStyle: 'horizontal',\n              hasZebraStriping: false,\n            }}\n          />\n        </Dialog.Content>\n      </Dialog>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/data-grid/stories/datagrid-keyboard-navigation.story.js

@@ -49,8 +49,9 @@ const actionsColumn = (tableNav) => ({
                     }, children: (0, jsx_runtime_1.jsx)(icons_1.MegaphoneIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Select, { ariaLabel: `actions-select-row-${row.index}`, type: "select", selectProps: {
                         menuPortalTarget: portalTarget,
                         onChange: (e) => {
-                            if (!e)
+                            if (!e) {
                                 return;
+                            }
                             setSelected(e);
                         },
                         onKeyDown: (e) => {

package/lib/cjs/data-grid/stories/datagrid-keyboard-navigation.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"datagrid-keyboard-navigation.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-keyboard-navigation.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Checkbox,\n  DataGrid,\n  type DataGridNav,\n  IconButton,\n  Select,\n  useDataGridContext,\n} from '@neo4j-ndl/react';\nimport { MegaphoneIconOutline } from '@neo4j-ndl/react/icons';\nimport {\n  type ColumnDef,\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { useRef, useState } from 'react';\n\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst selectableColumn: ColumnDef<TestDataFormat> = {\n  cell: ({ row }) => (\n    <Checkbox\n      ariaLabel={`row-${row.index}`}\n      isChecked={row.getIsSelected() || false}\n      onChange={row.getToggleSelectedHandler()}\n    />\n  ),\n  header: ({ table }) => (\n    <Checkbox\n      ariaLabel=\"Select all rows\"\n      isChecked={table.getIsAllRowsSelected() || false}\n      onChange={table.getToggleAllRowsSelectedHandler()}\n      isIndeterminate={table.getIsSomeRowsSelected()}\n    />\n  ),\n  id: 'select',\n  maxSize: 80,\n  size: 80,\n};\n\nconst actionsColumn: (tableNav: DataGridNav) => ColumnDef<TestDataFormat> = (\n  tableNav,\n) => ({\n  cell: ({ row }) => {\n    const options = ['Edit', 'Delete', 'View'];\n    const dropdownOptions = options.map((o) => ({ label: o, value: o }));\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const [selected, setSelected] = useState(dropdownOptions[0]);\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const { portalTarget } = useDataGridContext();\n\n    return (\n      <div\n        data-testid={`ndl-actions-cell-row-${row.index}`}\n        className=\"n-flex n-flex-row n-gap-token-8\"\n      >\n        <IconButton\n          description=\"Megaphone\"\n          onClick={() => {\n            alert(\"Let's get loud 📣\");\n          }}\n          htmlAttributes={{\n            type: 'button',\n          }}\n        >\n          <MegaphoneIconOutline />\n        </IconButton>\n        <Select\n          ariaLabel={`actions-select-row-${row.index}`}\n          type=\"select\"\n          selectProps={{\n            menuPortalTarget: portalTarget,\n            onChange: (e) => {\n              if (!e) return;\n              setSelected(e);\n            },\n            onKeyDown: (e) => {\n              // Stop propagation of arrow down to the table, to avoid moving to the next item in the cell\n              if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n                e.stopPropagation();\n              }\n            },\n            onMenuClose: () => {\n              console.info(\n                'Start listening to keyboard events for table navigation',\n              );\n              tableNav.enable();\n            },\n            onMenuOpen: () => {\n              console.info(\n                'Stop listening to keyboard events for table navigation',\n              );\n              tableNav.disable();\n            },\n            options: dropdownOptions,\n            value: selected,\n          }}\n        />\n      </div>\n    );\n  },\n  header: 'actions',\n  id: 'actions',\n});\n\nconst allColumns = (tableNav: DataGridNav) => {\n  const columnHelper = createColumnHelper<TestDataFormat>();\n\n  const commonColumns = [\n    columnHelper.accessor('name', {\n      cell: (info) => info.getValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Name',\n      maxSize: 300,\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => info.renderValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Age',\n      minSize: 80,\n    }),\n  ];\n\n  return [selectableColumn, ...commonColumns, actionsColumn(tableNav)];\n};\n\nconst Component = () => {\n  const [rowSelection, setRowSelection] = useState({});\n  const ref = useRef<HTMLDivElement>(null);\n  const tableNavRef = useRef<DataGridNav>(null!);\n\n  const table = useReactTable({\n    columnResizeMode: 'onChange',\n    columns: allColumns(tableNavRef.current),\n    data: TABLE_DEMO_DATA,\n    enableSorting: false,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    initialState: {\n      pagination: {\n        pageSize: 5,\n      },\n    },\n    onRowSelectionChange: setRowSelection,\n    state: {\n      rowSelection,\n    },\n  });\n\n  return (\n    <>\n      <DataGrid\n        isResizable={false}\n        isKeyboardNavigable={true}\n        styling={{\n          borderStyle: 'all-sides',\n        }}\n        tableNavRef={tableNavRef}\n        tableInstance={table}\n        ref={ref}\n        portalTarget={document.body}\n      />\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"datagrid-keyboard-navigation.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-keyboard-navigation.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Checkbox,\n  DataGrid,\n  type DataGridNav,\n  IconButton,\n  Select,\n  useDataGridContext,\n} from '@neo4j-ndl/react';\nimport { MegaphoneIconOutline } from '@neo4j-ndl/react/icons';\nimport {\n  type ColumnDef,\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { useRef, useState } from 'react';\n\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst selectableColumn: ColumnDef<TestDataFormat> = {\n  cell: ({ row }) => (\n    <Checkbox\n      ariaLabel={`row-${row.index}`}\n      isChecked={row.getIsSelected() || false}\n      onChange={row.getToggleSelectedHandler()}\n    />\n  ),\n  header: ({ table }) => (\n    <Checkbox\n      ariaLabel=\"Select all rows\"\n      isChecked={table.getIsAllRowsSelected() || false}\n      onChange={table.getToggleAllRowsSelectedHandler()}\n      isIndeterminate={table.getIsSomeRowsSelected()}\n    />\n  ),\n  id: 'select',\n  maxSize: 80,\n  size: 80,\n};\n\nconst actionsColumn: (tableNav: DataGridNav) => ColumnDef<TestDataFormat> = (\n  tableNav,\n) => ({\n  cell: ({ row }) => {\n    const options = ['Edit', 'Delete', 'View'];\n    const dropdownOptions = options.map((o) => ({ label: o, value: o }));\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const [selected, setSelected] = useState(dropdownOptions[0]);\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    const { portalTarget } = useDataGridContext();\n\n    return (\n      <div\n        data-testid={`ndl-actions-cell-row-${row.index}`}\n        className=\"n-flex n-flex-row n-gap-token-8\"\n      >\n        <IconButton\n          description=\"Megaphone\"\n          onClick={() => {\n            alert(\"Let's get loud 📣\");\n          }}\n          htmlAttributes={{\n            type: 'button',\n          }}\n        >\n          <MegaphoneIconOutline />\n        </IconButton>\n        <Select\n          ariaLabel={`actions-select-row-${row.index}`}\n          type=\"select\"\n          selectProps={{\n            menuPortalTarget: portalTarget,\n            onChange: (e) => {\n              if (!e) {\n                return;\n              }\n              setSelected(e);\n            },\n            onKeyDown: (e) => {\n              // Stop propagation of arrow down to the table, to avoid moving to the next item in the cell\n              if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {\n                e.stopPropagation();\n              }\n            },\n            onMenuClose: () => {\n              console.info(\n                'Start listening to keyboard events for table navigation',\n              );\n              tableNav.enable();\n            },\n            onMenuOpen: () => {\n              console.info(\n                'Stop listening to keyboard events for table navigation',\n              );\n              tableNav.disable();\n            },\n            options: dropdownOptions,\n            value: selected,\n          }}\n        />\n      </div>\n    );\n  },\n  header: 'actions',\n  id: 'actions',\n});\n\nconst allColumns = (tableNav: DataGridNav) => {\n  const columnHelper = createColumnHelper<TestDataFormat>();\n\n  const commonColumns = [\n    columnHelper.accessor('name', {\n      cell: (info) => info.getValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Name',\n      maxSize: 300,\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => info.renderValue(),\n      footer: (info) => info.column.id,\n      header: () => 'Age',\n      minSize: 80,\n    }),\n  ];\n\n  return [selectableColumn, ...commonColumns, actionsColumn(tableNav)];\n};\n\nconst Component = () => {\n  const [rowSelection, setRowSelection] = useState({});\n  const ref = useRef<HTMLDivElement>(null);\n  const tableNavRef = useRef<DataGridNav>(null!);\n\n  const table = useReactTable({\n    columnResizeMode: 'onChange',\n    columns: allColumns(tableNavRef.current),\n    data: TABLE_DEMO_DATA,\n    enableSorting: false,\n    getCoreRowModel: getCoreRowModel(),\n    getPaginationRowModel: getPaginationRowModel(),\n    initialState: {\n      pagination: {\n        pageSize: 5,\n      },\n    },\n    onRowSelectionChange: setRowSelection,\n    state: {\n      rowSelection,\n    },\n  });\n\n  return (\n    <>\n      <DataGrid\n        isResizable={false}\n        isKeyboardNavigable={true}\n        styling={{\n          borderStyle: 'all-sides',\n        }}\n        tableNavRef={tableNavRef}\n        tableInstance={table}\n        ref={ref}\n        portalTarget={document.body}\n      />\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/data-grid/stories/datagrid-kitchen-sink.story.js

@@ -77,8 +77,7 @@ const COMMON_COLUMNS = (options) => {
                     actions: [
                         {
                             onClick: (_event, cell) => {
-                                alert('Row Action triggered for row with index: ' +
-                                    cell.row.index);
+                                alert(`Row Action triggered for row with index: ${cell.row.index}`);
                             },
                             title: 'Example Row Action',
                         },

package/lib/cjs/data-grid/stories/datagrid-kitchen-sink.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"datagrid-kitchen-sink.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-kitchen-sink.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DataGrid, Menu } from '@neo4j-ndl/react';\nimport { ChevronDownIconSolid } from '@neo4j-ndl/react/icons';\nimport {\n  type ColumnDef,\n  type ColumnMeta,\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  type TableOptions,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { Leva, useControls } from 'leva';\n\nimport { type BorderStyle, type HeaderStyle } from '../DataGrid';\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst columnHelper = createColumnHelper<TestDataFormat>();\n\nconst ColumnActions: ColumnMeta<TestDataFormat, unknown> = {\n  columnActions: {\n    actions: [\n      {\n        onClick: () => {\n          alert('Action triggered');\n        },\n        title: 'Example Column Action',\n      },\n    ],\n  },\n};\n\ntype ColumnGeneratorOptions = {\n  shouldIncludeRowActionColumn: boolean;\n};\nconst COMMON_COLUMNS = (options: ColumnGeneratorOptions) => {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const columns: ColumnDef<TestDataFormat, any>[] = [\n    columnHelper.accessor('name', {\n      cell: (info) => info.getValue(),\n      maxSize: 300,\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => info.getValue(),\n      header: () => <div>Age</div>,\n      minSize: 80,\n      ...(options.shouldIncludeRowActionColumn\n        ? {\n            meta: {\n              ...ColumnActions,\n            },\n          }\n        : {}),\n    }),\n    columnHelper.accessor('cypherCommand', {\n      cell: (info) => info.getValue(),\n      minSize: 400,\n      size: 400,\n    }),\n  ];\n\n  if (options.shouldIncludeRowActionColumn) {\n    columns.push(\n      columnHelper.display({\n        cell: (cell) => {\n          const isSpecialRow =\n            cell.row.original.name === TABLE_DEMO_DATA[3].name || undefined;\n          return (\n            <DataGrid.ActionCell\n              cell={cell}\n              innerCleanIconButtonProps={{\n                children: isSpecialRow && <ChevronDownIconSolid />,\n                description: `Actions for ${cell.row.original.name}`,\n              }}\n              innerMenuProps={\n                isSpecialRow && {\n                  children: <Menu.Item title=\"Custom icon and menu props\" />,\n                }\n              }\n            />\n          );\n        },\n        id: 'actions',\n        meta: {\n          isActionCell: {\n            actions: [\n              {\n                onClick: (_event, cell) => {\n                  alert(\n                    'Row Action triggered for row with index: ' +\n                      cell.row.index,\n                  );\n                },\n                title: 'Example Row Action',\n              },\n            ],\n            onOpenChange: (open) => console.info(`onOpenChange: ${open}`),\n          },\n        },\n      }),\n    );\n  }\n\n  return columns;\n};\n\nconst COMMON_TABLE_PROPS = {\n  columnResizeMode: 'onChange',\n  data: TABLE_DEMO_DATA,\n  // https://tanstack.com/table/v8/docs/guide/column-sizing#overview\n  defaultColumn: {\n    minSize: 80,\n  },\n  enableSorting: false,\n  getCoreRowModel: getCoreRowModel(),\n  getPaginationRowModel: getPaginationRowModel(),\n  initialState: {\n    pagination: {\n      pageSize: 5,\n    },\n  },\n  meta: {\n    actions: [\n      {\n        onClick: () => {\n          alert('wowowow');\n        },\n        title: \"Let's party\",\n      },\n    ],\n  },\n} as Omit<TableOptions<TestDataFormat>, 'columns'>;\n\nconst Component = () => {\n  const {\n    keyboard: isKeyboardNavigable,\n    zebraStriping: hasZebraStriping,\n    borderStyle,\n    headerStyle,\n    includeRowActionColumn: shouldIncludeRowActionColumn,\n  } = useControls({\n    borderStyle: {\n      options: ['all-sides', 'horizontal', 'vertical', 'none'],\n      value: 'all-sides',\n    },\n    headerStyle: {\n      options: ['filled', 'clean'],\n      value: 'filled',\n    },\n    includeRowActionColumn: false,\n    keyboard: false,\n    zebraStriping: false,\n  });\n\n  const table = useReactTable({\n    ...COMMON_TABLE_PROPS,\n    columns: COMMON_COLUMNS({\n      shouldIncludeRowActionColumn,\n    }),\n    enableSorting: true,\n    getSortedRowModel: getSortedRowModel(),\n  });\n\n  return (\n    <div className=\"n-h-[1000px] n-w-full n-bg-primary-bg-weak n-p-token-32\">\n      <Leva isRoot />\n      <DataGrid\n        isResizable={true}\n        tableInstance={table}\n        isKeyboardNavigable={isKeyboardNavigable}\n        styling={{\n          borderStyle: borderStyle as BorderStyle,\n          hasZebraStriping,\n          headerStyle: headerStyle as HeaderStyle,\n        }}\n      />\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"datagrid-kitchen-sink.story.js","sourceRoot":"","sources":["../../../../src/data-grid/stories/datagrid-kitchen-sink.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAkD;AAClD,kDAA8D;AAC9D,uDAS+B;AAC/B,+BAAyC;AAGzC,6CAA+C;AAQ/C,MAAM,YAAY,GAAG,IAAA,gCAAkB,GAAkB,CAAC;AAE1D,MAAM,aAAa,GAAwC;IACzD,aAAa,EAAE;QACb,OAAO,EAAE;YACP;gBACE,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,kBAAkB,CAAC,CAAC;gBAC5B,CAAC;gBACD,KAAK,EAAE,uBAAuB;aAC/B;SACF;KACF;CACF,CAAC;AAKF,MAAM,cAAc,GAAG,CAAC,OAA+B,EAAE,EAAE;IACzD,8DAA8D;IAC9D,MAAM,OAAO,GAAqC;QAChD,YAAY,CAAC,QAAQ,CAAC,MAAM,EAAE;YAC5B,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE;YAC/B,OAAO,EAAE,GAAG;YACZ,OAAO,EAAE,GAAG;YACZ,IAAI,EAAE,GAAG;SACV,CAAC;QACF,YAAY,CAAC,QAAQ,CAAC,KAAK,kBACzB,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE,EAC/B,MAAM,EAAE,GAAG,EAAE,CAAC,kDAAc,EAC5B,OAAO,EAAE,EAAE,IACR,CAAC,OAAO,CAAC,4BAA4B;YACtC,CAAC,CAAC;gBACE,IAAI,oBACC,aAAa,CACjB;aACF;YACH,CAAC,CAAC,EAAE,CAAC,EACP;QACF,YAAY,CAAC,QAAQ,CAAC,eAAe,EAAE;YACrC,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,QAAQ,EAAE;YAC/B,OAAO,EAAE,GAAG;YACZ,IAAI,EAAE,GAAG;SACV,CAAC;KACH,CAAC;IAEF,IAAI,OAAO,CAAC,4BAA4B,EAAE,CAAC;QACzC,OAAO,CAAC,IAAI,CACV,YAAY,CAAC,OAAO,CAAC;YACnB,IAAI,EAAE,CAAC,IAAI,EAAE,EAAE;gBACb,MAAM,YAAY,GAChB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,KAAK,4BAAe,CAAC,CAAC,CAAC,CAAC,IAAI,IAAI,SAAS,CAAC;gBAClE,OAAO,CACL,uBAAC,gBAAQ,CAAC,UAAU,IAClB,IAAI,EAAE,IAAI,EACV,yBAAyB,EAAE;wBACzB,QAAQ,EAAE,YAAY,IAAI,uBAAC,4BAAoB,KAAG;wBAClD,WAAW,EAAE,eAAe,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,EAAE;qBACrD,EACD,cAAc,EACZ,YAAY,IAAI;wBACd,QAAQ,EAAE,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,4BAA4B,GAAG;qBAC3D,GAEH,CACH,CAAC;YACJ,CAAC;YACD,EAAE,EAAE,SAAS;YACb,IAAI,EAAE;gBACJ,YAAY,EAAE;oBACZ,OAAO,EAAE;wBACP;4BACE,OAAO,EAAE,CAAC,MAAM,EAAE,IAAI,EAAE,EAAE;gCACxB,KAAK,CACH,4CACE,IAAI,CAAC,GAAG,CAAC,KACX,EAAE,CACH,CAAC;4BACJ,CAAC;4BACD,KAAK,EAAE,oBAAoB;yBAC5B;qBACF;oBACD,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,iBAAiB,IAAI,EAAE,CAAC;iBAC9D;aACF;SACF,CAAC,CACH,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC;AAEF,MAAM,kBAAkB,GAAG;IACzB,gBAAgB,EAAE,UAAU;IAC5B,IAAI,EAAE,4BAAe;IACrB,kEAAkE;IAClE,aAAa,EAAE;QACb,OAAO,EAAE,EAAE;KACZ;IACD,aAAa,EAAE,KAAK;IACpB,eAAe,EAAE,IAAA,6BAAe,GAAE;IAClC,qBAAqB,EAAE,IAAA,mCAAqB,GAAE;IAC9C,YAAY,EAAE;QACZ,UAAU,EAAE;YACV,QAAQ,EAAE,CAAC;SACZ;KACF;IACD,IAAI,EAAE;QACJ,OAAO,EAAE;YACP;gBACE,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,SAAS,CAAC,CAAC;gBACnB,CAAC;gBACD,KAAK,EAAE,aAAa;aACrB;SACF;KACF;CAC+C,CAAC;AAEnD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,EACJ,QAAQ,EAAE,mBAAmB,EAC7B,aAAa,EAAE,gBAAgB,EAC/B,WAAW,EACX,WAAW,EACX,sBAAsB,EAAE,4BAA4B,GACrD,GAAG,IAAA,kBAAW,EAAC;QACd,WAAW,EAAE;YACX,OAAO,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,CAAC;YACxD,KAAK,EAAE,WAAW;SACnB;QACD,WAAW,EAAE;YACX,OAAO,EAAE,CAAC,QAAQ,EAAE,OAAO,CAAC;YAC5B,KAAK,EAAE,QAAQ;SAChB;QACD,sBAAsB,EAAE,KAAK;QAC7B,QAAQ,EAAE,KAAK;QACf,aAAa,EAAE,KAAK;KACrB,CAAC,CAAC;IAEH,MAAM,KAAK,GAAG,IAAA,2BAAa,kCACtB,kBAAkB,KACrB,OAAO,EAAE,cAAc,CAAC;YACtB,4BAA4B;SAC7B,CAAC,EACF,aAAa,EAAE,IAAI,EACnB,iBAAiB,EAAE,IAAA,+BAAiB,GAAE,IACtC,CAAC;IAEH,OAAO,CACL,iCAAK,SAAS,EAAC,yDAAyD,aACtE,uBAAC,WAAI,IAAC,MAAM,SAAG,EACf,uBAAC,gBAAQ,IACP,WAAW,EAAE,IAAI,EACjB,aAAa,EAAE,KAAK,EACpB,mBAAmB,EAAE,mBAAmB,EACxC,OAAO,EAAE;oBACP,WAAW,EAAE,WAA0B;oBACvC,gBAAgB;oBAChB,WAAW,EAAE,WAA0B;iBACxC,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DataGrid, Menu } from '@neo4j-ndl/react';\nimport { ChevronDownIconSolid } from '@neo4j-ndl/react/icons';\nimport {\n  type ColumnDef,\n  type ColumnMeta,\n  createColumnHelper,\n  getCoreRowModel,\n  getPaginationRowModel,\n  getSortedRowModel,\n  type TableOptions,\n  useReactTable,\n} from '@tanstack/react-table';\nimport { Leva, useControls } from 'leva';\n\nimport { type BorderStyle, type HeaderStyle } from '../DataGrid';\nimport { TABLE_DEMO_DATA } from './staticData';\n\ntype TestDataFormat = {\n  name: string;\n  age: number;\n  cypherCommand: string;\n};\n\nconst columnHelper = createColumnHelper<TestDataFormat>();\n\nconst ColumnActions: ColumnMeta<TestDataFormat, unknown> = {\n  columnActions: {\n    actions: [\n      {\n        onClick: () => {\n          alert('Action triggered');\n        },\n        title: 'Example Column Action',\n      },\n    ],\n  },\n};\n\ntype ColumnGeneratorOptions = {\n  shouldIncludeRowActionColumn: boolean;\n};\nconst COMMON_COLUMNS = (options: ColumnGeneratorOptions) => {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const columns: ColumnDef<TestDataFormat, any>[] = [\n    columnHelper.accessor('name', {\n      cell: (info) => info.getValue(),\n      maxSize: 300,\n      minSize: 180,\n      size: 220,\n    }),\n    columnHelper.accessor('age', {\n      cell: (info) => info.getValue(),\n      header: () => <div>Age</div>,\n      minSize: 80,\n      ...(options.shouldIncludeRowActionColumn\n        ? {\n            meta: {\n              ...ColumnActions,\n            },\n          }\n        : {}),\n    }),\n    columnHelper.accessor('cypherCommand', {\n      cell: (info) => info.getValue(),\n      minSize: 400,\n      size: 400,\n    }),\n  ];\n\n  if (options.shouldIncludeRowActionColumn) {\n    columns.push(\n      columnHelper.display({\n        cell: (cell) => {\n          const isSpecialRow =\n            cell.row.original.name === TABLE_DEMO_DATA[3].name || undefined;\n          return (\n            <DataGrid.ActionCell\n              cell={cell}\n              innerCleanIconButtonProps={{\n                children: isSpecialRow && <ChevronDownIconSolid />,\n                description: `Actions for ${cell.row.original.name}`,\n              }}\n              innerMenuProps={\n                isSpecialRow && {\n                  children: <Menu.Item title=\"Custom icon and menu props\" />,\n                }\n              }\n            />\n          );\n        },\n        id: 'actions',\n        meta: {\n          isActionCell: {\n            actions: [\n              {\n                onClick: (_event, cell) => {\n                  alert(\n                    `Row Action triggered for row with index: ${\n                      cell.row.index\n                    }`,\n                  );\n                },\n                title: 'Example Row Action',\n              },\n            ],\n            onOpenChange: (open) => console.info(`onOpenChange: ${open}`),\n          },\n        },\n      }),\n    );\n  }\n\n  return columns;\n};\n\nconst COMMON_TABLE_PROPS = {\n  columnResizeMode: 'onChange',\n  data: TABLE_DEMO_DATA,\n  // https://tanstack.com/table/v8/docs/guide/column-sizing#overview\n  defaultColumn: {\n    minSize: 80,\n  },\n  enableSorting: false,\n  getCoreRowModel: getCoreRowModel(),\n  getPaginationRowModel: getPaginationRowModel(),\n  initialState: {\n    pagination: {\n      pageSize: 5,\n    },\n  },\n  meta: {\n    actions: [\n      {\n        onClick: () => {\n          alert('wowowow');\n        },\n        title: \"Let's party\",\n      },\n    ],\n  },\n} as Omit<TableOptions<TestDataFormat>, 'columns'>;\n\nconst Component = () => {\n  const {\n    keyboard: isKeyboardNavigable,\n    zebraStriping: hasZebraStriping,\n    borderStyle,\n    headerStyle,\n    includeRowActionColumn: shouldIncludeRowActionColumn,\n  } = useControls({\n    borderStyle: {\n      options: ['all-sides', 'horizontal', 'vertical', 'none'],\n      value: 'all-sides',\n    },\n    headerStyle: {\n      options: ['filled', 'clean'],\n      value: 'filled',\n    },\n    includeRowActionColumn: false,\n    keyboard: false,\n    zebraStriping: false,\n  });\n\n  const table = useReactTable({\n    ...COMMON_TABLE_PROPS,\n    columns: COMMON_COLUMNS({\n      shouldIncludeRowActionColumn,\n    }),\n    enableSorting: true,\n    getSortedRowModel: getSortedRowModel(),\n  });\n\n  return (\n    <div className=\"n-h-[1000px] n-w-full n-bg-primary-bg-weak n-p-token-32\">\n      <Leva isRoot />\n      <DataGrid\n        isResizable={true}\n        tableInstance={table}\n        isKeyboardNavigable={isKeyboardNavigable}\n        styling={{\n          borderStyle: borderStyle as BorderStyle,\n          hasZebraStriping,\n          headerStyle: headerStyle as HeaderStyle,\n        }}\n      />\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/data-grid/stories/datagrid-search-and-filters.stories.js

@@ -27,7 +27,6 @@ const react_1 = require("@neo4j-ndl/react");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const react_table_1 = require("@tanstack/react-table");
 const react_2 = require("react");
-const react_3 = require("react");
 const staticData_1 = require("./staticData");
 exports.default = {
     component: react_1.DataGrid,
@@ -45,18 +44,19 @@ exports.default = {
 const globalFilterFn = (row, columnId, filterValue) => {
     const search = filterValue.toLowerCase();
     let value = row.getValue(columnId);
-    if (typeof value === 'number')
+    if (typeof value === 'number') {
         value = String(value);
+    }
     return value === null || value === void 0 ? void 0 : value.toLowerCase().includes(search);
 };
 const OpenFilterMenuIconButton = ({ onClick, open, description, ref, }) => ((0, jsx_runtime_1.jsx)(react_1.IconButton, { ref: ref, onClick: onClick, "aria-controls": open ? 'default-menu' : undefined, "aria-haspopup": "true", "aria-expanded": open, description: description, size: "medium", children: (0, jsx_runtime_1.jsx)(icons_1.FunnelIconOutline, {}) }));
 const Searchable = () => {
-    const [anchorEl, setAnchorEl] = (0, react_3.useState)(null);
+    const [anchorEl, setAnchorEl] = (0, react_2.useState)(null);
     // eslint-disable-next-line @typescript-eslint/naming-convention
     const open = Boolean(anchorEl);
     const ref = (0, react_2.useRef)(null);
-    const [globalFilter, setGlobalFilter] = (0, react_3.useState)('');
-    const [columnFilters, setColumnFilters] = (0, react_3.useState)([]);
+    const [globalFilter, setGlobalFilter] = (0, react_2.useState)('');
+    const [columnFilters, setColumnFilters] = (0, react_2.useState)([]);
     const handleClick = (event) => {
         setAnchorEl(event.currentTarget);
     };
@@ -118,8 +118,9 @@ const Searchable = () => {
     });
     const toggleAgeFilter = ({ min, max }) => {
         const ageColumn = table.getColumn('age');
-        if (!ageColumn)
+        if (!ageColumn) {
             return;
+        }
         const currentFilter = ageColumn.getFilterValue();
         // Helper function to determine the new filter value for a specific bound
         const determineNewBound = (currentBound, newBound) => {
@@ -141,10 +142,12 @@ const Searchable = () => {
         const ageFilter = columnFilters.find((filter) => filter.id === 'age');
         if (ageFilter) {
             const [min, max] = ageFilter.value;
-            if (type === 'min')
+            if (type === 'min') {
                 return min === value;
-            if (type === 'max')
+            }
+            if (type === 'max') {
                 return max === value;
+            }
         }
         return false;
     };
@@ -165,8 +168,8 @@ const Searchable = () => {
 };
 exports.Searchable = Searchable;
 const ColumnFiltering = () => {
-    const [tableData, setTableData] = (0, react_3.useState)(staticData_1.TABLE_DEMO_DATA);
-    const [isAgeFilterApplied, setIsAgeFilterApplied] = (0, react_3.useState)(false);
+    const [tableData, setTableData] = (0, react_2.useState)(staticData_1.TABLE_DEMO_DATA);
+    const [isAgeFilterApplied, setIsAgeFilterApplied] = (0, react_2.useState)(false);
     const columnHelper = (0, react_table_1.createColumnHelper)();
     const ColumnActions = {
         columnActions: {