@economic/taco 1.40.3 → 2.0.0-alpha.173

package/dist/esm/packages/taco/src/components/Table3/components/rows/Row.js

@@ -0,0 +1,255 @@
+import React__default from 'react';
+import cn from 'classnames';
+import { useFocusManager } from '@react-aria/focus';
+import { useDropTarget } from '../../../../utils/hooks/useDropTarget.js';
+import { RowContext, useRowContext } from './RowContext.js';
+import { focusableSelector } from '../../util/editing.js';
+
+function Row(props) {
+  const tableMeta = props.table.options.meta;
+  const isCurrentRow = tableMeta.currentRow.currentRowIndex === props.index;
+  const isDraggingRow = tableMeta.rowDrag.dragging[props.row.id];
+  // we use non-css hovered state to determine whether to render actions or not, for performance
+  const [isHovered, setIsHovered] = React__default.useState(false);
+  // rows are heavily memoized because performance in our table is critical
+  // be careful and selective about props that you pass to the row
+  const memoedProps = {
+    // aria-grabbed is being deprecated but there is no current alternative api, we use it until there is
+    'aria-grabbed': isDraggingRow ? true : tableMeta.rowDrag.isEnabled ? false : undefined,
+    'data-current': isCurrentRow,
+    'data-selected': props.row.getIsSelected(),
+    draggable: tableMeta.rowDrag.isEnabled,
+    index: props.index,
+    onClick: tableMeta.rowClick.handleClick,
+    onDrop: tableMeta.rowDrop.isEnabled ? tableMeta.rowDrop.handleDrop : undefined
+  };
+  let output = /*#__PURE__*/React__default.createElement(MemoedRow, Object.assign({}, props, memoedProps));
+  if (tableMeta.editing.isEditing && (isCurrentRow || isHovered && !tableMeta.hoverState.isPaused)) {
+    output = /*#__PURE__*/React__default.createElement(EditingRow, Object.assign({}, props, memoedProps, {
+      isLastRow: props.isLastRow,
+      setCurrentRowIndex: tableMeta.currentRow.setCurrentRowIndex
+    }));
+  }
+  // we store the row index in context because in a virtualised table the row index and the
+  // react table row index do not match when, for example, sorting is applied
+  const contextValue = React__default.useMemo(() => ({
+    isHovered,
+    setIsHovered,
+    rowIndex: props.index
+  }), [isHovered, props.index]);
+  return /*#__PURE__*/React__default.createElement(RowContext.Provider, {
+    value: contextValue
+  }, output);
+}
+// turns out we might need some kind of "state" for the focused column, but it doesn't need to be react state that re-renders
+let lastIndex;
+function getColumnIndex(focusedElement) {
+  if (focusedElement) {
+    var _focusedElement$close;
+    return (_focusedElement$close = focusedElement.closest('[role=cell]')) === null || _focusedElement$close === void 0 ? void 0 : _focusedElement$close.getAttribute('data-column-index');
+  }
+  return null;
+}
+// This code is needed to avoid multiple rows being hovered at the same time (it happens since we use non-css hovering)
+let previouslyHoveredIndex;
+const unhoverPreviousRow = tableRef => {
+  if (previouslyHoveredIndex !== undefined) {
+    var _tableRef$current;
+    const mouseoutEvent = new MouseEvent('mouseout', {
+      view: window,
+      bubbles: true,
+      cancelable: true
+    });
+    const previouslyHovered = tableRef === null || tableRef === void 0 ? void 0 : (_tableRef$current = tableRef.current) === null || _tableRef$current === void 0 ? void 0 : _tableRef$current.querySelector(`[data-row-index="${previouslyHoveredIndex}"]`);
+    previouslyHovered === null || previouslyHovered === void 0 ? void 0 : previouslyHovered.dispatchEvent(mouseoutEvent);
+  }
+};
+function EditingRow(props) {
+  const {
+    isLastRow,
+    setCurrentRowIndex,
+    virtualiser,
+    ...attributes
+  } = props;
+  const focusManager = useFocusManager();
+  const focusManagerOptions = {
+    tabbable: true
+  };
+  const tableMeta = props.table.options.meta;
+  const handleClickCapture = event => {
+    lastIndex = getColumnIndex(event.target);
+  };
+  const handleArrowLeftKey = event => {
+    let focusedElement;
+    if (event.key === 'ArrowLeft' || event.key === 'Tab' && event.shiftKey) {
+      // Need to stop propagation because "Tab" will be handled twice(default browser and programmatic one)
+      // and will lead to looping focus. Also we still need to perform special behaviour when focus reaches the end of the row,
+      // so we don't need default browser behaviour.
+      event.stopPropagation();
+      event.preventDefault();
+      // "CTRL + ArrowLeft" or "META + ArrowLeft" should focus first focusable element of the row
+      if (event.ctrlKey || event.metaKey) {
+        event.target.blur();
+        focusedElement = focusManager.focusFirst(focusManagerOptions);
+        lastIndex = getColumnIndex(focusedElement);
+      } else {
+        // Should focus previous focusable element, if there is one
+        focusedElement = focusManager.focusPrevious(focusManagerOptions);
+        // Should move to prevoius row and select last focusable element in that row,
+        // if there is no previous focusable element in current row
+        if (props.index !== 0 && (!focusedElement || !event.currentTarget.contains(focusedElement))) {
+          tableMeta.hoverState.pause(true);
+          setCurrentRowIndex(props.index - 1);
+          setTimeout(() => {
+            focusedElement = focusManager.focusLast(focusManagerOptions);
+            // Need to update lastIndex when row got changed and last element got selected.
+            lastIndex = getColumnIndex(focusedElement);
+          }, 1);
+        } else {
+          lastIndex = getColumnIndex(focusedElement);
+        }
+      }
+    }
+  };
+  const handleArrowRightKey = event => {
+    let focusedElement;
+    if (event.key === 'ArrowRight' || event.key === 'Tab' && !event.shiftKey) {
+      // Need to stop propagation because "Tab" will be handled twice(default browser and programmatic one)
+      // and will lead to looping focus. Also we still need to perform special behaviour when focus reaches the end of the row,
+      // so we don't need default browser behaviour.
+      event.stopPropagation();
+      event.preventDefault();
+      // "CTRL + ArrowRight" or "META + ArrowRight" should focus last focusable element of the row
+      if (event.ctrlKey || event.metaKey) {
+        event.target.blur();
+        focusedElement = focusManager.focusLast(focusManagerOptions);
+        lastIndex = getColumnIndex(focusedElement);
+      } else {
+        // Should focus next focusable element, if there is one
+        focusedElement = focusManager.focusNext(focusManagerOptions);
+        // Should move to next row and select first focusable element in that row,
+        // if there is no next focusable element in current row
+        if (!isLastRow && (!focusedElement || !event.currentTarget.contains(focusedElement))) {
+          tableMeta.hoverState.pause(true);
+          setCurrentRowIndex(props.index + 1);
+          setTimeout(() => {
+            focusedElement = focusManager.focusFirst(focusManagerOptions);
+            // Need to update lastIndex when row got changed and first element got selected.
+            lastIndex = getColumnIndex(focusedElement);
+          }, 1);
+        } else {
+          lastIndex = getColumnIndex(focusedElement);
+        }
+      }
+    }
+  };
+  React__default.useEffect(() => {
+    // if some row stuck in hovered state, we heed to unhover it when hover state is paused
+    if (tableMeta.hoverState.isPaused) {
+      unhoverPreviousRow(props.tableRef);
+    }
+  }, [tableMeta.hoverState.isPaused]);
+  const handleKeyDown = event => {
+    if (event.isDefaultPrevented() || event.isPropagationStopped() || tableMeta.editing.detailModeEditing) {
+      return;
+    }
+    handleArrowLeftKey(event);
+    handleArrowRightKey(event);
+  };
+  // this ensures we focus either on a field or on the same column when keyboard navigating up/down
+  React__default.useEffect(() => {
+    if (tableMeta.currentRow.currentRowIndex === props.index) {
+      if (lastIndex !== undefined) {
+        var _props$tableRef$curre, _lastIndexCell$queryS;
+        const lastIndexCell = (_props$tableRef$curre = props.tableRef.current) === null || _props$tableRef$curre === void 0 ? void 0 : _props$tableRef$curre.querySelector(`[role="row"][data-current="true"] [data-column-index="${lastIndex}"]`);
+        lastIndexCell === null || lastIndexCell === void 0 ? void 0 : (_lastIndexCell$queryS = lastIndexCell.querySelector(focusableSelector)) === null || _lastIndexCell$queryS === void 0 ? void 0 : _lastIndexCell$queryS.focus();
+      } else {
+        focusManager.focusFirst(focusManagerOptions);
+      }
+    }
+    // Need to subscribe to current row index and check is it a current row,
+    // for a situation where hovered row is the next row after current row...
+    // In this case row will not be re-rendered if user switch to next row, because hovered row also renders EditingRow.
+  }, [tableMeta.currentRow.currentRowIndex]);
+  return /*#__PURE__*/React__default.createElement(MemoedRow, Object.assign({}, attributes, {
+    onClickCapture: handleClickCapture,
+    onKeyDown: handleKeyDown
+  }));
+}
+const clickableElements = ['input', 'button', 'a', 'select', 'option', 'label', 'textarea'];
+const MemoedRow = /*#__PURE__*/React__default.memo(function MemoedRow(props) {
+  const {
+    index,
+    isLastRow: _1,
+    onClick,
+    onClickCapture,
+    onDrop,
+    row,
+    table,
+    tableRef,
+    ...attributes
+  } = props;
+  const ref = React__default.useRef(null);
+  const tableMeta = table.options.meta;
+  const {
+    setIsHovered
+  } = useRowContext();
+  // we use capture because it also picks up clicks on e.g. select checkboxes
+  const handleClickCapture = event => {
+    if (typeof onClickCapture === 'function') {
+      onClickCapture(event);
+    }
+    tableMeta.currentRow.setCurrentRowIndex(index);
+  };
+  const handleClick = event => {
+    if (typeof onClick === 'function') {
+      var _ref$current;
+      const clickedElement = event.target;
+      if (!((_ref$current = ref.current) !== null && _ref$current !== void 0 && _ref$current.contains(event.target)) || clickableElements.includes(clickedElement.tagName.toLowerCase()) || clickedElement.closest(clickableElements.map(tag => `[role=row] ${tag}`).join(','))) {
+        return;
+      }
+      onClick(row.original);
+    }
+  };
+  const handleMouseEnter = () => {
+    // When user moving mouse to fast, then some of the rows are getting stuck in hover state,
+    // because mouseleave event never got triggered, to avoid this to happen we're saving the index of last hovered row,
+    // so that we can unhover it when new row got hovered, and saving it in a variable outside of react to save in performance,
+    // since it would be very performance heavy to use state which is bound to mouse events.
+    if (previouslyHoveredIndex !== undefined) {
+      if (previouslyHoveredIndex !== index) {
+        unhoverPreviousRow(tableRef);
+        previouslyHoveredIndex = index;
+      }
+    } else {
+      previouslyHoveredIndex = index;
+    }
+    setIsHovered(true);
+  };
+  const handleMouseLeave = () => {
+    if (previouslyHoveredIndex === index) {
+      previouslyHoveredIndex = undefined;
+    }
+    setIsHovered(false);
+  };
+  const [, dropTargetProps] = useDropTarget(event => onDrop === null || onDrop === void 0 ? void 0 : onDrop(event, row.original));
+  const className = cn('group/row contents',
+  // resizing column requires dragging, which means the mouse might (on rare occasions) move over rows and trigger hover state
+  // that in turn triggers rendering of e.g. row actions, which could cause janky ui - so don't allow mouse interaction when resizing
+  '[[role="table"][data-resizing="true"]_&]:pointer-events-none', {
+    'hover:cursor-pointer': typeof onClick === 'function'
+  });
+  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, attributes, onDrop ? dropTargetProps : undefined, {
+    className: className,
+    "data-row-index": index,
+    onClick: handleClick,
+    onClickCapture: handleClickCapture,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave,
+    role: "row",
+    ref: ref
+  }));
+});
+
+export { Row };
+//# sourceMappingURL=Row.js.map

package/dist/esm/packages/taco/src/components/Table3/components/rows/Row.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Row.js","sources":["../../../../../../../../../src/components/Table3/components/rows/Row.tsx"],"sourcesContent":["import React from 'react';\nimport { Row as RTRow, Table as RTable, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { RowContext, useRowContext } from './RowContext';\nimport { useDropTarget } from '../../../../utils/hooks/useDropTarget';\nimport { Table3RowClickHandler, Table3RowDropHandler } from '../../types';\nimport { useFocusManager } from '@react-aria/focus';\nimport { focusableSelector } from '../../util/editing';\n\ntype RowProps<TType = unknown> = Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onDrop'> & {\n    index: number;\n    isLastRow: boolean;\n    onClick?: Table3RowClickHandler<TType>;\n    onDrop?: Table3RowDropHandler<TType>;\n    row: RTRow<TType>;\n    table: RTable<TType>;\n    tableRef: React.RefObject<HTMLDivElement>;\n};\n\nexport function Row<TType = unknown>(props: RowProps<TType>) {\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const isCurrentRow = tableMeta.currentRow.currentRowIndex === props.index;\n    const isDraggingRow = tableMeta.rowDrag.dragging[props.row.id];\n    // we use non-css hovered state to determine whether to render actions or not, for performance\n    const [isHovered, setIsHovered] = React.useState(false);\n\n    // rows are heavily memoized because performance in our table is critical\n    // be careful and selective about props that you pass to the row\n    const memoedProps = {\n        // aria-grabbed is being deprecated but there is no current alternative api, we use it until there is\n        'aria-grabbed': isDraggingRow ? true : tableMeta.rowDrag.isEnabled ? false : undefined,\n        'data-current': isCurrentRow,\n        'data-selected': props.row.getIsSelected(),\n        draggable: tableMeta.rowDrag.isEnabled,\n        index: props.index,\n        onClick: tableMeta.rowClick.handleClick,\n        onDrop: tableMeta.rowDrop.isEnabled ? tableMeta.rowDrop.handleDrop : undefined,\n    };\n\n    let output = <MemoedRow<TType> {...props} {...memoedProps} />;\n\n    if (tableMeta.editing.isEditing && (isCurrentRow || (isHovered && !tableMeta.hoverState.isPaused))) {\n        output = (\n            <EditingRow\n                {...props}\n                {...memoedProps}\n                isLastRow={props.isLastRow}\n                setCurrentRowIndex={tableMeta.currentRow.setCurrentRowIndex}\n            />\n        );\n    }\n\n    // we store the row index in context because in a virtualised table the row index and the\n    // react table row index do not match when, for example, sorting is applied\n    const contextValue = React.useMemo(() => ({ isHovered, setIsHovered, rowIndex: props.index }), [isHovered, props.index]);\n\n    return <RowContext.Provider value={contextValue}>{output}</RowContext.Provider>;\n}\n\n// turns out we might need some kind of \"state\" for the focused column, but it doesn't need to be react state that re-renders\nlet lastIndex;\n\nfunction getColumnIndex(focusedElement: Element) {\n    if (focusedElement) {\n        return focusedElement.closest('[role=cell]')?.getAttribute('data-column-index');\n    }\n\n    return null;\n}\n\n// This code is needed to avoid multiple rows being hovered at the same time (it happens since we use non-css hovering)\nlet previouslyHoveredIndex: number | undefined;\nconst unhoverPreviousRow = (tableRef: React.RefObject<HTMLDivElement>) => {\n    if (previouslyHoveredIndex !== undefined) {\n        const mouseoutEvent = new MouseEvent('mouseout', { view: window, bubbles: true, cancelable: true });\n        const previouslyHovered = tableRef?.current?.querySelector(`[data-row-index=\"${previouslyHoveredIndex}\"]`);\n        previouslyHovered?.dispatchEvent(mouseoutEvent);\n    }\n};\n\nfunction EditingRow(props) {\n    const { isLastRow, setCurrentRowIndex, virtualiser, ...attributes } = props;\n    const focusManager = useFocusManager();\n    const focusManagerOptions = { tabbable: true };\n    const tableMeta = props.table.options.meta as TableMeta<unknown>;\n\n    const handleClickCapture = (event: React.FocusEvent) => {\n        lastIndex = getColumnIndex(event.target);\n    };\n\n    const handleArrowLeftKey = event => {\n        let focusedElement: Element;\n        if (event.key === 'ArrowLeft' || (event.key === 'Tab' && event.shiftKey)) {\n            // Need to stop propagation because \"Tab\" will be handled twice(default browser and programmatic one)\n            // and will lead to looping focus. Also we still need to perform special behaviour when focus reaches the end of the row,\n            // so we don't need default browser behaviour.\n            event.stopPropagation();\n            event.preventDefault();\n\n            // \"CTRL + ArrowLeft\" or \"META + ArrowLeft\" should focus first focusable element of the row\n            if (event.ctrlKey || event.metaKey) {\n                event.target.blur();\n                focusedElement = focusManager.focusFirst(focusManagerOptions);\n                lastIndex = getColumnIndex(focusedElement);\n            } else {\n                // Should focus previous focusable element, if there is one\n                focusedElement = focusManager.focusPrevious(focusManagerOptions);\n\n                // Should move to prevoius row and select last focusable element in that row,\n                // if there is no previous focusable element in current row\n                if (props.index !== 0 && (!focusedElement || !event.currentTarget.contains(focusedElement))) {\n                    tableMeta.hoverState.pause(true);\n                    setCurrentRowIndex(props.index - 1);\n                    setTimeout(() => {\n                        focusedElement = focusManager.focusLast(focusManagerOptions);\n                        // Need to update lastIndex when row got changed and last element got selected.\n                        lastIndex = getColumnIndex(focusedElement);\n                    }, 1);\n                } else {\n                    lastIndex = getColumnIndex(focusedElement);\n                }\n            }\n        }\n    };\n\n    const handleArrowRightKey = event => {\n        let focusedElement: Element;\n        if (event.key === 'ArrowRight' || (event.key === 'Tab' && !event.shiftKey)) {\n            // Need to stop propagation because \"Tab\" will be handled twice(default browser and programmatic one)\n            // and will lead to looping focus. Also we still need to perform special behaviour when focus reaches the end of the row,\n            // so we don't need default browser behaviour.\n            event.stopPropagation();\n            event.preventDefault();\n\n            // \"CTRL + ArrowRight\" or \"META + ArrowRight\" should focus last focusable element of the row\n            if (event.ctrlKey || event.metaKey) {\n                event.target.blur();\n                focusedElement = focusManager.focusLast(focusManagerOptions);\n                lastIndex = getColumnIndex(focusedElement);\n            } else {\n                // Should focus next focusable element, if there is one\n                focusedElement = focusManager.focusNext(focusManagerOptions);\n\n                // Should move to next row and select first focusable element in that row,\n                // if there is no next focusable element in current row\n                if (!isLastRow && (!focusedElement || !event.currentTarget.contains(focusedElement))) {\n                    tableMeta.hoverState.pause(true);\n                    setCurrentRowIndex(props.index + 1);\n                    setTimeout(() => {\n                        focusedElement = focusManager.focusFirst(focusManagerOptions);\n                        // Need to update lastIndex when row got changed and first element got selected.\n\n                        lastIndex = getColumnIndex(focusedElement);\n                    }, 1);\n                } else {\n                    lastIndex = getColumnIndex(focusedElement);\n                }\n            }\n        }\n    };\n\n    React.useEffect(() => {\n        // if some row stuck in hovered state, we heed to unhover it when hover state is paused\n        if (tableMeta.hoverState.isPaused) {\n            unhoverPreviousRow(props.tableRef);\n        }\n    }, [tableMeta.hoverState.isPaused]);\n\n    const handleKeyDown = (event: React.KeyboardEvent) => {\n        if (event.isDefaultPrevented() || event.isPropagationStopped() || tableMeta.editing.detailModeEditing) {\n            return;\n        }\n\n        handleArrowLeftKey(event);\n        handleArrowRightKey(event);\n    };\n\n    // this ensures we focus either on a field or on the same column when keyboard navigating up/down\n    React.useEffect(() => {\n        if (tableMeta.currentRow.currentRowIndex === props.index) {\n            if (lastIndex !== undefined) {\n                const lastIndexCell = props.tableRef.current?.querySelector(\n                    `[role=\"row\"][data-current=\"true\"] [data-column-index=\"${lastIndex}\"]`\n                );\n                lastIndexCell?.querySelector(focusableSelector)?.focus();\n            } else {\n                focusManager.focusFirst(focusManagerOptions);\n            }\n        }\n        // Need to subscribe to current row index and check is it a current row,\n        // for a situation where hovered row is the next row after current row...\n        // In this case row will not be re-rendered if user switch to next row, because hovered row also renders EditingRow.\n    }, [tableMeta.currentRow.currentRowIndex]);\n\n    return <MemoedRow {...attributes} onClickCapture={handleClickCapture} onKeyDown={handleKeyDown} />;\n}\n\n// Memoization\n\nexport type MemoedRowProps<TType = unknown> = RowProps<TType> & {\n    'aria-grabbed'?: boolean;\n    'data-current': boolean;\n    'data-selected': boolean;\n    draggable: boolean;\n    index: number;\n};\n\nconst clickableElements = ['input', 'button', 'a', 'select', 'option', 'label', 'textarea'];\n\nconst MemoedRow = React.memo(function MemoedRow<TType = unknown>(props: MemoedRowProps<TType>) {\n    const { index, isLastRow: _1, onClick, onClickCapture, onDrop, row, table, tableRef, ...attributes } = props;\n    const ref = React.useRef<HTMLDivElement | null>(null);\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { setIsHovered } = useRowContext();\n\n    // we use capture because it also picks up clicks on e.g. select checkboxes\n    const handleClickCapture = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (typeof onClickCapture === 'function') {\n            onClickCapture(event);\n        }\n\n        tableMeta.currentRow.setCurrentRowIndex(index);\n    };\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (typeof onClick === 'function') {\n            const clickedElement = event.target as HTMLElement;\n\n            if (\n                !ref.current?.contains(event.target as HTMLElement) ||\n                clickableElements.includes(clickedElement.tagName.toLowerCase()) ||\n                clickedElement.closest(clickableElements.map(tag => `[role=row] ${tag}`).join(','))\n            ) {\n                return;\n            }\n\n            onClick(row.original);\n        }\n    };\n\n    const handleMouseEnter = () => {\n        // When user moving mouse to fast, then some of the rows are getting stuck in hover state,\n        // because mouseleave event never got triggered, to avoid this to happen we're saving the index of last hovered row,\n        // so that we can unhover it when new row got hovered, and saving it in a variable outside of react to save in performance,\n        // since it would be very performance heavy to use state which is bound to mouse events.\n        if (previouslyHoveredIndex !== undefined) {\n            if (previouslyHoveredIndex !== index) {\n                unhoverPreviousRow(tableRef);\n                previouslyHoveredIndex = index;\n            }\n        } else {\n            previouslyHoveredIndex = index;\n        }\n        setIsHovered(true);\n    };\n    const handleMouseLeave = () => {\n        if (previouslyHoveredIndex === index) {\n            previouslyHoveredIndex = undefined;\n        }\n        setIsHovered(false);\n    };\n\n    const [, dropTargetProps] = useDropTarget(event => onDrop?.(event, row.original));\n\n    const className = cn(\n        'group/row contents',\n        // resizing column requires dragging, which means the mouse might (on rare occasions) move over rows and trigger hover state\n        // that in turn triggers rendering of e.g. row actions, which could cause janky ui - so don't allow mouse interaction when resizing\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        {\n            'hover:cursor-pointer': typeof onClick === 'function',\n        }\n    );\n\n    return (\n        <div\n            {...attributes}\n            {...(onDrop ? dropTargetProps : undefined)}\n            className={className}\n            data-row-index={index}\n            onClick={handleClick}\n            onClickCapture={handleClickCapture}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            role=\"row\"\n            ref={ref}\n        />\n    );\n}) as <TType = unknown>(props: MemoedRowProps<TType>) => JSX.Element;\n"],"names":["Row","props","tableMeta","table","options","meta","isCurrentRow","currentRow","currentRowIndex","index","isDraggingRow","rowDrag","dragging","row","id","isHovered","setIsHovered","React","useState","memoedProps","isEnabled","undefined","getIsSelected","draggable","onClick","rowClick","handleClick","onDrop","rowDrop","handleDrop","output","MemoedRow","editing","isEditing","hoverState","isPaused","EditingRow","isLastRow","setCurrentRowIndex","contextValue","useMemo","rowIndex","RowContext","Provider","value","lastIndex","getColumnIndex","focusedElement","closest","getAttribute","previouslyHoveredIndex","unhoverPreviousRow","tableRef","mouseoutEvent","MouseEvent","view","window","bubbles","cancelable","previouslyHovered","current","querySelector","dispatchEvent","virtualiser","attributes","focusManager","useFocusManager","focusManagerOptions","tabbable","handleClickCapture","event","target","handleArrowLeftKey","key","shiftKey","stopPropagation","preventDefault","ctrlKey","metaKey","blur","focusFirst","focusPrevious","currentTarget","contains","pause","setTimeout","focusLast","handleArrowRightKey","focusNext","useEffect","handleKeyDown","isDefaultPrevented","isPropagationStopped","detailModeEditing","lastIndexCell","focusableSelector","focus","onClickCapture","onKeyDown","clickableElements","memo","_1","ref","useRef","useRowContext","clickedElement","includes","tagName","toLowerCase","map","tag","join","original","handleMouseEnter","handleMouseLeave","dropTargetProps","useDropTarget","className","cn","onMouseEnter","onMouseLeave","role"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/rows/RowContext.js

@@ -0,0 +1,13 @@
+import React__default from 'react';
+
+const RowContext = /*#__PURE__*/React__default.createContext({
+  isHovered: false,
+  setIsHovered: () => {
+    /* empty */
+  },
+  rowIndex: 0
+});
+const useRowContext = () => React__default.useContext(RowContext);
+
+export { RowContext, useRowContext };
+//# sourceMappingURL=RowContext.js.map

package/dist/esm/packages/taco/src/components/Table3/components/rows/RowContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowContext.js","sources":["../../../../../../../../../src/components/Table3/components/rows/RowContext.tsx"],"sourcesContent":["import React from 'react';\n\ntype RowContextValue = {\n    isHovered: boolean;\n    setIsHovered: (value: boolean) => void;\n    rowIndex: number;\n};\n\nexport const RowContext = React.createContext<RowContextValue>({\n    isHovered: false,\n    setIsHovered: () => {\n        /* empty */\n    },\n    rowIndex: 0,\n});\n\nexport const useRowContext = () => React.useContext(RowContext);\n"],"names":["RowContext","React","createContext","isHovered","setIsHovered","rowIndex","useRowContext","useContext"],"mappings":";;MAQaA,UAAU,gBAAGC,cAAK,CAACC,aAAa,CAAkB;EAC3DC,SAAS,EAAE,KAAK;EAChBC,YAAY,EAAE;;GAEb;EACDC,QAAQ,EAAE;CACb;MAEYC,aAAa,GAAG,MAAML,cAAK,CAACM,UAAU,CAACP,UAAU;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/rows/SkeletonRow.js

@@ -0,0 +1,43 @@
+import React__default from 'react';
+import { useInView } from 'react-intersection-observer';
+
+function SkeletonCell(props) {
+  const {
+    loadPage,
+    pageIndex,
+    table
+  } = props;
+  const {
+    ref,
+    inView
+  } = useInView({
+    threshold: 0,
+    triggerOnce: true,
+    initialInView: pageIndex === 0
+  });
+  React__default.useEffect(() => {
+    if (inView) {
+      loadPage(pageIndex, table.getState().sorting, table.getState().columnFilters, table.getState().globalFilter);
+    }
+  }, [inView]);
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "border-grey-300 flex h-10 items-center border-b px-2",
+    ref: ref
+  }, /*#__PURE__*/React__default.createElement("span", {
+    className: "bg-grey-100 text-grey-700 h-4 w-full text-center text-xs"
+  }));
+}
+function SkeletonRow(props) {
+  const {
+    columns,
+    ...otherProps
+  } = props;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "contents"
+  }, columns.map(column => /*#__PURE__*/React__default.createElement(SkeletonCell, Object.assign({
+    key: column.id
+  }, otherProps))));
+}
+
+export { SkeletonRow };
+//# sourceMappingURL=SkeletonRow.js.map

package/dist/esm/packages/taco/src/components/Table3/components/rows/SkeletonRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonRow.js","sources":["../../../../../../../../../src/components/Table3/components/rows/SkeletonRow.tsx"],"sourcesContent":["import React from 'react';\nimport { useInView } from 'react-intersection-observer';\nimport { Table3LoadPageHandler } from '../../types';\nimport { Column as RTColumn, Table as RTable } from '@tanstack/react-table';\n\ntype SkeletonCellProps<TType = unknown> = {\n    loadPage: Table3LoadPageHandler;\n    pageIndex: number;\n    table: RTable<TType>;\n};\nfunction SkeletonCell<TType = unknown>(props: SkeletonCellProps<TType>) {\n    const { loadPage, pageIndex, table } = props;\n    const { ref, inView } = useInView({\n        threshold: 0,\n        triggerOnce: true,\n        initialInView: pageIndex === 0,\n    });\n\n    React.useEffect(() => {\n        if (inView) {\n            loadPage(pageIndex, table.getState().sorting, table.getState().columnFilters, table.getState().globalFilter);\n        }\n    }, [inView]);\n\n    return (\n        <div className=\"border-grey-300 flex h-10 items-center border-b px-2\" ref={ref}>\n            <span className=\"bg-grey-100 text-grey-700 h-4 w-full text-center text-xs\" />\n        </div>\n    );\n}\n\nexport type SkeletonRowProps<TType = unknown> = {\n    columns: RTColumn<TType, unknown>[];\n    loadPage: Table3LoadPageHandler;\n    pageIndex: number;\n    table: RTable<TType>;\n};\n\nexport function SkeletonRow<TType = unknown>(props: SkeletonRowProps<TType>) {\n    const { columns, ...otherProps } = props;\n\n    return (\n        <div className=\"contents\">\n            {columns.map(column => (\n                <SkeletonCell key={column.id} {...otherProps} />\n            ))}\n        </div>\n    );\n}\n"],"names":["SkeletonCell","props","loadPage","pageIndex","table","ref","inView","useInView","threshold","triggerOnce","initialInView","React","useEffect","getState","sorting","columnFilters","globalFilter","className","SkeletonRow","columns","otherProps","map","column","key","id"],"mappings":";;;AAUA,SAASA,YAAY,CAAkBC,KAA+B;EAClE,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEC;GAAO,GAAGH,KAAK;EAC5C,MAAM;IAAEI,GAAG;IAAEC;GAAQ,GAAGC,SAAS,CAAC;IAC9BC,SAAS,EAAE,CAAC;IACZC,WAAW,EAAE,IAAI;IACjBC,aAAa,EAAEP,SAAS,KAAK;GAChC,CAAC;EAEFQ,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIN,MAAM,EAAE;MACRJ,QAAQ,CAACC,SAAS,EAAEC,KAAK,CAACS,QAAQ,EAAE,CAACC,OAAO,EAAEV,KAAK,CAACS,QAAQ,EAAE,CAACE,aAAa,EAAEX,KAAK,CAACS,QAAQ,EAAE,CAACG,YAAY,CAAC;;GAEnH,EAAE,CAACV,MAAM,CAAC,CAAC;EAEZ,oBACIK;IAAKM,SAAS,EAAC,sDAAsD;IAACZ,GAAG,EAAEA;kBACvEM;IAAMM,SAAS,EAAC;IAA6D,CAC3E;AAEd;SASgBC,WAAW,CAAkBjB,KAA8B;EACvE,MAAM;IAAEkB,OAAO;IAAE,GAAGC;GAAY,GAAGnB,KAAK;EAExC,oBACIU;IAAKM,SAAS,EAAC;KACVE,OAAO,CAACE,GAAG,CAACC,MAAM,iBACfX,6BAACX,YAAY;IAACuB,GAAG,EAAED,MAAM,CAACE;KAAQJ,UAAU,EAC/C,CAAC,CACA;AAEd;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/rows/styles.js

@@ -0,0 +1,9 @@
+const rowHeightSizeEstimates = {
+  short: 33,
+  medium: 41,
+  tall: 49,
+  'extra-tall': 57
+};
+
+export { rowHeightSizeEstimates };
+//# sourceMappingURL=styles.js.map

package/dist/esm/packages/taco/src/components/Table3/components/rows/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sources":["../../../../../../../../../src/components/Table3/components/rows/styles.ts"],"sourcesContent":["export const rowHeightSizeEstimates = {\n    short: 33,\n    medium: 41,\n    tall: 49,\n    'extra-tall': 57,\n};\n"],"names":["rowHeightSizeEstimates","short","medium","tall"],"mappings":"MAAaA,sBAAsB,GAAG;EAClCC,KAAK,EAAE,EAAE;EACTC,MAAM,EAAE,EAAE;EACVC,IAAI,EAAE,EAAE;EACR,YAAY,EAAE;;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/ColumnSettings.js

@@ -0,0 +1,105 @@
+import React__default from 'react';
+import cn from 'classnames';
+import { Icon } from '../../../Icon/Icon.js';
+import { useLocalization } from '../../../Provider/Localization.js';
+import { Button } from '../../../Button/Button.js';
+import { Checkbox } from '../../../Checkbox/Checkbox.js';
+import { Input } from '../../../Input/Input.js';
+import { Popover } from '../../../Popover/Popover.js';
+import { isInternalColumn } from '../../util/columns.js';
+import { ensureOrdering } from '../../hooks/features/useColumnOrdering.js';
+import { Container } from '../../../../primitives/Sortable/components/Container.js';
+import { arrayMove } from '@dnd-kit/sortable';
+import { Item } from '../../../../primitives/Sortable/components/Item.js';
+import { List } from '../../../../primitives/Sortable/components/List.js';
+
+const Column = /*#__PURE__*/React__default.forwardRef(function Column(props, ref) {
+  var _column$columnDef$met;
+  const {
+    column,
+    draggable = false,
+    ...dragAttributes
+  } = props;
+  const canHide = column.getCanHide();
+  const className = cn('group/column flex items-center gap-x-2 rounded py-1 px-2', {
+    'hover:bg-grey-200': canHide || draggable,
+    'hover:cursor-pointer': canHide,
+    'active:cursor-move active:bg-grey-300': draggable
+  });
+  const attributes = draggable ? dragAttributes : undefined;
+  const isVisible = column.getIsVisible();
+  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, attributes, {
+    key: column.id,
+    className: className,
+    onClick: () => column.toggleVisibility(!isVisible),
+    ref: ref
+  }), draggable ? /*#__PURE__*/React__default.createElement(Icon, {
+    name: "drag",
+    className: "text-grey-500 group-hover/column:text-grey-700 -mx-2 !h-5"
+  }) : null, /*#__PURE__*/React__default.createElement("span", {
+    className: "flex-grow truncate"
+  }, (_column$columnDef$met = column.columnDef.meta) === null || _column$columnDef$met === void 0 ? void 0 : _column$columnDef$met.header), canHide ? /*#__PURE__*/React__default.createElement(Checkbox, {
+    checked: isVisible,
+    onChange: () => column.toggleVisibility(!isVisible)
+  }) : null);
+});
+function ColumnSettings(props) {
+  const {
+    table
+  } = props;
+  const {
+    texts
+  } = useLocalization();
+  const [query, setQuery] = React__default.useState('');
+  const allColumns = table.getAllLeafColumns();
+  const tableMeta = table.options.meta;
+  const columns = React__default.useMemo(() => allColumns.filter(column => !isInternalColumn(column.id)).filter(column => {
+    var _column$columnDef$met2;
+    return query !== null && query !== void 0 && query.length ? (_column$columnDef$met2 = column.columnDef.meta) === null || _column$columnDef$met2 === void 0 ? void 0 : _column$columnDef$met2.header.toLowerCase().includes(query.toLowerCase()) : true;
+  }), [allColumns, query]);
+  const listClassName = 'flex max-h-64 flex-col gap-y-px overflow-auto';
+  const handleReorder = (activeId, overId) => {
+    if (columns.find(column => {
+      var _column$columnDef$met3;
+      return column.id === overId && ((_column$columnDef$met3 = column.columnDef.meta) === null || _column$columnDef$met3 === void 0 ? void 0 : _column$columnDef$met3.enableOrdering) === false;
+    })) {
+      return;
+    }
+    table.setColumnOrder(currentOrder => ensureOrdering(allColumns, arrayMove(currentOrder, currentOrder.findIndex(c => c === activeId), currentOrder.findIndex(c => c === overId))));
+  };
+  return /*#__PURE__*/React__default.createElement(Button, {
+    popover: popoverProps => /*#__PURE__*/React__default.createElement(Popover, Object.assign({}, popoverProps), /*#__PURE__*/React__default.createElement(Popover.Content, null, /*#__PURE__*/React__default.createElement("div", {
+      className: "flex w-60 flex-col gap-2"
+    }, table.options.enableHiding ? /*#__PURE__*/React__default.createElement(Input, {
+      onChange: event => setQuery(event.target.value),
+      placeholder: texts.table3.columnSettings.search,
+      value: query
+    }) : null, tableMeta.columnOrdering.isEnabled && columns.length && !(query !== null && query !== void 0 && query.length) ? /*#__PURE__*/React__default.createElement(Container, {
+      reorder: handleReorder
+    }, /*#__PURE__*/React__default.createElement(List, {
+      id: "columns",
+      className: listClassName
+    }, columns.map(column => {
+      var _column$columnDef$met4, _column$columnDef$met5;
+      return /*#__PURE__*/React__default.createElement(Item, {
+        key: column.id,
+        id: column.id,
+        disabled: !((_column$columnDef$met4 = column.columnDef.meta) !== null && _column$columnDef$met4 !== void 0 && _column$columnDef$met4.enableOrdering),
+        asChild: true
+      }, /*#__PURE__*/React__default.createElement(Column, {
+        column: column,
+        draggable: (_column$columnDef$met5 = column.columnDef.meta) === null || _column$columnDef$met5 === void 0 ? void 0 : _column$columnDef$met5.enableOrdering
+      }));
+    }))) : /*#__PURE__*/React__default.createElement("div", {
+      className: listClassName
+    }, columns.length ? columns.map(column => /*#__PURE__*/React__default.createElement(Column, {
+      column: column,
+      key: column.id
+    })) : texts.table3.columnSettings.noResults))))
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    name: "columns"
+  }), texts.table3.columnSettings.button);
+}
+
+export { ColumnSettings };
+//# sourceMappingURL=ColumnSettings.js.map

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/ColumnSettings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnSettings.js","sources":["../../../../../../../../../src/components/Table3/components/toolbar/ColumnSettings.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Table as RTable, Column as RTColumn, TableMeta } from '@tanstack/react-table';\nimport { isInternalColumn } from '../../util/columns';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { Checkbox } from '../../../Checkbox/Checkbox';\nimport { Popover } from '../../../Popover/Popover';\nimport { Input } from '../../../Input/Input';\nimport * as SortablePrimitive from '../../../../primitives/Sortable/Sortable';\nimport { Icon } from '../../../Icon/Icon';\nimport { ensureOrdering } from '../../hooks/features/useColumnOrdering';\nimport { Button } from '../../../Button/Button';\n\ntype ColumnProps<TType = unknown> = React.HTMLAttributes<HTMLDivElement> & {\n    column: RTColumn<TType, unknown>;\n    draggable?: boolean;\n};\n\nconst Column = React.forwardRef(function Column<TType = unknown>(props: ColumnProps<TType>, ref: React.Ref<HTMLDivElement>) {\n    const { column, draggable = false, ...dragAttributes } = props;\n    const canHide = column.getCanHide();\n\n    const className = cn('group/column flex items-center gap-x-2 rounded py-1 px-2', {\n        'hover:bg-grey-200': canHide || draggable,\n        'hover:cursor-pointer': canHide,\n        'active:cursor-move active:bg-grey-300': draggable,\n    });\n\n    const attributes = draggable ? dragAttributes : undefined;\n    const isVisible = column.getIsVisible();\n\n    return (\n        <div {...attributes} key={column.id} className={className} onClick={() => column.toggleVisibility(!isVisible)} ref={ref}>\n            {draggable ? <Icon name=\"drag\" className=\"text-grey-500 group-hover/column:text-grey-700 -mx-2 !h-5\" /> : null}\n            <span className=\"flex-grow truncate\">{column.columnDef.meta?.header}</span>\n            {canHide ? <Checkbox checked={isVisible} onChange={() => column.toggleVisibility(!isVisible)} /> : null}\n        </div>\n    );\n});\n\nexport type ColumnSettingsProps<TType = unknown> = {\n    table: RTable<TType>;\n};\n\nexport function ColumnSettings<TType = unknown>(props: ColumnSettingsProps<TType>) {\n    const { table } = props;\n    const { texts } = useLocalization();\n    const [query, setQuery] = React.useState('');\n    const allColumns = table.getAllLeafColumns();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columns = React.useMemo(\n        () =>\n            allColumns\n                .filter(column => !isInternalColumn(column.id))\n                .filter(column =>\n                    query?.length ? column.columnDef.meta?.header.toLowerCase().includes(query.toLowerCase()) : true\n                ),\n        [allColumns, query]\n    );\n\n    const listClassName = 'flex max-h-64 flex-col gap-y-px overflow-auto';\n\n    const handleReorder = (activeId, overId) => {\n        if (columns.find(column => column.id === overId && column.columnDef.meta?.enableOrdering === false)) {\n            return;\n        }\n\n        table.setColumnOrder(currentOrder =>\n            ensureOrdering(\n                allColumns,\n                SortablePrimitive.arrayMove(\n                    currentOrder,\n                    currentOrder.findIndex(c => c === activeId),\n                    currentOrder.findIndex(c => c === overId)\n                )\n            )\n        );\n    };\n\n    return (\n        <Button\n            popover={popoverProps => (\n                <Popover {...popoverProps}>\n                    <Popover.Content>\n                        <div className=\"flex w-60 flex-col gap-2\">\n                            {table.options.enableHiding ? (\n                                <Input\n                                    onChange={event => setQuery(event.target.value)}\n                                    placeholder={texts.table3.columnSettings.search}\n                                    value={query}\n                                />\n                            ) : null}\n                            {tableMeta.columnOrdering.isEnabled && columns.length && !query?.length ? (\n                                <SortablePrimitive.Container reorder={handleReorder}>\n                                    <SortablePrimitive.List id=\"columns\" className={listClassName}>\n                                        {columns.map(column => (\n                                            <SortablePrimitive.Item\n                                                key={column.id}\n                                                id={column.id}\n                                                disabled={!column.columnDef.meta?.enableOrdering}\n                                                asChild>\n                                                <Column\n                                                    column={column as any}\n                                                    draggable={column.columnDef.meta?.enableOrdering}\n                                                />\n                                            </SortablePrimitive.Item>\n                                        ))}\n                                    </SortablePrimitive.List>\n                                </SortablePrimitive.Container>\n                            ) : (\n                                <div className={listClassName}>\n                                    {columns.length\n                                        ? columns.map(column => <Column column={column as any} key={column.id} />)\n                                        : texts.table3.columnSettings.noResults}\n                                </div>\n                            )}\n                        </div>\n                    </Popover.Content>\n                </Popover>\n            )}>\n            <Icon name=\"columns\" />\n            {texts.table3.columnSettings.button}\n        </Button>\n    );\n}\n"],"names":["Column","React","forwardRef","props","ref","column","draggable","dragAttributes","canHide","getCanHide","className","cn","attributes","undefined","isVisible","getIsVisible","key","id","onClick","toggleVisibility","Icon","name","columnDef","meta","header","Checkbox","checked","onChange","ColumnSettings","table","texts","useLocalization","query","setQuery","useState","allColumns","getAllLeafColumns","tableMeta","options","columns","useMemo","filter","isInternalColumn","length","toLowerCase","includes","listClassName","handleReorder","activeId","overId","find","enableOrdering","setColumnOrder","currentOrder","ensureOrdering","SortablePrimitive","findIndex","c","Button","popover","popoverProps","Popover","Content","enableHiding","Input","event","target","value","placeholder","table3","columnSettings","search","columnOrdering","isEnabled","reorder","map","disabled","asChild","noResults","button"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/EditButton.js

@@ -0,0 +1,45 @@
+import React__default from 'react';
+import cn from 'classnames';
+import { Icon } from '../../../Icon/Icon.js';
+import { useGlobalKeyDown } from '../../../../hooks/useGlobalKeyDown.js';
+import { useLocalization } from '../../../Provider/Localization.js';
+import { Button } from '../../../Button/Button.js';
+import { Shortcut } from '../../../Shortcut/Shortcut.js';
+
+function EditButton(props) {
+  const {
+    texts
+  } = useLocalization();
+  const tableMeta = props.table.options.meta;
+  const className = cn({
+    '!wcag-blue-100': tableMeta.editing.isEditing
+  });
+  const handleClick = () => tableMeta.editing.toggleEditing(!tableMeta.editing.isEditing);
+  useGlobalKeyDown({
+    key: 'e',
+    meta: true,
+    shift: false
+  }, event => {
+    event.preventDefault();
+    tableMeta.editing.toggleEditing(!tableMeta.editing.isEditing);
+  });
+  return /*#__PURE__*/React__default.createElement(Button, {
+    "aria-pressed": tableMeta.editing.isEditing,
+    className: className,
+    onClick: handleClick,
+    tooltip: /*#__PURE__*/React__default.createElement(React__default.Fragment, null, texts.table3.editing.buttons.edit.tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
+      className: "ml-2",
+      keys: {
+        key: 'e',
+        meta: true,
+        shift: false
+      }
+    }))
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    "aria-hidden": true,
+    name: "edit"
+  }), texts.table3.editing.buttons.edit.text);
+}
+
+export { EditButton };
+//# sourceMappingURL=EditButton.js.map

package/dist/esm/packages/taco/src/components/Table3/components/toolbar/EditButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditButton.js","sources":["../../../../../../../../../src/components/Table3/components/toolbar/EditButton.tsx"],"sourcesContent":["import React from 'react';\nimport { Table as RTable, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { Icon } from '../../../Icon/Icon';\nimport { Button } from '../../../Button/Button';\nimport { useLocalization } from '../../../Provider/Localization';\nimport { useGlobalKeyDown } from '../../../../hooks/useGlobalKeyDown';\nimport { Shortcut } from '../../../Shortcut/Shortcut';\n\ntype EditButtonProps<TType = unknown> = React.HTMLAttributes<HTMLButtonElement> & {\n    table: RTable<TType>;\n};\n\nexport function EditButton<TType = unknown>(props: EditButtonProps<TType>) {\n    const { texts } = useLocalization();\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n    const className = cn({\n        '!wcag-blue-100': tableMeta.editing.isEditing,\n    });\n    const handleClick = () => tableMeta.editing.toggleEditing(!tableMeta.editing.isEditing);\n\n    useGlobalKeyDown({ key: 'e', meta: true, shift: false }, (event: KeyboardEvent) => {\n        event.preventDefault();\n        tableMeta.editing.toggleEditing(!tableMeta.editing.isEditing);\n    });\n\n    return (\n        <Button\n            aria-pressed={tableMeta.editing.isEditing}\n            className={className}\n            onClick={handleClick}\n            tooltip={\n                <>\n                    {texts.table3.editing.buttons.edit.tooltip}\n                    <Shortcut className=\"ml-2\" keys={{ key: 'e', meta: true, shift: false }} />\n                </>\n            }>\n            <Icon aria-hidden name=\"edit\" />\n            {texts.table3.editing.buttons.edit.text}\n        </Button>\n    );\n}\n"],"names":["EditButton","props","texts","useLocalization","tableMeta","table","options","meta","className","cn","editing","isEditing","handleClick","toggleEditing","useGlobalKeyDown","key","shift","event","preventDefault","React","Button","onClick","tooltip","table3","buttons","edit","Shortcut","keys","Icon","name","text"],"mappings":";;;;;;;;SAagBA,UAAU,CAAkBC,KAA6B;EACrE,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,SAAS,GAAGH,KAAK,CAACI,KAAK,CAACC,OAAO,CAACC,IAAwB;EAC9D,MAAMC,SAAS,GAAGC,EAAE,CAAC;IACjB,gBAAgB,EAAEL,SAAS,CAACM,OAAO,CAACC;GACvC,CAAC;EACF,MAAMC,WAAW,GAAG,MAAMR,SAAS,CAACM,OAAO,CAACG,aAAa,CAAC,CAACT,SAAS,CAACM,OAAO,CAACC,SAAS,CAAC;EAEvFG,gBAAgB,CAAC;IAAEC,GAAG,EAAE,GAAG;IAAER,IAAI,EAAE,IAAI;IAAES,KAAK,EAAE;GAAO,EAAGC,KAAoB;IAC1EA,KAAK,CAACC,cAAc,EAAE;IACtBd,SAAS,CAACM,OAAO,CAACG,aAAa,CAAC,CAACT,SAAS,CAACM,OAAO,CAACC,SAAS,CAAC;GAChE,CAAC;EAEF,oBACIQ,6BAACC,MAAM;oBACWhB,SAAS,CAACM,OAAO,CAACC,SAAS;IACzCH,SAAS,EAAEA,SAAS;IACpBa,OAAO,EAAET,WAAW;IACpBU,OAAO,eACHH,4DACKjB,KAAK,CAACqB,MAAM,CAACb,OAAO,CAACc,OAAO,CAACC,IAAI,CAACH,OAAO,eAC1CH,6BAACO,QAAQ;MAAClB,SAAS,EAAC,MAAM;MAACmB,IAAI,EAAE;QAAEZ,GAAG,EAAE,GAAG;QAAER,IAAI,EAAE,IAAI;QAAES,KAAK,EAAE;;MAAW;kBAGnFG,6BAACS,IAAI;;IAAaC,IAAI,EAAC;IAAS,EAC/B3B,KAAK,CAACqB,MAAM,CAACb,OAAO,CAACc,OAAO,CAACC,IAAI,CAACK,IAAI,CAClC;AAEjB;;;;"}