npm - @okta/odyssey-react-mui - Versions diffs - 1.9.14 → 1.9.16 - Mend

@okta/odyssey-react-mui 1.9.14 → 1.9.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

package/CHANGELOG.md +10 -0
package/dist/labs/DataTable.js +169 -48
package/dist/labs/DataTable.js.map +1 -1
package/dist/labs/Switch.js +3 -3
package/dist/labs/Switch.js.map +1 -1
package/dist/src/labs/DataTable.d.ts.map +1 -1
package/dist/src/labs/Switch.d.ts.map +1 -1
package/dist/tsconfig.production.tsbuildinfo +1 -1
package/package.json +3 -3
package/src/labs/DataTable.tsx +199 -41
package/src/labs/Switch.tsx +2 -1

package/CHANGELOG.md CHANGED Viewed

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+## [1.9.16](https://github.com/okta/odyssey/compare/v1.9.15...v1.9.16) (2024-01-08)
+### Bug Fixes
+- (odyssey-react-mui): move variable declaration below import ([#2082](https://github.com/okta/odyssey/issues/2082)) ([910e4fc](https://github.com/okta/odyssey/commit/910e4fc120371df48cfc5908f06e175c61cbcaba))
+## [1.9.15](https://github.com/okta/odyssey/compare/v1.9.14...v1.9.15) (2024-01-08)
+**Note:** Version bump only for package @okta/odyssey-react-mui
 ## [1.9.14](https://github.com/okta/odyssey/compare/v1.9.13...v1.9.14) (2024-01-05)
 **Note:** Version bump only for package @okta/odyssey-react-mui

package/dist/labs/DataTable.js CHANGED Viewed

@@ -14,6 +14,7 @@ import _Checkbox from "@mui/material/Checkbox";
 import { useMaterialReactTable, MRT_TableContainer } from "material-react-table";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { ArrowTopIcon, ArrowBottomIcon, ArrowDownIcon, ArrowUpIcon, DragIndicatorIcon, ListIcon, ShowIcon, MoreIcon } from "../icons.generated/index.js";
+import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { DataTablePagination } from "./DataTablePagination.js";
 import { DataFilters } from "./DataFilters.js";
 import { Box } from "../Box.js";
@@ -23,7 +24,21 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 export const densityValues = ["comfortable", "spacious", "compact"];
-const DataTable = _ref => {
+const reorderDataRowsLocally = _ref => {
+  let {
+    currentData,
+    rowId,
+    newIndex
+  } = _ref;
+  const updatedData = [...currentData];
+  const rowIndex = updatedData.findIndex(row => row.id === rowId);
+  if (rowIndex !== -1) {
+    const [removedRow] = updatedData.splice(rowIndex, 1);
+    updatedData.splice(newIndex, 0, removedRow);
+  }
+  return updatedData;
+};
+const DataTable = _ref2 => {
   let {
     columns,
     data: dataProp,
@@ -49,7 +64,8 @@ const DataTable = _ref => {
     hasRowSelection,
     hasSearch,
     hasSorting
-  } = _ref;
+  } = _ref2;
+  const odysseyDesignTokens = useOdysseyDesignTokens();
   const [draggingRow, setDraggingRow] = useState();
   const [showSkeletons, setShowSkeletons] = useState(true);
   const [data, setData] = useState(dataProp);
@@ -67,6 +83,12 @@ const DataTable = _ref => {
   const [columnVisibility, setColumnVisibility] = useState(initialColumnVisibility);
   const [globalFilter, setGlobalFilter] = useState("");
   const [filters, setFilters] = useState();
+  useEffect(() => {
+    setShowSkeletons(false);
+  }, [data]);
+  useEffect(() => {
+    onRowSelectionChange?.(rowSelection);
+  }, [rowSelection, onRowSelectionChange]);
   const refreshData = useCallback(async () => {
     setShowSkeletons(true);
     try {
@@ -80,10 +102,12 @@ const DataTable = _ref => {
       setData(newData);
       setShowSkeletons(false);
     } catch (error) {
-      console.log(error);
       setShowSkeletons(false);
     }
   }, [page, resultsPerPage, sorting, globalFilter, filters, fetchDataFn]);
+  useEffect(() => {
+    refreshData();
+  }, [refreshData, page, resultsPerPage, sorting, globalFilter, filters]);
   const handleSortingChange = useCallback(updater => {
     setSorting(prevSorting => updater instanceof Function ? updater(prevSorting) : sorting);
   }, [sorting]);
@@ -102,33 +126,124 @@ const DataTable = _ref => {
   const handleRowSelectionChange = useCallback(updater => {
     setRowSelection(prevRowSelection => updater instanceof Function ? updater(prevRowSelection) : rowSelection);
   }, [rowSelection]);
-  const handleReordering = useCallback(_ref2 => {
+  const updateRowOrder = useCallback(_ref3 => {
     let {
       rowId,
       newIndex
-    } = _ref2;
+    } = _ref3;
     if (newIndex < 0) {
       return;
     }
     if (totalRows && newIndex > totalRows) {
       return;
     }
+    const newData = reorderDataRowsLocally({
+      currentData: data,
+      rowId,
+      newIndex
+    });
+    setData(newData);
     reorderDataFn?.({
       rowId,
       newIndex
     });
     refreshData();
-  }, [totalRows, reorderDataFn, refreshData]);
-  useEffect(() => {
-    setShowSkeletons(false);
-  }, [data]);
-  useEffect(() => {
-    refreshData();
-  }, [refreshData, page, resultsPerPage, sorting, globalFilter, filters]);
-  useEffect(() => {
-    onRowSelectionChange?.(rowSelection);
-  }, [rowSelection, onRowSelectionChange]);
+  }, [data, totalRows, reorderDataFn, refreshData]);
   const rowVirtualizerInstanceRef = useRef(null);
+  const getRowFromTableAndSetHovered = (table, id) => {
+    if (id) {
+      const nextRow = table.getRow(id);
+      if (nextRow) {
+        table.setHoveredRow(nextRow);
+      }
+    }
+  };
+  const resetDraggingAndHoveredRow = table => {
+    setDraggingRow(null);
+    table.setHoveredRow(null);
+  };
+  const handleDragHandleKeyDown = useCallback(_ref4 => {
+    let {
+      table,
+      row,
+      event
+    } = _ref4;
+    const {
+      hoveredRow
+    } = table.getState();
+    const {
+      key
+    } = event;
+    const isSpaceKey = key === " ";
+    const isEnterKey = key === "Enter";
+    const isEscapeKey = key === "Escape";
+    const isArrowDown = key === "ArrowDown";
+    const isArrowUp = key === "ArrowUp";
+    const isSpaceOrEnter = isSpaceKey || isEnterKey;
+    const zeroIndexedPageNumber = page - 1;
+    const currentIndex = row.index + zeroIndexedPageNumber * resultsPerPage;
+    if (isEscapeKey) {
+      resetDraggingAndHoveredRow(table);
+      return;
+    }
+    if (isSpaceOrEnter) {
+      event.preventDefault();
+      event.stopPropagation();
+    }
+    if (draggingRow) {
+      if (typeof hoveredRow?.index === "number") {
+        const {
+          index
+        } = hoveredRow;
+        if (isSpaceOrEnter) {
+          const pageRelativeIndex = index + zeroIndexedPageNumber * resultsPerPage;
+          if (pageRelativeIndex !== currentIndex) {
+            updateRowOrder({
+              rowId: row.id,
+              newIndex: pageRelativeIndex
+            });
+            setTimeout(() => {
+              resetDraggingAndHoveredRow(table);
+            }, odysseyDesignTokens.TransitionDurationMainAsNumber);
+            return;
+          }
+        }
+        if (isArrowDown || isArrowUp) {
+          const nextIndex = isArrowDown ? index + 1 : index - 1;
+          getRowFromTableAndSetHovered(table, data[nextIndex]?.id);
+        }
+      } else {
+        if (isArrowDown || isArrowUp) {
+          const nextIndex = isArrowDown ? row.index + 1 : row.index - 1;
+          getRowFromTableAndSetHovered(table, data[nextIndex]?.id);
+        }
+      }
+    } else {
+      if (isSpaceOrEnter) {
+        setDraggingRow(row);
+      }
+    }
+  }, [data, draggingRow, odysseyDesignTokens, page, resultsPerPage, updateRowOrder]);
+  const handleDragHandleOnDragEnd = useCallback(table => {
+    const cols = table.getAllColumns();
+    cols[0].toggleVisibility();
+    const {
+      draggingRow,
+      hoveredRow
+    } = table.getState();
+    if (draggingRow) {
+      updateRowOrder({
+        rowId: draggingRow.id,
+        newIndex: hoveredRow.index
+      });
+    }
+    setDraggingRow(null);
+  }, [updateRowOrder]);
+  const handleDragHandleOnDragCapture = useCallback(table => {
+    if (!draggingRow && table.getState().draggingRow?.id) {
+      setDraggingRow(table.getState().draggingRow);
+    }
+  }, [draggingRow]);
   const table = useMaterialReactTable({
     columns: columns,
     data: data,
@@ -179,13 +294,13 @@ const DataTable = _ref => {
         muiTableBodyCellProps: {
           sx: {
             minWidth: 0,
-            width: 32
+            width: "auto"
           }
         },
         muiTableHeadCellProps: {
           sx: {
             minWidth: 0,
-            width: 32
+            width: "auto"
           }
         }
       }
@@ -203,50 +318,56 @@ const DataTable = _ref => {
     onRowSelectionChange: handleRowSelectionChange,
     enableRowActions: hasRowReordering === true || rowActionButtons || rowActionMenuItems ? true : false,
     positionActionsColumn: "last",
-    muiTableHeadCellProps: _ref3 => {
+    muiTableHeadCellProps: _ref5 => {
       let {
         column
-      } = _ref3;
+      } = _ref5;
       return {
         className: sorting.find(item => item.id === column.id) ? "isSorted" : "isUnsorted"
       };
     },
-    muiTableBodyRowProps: _ref4 => {
+    muiTableBodyRowProps: _ref6 => {
       let {
         table,
         row
-      } = _ref4;
+      } = _ref6;
       return {
         className: draggingRow?.id === row.id && table.getState().hoveredRow?.id !== row.id ? "isDragging" : table.getState().hoveredRow?.id === row.id && draggingRow?.id !== row.id ? "isDragTarget" : draggingRow?.id === row.id && table.getState().hoveredRow?.id === row.id ? "isDragging isDragTarget" : undefined
       };
     },
-    muiRowDragHandleProps: {
-      tabIndex: -1,
-      onDragEnd: () => {
-        const cols = table.getAllColumns();
-        cols[0].toggleVisibility();
-        const {
-          draggingRow,
-          hoveredRow
-        } = table.getState();
-        if (draggingRow) {
-          handleReordering({
-            rowId: draggingRow.id,
-            newIndex: hoveredRow.index
-          });
-        }
-        setDraggingRow(null);
-      },
-      onDragCapture: () => {
-        if (!draggingRow && table.getState().draggingRow?.id) {
-          setDraggingRow(table.getState().draggingRow);
+    muiRowDragHandleProps: _ref7 => {
+      let {
+        table,
+        row
+      } = _ref7;
+      return {
+        title: "Drag row or press space/enter key to start and stop reordering",
+        "aria-label": "Drag row to reorder. Or, press space or enter to start and stop reordering and esc to cancel.",
+        onKeyDown: event => handleDragHandleKeyDown({
+          table,
+          row,
+          event
+        }),
+        onBlur: () => {
+          resetDraggingAndHoveredRow(table);
+        },
+        onDragEnd: () => handleDragHandleOnDragEnd(table),
+        onDragCapture: () => handleDragHandleOnDragCapture(table),
+        sx: {
+          padding: odysseyDesignTokens.Spacing1,
+          borderRadius: odysseyDesignTokens.BorderRadiusMain,
+          "&:focus-visible": {
+            boxShadow: `0 0 0 2px ${odysseyDesignTokens.HueNeutralWhite}, 0 0 0 4px ${odysseyDesignTokens.PalettePrimaryMain}`,
+            outline: "2px solid transparent",
+            outlineOffset: "1px"
+          }
         }
-      }
+      };
     },
-    renderRowActions: _ref5 => {
+    renderRowActions: _ref8 => {
       let {
         row
-      } = _ref5;
+      } = _ref8;
       const currentIndex = row.index + (page - 1) * resultsPerPage;
       return _jsxs(Box, {
         sx: {
@@ -262,21 +383,21 @@ const DataTable = _ref => {
             children: [rowActionMenuItems(row), _jsx("hr", {})]
           }), _jsxs(MenuItem, {
             isDisabled: currentIndex <= 0,
-            onClick: () => handleReordering({
+            onClick: () => updateRowOrder({
               rowId: row.id,
               newIndex: 0
             }),
             children: [_jsx(ArrowTopIcon, {}), " Bring to front"]
           }), _jsxs(MenuItem, {
             isDisabled: currentIndex <= 0,
-            onClick: () => handleReordering({
+            onClick: () => updateRowOrder({
               rowId: row.id,
               newIndex: currentIndex <= 0 ? 0 : currentIndex - 1
             }),
             children: [_jsx(ArrowUpIcon, {}), " Bring forward"]
           }), _jsxs(MenuItem, {
             isDisabled: totalRows ? currentIndex >= totalRows - 1 : false,
-            onClick: () => handleReordering({
+            onClick: () => updateRowOrder({
               rowId: row.id,
               newIndex: currentIndex + 1
             }),
@@ -284,7 +405,7 @@ const DataTable = _ref => {
           }), _jsx(_Fragment, {
             children: totalRows && _jsxs(MenuItem, {
               isDisabled: currentIndex >= totalRows - 1,
-              onClick: () => handleReordering({
+              onClick: () => updateRowOrder({
                 rowId: row.id,
                 newIndex: totalRows
               }),

package/dist/labs/DataTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.js","names":["useMaterialReactTable","MRT_TableContainer","memo","useCallback","useEffect","useMemo","useRef","useState","ArrowTopIcon","ArrowBottomIcon","ArrowDownIcon","ArrowUpIcon","DragIndicatorIcon","ListIcon","ShowIcon","MoreIcon","DataTablePagination","DataFilters","Box","MenuButton","MenuItem","ArrowUnsortedIcon","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","densityValues","DataTable","_ref","columns","data","dataProp","getRowId","page","pageProp","initialDensity","resultsPerPage","resultsPerPageProp","fetchDataFn","reorderDataFn","totalRows","hasSearchSubmitButton","searchDelayTime","paginationType","onRowSelectionChange","rowActionButtons","rowActionMenuItems","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSorting","draggingRow","setDraggingRow","showSkeletons","setShowSkeletons","setData","setPage","setResultsPerPage","rowSelection","setRowSelection","sorting","setSorting","density","setDensity","initialColumnVisibility","reduce","acc","column","accessorKey","columnVisibility","setColumnVisibility","globalFilter","setGlobalFilter","filters","setFilters","refreshData","newData","sort","search","error","console","log","handleSortingChange","updater","prevSorting","Function","handleColumnVisibility","columnId","prevVisibility","handleSearch","value","handleFilters","updatedFilters","handleRowSelectionChange","prevRowSelection","handleReordering","_ref2","rowId","newIndex","rowVirtualizerInstanceRef","table","state","rowVirtualizerOptions","overscan","enableRowVirtualization","enableColumnResizing","enableDensityToggle","enableFullScreenToggle","enablePagination","enableRowSelection","enableFilters","enableHiding","enableRowOrdering","enableRowDragging","enableSorting","selectAllMode","enableColumnActions","layoutMode","displayColumnDefOptions","muiTableBodyCellProps","align","sx","overflow","width","muiTableHeadCellProps","header","minWidth","enableGlobalFilter","manualFiltering","manualSorting","icons","ArrowDownwardIcon","DragHandleIcon","SyncAltIcon","onSortingChange","enableRowActions","positionActionsColumn","_ref3","className","find","item","id","muiTableBodyRowProps","_ref4","row","getState","hoveredRow","undefined","muiRowDragHandleProps","tabIndex","onDragEnd","cols","getAllColumns","toggleVisibility","index","onDragCapture","renderRowActions","_ref5","currentIndex","display","children","endIcon","size","buttonVariant","ariaLabel","menuAlignment","isDisabled","onClick","tableSettings","shouldCloseOnSelect","map","isSelected","charAt","toUpperCase","slice","filter","_Checkbox","checked","flexDirection","gap","onChangeSearch","onChangeFilters","additionalActions","enableColumnFilter","label","variant","filterVariant","options","filterSelectOptions","currentNumberOfResults","length","currentPage","isPreviousButtonDisabled","isNextButtonDisabled","onClickPrevious","onClickNext","MemoizedDataTable","displayName"],"sources":["../../src/labs/DataTable.tsx"],"sourcesContent":["/!\n Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n /\n\nimport {\n MRT_Updater,\n MRT_Virtualizer,\n MRT_RowData,\n MRT_TableOptions,\n useMaterialReactTable,\n MRT_SortingState,\n MRT_DensityState,\n MRT_VisibilityState,\n MRT_TableContainer,\n MRT_RowSelectionState,\n MRT_Row,\n MRT_ColumnDef,\n} from \"material-react-table\";\nimport {\n Fragment,\n ReactElement,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport {\n ArrowTopIcon,\n ArrowBottomIcon,\n ArrowDownIcon,\n ArrowUpIcon,\n DragIndicatorIcon,\n ListIcon,\n ShowIcon,\n MoreIcon,\n} from \"../icons.generated\";\nimport { Checkbox as MuiCheckbox } from \"@mui/material\";\nimport {\n DataTablePagination,\n paginationTypeValues,\n} from \"./DataTablePagination\";\nimport { DataFilter, DataFilters } from \"./DataFilters\";\nimport { Button } from \"../Button\";\nimport { Box } from \"../Box\";\nimport { MenuButton, MenuItem } from \"..\";\nimport { ArrowUnsortedIcon } from \"../icons.generated\";\n\nexport const densityValues = [\"comfortable\", \"spacious\", \"compact\"] as const;\n\nexport type {\n MRT_ColumnFiltersState,\n MRT_SortingState,\n MRT_ColumnDef as TableColumn,\n} from \"material-react-table\";\n\n// The shape of the table columns,\n// with props named to match their MRT_ColumnDef counterparts\nexport type DataColumn = {\n /\n The unique ID of the column\n /\n accessorKey: string;\n /\n The human-friendly title of the column\n /\n header: string;\n /\n Customize the way each cell in the column is\n * displayed via a custom React component.\n /\n Cell?: MRT_ColumnDef<MRT_RowData>[\"Cell\"];\n /\n The UI control that will be used to filter the column.\n * Defaults to a standard text input.\n /\n filterVariant?: MRT_ColumnDef<MRT_RowData>[\"filterVariant\"];\n /\n If the filter control has preset options (such as a select or multi-select),\n * these are the options provided.\n /\n filterSelectOptions?: Array<{ label: string; value: string }>;\n /\n The optional column width, in pixels\n /\n size?: number;\n /\n The minimum column width, in pixels\n /\n minSize?: number;\n /\n The maximum column width, in pixels\n /\n maxSize?: number;\n /\n If set to false, the column won't be filterable\n /\n enableColumnFilter?: boolean;\n /\n If set to false, the column won't be searchable\n /\n enableGlobalFilter?: boolean;\n /\n If set to false, the column won't be sortable\n /\n enableSorting?: boolean;\n /\n If set to false, the column won't be resizable\n /\n enableResizing?: boolean;\n /\n If set to false, the column won't be hideable\n /\n enableHiding?: boolean;\n};\n\nexport type DataTableProps = {\n /\n The columns that make up the table\n /\n columns: DataColumn[];\n /\n The data that goes into the table, which will be displayed\n * as the table rows\n /\n data: MRT_TableOptions<MRT_RowData>[\"data\"];\n /\n The total number of rows in the table. Optional, because it's sometimes impossible\n * to calculate. Used in table pagination to know when to disable the \"next\"/\"more\" button.\n /\n totalRows?: number;\n /\n The function to get the ID of a row\n /\n getRowId?: MRT_TableOptions<MRT_RowData>[\"getRowId\"];\n /\n The initial density of the table. This is available even if the table density\n * isn't changeable.\n /\n initialDensity?: (typeof densityValues)[number];\n /\n If true, the end user will be able to change the table density.\n /\n hasChangeableDensity?: boolean;\n /\n If true, the end user can resize individual columns.\n /\n hasColumnResizing?: boolean;\n /\n If true, the end user will be able to show/hide columns.\n /\n hasColumnVisibility?: boolean;\n /\n If true, the end user will be able to filter columns.\n /\n hasFilters?: boolean;\n /\n If true, the table will include pagination controls.\n /\n hasPagination?: boolean;\n /\n If true, the table will include checkboxes on each row, enabling\n * the user to select some or all rows.\n /\n hasRowSelection?: boolean;\n /\n If true, the global table search controls will be shown.\n /\n hasSearch?: boolean;\n /\n If true, the end user can sort columns (ascending, descending, or neither)\n /\n hasSorting?: boolean;\n /\n If true, the end user can reorder rows via a drag-and-drop interface\n /\n hasRowReordering?: boolean;\n /\n If true, the search field will include a Search button, rather than\n * firing on input change.\n /\n hasSearchSubmitButton?: boolean;\n /\n The debounce time, in milliseconds, for the search input firing\n * `onChangeSearch` when changed. If `hasSearchSubmitButton` is true,\n * this doesn't do anything.\n /\n searchDelayTime?: number;\n /\n Callback that fires when a row (or rows) is selected or unselected.\n /\n onRowSelectionChange?: (rowSelection: MRT_RowSelectionState) => void;\n /\n Callback that fires whenever the table needs to fetch new data, due to changes in\n * page, results per page, search input, filters, or sorting\n /\n fetchDataFn: ({\n page,\n resultsPerPage,\n search,\n filters,\n sort,\n }: {\n page?: number;\n resultsPerPage?: number;\n search?: string;\n filters?: DataFilter[];\n sort?: MRT_SortingState;\n }) => MRT_TableOptions<MRT_RowData>[\"data\"];\n /\n Callback that fires when the user reorders rows within the table. Can be used\n * to propogate order change to the backend.\n /\n reorderDataFn?: ({\n rowId,\n newIndex,\n }: {\n rowId: string;\n newIndex: number;\n }) => void;\n /\n The current page number.\n /\n page?: number;\n /\n The number of results per page.\n /\n resultsPerPage?: number;\n /\n The type of pagination controls shown. Defaults to next/prev buttons, but can be\n * set to a simple \"Load more\" button by setting to \"loadMore\".\n /\n paginationType?: (typeof paginationTypeValues)[number];\n /\n Action buttons to display in each row\n /\n rowActionButtons?: (\n row: MRT_RowData\n ) => ReactElement<typeof Button \| typeof Fragment>;\n /\n Menu items to include in the optional actions menu on each row.\n /\n rowActionMenuItems?: (\n row: MRT_RowData\n ) => ReactElement<typeof MenuItem \| typeof Fragment>;\n};\n\nconst DataTable = ({\n columns,\n data: dataProp,\n getRowId,\n page: pageProp = 1,\n initialDensity = densityValues[0],\n resultsPerPage: resultsPerPageProp = 20,\n fetchDataFn,\n reorderDataFn,\n totalRows,\n hasSearchSubmitButton,\n searchDelayTime,\n paginationType = \"paged\",\n onRowSelectionChange,\n rowActionButtons,\n rowActionMenuItems,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSorting,\n}: DataTableProps) => {\n const [draggingRow, setDraggingRow] = useState<MRT_Row<MRT_RowData> \| null>();\n const [showSkeletons, setShowSkeletons] = useState<boolean>(true);\n const [data, setData] =\n useState<MRT_TableOptions<MRT_RowData>[\"data\"]>(dataProp);\n const [page, setPage] = useState<number>(pageProp);\n const [resultsPerPage, setResultsPerPage] =\n useState<number>(resultsPerPageProp);\n const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});\n const [sorting, setSorting] = useState<MRT_SortingState>([]);\n const [density, setDensity] = useState<MRT_DensityState>(initialDensity);\n\n const initialColumnVisibility = useMemo(() => {\n return columns.reduce((acc, column) => {\n acc[column.accessorKey as string] = true;\n return acc;\n }, {} as MRT_VisibilityState);\n }, [columns]);\n\n const [columnVisibility, setColumnVisibility] = useState<MRT_VisibilityState>(\n initialColumnVisibility\n );\n\n const [globalFilter, setGlobalFilter] = useState<string>(\"\");\n const [filters, setFilters] = useState<Array<DataFilter>>();\n\n const refreshData = useCallback(async () => {\n setShowSkeletons(true);\n try {\n const newData = await fetchDataFn({\n page: page,\n resultsPerPage: resultsPerPage,\n sort: sorting,\n search: globalFilter,\n filters: filters,\n });\n setData(newData);\n setShowSkeletons(false);\n } catch (error) {\n console.log(error);\n setShowSkeletons(false);\n }\n }, [page, resultsPerPage, sorting, globalFilter, filters, fetchDataFn]);\n\n const handleSortingChange = useCallback(\n (updater: MRT_Updater<MRT_SortingState>) => {\n setSorting((prevSorting) =>\n updater instanceof Function ? updater(prevSorting) : sorting\n );\n },\n [sorting]\n );\n\n const handleColumnVisibility = useCallback(\n (columnId: string) => {\n setColumnVisibility((prevVisibility) => ({\n ...prevVisibility,\n [columnId]: !columnVisibility[columnId],\n }));\n },\n [columnVisibility]\n );\n\n const handleSearch = useCallback((value: string) => {\n setGlobalFilter(value);\n }, []);\n\n const handleFilters = useCallback((updatedFilters: Array<DataFilter>) => {\n setFilters(updatedFilters);\n }, []);\n\n const handleRowSelectionChange = useCallback(\n (updater: MRT_Updater<MRT_RowSelectionState>) => {\n setRowSelection((prevRowSelection) =>\n updater instanceof Function ? updater(prevRowSelection) : rowSelection\n );\n },\n [rowSelection]\n );\n\n const handleReordering = useCallback(\n ({ rowId, newIndex }: { rowId: string; newIndex: number }) => {\n if (newIndex < 0) {\n return;\n }\n\n if (totalRows && newIndex > totalRows) {\n return;\n }\n\n reorderDataFn?.({ rowId, newIndex });\n refreshData();\n },\n [totalRows, reorderDataFn, refreshData]\n );\n\n useEffect(() => {\n setShowSkeletons(false);\n }, [data]);\n\n useEffect(() => {\n refreshData();\n }, [refreshData, page, resultsPerPage, sorting, globalFilter, filters]);\n\n useEffect(() => {\n onRowSelectionChange?.(rowSelection);\n }, [rowSelection, onRowSelectionChange]);\n\n const rowVirtualizerInstanceRef =\n useRef<MRT_Virtualizer<HTMLDivElement, HTMLTableRowElement>>(null);\n\n const table = useMaterialReactTable({\n columns: columns,\n data: data,\n state: {\n density,\n sorting,\n globalFilter,\n columnVisibility,\n rowSelection,\n showSkeletons,\n },\n rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,\n rowVirtualizerOptions: { overscan: 4 },\n enableRowVirtualization:\n paginationType === \"loadMore\" \|\| resultsPerPage > 50,\n enableColumnResizing: hasColumnResizing,\n enableDensityToggle: false,\n enableFullScreenToggle: false,\n enablePagination: false,\n enableRowSelection: hasRowSelection,\n enableFilters: false,\n enableHiding: false,\n enableRowOrdering: hasRowReordering,\n enableRowDragging: hasRowReordering,\n enableSorting: hasSorting,\n selectAllMode: \"all\",\n enableColumnActions: false,\n layoutMode: \"grid-no-grow\",\n displayColumnDefOptions: {\n \"mrt-row-actions\": {\n muiTableBodyCellProps: {\n align: \"right\",\n sx: {\n overflow: \"visible\",\n width: \"unset\",\n },\n },\n muiTableHeadCellProps: {\n align: \"right\",\n sx: {\n width: \"unset\",\n // TODO: Make the right padding here 16px (and possibly adapt it to the density padding)\n },\n },\n },\n \"mrt-row-drag\": {\n header: \"\",\n muiTableBodyCellProps: {\n sx: {\n minWidth: 0,\n width: 32,\n },\n },\n muiTableHeadCellProps: {\n sx: {\n minWidth: 0,\n width: 32,\n },\n },\n },\n },\n enableGlobalFilter: false,\n manualFiltering: true,\n manualSorting: true,\n getRowId: getRowId,\n icons: {\n ArrowDownwardIcon: ArrowDownIcon,\n DragHandleIcon: DragIndicatorIcon,\n SyncAltIcon: ArrowUnsortedIcon,\n },\n onSortingChange: handleSortingChange,\n onRowSelectionChange: handleRowSelectionChange,\n enableRowActions:\n hasRowReordering === true \|\| rowActionButtons \|\| rowActionMenuItems\n ? true\n : false,\n positionActionsColumn: \"last\",\n\n muiTableHeadCellProps: ({ column }) => ({\n className: sorting.find((item) => item.id === column.id)\n ? \"isSorted\"\n : \"isUnsorted\",\n }),\n\n muiTableBodyRowProps: ({ table, row }) => ({\n className:\n draggingRow?.id === row.id && table.getState().hoveredRow?.id !== row.id\n ? \"isDragging\"\n : table.getState().hoveredRow?.id === row.id &&\n draggingRow?.id !== row.id\n ? \"isDragTarget\"\n : draggingRow?.id === row.id &&\n table.getState().hoveredRow?.id === row.id\n ? \"isDragging isDragTarget\"\n : undefined,\n }),\n\n muiRowDragHandleProps: {\n tabIndex: -1,\n onDragEnd: () => {\n const cols = table.getAllColumns();\n cols[0].toggleVisibility();\n\n const { draggingRow, hoveredRow } = table.getState();\n if (draggingRow) {\n handleReordering({\n rowId: draggingRow.id,\n newIndex: (hoveredRow as MRT_RowData).index,\n });\n }\n\n setDraggingRow(null);\n },\n\n onDragCapture: () => {\n if (!draggingRow && table.getState().draggingRow?.id) {\n setDraggingRow(table.getState().draggingRow);\n }\n },\n },\n\n renderRowActions: ({ row }) => {\n const currentIndex = row.index + (page - 1) resultsPerPage;\n\n return (\n <Box sx={{ display: \"flex\" }}>\n {rowActionButtons?.(row)}\n {(rowActionMenuItems \|\| hasRowReordering) && (\n <MenuButton\n endIcon={<MoreIcon />}\n size=\"small\"\n buttonVariant=\"floating\"\n ariaLabel=\"More actions\"\n menuAlignment=\"right\"\n >\n {rowActionMenuItems && (\n <>\n {rowActionMenuItems(row)}\n <hr />\n </>\n )}\n <MenuItem\n isDisabled={currentIndex <= 0}\n onClick={() => handleReordering({ rowId: row.id, newIndex: 0 })}\n >\n <ArrowTopIcon /> Bring to front\n </MenuItem>\n <MenuItem\n isDisabled={currentIndex <= 0}\n onClick={() =>\n handleReordering({\n rowId: row.id,\n newIndex: currentIndex <= 0 ? 0 : currentIndex - 1,\n })\n }\n >\n <ArrowUpIcon /> Bring forward\n </MenuItem>\n <MenuItem\n isDisabled={totalRows ? currentIndex >= totalRows - 1 : false}\n onClick={() =>\n handleReordering({\n rowId: row.id,\n newIndex: currentIndex + 1,\n })\n }\n >\n <ArrowDownIcon /> Send backward\n </MenuItem>\n <>\n {totalRows && (\n <MenuItem\n isDisabled={currentIndex >= totalRows - 1}\n onClick={() =>\n handleReordering({\n rowId: row.id,\n newIndex: totalRows,\n })\n }\n >\n <ArrowBottomIcon /> Send to back\n </MenuItem>\n )}\n </>\n </MenuButton>\n )}\n </Box>\n );\n },\n });\n\n const tableSettings = useMemo(\n () => (\n <>\n {hasChangeableDensity && (\n <MenuButton\n endIcon={<ListIcon />}\n ariaLabel=\"Table density\"\n menuAlignment=\"right\"\n shouldCloseOnSelect={false}\n >\n <>\n {densityValues.map((value: MRT_DensityState) => (\n <MenuItem\n key={value}\n isSelected={density === value}\n onClick={() => setDensity(value)}\n >\n {`${value.charAt(0).toUpperCase()}${value.slice(1)}`}\n </MenuItem>\n ))}\n </>\n </MenuButton>\n )}\n\n {hasColumnVisibility && (\n <MenuButton\n endIcon={<ShowIcon />}\n ariaLabel=\"Show/hide columns\"\n menuAlignment=\"right\"\n shouldCloseOnSelect={false}\n >\n <>\n {columns\n .filter((column) => column.enableHiding !== false)\n .map((column) => (\n <MenuItem\n key={column.accessorKey}\n onClick={() =>\n handleColumnVisibility(column.accessorKey as string)\n }\n >\n <MuiCheckbox\n checked={\n columnVisibility[column.accessorKey as string] !== false\n }\n />\n {column.header}\n </MenuItem>\n ))}\n </>\n </MenuButton>\n )}\n </>\n ),\n [\n columnVisibility,\n columns,\n density,\n hasChangeableDensity,\n handleColumnVisibility,\n hasColumnVisibility,\n ]\n );\n\n return (\n <Box sx={{ display: \"flex\", flexDirection: \"column\", gap: 4 }}>\n <DataFilters\n onChangeSearch={hasSearch ? handleSearch : undefined}\n onChangeFilters={handleFilters}\n hasSearchSubmitButton={hasSearchSubmitButton}\n searchDelayTime={searchDelayTime}\n additionalActions={tableSettings}\n filters={\n hasFilters\n ? columns\n .filter((column) => column.enableColumnFilter !== false)\n .map((column) => {\n return {\n id: column.accessorKey as string,\n label: column.header,\n variant: column.filterVariant ?? \"text\",\n options: column.filterSelectOptions,\n };\n })\n : undefined\n }\n />\n\n <MRT_TableContainer table={table} />\n\n {hasPagination && (\n <DataTablePagination\n paginationType={paginationType}\n currentNumberOfResults={data.length}\n currentPage={page}\n isPreviousButtonDisabled={page <= 1}\n isNextButtonDisabled={false} // TODO: Add logic for disabling next/load more button\n onClickPrevious={() => setPage(page - 1)}\n onClickNext={() => {\n if (paginationType === \"loadMore\") {\n setResultsPerPage(resultsPerPage + resultsPerPageProp);\n } else {\n setPage(page + 1);\n }\n }}\n />\n )}\n </Box>\n );\n};\n\nconst MemoizedDataTable = memo(DataTable);\nMemoizedDataTable.displayName = \"DataTable\";\n\nexport { MemoizedDataTable as DataTable };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAKEA,qBAAqB,EAIrBC,kBAAkB,QAIb,sBAAsB;AAC7B,SAGEC,IAAI,EACJC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,MAAM,EACNC,QAAQ,QACH,OAAO;AAAC,SAEbC,YAAY,EACZC,eAAe,EACfC,aAAa,EACbC,WAAW,EACXC,iBAAiB,EACjBC,QAAQ,EACRC,QAAQ,EACRC,QAAQ;AAAA,SAIRC,mBAAmB;AAAA,SAGAC,WAAW;AAAA,SAEvBC,GAAG;AAAA,SACHC,UAAU,EAAEC,QAAQ;AAAA,SACpBC,iBAAiB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE1B,OAAO,MAAMC,aAAa,GAAG,CAAC,aAAa,EAAE,UAAU,EAAE,SAAS,CAAU;AAuM5E,MAAMC,SAAS,GAAGC,IAAA,IAyBI;EAAA,IAzBH;IACjBC,OAAO;IACPC,IAAI,EAAEC,QAAQ;IACdC,QAAQ;IACRC,IAAI,EAAEC,QAAQ,GAAG,CAAC;IAClBC,cAAc,GAAGT,aAAa,CAAC,CAAC,CAAC;IACjCU,cAAc,EAAEC,kBAAkB,GAAG,EAAE;IACvCC,WAAW;IACXC,aAAa;IACbC,SAAS;IACTC,qBAAqB;IACrBC,eAAe;IACfC,cAAc,GAAG,OAAO;IACxBC,oBAAoB;IACpBC,gBAAgB;IAChBC,kBAAkB;IAClBC,oBAAoB;IACpBC,iBAAiB;IACjBC,mBAAmB;IACnBC,UAAU;IACVC,aAAa;IACbC,gBAAgB;IAChBC,eAAe;IACfC,SAAS;IACTC;EACc,CAAC,GAAA3B,IAAA;EACf,MAAM,CAAC4B,WAAW,EAAEC,cAAc,CAAC,GAAGpD,QAAQ,CAA8B,CAAC;EAC7E,MAAM,CAACqD,aAAa,EAAEC,gBAAgB,CAAC,GAAGtD,QAAQ,CAAU,IAAI,CAAC;EACjE,MAAM,CAACyB,IAAI,EAAE8B,OAAO,CAAC,GACnBvD,QAAQ,CAAwC0B,QAAQ,CAAC;EAC3D,MAAM,CAACE,IAAI,EAAE4B,OAAO,CAAC,GAAGxD,QAAQ,CAAS6B,QAAQ,CAAC;EAClD,MAAM,CAACE,cAAc,EAAE0B,iBAAiB,CAAC,GACvCzD,QAAQ,CAASgC,kBAAkB,CAAC;EACtC,MAAM,CAAC0B,YAAY,EAAEC,eAAe,CAAC,GAAG3D,QAAQ,CAAwB,CAAC,CAAC,CAAC;EAC3E,MAAM,CAAC4D,OAAO,EAAEC,UAAU,CAAC,GAAG7D,QAAQ,CAAmB,EAAE,CAAC;EAC5D,MAAM,CAAC8D,OAAO,EAAEC,UAAU,CAAC,GAAG/D,QAAQ,CAAmB8B,cAAc,CAAC;EAExE,MAAMkC,uBAAuB,GAAGlE,OAAO,CAAC,MAAM;IAC5C,OAAO0B,OAAO,CAACyC,MAAM,CAAC,CAACC,GAAG,EAAEC,MAAM,KAAK;MACrCD,GAAG,CAACC,MAAM,CAACC,WAAW,CAAW,GAAG,IAAI;MACxC,OAAOF,GAAG;IACZ,CAAC,EAAE,CAAC,CAAwB,CAAC;EAC/B,CAAC,EAAE,CAAC1C,OAAO,CAAC,CAAC;EAEb,MAAM,CAAC6C,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGtE,QAAQ,CACtDgE,uBACF,CAAC;EAED,MAAM,CAACO,YAAY,EAAEC,eAAe,CAAC,GAAGxE,QAAQ,CAAS,EAAE,CAAC;EAC5D,MAAM,CAACyE,OAAO,EAAEC,UAAU,CAAC,GAAG1E,QAAQ,CAAoB,CAAC;EAE3D,MAAM2E,WAAW,GAAG/E,WAAW,CAAC,YAAY;IAC1C0D,gBAAgB,CAAC,IAAI,CAAC;IACtB,IAAI;MACF,MAAMsB,OAAO,GAAG,MAAM3C,WAAW,CAAC;QAChCL,IAAI,EAAEA,IAAI;QACVG,cAAc,EAAEA,cAAc;QAC9B8C,IAAI,EAAEjB,OAAO;QACbkB,MAAM,EAAEP,YAAY;QACpBE,OAAO,EAAEA;MACX,CAAC,CAAC;MACFlB,OAAO,CAACqB,OAAO,CAAC;MAChBtB,gBAAgB,CAAC,KAAK,CAAC;IACzB,CAAC,CAAC,OAAOyB,KAAK,EAAE;MACdC,OAAO,CAACC,GAAG,CAACF,KAAK,CAAC;MAClBzB,gBAAgB,CAAC,KAAK,CAAC;IACzB;EACF,CAAC,EAAE,CAAC1B,IAAI,EAAEG,cAAc,EAAE6B,OAAO,EAAEW,YAAY,EAAEE,OAAO,EAAExC,WAAW,CAAC,CAAC;EAEvE,MAAMiD,mBAAmB,GAAGtF,WAAW,CACpCuF,OAAsC,IAAK;IAC1CtB,UAAU,CAAEuB,WAAW,IACrBD,OAAO,YAAYE,QAAQ,GAAGF,OAAO,CAACC,WAAW,CAAC,GAAGxB,OACvD,CAAC;EACH,CAAC,EACD,CAACA,OAAO,CACV,CAAC;EAED,MAAM0B,sBAAsB,GAAG1F,WAAW,CACvC2F,QAAgB,IAAK;IACpBjB,mBAAmB,CAAEkB,cAAc,KAAM;MACvC,GAAGA,cAAc;MACjB,CAACD,QAAQ,GAAG,CAAClB,gBAAgB,CAACkB,QAAQ;IACxC,CAAC,CAAC,CAAC;EACL,CAAC,EACD,CAAClB,gBAAgB,CACnB,CAAC;EAED,MAAMoB,YAAY,GAAG7F,WAAW,CAAE8F,KAAa,IAAK;IAClDlB,eAAe,CAACkB,KAAK,CAAC;EACxB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,aAAa,GAAG/F,WAAW,CAAEgG,cAAiC,IAAK;IACvElB,UAAU,CAACkB,cAAc,CAAC;EAC5B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,wBAAwB,GAAGjG,WAAW,CACzCuF,OAA2C,IAAK;IAC/CxB,eAAe,CAAEmC,gBAAgB,IAC/BX,OAAO,YAAYE,QAAQ,GAAGF,OAAO,CAACW,gBAAgB,CAAC,GAAGpC,YAC5D,CAAC;EACH,CAAC,EACD,CAACA,YAAY,CACf,CAAC;EAED,MAAMqC,gBAAgB,GAAGnG,WAAW,CAClCoG,KAAA,IAA8D;IAAA,IAA7D;MAAEC,KAAK;MAAEC;IAA8C,CAAC,GAAAF,KAAA;IACvD,IAAIE,QAAQ,GAAG,CAAC,EAAE;MAChB;IACF;IAEA,IAAI/D,SAAS,IAAI+D,QAAQ,GAAG/D,SAAS,EAAE;MACrC;IACF;IAEAD,aAAa,GAAG;MAAE+D,KAAK;MAAEC;IAAS,CAAC,CAAC;IACpCvB,WAAW,CAAC,CAAC;EACf,CAAC,EACD,CAACxC,SAAS,EAAED,aAAa,EAAEyC,WAAW,CACxC,CAAC;EAED9E,SAAS,CAAC,MAAM;IACdyD,gBAAgB,CAAC,KAAK,CAAC;EACzB,CAAC,EAAE,CAAC7B,IAAI,CAAC,CAAC;EAEV5B,SAAS,CAAC,MAAM;IACd8E,WAAW,CAAC,CAAC;EACf,CAAC,EAAE,CAACA,WAAW,EAAE/C,IAAI,EAAEG,cAAc,EAAE6B,OAAO,EAAEW,YAAY,EAAEE,OAAO,CAAC,CAAC;EAEvE5E,SAAS,CAAC,MAAM;IACd0C,oBAAoB,GAAGmB,YAAY,CAAC;EACtC,CAAC,EAAE,CAACA,YAAY,EAAEnB,oBAAoB,CAAC,CAAC;EAExC,MAAM4D,yBAAyB,GAC7BpG,MAAM,CAAuD,IAAI,CAAC;EAEpE,MAAMqG,KAAK,GAAG3G,qBAAqB,CAAC;IAClC+B,OAAO,EAAEA,OAAO;IAChBC,IAAI,EAAEA,IAAI;IACV4E,KAAK,EAAE;MACLvC,OAAO;MACPF,OAAO;MACPW,YAAY;MACZF,gBAAgB;MAChBX,YAAY;MACZL;IACF,CAAC;IACD8C,yBAAyB,EAAEA,yBAAyB;IACpDG,qBAAqB,EAAE;MAAEC,QAAQ,EAAE;IAAE,CAAC;IACtCC,uBAAuB,EACrBlE,cAAc,KAAK,UAAU,IAAIP,cAAc,GAAG,EAAE;IACtD0E,oBAAoB,EAAE9D,iBAAiB;IACvC+D,mBAAmB,EAAE,KAAK;IAC1BC,sBAAsB,EAAE,KAAK;IAC7BC,gBAAgB,EAAE,KAAK;IACvBC,kBAAkB,EAAE7D,eAAe;IACnC8D,aAAa,EAAE,KAAK;IACpBC,YAAY,EAAE,KAAK;IACnBC,iBAAiB,EAAEjE,gBAAgB;IACnCkE,iBAAiB,EAAElE,gBAAgB;IACnCmE,aAAa,EAAEhE,UAAU;IACzBiE,aAAa,EAAE,KAAK;IACpBC,mBAAmB,EAAE,KAAK;IAC1BC,UAAU,EAAE,cAAc;IAC1BC,uBAAuB,EAAE;MACvB,iBAAiB,EAAE;QACjBC,qBAAqB,EAAE;UACrBC,KAAK,EAAE,OAAO;UACdC,EAAE,EAAE;YACFC,QAAQ,EAAE,SAAS;YACnBC,KAAK,EAAE;UACT;QACF,CAAC;QACDC,qBAAqB,EAAE;UACrBJ,KAAK,EAAE,OAAO;UACdC,EAAE,EAAE;YACFE,KAAK,EAAE;UAET;QACF;MACF,CAAC;MACD,cAAc,EAAE;QACdE,MAAM,EAAE,EAAE;QACVN,qBAAqB,EAAE;UACrBE,EAAE,EAAE;YACFK,QAAQ,EAAE,CAAC;YACXH,KAAK,EAAE;UACT;QACF,CAAC;QACDC,qBAAqB,EAAE;UACrBH,EAAE,EAAE;YACFK,QAAQ,EAAE,CAAC;YACXH,KAAK,EAAE;UACT;QACF;MACF;IACF,CAAC;IACDI,kBAAkB,EAAE,KAAK;IACzBC,eAAe,EAAE,IAAI;IACrBC,aAAa,EAAE,IAAI;IACnBtG,QAAQ,EAAEA,QAAQ;IAClBuG,KAAK,EAAE;MACLC,iBAAiB,EAAEhI,aAAa;MAChCiI,cAAc,EAAE/H,iBAAiB;MACjCgI,WAAW,EAAEvH;IACf,CAAC;IACDwH,eAAe,EAAEpD,mBAAmB;IACpC3C,oBAAoB,EAAEsD,wBAAwB;IAC9C0C,gBAAgB,EACdxF,gBAAgB,KAAK,IAAI,IAAIP,gBAAgB,IAAIC,kBAAkB,GAC/D,IAAI,GACJ,KAAK;IACX+F,qBAAqB,EAAE,MAAM;IAE7BZ,qBAAqB,EAAEa,KAAA;MAAA,IAAC;QAAEtE;MAAO,CAAC,GAAAsE,KAAA;MAAA,OAAM;QACtCC,SAAS,EAAE9E,OAAO,CAAC+E,IAAI,CAAEC,IAAI,IAAKA,IAAI,CAACC,EAAE,KAAK1E,MAAM,CAAC0E,EAAE,CAAC,GACpD,UAAU,GACV;MACN,CAAC;IAAA,CAAC;IAEFC,oBAAoB,EAAEC,KAAA;MAAA,IAAC;QAAE3C,KAAK;QAAE4C;MAAI,CAAC,GAAAD,KAAA;MAAA,OAAM;QACzCL,SAAS,EACPvF,WAAW,EAAE0F,EAAE,KAAKG,GAAG,CAACH,EAAE,IAAIzC,KAAK,CAAC6C,QAAQ,CAAC,CAAC,CAACC,UAAU,EAAEL,EAAE,KAAKG,GAAG,CAACH,EAAE,GACpE,YAAY,GACZzC,KAAK,CAAC6C,QAAQ,CAAC,CAAC,CAACC,UAAU,EAAEL,EAAE,KAAKG,GAAG,CAACH,EAAE,IAC1C1F,WAAW,EAAE0F,EAAE,KAAKG,GAAG,CAACH,EAAE,GAC1B,cAAc,GACd1F,WAAW,EAAE0F,EAAE,KAAKG,GAAG,CAACH,EAAE,IAC1BzC,KAAK,CAAC6C,QAAQ,CAAC,CAAC,CAACC,UAAU,EAAEL,EAAE,KAAKG,GAAG,CAACH,EAAE,GAC1C,yBAAyB,GACzBM;MACR,CAAC;IAAA,CAAC;IAEFC,qBAAqB,EAAE;MACrBC,QAAQ,EAAE,CAAC,CAAC;MACZC,SAAS,EAAEA,CAAA,KAAM;QACf,MAAMC,IAAI,GAAGnD,KAAK,CAACoD,aAAa,CAAC,CAAC;QAClCD,IAAI,CAAC,CAAC,CAAC,CAACE,gBAAgB,CAAC,CAAC;QAE1B,MAAM;UAAEtG,WAAW;UAAE+F;QAAW,CAAC,GAAG9C,KAAK,CAAC6C,QAAQ,CAAC,CAAC;QACpD,IAAI9F,WAAW,EAAE;UACf4C,gBAAgB,CAAC;YACfE,KAAK,EAAE9C,WAAW,CAAC0F,EAAE;YACrB3C,QAAQ,EAAGgD,UAAU,CAAiBQ;UACxC,CAAC,CAAC;QACJ;QAEAtG,cAAc,CAAC,IAAI,CAAC;MACtB,CAAC;MAEDuG,aAAa,EAAEA,CAAA,KAAM;QACnB,IAAI,CAACxG,WAAW,IAAIiD,KAAK,CAAC6C,QAAQ,CAAC,CAAC,CAAC9F,WAAW,EAAE0F,EAAE,EAAE;UACpDzF,cAAc,CAACgD,KAAK,CAAC6C,QAAQ,CAAC,CAAC,CAAC9F,WAAW,CAAC;QAC9C;MACF;IACF,CAAC;IAEDyG,gBAAgB,EAAEC,KAAA,IAAa;MAAA,IAAZ;QAAEb;MAAI,CAAC,GAAAa,KAAA;MACxB,MAAMC,YAAY,GAAGd,GAAG,CAACU,KAAK,GAAG,CAAC9H,IAAI,GAAG,CAAC,IAAIG,cAAc;MAE5D,OACEX,KAAA,CAACT,GAAG;QAAC8G,EAAE,EAAE;UAAEsC,OAAO,EAAE;QAAO,CAAE;QAAAC,QAAA,GAC1BxH,gBAAgB,GAAGwG,GAAG,CAAC,EACvB,CAACvG,kBAAkB,IAAIM,gBAAgB,KACtC3B,KAAA,CAACR,UAAU;UACTqJ,OAAO,EAAEjJ,IAAA,CAACR,QAAQ,IAAE,CAAE;UACtB0J,IAAI,EAAC,OAAO;UACZC,aAAa,EAAC,UAAU;UACxBC,SAAS,EAAC,cAAc;UACxBC,aAAa,EAAC,OAAO;UAAAL,QAAA,GAEpBvH,kBAAkB,IACjBrB,KAAA,CAAAF,SAAA;YAAA8I,QAAA,GACGvH,kBAAkB,CAACuG,GAAG,CAAC,EACxBhI,IAAA,SAAK,CAAC;UAAA,CACN,CACH,EACDI,KAAA,CAACP,QAAQ;YACPyJ,UAAU,EAAER,YAAY,IAAI,CAAE;YAC9BS,OAAO,EAAEA,CAAA,KAAMxE,gBAAgB,CAAC;cAAEE,KAAK,EAAE+C,GAAG,CAACH,EAAE;cAAE3C,QAAQ,EAAE;YAAE,CAAC,CAAE;YAAA8D,QAAA,GAEhEhJ,IAAA,CAACf,YAAY,IAAE,CAAC,mBAClB;UAAA,CAAU,CAAC,EACXmB,KAAA,CAACP,QAAQ;YACPyJ,UAAU,EAAER,YAAY,IAAI,CAAE;YAC9BS,OAAO,EAAEA,CAAA,KACPxE,gBAAgB,CAAC;cACfE,KAAK,EAAE+C,GAAG,CAACH,EAAE;cACb3C,QAAQ,EAAE4D,YAAY,IAAI,CAAC,GAAG,CAAC,GAAGA,YAAY,GAAG;YACnD,CAAC,CACF;YAAAE,QAAA,GAEDhJ,IAAA,CAACZ,WAAW,IAAE,CAAC,kBACjB;UAAA,CAAU,CAAC,EACXgB,KAAA,CAACP,QAAQ;YACPyJ,UAAU,EAAEnI,SAAS,GAAG2H,YAAY,IAAI3H,SAAS,GAAG,CAAC,GAAG,KAAM;YAC9DoI,OAAO,EAAEA,CAAA,KACPxE,gBAAgB,CAAC;cACfE,KAAK,EAAE+C,GAAG,CAACH,EAAE;cACb3C,QAAQ,EAAE4D,YAAY,GAAG;YAC3B,CAAC,CACF;YAAAE,QAAA,GAEDhJ,IAAA,CAACb,aAAa,IAAE,CAAC,kBACnB;UAAA,CAAU,CAAC,EACXa,IAAA,CAAAE,SAAA;YAAA8I,QAAA,EACG7H,SAAS,IACRf,KAAA,CAACP,QAAQ;cACPyJ,UAAU,EAAER,YAAY,IAAI3H,SAAS,GAAG,CAAE;cAC1CoI,OAAO,EAAEA,CAAA,KACPxE,gBAAgB,CAAC;gBACfE,KAAK,EAAE+C,GAAG,CAACH,EAAE;gBACb3C,QAAQ,EAAE/D;cACZ,CAAC,CACF;cAAA6H,QAAA,GAEDhJ,IAAA,CAACd,eAAe,IAAE,CAAC,iBACrB;YAAA,CAAU;UACX,CACD,CAAC;QAAA,CACO,CACb;MAAA,CACE,CAAC;IAEV;EACF,CAAC,CAAC;EAEF,MAAMsK,aAAa,GAAG1K,OAAO,CAC3B,MACEsB,KAAA,CAAAF,SAAA;IAAA8I,QAAA,GACGtH,oBAAoB,IACnB1B,IAAA,CAACJ,UAAU;MACTqJ,OAAO,EAAEjJ,IAAA,CAACV,QAAQ,IAAE,CAAE;MACtB8J,SAAS,EAAC,eAAe;MACzBC,aAAa,EAAC,OAAO;MACrBI,mBAAmB,EAAE,KAAM;MAAAT,QAAA,EAE3BhJ,IAAA,CAAAE,SAAA;QAAA8I,QAAA,EACG3I,aAAa,CAACqJ,GAAG,CAAEhF,KAAuB,IACzC1E,IAAA,CAACH,QAAQ;UAEP8J,UAAU,EAAE7G,OAAO,KAAK4B,KAAM;UAC9B6E,OAAO,EAAEA,CAAA,KAAMxG,UAAU,CAAC2B,KAAK,CAAE;UAAAsE,QAAA,EAE/B,GAAEtE,KAAK,CAACkF,MAAM,CAAC,CAAC,CAAC,CAACC,WAAW,CAAC,CAAE,GAAEnF,KAAK,CAACoF,KAAK,CAAC,CAAC,CAAE;QAAC,GAJ/CpF,KAKG,CACX;MAAC,CACF;IAAC,CACO,CACb,EAEA9C,mBAAmB,IAClB5B,IAAA,CAACJ,UAAU;MACTqJ,OAAO,EAAEjJ,IAAA,CAACT,QAAQ,IAAE,CAAE;MACtB6J,SAAS,EAAC,mBAAmB;MAC7BC,aAAa,EAAC,OAAO;MACrBI,mBAAmB,EAAE,KAAM;MAAAT,QAAA,EAE3BhJ,IAAA,CAAAE,SAAA;QAAA8I,QAAA,EACGxI,OAAO,CACLuJ,MAAM,CAAE5G,MAAM,IAAKA,MAAM,CAAC4C,YAAY,KAAK,KAAK,CAAC,CACjD2D,GAAG,CAAEvG,MAAM,IACV/C,KAAA,CAACP,QAAQ;UAEP0J,OAAO,EAAEA,CAAA,KACPjF,sBAAsB,CAACnB,MAAM,CAACC,WAAqB,CACpD;UAAA4F,QAAA,GAEDhJ,IAAA,CAAAgK,SAAA;YACEC,OAAO,EACL5G,gBAAgB,CAACF,MAAM,CAACC,WAAW,CAAW,KAAK;UACpD,CACF,CAAC,EACDD,MAAM,CAAC0D,MAAM;QAAA,GAVT1D,MAAM,CAACC,WAWJ,CACX;MAAC,CACJ;IAAC,CACO,CACb;EAAA,CACD,CACH,EACD,CACEC,gBAAgB,EAChB7C,OAAO,EACPsC,OAAO,EACPpB,oBAAoB,EACpB4C,sBAAsB,EACtB1C,mBAAmB,CAEvB,CAAC;EAED,OACExB,KAAA,CAACT,GAAG;IAAC8G,EAAE,EAAE;MAAEsC,OAAO,EAAE,MAAM;MAAEmB,aAAa,EAAE,QAAQ;MAAEC,GAAG,EAAE;IAAE,CAAE;IAAAnB,QAAA,GAC5DhJ,IAAA,CAACN,WAAW;MACV0K,cAAc,EAAEnI,SAAS,GAAGwC,YAAY,GAAG0D,SAAU;MACrDkC,eAAe,EAAE1F,aAAc;MAC/BvD,qBAAqB,EAAEA,qBAAsB;MAC7CC,eAAe,EAAEA,eAAgB;MACjCiJ,iBAAiB,EAAEd,aAAc;MACjC/F,OAAO,EACL5B,UAAU,GACNrB,OAAO,CACJuJ,MAAM,CAAE5G,MAAM,IAAKA,MAAM,CAACoH,kBAAkB,KAAK,KAAK,CAAC,CACvDb,GAAG,CAAEvG,MAAM,IAAK;QACf,OAAO;UACL0E,EAAE,EAAE1E,MAAM,CAACC,WAAqB;UAChCoH,KAAK,EAAErH,MAAM,CAAC0D,MAAM;UACpB4D,OAAO,EAAEtH,MAAM,CAACuH,aAAa,IAAI,MAAM;UACvCC,OAAO,EAAExH,MAAM,CAACyH;QAClB,CAAC;MACH,CAAC,CAAC,GACJzC;IACL,CACF,CAAC,EAEFnI,IAAA,CAACtB,kBAAkB;MAAC0G,KAAK,EAAEA;IAAM,CAAE,CAAC,EAEnCtD,aAAa,IACZ9B,IAAA,CAACP,mBAAmB;MAClB6B,cAAc,EAAEA,cAAe;MAC/BuJ,sBAAsB,EAAEpK,IAAI,CAACqK,MAAO;MACpCC,WAAW,EAAEnK,IAAK;MAClBoK,wBAAwB,EAAEpK,IAAI,IAAI,CAAE;MACpCqK,oBAAoB,EAAE,KAAM;MAC5BC,eAAe,EAAEA,CAAA,KAAM1I,OAAO,CAAC5B,IAAI,GAAG,CAAC,CAAE;MACzCuK,WAAW,EAAEA,CAAA,KAAM;QACjB,IAAI7J,cAAc,KAAK,UAAU,EAAE;UACjCmB,iBAAiB,CAAC1B,cAAc,GAAGC,kBAAkB,CAAC;QACxD,CAAC,MAAM;UACLwB,OAAO,CAAC5B,IAAI,GAAG,CAAC,CAAC;QACnB;MACF;IAAE,CACH,CACF;EAAA,CACE,CAAC;AAEV,CAAC;AAED,MAAMwK,iBAAiB,GAAGzM,IAAI,CAAC2B,SAAS,CAAC;AACzC8K,iBAAiB,CAACC,WAAW,GAAG,WAAW;AAE3C,SAASD,iBAAiB,IAAI9K,SAAS"}
1	+ {"version":3,"file":"DataTable.js","names":["useMaterialReactTable","MRT_TableContainer","memo","useCallback","useEffect","useMemo","useRef","useState","ArrowTopIcon","ArrowBottomIcon","ArrowDownIcon","ArrowUpIcon","DragIndicatorIcon","ListIcon","ShowIcon","MoreIcon","useOdysseyDesignTokens","DataTablePagination","DataFilters","Box","MenuButton","MenuItem","ArrowUnsortedIcon","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","densityValues","reorderDataRowsLocally","_ref","currentData","rowId","newIndex","updatedData","rowIndex","findIndex","row","id","removedRow","splice","DataTable","_ref2","columns","data","dataProp","getRowId","page","pageProp","initialDensity","resultsPerPage","resultsPerPageProp","fetchDataFn","reorderDataFn","totalRows","hasSearchSubmitButton","searchDelayTime","paginationType","onRowSelectionChange","rowActionButtons","rowActionMenuItems","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSorting","odysseyDesignTokens","draggingRow","setDraggingRow","showSkeletons","setShowSkeletons","setData","setPage","setResultsPerPage","rowSelection","setRowSelection","sorting","setSorting","density","setDensity","initialColumnVisibility","reduce","acc","column","accessorKey","columnVisibility","setColumnVisibility","globalFilter","setGlobalFilter","filters","setFilters","refreshData","newData","sort","search","error","handleSortingChange","updater","prevSorting","Function","handleColumnVisibility","columnId","prevVisibility","handleSearch","value","handleFilters","updatedFilters","handleRowSelectionChange","prevRowSelection","updateRowOrder","_ref3","rowVirtualizerInstanceRef","getRowFromTableAndSetHovered","table","nextRow","getRow","setHoveredRow","resetDraggingAndHoveredRow","handleDragHandleKeyDown","_ref4","event","hoveredRow","getState","key","isSpaceKey","isEnterKey","isEscapeKey","isArrowDown","isArrowUp","isSpaceOrEnter","zeroIndexedPageNumber","currentIndex","index","preventDefault","stopPropagation","pageRelativeIndex","setTimeout","TransitionDurationMainAsNumber","nextIndex","handleDragHandleOnDragEnd","cols","getAllColumns","toggleVisibility","handleDragHandleOnDragCapture","state","rowVirtualizerOptions","overscan","enableRowVirtualization","enableColumnResizing","enableDensityToggle","enableFullScreenToggle","enablePagination","enableRowSelection","enableFilters","enableHiding","enableRowOrdering","enableRowDragging","enableSorting","selectAllMode","enableColumnActions","layoutMode","displayColumnDefOptions","muiTableBodyCellProps","align","sx","overflow","width","muiTableHeadCellProps","header","minWidth","enableGlobalFilter","manualFiltering","manualSorting","icons","ArrowDownwardIcon","DragHandleIcon","SyncAltIcon","onSortingChange","enableRowActions","positionActionsColumn","_ref5","className","find","item","muiTableBodyRowProps","_ref6","undefined","muiRowDragHandleProps","_ref7","title","onKeyDown","onBlur","onDragEnd","onDragCapture","padding","Spacing1","borderRadius","BorderRadiusMain","boxShadow","HueNeutralWhite","PalettePrimaryMain","outline","outlineOffset","renderRowActions","_ref8","display","children","endIcon","size","buttonVariant","ariaLabel","menuAlignment","isDisabled","onClick","tableSettings","shouldCloseOnSelect","map","isSelected","charAt","toUpperCase","slice","filter","_Checkbox","checked","flexDirection","gap","onChangeSearch","onChangeFilters","additionalActions","enableColumnFilter","label","variant","filterVariant","options","filterSelectOptions","currentNumberOfResults","length","currentPage","isPreviousButtonDisabled","isNextButtonDisabled","onClickPrevious","onClickNext","MemoizedDataTable","displayName"],"sources":["../../src/labs/DataTable.tsx"],"sourcesContent":["/!\n Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n /\n\nimport {\n MRT_Updater,\n MRT_Virtualizer,\n MRT_RowData,\n MRT_TableOptions,\n useMaterialReactTable,\n MRT_SortingState,\n MRT_DensityState,\n MRT_VisibilityState,\n MRT_TableContainer,\n MRT_RowSelectionState,\n MRT_Row,\n MRT_ColumnDef,\n MRT_TableInstance,\n} from \"material-react-table\";\nimport {\n Fragment,\n ReactElement,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n KeyboardEvent,\n} from \"react\";\nimport {\n ArrowTopIcon,\n ArrowBottomIcon,\n ArrowDownIcon,\n ArrowUpIcon,\n DragIndicatorIcon,\n ListIcon,\n ShowIcon,\n MoreIcon,\n} from \"../icons.generated\";\nimport { Checkbox as MuiCheckbox } from \"@mui/material\";\nimport { useOdysseyDesignTokens } from \"../OdysseyDesignTokensContext\";\nimport {\n DataTablePagination,\n paginationTypeValues,\n} from \"./DataTablePagination\";\nimport { DataFilter, DataFilters } from \"./DataFilters\";\nimport { Button } from \"../Button\";\nimport { Box } from \"../Box\";\nimport { MenuButton, MenuItem } from \"..\";\nimport { ArrowUnsortedIcon } from \"../icons.generated\";\n\nexport const densityValues = [\"comfortable\", \"spacious\", \"compact\"] as const;\n\nexport type {\n MRT_ColumnFiltersState,\n MRT_SortingState,\n MRT_ColumnDef as TableColumn,\n} from \"material-react-table\";\n\n// The shape of the table columns,\n// with props named to match their MRT_ColumnDef counterparts\nexport type DataColumn = {\n /\n The unique ID of the column\n /\n accessorKey: string;\n /\n The human-friendly title of the column\n /\n header: string;\n /\n Customize the way each cell in the column is\n * displayed via a custom React component.\n /\n Cell?: MRT_ColumnDef<MRT_RowData>[\"Cell\"];\n /\n The UI control that will be used to filter the column.\n * Defaults to a standard text input.\n /\n filterVariant?: MRT_ColumnDef<MRT_RowData>[\"filterVariant\"];\n /\n If the filter control has preset options (such as a select or multi-select),\n * these are the options provided.\n /\n filterSelectOptions?: Array<{ label: string; value: string }>;\n /\n The optional column width, in pixels\n /\n size?: number;\n /\n The minimum column width, in pixels\n /\n minSize?: number;\n /\n The maximum column width, in pixels\n /\n maxSize?: number;\n /\n If set to false, the column won't be filterable\n /\n enableColumnFilter?: boolean;\n /\n If set to false, the column won't be searchable\n /\n enableGlobalFilter?: boolean;\n /\n If set to false, the column won't be sortable\n /\n enableSorting?: boolean;\n /\n If set to false, the column won't be resizable\n /\n enableResizing?: boolean;\n /\n If set to false, the column won't be hideable\n /\n enableHiding?: boolean;\n};\n\nexport type DataTableProps = {\n /\n The columns that make up the table\n /\n columns: DataColumn[];\n /\n The data that goes into the table, which will be displayed\n * as the table rows\n /\n data: MRT_TableOptions<MRT_RowData>[\"data\"];\n /\n The total number of rows in the table. Optional, because it's sometimes impossible\n * to calculate. Used in table pagination to know when to disable the \"next\"/\"more\" button.\n /\n totalRows?: number;\n /\n The function to get the ID of a row\n /\n getRowId?: MRT_TableOptions<MRT_RowData>[\"getRowId\"];\n /\n The initial density of the table. This is available even if the table density\n * isn't changeable.\n /\n initialDensity?: (typeof densityValues)[number];\n /\n If true, the end user will be able to change the table density.\n /\n hasChangeableDensity?: boolean;\n /\n If true, the end user can resize individual columns.\n /\n hasColumnResizing?: boolean;\n /\n If true, the end user will be able to show/hide columns.\n /\n hasColumnVisibility?: boolean;\n /\n If true, the end user will be able to filter columns.\n /\n hasFilters?: boolean;\n /\n If true, the table will include pagination controls.\n /\n hasPagination?: boolean;\n /\n If true, the table will include checkboxes on each row, enabling\n * the user to select some or all rows.\n /\n hasRowSelection?: boolean;\n /\n If true, the global table search controls will be shown.\n /\n hasSearch?: boolean;\n /\n If true, the end user can sort columns (ascending, descending, or neither)\n /\n hasSorting?: boolean;\n /\n If true, the end user can reorder rows via a drag-and-drop interface\n /\n hasRowReordering?: boolean;\n /\n If true, the search field will include a Search button, rather than\n * firing on input change.\n /\n hasSearchSubmitButton?: boolean;\n /\n The debounce time, in milliseconds, for the search input firing\n * `onChangeSearch` when changed. If `hasSearchSubmitButton` is true,\n * this doesn't do anything.\n /\n searchDelayTime?: number;\n /\n Callback that fires when a row (or rows) is selected or unselected.\n /\n onRowSelectionChange?: (rowSelection: MRT_RowSelectionState) => void;\n /\n Callback that fires whenever the table needs to fetch new data, due to changes in\n * page, results per page, search input, filters, or sorting\n /\n fetchDataFn: ({\n page,\n resultsPerPage,\n search,\n filters,\n sort,\n }: {\n page?: number;\n resultsPerPage?: number;\n search?: string;\n filters?: DataFilter[];\n sort?: MRT_SortingState;\n }) => MRT_TableOptions<MRT_RowData>[\"data\"];\n /\n Callback that fires when the user reorders rows within the table. Can be used\n * to propogate order change to the backend.\n /\n reorderDataFn?: ({\n rowId,\n newIndex,\n }: {\n rowId: string;\n newIndex: number;\n }) => void;\n /\n The current page number.\n /\n page?: number;\n /\n The number of results per page.\n /\n resultsPerPage?: number;\n /\n The type of pagination controls shown. Defaults to next/prev buttons, but can be\n * set to a simple \"Load more\" button by setting to \"loadMore\".\n /\n paginationType?: (typeof paginationTypeValues)[number];\n /\n Action buttons to display in each row\n /\n rowActionButtons?: (\n row: MRT_RowData\n ) => ReactElement<typeof Button \| typeof Fragment>;\n /\n Menu items to include in the optional actions menu on each row.\n /\n rowActionMenuItems?: (\n row: MRT_RowData\n ) => ReactElement<typeof MenuItem \| typeof Fragment>;\n};\n\ntype TableType = MRT_TableInstance<MRT_RowData>;\n\nconst reorderDataRowsLocally = ({\n currentData,\n rowId,\n newIndex,\n}: {\n currentData: MRT_TableOptions<MRT_RowData>[\"data\"];\n rowId: string;\n newIndex: number;\n}) => {\n const updatedData = [...currentData];\n\n const rowIndex = updatedData.findIndex((row) => row.id === rowId);\n\n if (rowIndex !== -1) {\n // Remove the row from its current position\n const [removedRow] = updatedData.splice(rowIndex, 1);\n\n // Insert the row at the new index\n updatedData.splice(newIndex, 0, removedRow);\n }\n\n return updatedData;\n};\n\nconst DataTable = ({\n columns,\n data: dataProp,\n getRowId,\n page: pageProp = 1,\n initialDensity = densityValues[0],\n resultsPerPage: resultsPerPageProp = 20,\n fetchDataFn,\n reorderDataFn,\n totalRows,\n hasSearchSubmitButton,\n searchDelayTime,\n paginationType = \"paged\",\n onRowSelectionChange,\n rowActionButtons,\n rowActionMenuItems,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSorting,\n}: DataTableProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const [draggingRow, setDraggingRow] = useState<MRT_Row<MRT_RowData> \| null>();\n const [showSkeletons, setShowSkeletons] = useState<boolean>(true);\n const [data, setData] =\n useState<MRT_TableOptions<MRT_RowData>[\"data\"]>(dataProp);\n const [page, setPage] = useState<number>(pageProp);\n const [resultsPerPage, setResultsPerPage] =\n useState<number>(resultsPerPageProp);\n const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});\n const [sorting, setSorting] = useState<MRT_SortingState>([]);\n const [density, setDensity] = useState<MRT_DensityState>(initialDensity);\n\n const initialColumnVisibility = useMemo(() => {\n return columns.reduce((acc, column) => {\n acc[column.accessorKey as string] = true;\n return acc;\n }, {} as MRT_VisibilityState);\n }, [columns]);\n\n const [columnVisibility, setColumnVisibility] = useState<MRT_VisibilityState>(\n initialColumnVisibility\n );\n\n const [globalFilter, setGlobalFilter] = useState<string>(\"\");\n const [filters, setFilters] = useState<Array<DataFilter>>();\n\n useEffect(() => {\n setShowSkeletons(false);\n }, [data]);\n\n useEffect(() => {\n onRowSelectionChange?.(rowSelection);\n }, [rowSelection, onRowSelectionChange]);\n\n const refreshData = useCallback(async () => {\n setShowSkeletons(true);\n try {\n const newData = await fetchDataFn({\n page: page,\n resultsPerPage: resultsPerPage,\n sort: sorting,\n search: globalFilter,\n filters: filters,\n });\n setData(newData);\n setShowSkeletons(false);\n } catch (error) {\n setShowSkeletons(false);\n }\n }, [page, resultsPerPage, sorting, globalFilter, filters, fetchDataFn]);\n\n useEffect(() => {\n refreshData();\n }, [refreshData, page, resultsPerPage, sorting, globalFilter, filters]);\n\n const handleSortingChange = useCallback(\n (updater: MRT_Updater<MRT_SortingState>) => {\n setSorting((prevSorting) =>\n updater instanceof Function ? updater(prevSorting) : sorting\n );\n },\n [sorting]\n );\n\n const handleColumnVisibility = useCallback(\n (columnId: string) => {\n setColumnVisibility((prevVisibility) => ({\n ...prevVisibility,\n [columnId]: !columnVisibility[columnId],\n }));\n },\n [columnVisibility]\n );\n\n const handleSearch = useCallback((value: string) => {\n setGlobalFilter(value);\n }, []);\n\n const handleFilters = useCallback((updatedFilters: Array<DataFilter>) => {\n setFilters(updatedFilters);\n }, []);\n\n const handleRowSelectionChange = useCallback(\n (updater: MRT_Updater<MRT_RowSelectionState>) => {\n setRowSelection((prevRowSelection) =>\n updater instanceof Function ? updater(prevRowSelection) : rowSelection\n );\n },\n [rowSelection]\n );\n\n const updateRowOrder = useCallback(\n ({ rowId, newIndex }: { rowId: string; newIndex: number }) => {\n if (newIndex < 0) {\n return;\n }\n\n if (totalRows && newIndex > totalRows) {\n return;\n }\n\n const newData = reorderDataRowsLocally({\n currentData: data,\n rowId,\n newIndex,\n });\n\n setData(newData);\n reorderDataFn?.({ rowId, newIndex });\n refreshData();\n },\n [data, totalRows, reorderDataFn, refreshData]\n );\n\n const rowVirtualizerInstanceRef =\n useRef<MRT_Virtualizer<HTMLDivElement, HTMLTableRowElement>>(null);\n\n const getRowFromTableAndSetHovered = (\n table: TableType,\n id: MRT_RowData[\"id\"]\n ) => {\n if (id) {\n const nextRow: MRT_RowData = table.getRow(id);\n\n if (nextRow) {\n table.setHoveredRow(nextRow);\n }\n }\n };\n\n const resetDraggingAndHoveredRow = (table: TableType) => {\n setDraggingRow(null);\n table.setHoveredRow(null);\n };\n\n type HandleDragHandleKeyDownArgs = {\n table: TableType;\n row: MRT_Row<MRT_RowData>;\n event: KeyboardEvent<HTMLButtonElement>;\n };\n\n const handleDragHandleKeyDown = useCallback(\n ({ table, row, event }: HandleDragHandleKeyDownArgs) => {\n const { hoveredRow } = table.getState();\n\n const { key } = event;\n\n const isSpaceKey = key === \" \";\n const isEnterKey = key === \"Enter\";\n const isEscapeKey = key === \"Escape\";\n const isArrowDown = key === \"ArrowDown\";\n const isArrowUp = key === \"ArrowUp\";\n const isSpaceOrEnter = isSpaceKey \|\| isEnterKey;\n const zeroIndexedPageNumber = page - 1;\n const currentIndex = row.index + zeroIndexedPageNumber resultsPerPage;\n\n if (isEscapeKey) {\n resetDraggingAndHoveredRow(table);\n return;\n }\n\n if (isSpaceOrEnter) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n if (draggingRow) {\n if (typeof hoveredRow?.index === \"number\") {\n const { index } = hoveredRow;\n\n if (isSpaceOrEnter) {\n const pageRelativeIndex =\n index + zeroIndexedPageNumber * resultsPerPage;\n\n if (pageRelativeIndex !== currentIndex) {\n updateRowOrder({\n rowId: row.id,\n newIndex: pageRelativeIndex,\n });\n\n // Can't transition CSS hover effect. Use timeout to delay hovered row effect removal\n setTimeout(() => {\n resetDraggingAndHoveredRow(table);\n }, odysseyDesignTokens.TransitionDurationMainAsNumber);\n return;\n }\n }\n\n if (isArrowDown \|\| isArrowUp) {\n const nextIndex = isArrowDown ? index + 1 : index - 1;\n getRowFromTableAndSetHovered(table, data[nextIndex]?.id);\n }\n } else {\n if (isArrowDown \|\| isArrowUp) {\n const nextIndex = isArrowDown ? row.index + 1 : row.index - 1;\n getRowFromTableAndSetHovered(table, data[nextIndex]?.id);\n }\n }\n } else {\n if (isSpaceOrEnter) {\n setDraggingRow(row);\n }\n }\n },\n [\n data,\n draggingRow,\n odysseyDesignTokens,\n page,\n resultsPerPage,\n updateRowOrder,\n ]\n );\n\n const handleDragHandleOnDragEnd = useCallback(\n (table: TableType) => {\n const cols = table.getAllColumns();\n cols[0].toggleVisibility();\n\n const { draggingRow, hoveredRow } = table.getState();\n if (draggingRow) {\n updateRowOrder({\n rowId: draggingRow.id,\n newIndex: (hoveredRow as MRT_RowData).index,\n });\n }\n\n setDraggingRow(null);\n },\n [updateRowOrder]\n );\n\n const handleDragHandleOnDragCapture = useCallback(\n (table: TableType) => {\n if (!draggingRow && table.getState().draggingRow?.id) {\n setDraggingRow(table.getState().draggingRow);\n }\n },\n [draggingRow]\n );\n\n const table = useMaterialReactTable({\n columns: columns,\n data: data,\n state: {\n density,\n sorting,\n globalFilter,\n columnVisibility,\n rowSelection,\n showSkeletons,\n },\n rowVirtualizerInstanceRef: rowVirtualizerInstanceRef,\n rowVirtualizerOptions: { overscan: 4 },\n enableRowVirtualization:\n paginationType === \"loadMore\" \|\| resultsPerPage > 50,\n enableColumnResizing: hasColumnResizing,\n enableDensityToggle: false,\n enableFullScreenToggle: false,\n enablePagination: false,\n enableRowSelection: hasRowSelection,\n enableFilters: false,\n enableHiding: false,\n enableRowOrdering: hasRowReordering,\n enableRowDragging: hasRowReordering,\n enableSorting: hasSorting,\n selectAllMode: \"all\",\n enableColumnActions: false,\n layoutMode: \"grid-no-grow\",\n displayColumnDefOptions: {\n \"mrt-row-actions\": {\n muiTableBodyCellProps: {\n align: \"right\",\n sx: {\n overflow: \"visible\",\n width: \"unset\",\n },\n },\n muiTableHeadCellProps: {\n align: \"right\",\n sx: {\n width: \"unset\",\n // TODO: Make the right padding here 16px (and possibly adapt it to the density padding)\n },\n },\n },\n \"mrt-row-drag\": {\n header: \"\",\n muiTableBodyCellProps: {\n sx: {\n minWidth: 0,\n width: \"auto\",\n },\n },\n muiTableHeadCellProps: {\n sx: {\n minWidth: 0,\n width: \"auto\",\n },\n },\n },\n },\n enableGlobalFilter: false,\n manualFiltering: true,\n manualSorting: true,\n getRowId: getRowId,\n icons: {\n ArrowDownwardIcon: ArrowDownIcon,\n DragHandleIcon: DragIndicatorIcon,\n SyncAltIcon: ArrowUnsortedIcon,\n },\n onSortingChange: handleSortingChange,\n onRowSelectionChange: handleRowSelectionChange,\n enableRowActions:\n hasRowReordering === true \|\| rowActionButtons \|\| rowActionMenuItems\n ? true\n : false,\n positionActionsColumn: \"last\",\n\n muiTableHeadCellProps: ({ column }) => ({\n className: sorting.find((item) => item.id === column.id)\n ? \"isSorted\"\n : \"isUnsorted\",\n }),\n\n muiTableBodyRowProps: ({ table, row }) => ({\n className:\n draggingRow?.id === row.id && table.getState().hoveredRow?.id !== row.id\n ? \"isDragging\"\n : table.getState().hoveredRow?.id === row.id &&\n draggingRow?.id !== row.id\n ? \"isDragTarget\"\n : draggingRow?.id === row.id &&\n table.getState().hoveredRow?.id === row.id\n ? \"isDragging isDragTarget\"\n : undefined,\n }),\n\n muiRowDragHandleProps: ({ table, row }) => ({\n title: \"Drag row or press space/enter key to start and stop reordering\",\n \"aria-label\":\n \"Drag row to reorder. Or, press space or enter to start and stop reordering and esc to cancel.\",\n onKeyDown: (event) => handleDragHandleKeyDown({ table, row, event }),\n onBlur: () => {\n resetDraggingAndHoveredRow(table);\n },\n onDragEnd: () => handleDragHandleOnDragEnd(table),\n onDragCapture: () => handleDragHandleOnDragCapture(table),\n sx: {\n padding: odysseyDesignTokens.Spacing1,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n\n \"&:focus-visible\": {\n boxShadow: `0 0 0 2px ${odysseyDesignTokens.HueNeutralWhite}, 0 0 0 4px ${odysseyDesignTokens.PalettePrimaryMain}`,\n outline: \"2px solid transparent\",\n outlineOffset: \"1px\",\n },\n },\n }),\n\n renderRowActions: ({ row }) => {\n const currentIndex = row.index + (page - 1) * resultsPerPage;\n\n return (\n <Box sx={{ display: \"flex\" }}>\n {rowActionButtons?.(row)}\n {(rowActionMenuItems \|\| hasRowReordering) && (\n <MenuButton\n endIcon={<MoreIcon />}\n size=\"small\"\n buttonVariant=\"floating\"\n ariaLabel=\"More actions\"\n menuAlignment=\"right\"\n >\n {rowActionMenuItems && (\n <>\n {rowActionMenuItems(row)}\n <hr />\n </>\n )}\n <MenuItem\n isDisabled={currentIndex <= 0}\n onClick={() => updateRowOrder({ rowId: row.id, newIndex: 0 })}\n >\n <ArrowTopIcon /> Bring to front\n </MenuItem>\n <MenuItem\n isDisabled={currentIndex <= 0}\n onClick={() =>\n updateRowOrder({\n rowId: row.id,\n newIndex: currentIndex <= 0 ? 0 : currentIndex - 1,\n })\n }\n >\n <ArrowUpIcon /> Bring forward\n </MenuItem>\n <MenuItem\n isDisabled={totalRows ? currentIndex >= totalRows - 1 : false}\n onClick={() =>\n updateRowOrder({\n rowId: row.id,\n newIndex: currentIndex + 1,\n })\n }\n >\n <ArrowDownIcon /> Send backward\n </MenuItem>\n <>\n {totalRows && (\n <MenuItem\n isDisabled={currentIndex >= totalRows - 1}\n onClick={() =>\n updateRowOrder({\n rowId: row.id,\n newIndex: totalRows,\n })\n }\n >\n <ArrowBottomIcon /> Send to back\n </MenuItem>\n )}\n </>\n </MenuButton>\n )}\n </Box>\n );\n },\n });\n\n const tableSettings = useMemo(\n () => (\n <>\n {hasChangeableDensity && (\n <MenuButton\n endIcon={<ListIcon />}\n ariaLabel=\"Table density\"\n menuAlignment=\"right\"\n shouldCloseOnSelect={false}\n >\n <>\n {densityValues.map((value: MRT_DensityState) => (\n <MenuItem\n key={value}\n isSelected={density === value}\n onClick={() => setDensity(value)}\n >\n {`${value.charAt(0).toUpperCase()}${value.slice(1)}`}\n </MenuItem>\n ))}\n </>\n </MenuButton>\n )}\n\n {hasColumnVisibility && (\n <MenuButton\n endIcon={<ShowIcon />}\n ariaLabel=\"Show/hide columns\"\n menuAlignment=\"right\"\n shouldCloseOnSelect={false}\n >\n <>\n {columns\n .filter((column) => column.enableHiding !== false)\n .map((column) => (\n <MenuItem\n key={column.accessorKey}\n onClick={() =>\n handleColumnVisibility(column.accessorKey as string)\n }\n >\n <MuiCheckbox\n checked={\n columnVisibility[column.accessorKey as string] !== false\n }\n />\n {column.header}\n </MenuItem>\n ))}\n </>\n </MenuButton>\n )}\n </>\n ),\n [\n columnVisibility,\n columns,\n density,\n hasChangeableDensity,\n handleColumnVisibility,\n hasColumnVisibility,\n ]\n );\n\n return (\n <Box sx={{ display: \"flex\", flexDirection: \"column\", gap: 4 }}>\n <DataFilters\n onChangeSearch={hasSearch ? handleSearch : undefined}\n onChangeFilters={handleFilters}\n hasSearchSubmitButton={hasSearchSubmitButton}\n searchDelayTime={searchDelayTime}\n additionalActions={tableSettings}\n filters={\n hasFilters\n ? columns\n .filter((column) => column.enableColumnFilter !== false)\n .map((column) => {\n return {\n id: column.accessorKey as string,\n label: column.header,\n variant: column.filterVariant ?? \"text\",\n options: column.filterSelectOptions,\n };\n })\n : undefined\n }\n />\n\n <MRT_TableContainer table={table} />\n\n {hasPagination && (\n <DataTablePagination\n paginationType={paginationType}\n currentNumberOfResults={data.length}\n currentPage={page}\n isPreviousButtonDisabled={page <= 1}\n isNextButtonDisabled={false} // TODO: Add logic for disabling next/load more button\n onClickPrevious={() => setPage(page - 1)}\n onClickNext={() => {\n if (paginationType === \"loadMore\") {\n setResultsPerPage(resultsPerPage + resultsPerPageProp);\n } else {\n setPage(page + 1);\n }\n }}\n />\n )}\n </Box>\n );\n};\n\nconst MemoizedDataTable = memo(DataTable);\nMemoizedDataTable.displayName = \"DataTable\";\n\nexport { MemoizedDataTable as DataTable };\n"],"mappings":"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"}

package/dist/labs/Switch.js CHANGED Viewed

@@ -13,9 +13,6 @@ import _Switch from "@mui/material/Switch";
  */
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
-const {
-  CONTROLLED
-} = ComponentControlledState;
 import { useOdysseyDesignTokens } from "../OdysseyDesignTokensContext.js";
 import { Box } from "../Box.js";
 import { FieldHint } from "../FieldHint.js";
@@ -24,6 +21,9 @@ import { ComponentControlledState, getControlState } from "../inputUtils.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
+const {
+  CONTROLLED
+} = ComponentControlledState;
 const SwitchLabel = _ref => {
   let {
     checked,

package/dist/labs/Switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","CONTROLLED","ComponentControlledState","useOdysseyDesignTokens","Box","FieldHint","useUniqueId","getControlState","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","SwitchLabel","_ref","checked","hint","hintId","isFullWidth","label","odysseyDesignTokens","children","sx","display","alignItems","flexWrap","gap","Spacing1","margin","maxWidth","TypographyLineLengthMax","fontWeight","TypographyWeightBodyBold","padding","backgroundColor","PaletteSuccessLighter","HueNeutral100","borderRadius","BorderRadiusMain","color","PaletteSuccessText","HueNeutral700","fontSize","TypographyScale0","lineHeight","TypographyLineHeightOverline","transitionProperty","transitionDuration","TransitionDurationMain","id","text","Switch","_ref2","_id","isChecked","isDefaultChecked","isDisabled","name","_name","onChange","testId","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","current","defaultChecked","internalSwitchChecked","setInternalSwitchChecked","Boolean","undefined","labelElementId","handleOnChange","_","renderSwitchComponent","_Switch","disabled","disableRipple","inputProps","marginBlockEnd","Spacing2","_FormControlLabel","control","labelPlacement","justifyContent","Spacing4","width","MemoizedSwitch","displayName"],"sources":["../../src/labs/Switch.tsx"],"sourcesContent":["/!\n Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n /\n\nimport {\n memo,\n SyntheticEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport {\n Switch as MuiSwitch,\n SwitchProps as MuiSwitchProps,\n FormControlLabel,\n} from \"@mui/material\";\n\nconst { CONTROLLED } = ComponentControlledState;\nimport { useOdysseyDesignTokens } from \"../OdysseyDesignTokensContext\";\nimport { Box } from \"../Box\";\nimport { FieldComponentProps } from \"../FieldComponentProps\";\nimport { FieldHint } from \"../FieldHint\";\nimport type { AllowedProps } from \"../AllowedProps\";\nimport { useUniqueId } from \"../useUniqueId\";\nimport { ComponentControlledState, getControlState } from \"../inputUtils\";\nimport { CheckedFieldProps } from \"../FormCheckedProps\";\n\ntype OnChangeCallbackArguments = {\n checked: boolean;\n value: string;\n};\n\nexport type SwitchProps = {\n /\n if `true`, the label and switch span entire containing element's width\n /\n isFullWidth?: boolean;\n /\n The label text for the Switch\n /\n label: string;\n /\n The change event handler for the Switch\n /\n onChange?: ({ checked, value }: OnChangeCallbackArguments) => void;\n /\n The value attribute of the Switch\n */\n value: string;\n} & Pick<\n FieldComponentProps,\n \"hint\" \| \"id\" \| \"isFullWidth\" \| \"isDisabled\" \| \"name\"\n> &\n CheckedFieldProps<MuiSwitchProps> &\n AllowedProps;\n\ntype SwitchLabelProps = {\n checked: boolean;\n hint: SwitchProps[\"hint\"];\n hintId?: string;\n isFullWidth: SwitchProps[\"isFullWidth\"];\n label: SwitchProps[\"label\"];\n};\n\nconst SwitchLabel = ({\n checked,\n hint,\n hintId,\n isFullWidth,\n label,\n}: SwitchLabelProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <>\n <Box\n sx={{\n display: \"flex\",\n alignItems: \"center\",\n flexWrap: \"wrap\",\n gap: odysseyDesignTokens.Spacing1,\n margin: 0,\n maxWidth: isFullWidth\n ? \"100%\"\n : odysseyDesignTokens.TypographyLineLengthMax,\n fontWeight: odysseyDesignTokens.TypographyWeightBodyBold,\n }}\n >\n {label}\n <Box\n sx={{\n padding: \"2px 4px\",\n backgroundColor: checked\n ? odysseyDesignTokens.PaletteSuccessLighter\n : odysseyDesignTokens.HueNeutral100,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n color: checked\n ? odysseyDesignTokens.PaletteSuccessText\n : odysseyDesignTokens.HueNeutral700,\n fontWeight: odysseyDesignTokens.TypographyWeightBodyBold,\n fontSize: odysseyDesignTokens.TypographyScale0,\n lineHeight: odysseyDesignTokens.TypographyLineHeightOverline,\n transitionProperty: \"background-color, color\",\n transitionDuration: odysseyDesignTokens.TransitionDurationMain,\n }}\n >\n {checked ? \"Active\" : \"Inactive\"}\n </Box>\n </Box>\n {hint && <FieldHint id={hintId} text={hint} />}\n </>\n );\n};\n\nconst Switch = ({\n hint,\n id: _id,\n isChecked,\n isDefaultChecked,\n isDisabled,\n isFullWidth = false,\n label,\n name: _name,\n onChange,\n testId,\n value = \"Something\",\n}: SwitchProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: isChecked,\n uncontrolledValue: isDefaultChecked,\n })\n );\n const inputValues = useMemo(() => {\n if (controlledStateRef.current === CONTROLLED) {\n return { checked: isChecked };\n }\n return { defaultChecked: isDefaultChecked };\n }, [isDefaultChecked, isChecked]);\n\n const [internalSwitchChecked, setInternalSwitchChecked] = useState(\n controlledStateRef.current === CONTROLLED\n ? Boolean(isChecked)\n : Boolean(isDefaultChecked)\n );\n\n useEffect(() => {\n if (controlledStateRef.current === CONTROLLED) {\n setInternalSwitchChecked(Boolean(isChecked));\n }\n }, [isChecked]);\n\n const id = useUniqueId(_id);\n\n const hintId = hint ? `${id}-hint` : undefined;\n const labelElementId = `${id}-label`;\n\n const handleOnChange = useCallback(\n (_: SyntheticEvent<Element, Event>, checked: boolean) => {\n setInternalSwitchChecked(checked);\n onChange?.({ checked, value });\n },\n [onChange, setInternalSwitchChecked, value]\n );\n\n const renderSwitchComponent = useMemo(\n () => (\n <MuiSwitch\n {...inputValues}\n disabled={isDisabled}\n disableRipple\n inputProps={{\n \"aria-checked\": internalSwitchChecked,\n \"aria-describedby\": hintId,\n \"aria-label\": label,\n \"aria-labelledby\": labelElementId,\n }}\n name={_name ?? id}\n onChange={handleOnChange}\n />\n ),\n [\n handleOnChange,\n hintId,\n inputValues,\n internalSwitchChecked,\n id,\n isDisabled,\n label,\n labelElementId,\n _name,\n ]\n );\n\n return (\n <Box\n sx={{\n marginBlockEnd: odysseyDesignTokens.Spacing2,\n }}\n >\n <FormControlLabel\n checked={internalSwitchChecked}\n control={renderSwitchComponent}\n data-se={testId}\n disabled={isDisabled}\n id={labelElementId}\n label={\n <SwitchLabel\n checked={internalSwitchChecked}\n hint={hint}\n hintId={hintId}\n isFullWidth={isFullWidth}\n label={label}\n />\n }\n labelPlacement=\"start\"\n sx={{\n justifyContent: \"space-between\",\n alignItems: \"flex-start\",\n gap: odysseyDesignTokens.Spacing4,\n width: \"100%\",\n maxWidth: isFullWidth\n ? \"100%\"\n : odysseyDesignTokens.TypographyLineLengthMax,\n }}\n value={value}\n />\n </Box>\n );\n};\n\nconst MemoizedSwitch = memo(Switch);\nMemoizedSwitch.displayName = \"Switch\";\n\nexport { MemoizedSwitch as Switch };\n"],"mappings":"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"}
1	+ {"version":3,"file":"Switch.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useOdysseyDesignTokens","Box","FieldHint","useUniqueId","ComponentControlledState","getControlState","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","CONTROLLED","SwitchLabel","_ref","checked","hint","hintId","isFullWidth","label","odysseyDesignTokens","children","sx","display","alignItems","flexWrap","gap","Spacing1","margin","maxWidth","TypographyLineLengthMax","fontWeight","TypographyWeightBodyBold","padding","backgroundColor","PaletteSuccessLighter","HueNeutral100","borderRadius","BorderRadiusMain","color","PaletteSuccessText","HueNeutral700","fontSize","TypographyScale0","lineHeight","TypographyLineHeightOverline","transitionProperty","transitionDuration","TransitionDurationMain","id","text","Switch","_ref2","_id","isChecked","isDefaultChecked","isDisabled","name","_name","onChange","testId","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","current","defaultChecked","internalSwitchChecked","setInternalSwitchChecked","Boolean","undefined","labelElementId","handleOnChange","_","renderSwitchComponent","_Switch","disabled","disableRipple","inputProps","marginBlockEnd","Spacing2","_FormControlLabel","control","labelPlacement","justifyContent","Spacing4","width","MemoizedSwitch","displayName"],"sources":["../../src/labs/Switch.tsx"],"sourcesContent":["/!\n Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n \n You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n \n See the License for the specific language governing permissions and limitations under the License.\n /\n\nimport {\n memo,\n SyntheticEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport {\n Switch as MuiSwitch,\n SwitchProps as MuiSwitchProps,\n FormControlLabel,\n} from \"@mui/material\";\n\nimport { useOdysseyDesignTokens } from \"../OdysseyDesignTokensContext\";\nimport { Box } from \"../Box\";\nimport { FieldComponentProps } from \"../FieldComponentProps\";\nimport { FieldHint } from \"../FieldHint\";\nimport type { AllowedProps } from \"../AllowedProps\";\nimport { useUniqueId } from \"../useUniqueId\";\nimport { ComponentControlledState, getControlState } from \"../inputUtils\";\nimport { CheckedFieldProps } from \"../FormCheckedProps\";\n\nconst { CONTROLLED } = ComponentControlledState;\n\ntype OnChangeCallbackArguments = {\n checked: boolean;\n value: string;\n};\n\nexport type SwitchProps = {\n /\n if `true`, the label and switch span entire containing element's width\n /\n isFullWidth?: boolean;\n /\n The label text for the Switch\n /\n label: string;\n /\n The change event handler for the Switch\n /\n onChange?: ({ checked, value }: OnChangeCallbackArguments) => void;\n /\n The value attribute of the Switch\n */\n value: string;\n} & Pick<\n FieldComponentProps,\n \"hint\" \| \"id\" \| \"isFullWidth\" \| \"isDisabled\" \| \"name\"\n> &\n CheckedFieldProps<MuiSwitchProps> &\n AllowedProps;\n\ntype SwitchLabelProps = {\n checked: boolean;\n hint: SwitchProps[\"hint\"];\n hintId?: string;\n isFullWidth: SwitchProps[\"isFullWidth\"];\n label: SwitchProps[\"label\"];\n};\n\nconst SwitchLabel = ({\n checked,\n hint,\n hintId,\n isFullWidth,\n label,\n}: SwitchLabelProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n return (\n <>\n <Box\n sx={{\n display: \"flex\",\n alignItems: \"center\",\n flexWrap: \"wrap\",\n gap: odysseyDesignTokens.Spacing1,\n margin: 0,\n maxWidth: isFullWidth\n ? \"100%\"\n : odysseyDesignTokens.TypographyLineLengthMax,\n fontWeight: odysseyDesignTokens.TypographyWeightBodyBold,\n }}\n >\n {label}\n <Box\n sx={{\n padding: \"2px 4px\",\n backgroundColor: checked\n ? odysseyDesignTokens.PaletteSuccessLighter\n : odysseyDesignTokens.HueNeutral100,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n color: checked\n ? odysseyDesignTokens.PaletteSuccessText\n : odysseyDesignTokens.HueNeutral700,\n fontWeight: odysseyDesignTokens.TypographyWeightBodyBold,\n fontSize: odysseyDesignTokens.TypographyScale0,\n lineHeight: odysseyDesignTokens.TypographyLineHeightOverline,\n transitionProperty: \"background-color, color\",\n transitionDuration: odysseyDesignTokens.TransitionDurationMain,\n }}\n >\n {checked ? \"Active\" : \"Inactive\"}\n </Box>\n </Box>\n {hint && <FieldHint id={hintId} text={hint} />}\n </>\n );\n};\n\nconst Switch = ({\n hint,\n id: _id,\n isChecked,\n isDefaultChecked,\n isDisabled,\n isFullWidth = false,\n label,\n name: _name,\n onChange,\n testId,\n value = \"Something\",\n}: SwitchProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: isChecked,\n uncontrolledValue: isDefaultChecked,\n })\n );\n const inputValues = useMemo(() => {\n if (controlledStateRef.current === CONTROLLED) {\n return { checked: isChecked };\n }\n return { defaultChecked: isDefaultChecked };\n }, [isDefaultChecked, isChecked]);\n\n const [internalSwitchChecked, setInternalSwitchChecked] = useState(\n controlledStateRef.current === CONTROLLED\n ? Boolean(isChecked)\n : Boolean(isDefaultChecked)\n );\n\n useEffect(() => {\n if (controlledStateRef.current === CONTROLLED) {\n setInternalSwitchChecked(Boolean(isChecked));\n }\n }, [isChecked]);\n\n const id = useUniqueId(_id);\n\n const hintId = hint ? `${id}-hint` : undefined;\n const labelElementId = `${id}-label`;\n\n const handleOnChange = useCallback(\n (_: SyntheticEvent<Element, Event>, checked: boolean) => {\n setInternalSwitchChecked(checked);\n onChange?.({ checked, value });\n },\n [onChange, setInternalSwitchChecked, value]\n );\n\n const renderSwitchComponent = useMemo(\n () => (\n <MuiSwitch\n {...inputValues}\n disabled={isDisabled}\n disableRipple\n inputProps={{\n \"aria-checked\": internalSwitchChecked,\n \"aria-describedby\": hintId,\n \"aria-label\": label,\n \"aria-labelledby\": labelElementId,\n }}\n name={_name ?? id}\n onChange={handleOnChange}\n />\n ),\n [\n handleOnChange,\n hintId,\n inputValues,\n internalSwitchChecked,\n id,\n isDisabled,\n label,\n labelElementId,\n _name,\n ]\n );\n\n return (\n <Box\n sx={{\n marginBlockEnd: odysseyDesignTokens.Spacing2,\n }}\n >\n <FormControlLabel\n checked={internalSwitchChecked}\n control={renderSwitchComponent}\n data-se={testId}\n disabled={isDisabled}\n id={labelElementId}\n label={\n <SwitchLabel\n checked={internalSwitchChecked}\n hint={hint}\n hintId={hintId}\n isFullWidth={isFullWidth}\n label={label}\n />\n }\n labelPlacement=\"start\"\n sx={{\n justifyContent: \"space-between\",\n alignItems: \"flex-start\",\n gap: odysseyDesignTokens.Spacing4,\n width: \"100%\",\n maxWidth: isFullWidth\n ? \"100%\"\n : odysseyDesignTokens.TypographyLineLengthMax,\n }}\n value={value}\n />\n </Box>\n );\n};\n\nconst MemoizedSwitch = memo(Switch);\nMemoizedSwitch.displayName = \"Switch\";\n\nexport { MemoizedSwitch as Switch };\n"],"mappings":"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"}