npm - @okta/odyssey-react-mui - Versions diffs - 1.21.2 → 1.22.0 - Mend

@okta/odyssey-react-mui 1.21.2 → 1.22.0

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 (432) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useMaterialReactTable","MRT_TableContainer","useTranslation","ArrowDownIcon","ArrowUnsortedIcon","ChevronDownIcon","DragIndicatorIcon","MoreIcon","densityValues","Pagination","usePagination","DataFilters","DataTableRowActions","useRowReordering","DataTableSettings","MenuButton","Box","useOdysseyDesignTokens","useScrollIndication","styled","EmptyState","Button","Callout","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ScrollableTableContainer","shouldForwardProp","prop","odysseyDesignTokens","isScrollableStart","isScrollableEnd","marginBlockEnd","Spacing4","position","borderInlineStartColor","HueNeutral200","borderInlineStartStyle","borderInlineStartWidth","BorderWidthMain","background","content","opacity","pointerEvents","top","left","bottom","width","Spacing6","zIndex","transition","TransitionDurationMain","TransitionTimingMain","borderInlineEndColor","borderInlineEndStyle","borderInlineEndWidth","right","DataTable","bulkActionMenuItems","columns","currentPage","emptyPlaceholder","errorMessage","errorMessageProp","filters","filtersProp","getData","getRowId","getRowIdProp","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSearchSubmitButton","hasSorting","initialDensity","initialSearchValue","isPaginationMoreDisabled","noResultsPlaceholder","onChangeRowSelection","onReorderRows","paginationType","renderDetailPanel","resultsPerPage","maxResultsPerPage","maxPages","rowActionButtons","rowActionMenuItems","searchDelayTime","totalRows","t","data","setData","pagination","setPagination","pageIndex","pageSize","draggingRow","setDraggingRow","isTableContainerScrolledToStart","setIsTableContainerScrolledToStart","isTableContainerScrolledToEnd","setIsTableContainerScrolledToEnd","tableInnerContainerWidth","setTableInnerContainerWidth","tableOuterContainerRef","tableInnerContainerRef","tableContentRef","columnSorting","setColumnSorting","columnVisibility","setColumnVisibility","rowDensity","setRowDensity","rowSelection","setRowSelection","search","setSearch","setFilters","initialFilters","setInitialFilters","isLoading","setIsLoading","isEmpty","setIsEmpty","setErrorMessage","tableOuterContainer","current","tableInnerContainer","dragHandleStyles","dragHandleText","draggableTableBodyRowClassName","handleDragHandleKeyDown","handleDragHandleOnDragCapture","handleDragHandleOnDragEnd","resetDraggingAndHoveredRow","updateRowOrder","page","row","id","rowDensityClassName","renderRowActions","currentIndex","index","rowIndex","undefined","convertFilterSelectOptions","options","map","option","label","value","convertColumnToFilter","column","enableColumnFilter","accessorKey","header","variant","filterVariant","filterSelectOptions","dataTableFilters","providedFilters","reduce","accumulator","item","foundColumn","find","filter","concat","defaultCell","cell","getValue","hasTextWrapping","columnDef","enableWrapping","sx","whiteSpace","textOverflow","overflow","children","emptyState","noResultsInnerContent","heading","description","emptyStateInnerContent","columnIds","columnOrder","shouldDisplayRowActions","dataTable","state","sorting","globalFilter","icons","ArrowDownwardIcon","DragHandleIcon","SyncAltIcon","ExpandMoreIcon","enableColumnActions","enableColumnResizing","enableDensityToggle","enableFilters","enableFullScreenToggle","enableGlobalFilter","enableHiding","enablePagination","layoutMode","manualFiltering","manualSorting","muiTablePaperProps","elevation","selectAllMode","displayColumnDefOptions","grow","muiTableBodyCellProps","align","className","muiTableHeadCellProps","display","visibility","endIcon","size","ariaLabel","isDisabled","minWidth","marginInline","padding","muiTableBodyProps","defaultColumn","Cell","getIsResizing","enableRowOrdering","Boolean","enableRowDragging","muiTableBodyRowProps","table","currentRowId","draggingRowId","hoveredRowId","getState","hoveredRow","muiRowDragHandleProps","onKeyDown","event","onBlur","onDragEnd","onDragCapture","enableRowActions","positionActionsColumn","enableRowSelection","onRowSelectionChange","enableSorting","onSortingChange","currentColumn","sortedColumn","enableRowVirtualization","rowVirtualizerInstanceRef","rowVirtualizerOptions","overscan","renderEmptyRowsFallback","muiTableProps","ref","muiTableContainerProps","enableExpandAll","bulkActionMenuButton","buttonVariant","Object","keys","length","incomingData","sort","error","prev","lastRow","currentRowsCount","marginBottom","onChangeSearch","onChangeFilters","defaultSearchTerm","additionalActions","severity","text","maxPageIndex","maxPageSize","onPaginationChange","isMoreDisabled","rowsPerPageLabel","currentPageLabel","previousLabel","nextLabel","loadMoreLabel","MemoizedDataTable","displayName"],"sources":["../../src/DataTable/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 ReactNode,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport {\n MRT_Cell,\n MRT_DensityState,\n MRT_Row,\n MRT_SortingState,\n MRT_TableOptions,\n MRT_RowSelectionState,\n MRT_RowVirtualizer,\n MRT_VisibilityState,\n useMaterialReactTable,\n MRT_TableContainer,\n MRT_Column,\n MRT_ColumnDef,\n MRT_TableInstance,\n} from \"material-react-table\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n ArrowDownIcon,\n ArrowUnsortedIcon,\n ChevronDownIcon,\n DragIndicatorIcon,\n MoreIcon,\n} from \"../icons.generated\";\nimport { densityValues } from \"./constants\";\nimport { Pagination, paginationTypeValues, usePagination } from \"../Pagination\";\nimport { DataFilter, DataFilters } from \"../labs/DataFilters\";\nimport {\n DataTableRowActions,\n DataTableRowActionsProps,\n} from \"./DataTableRowActions\";\nimport { useRowReordering } from \"./useRowReordering\";\nimport { DataTableSettings } from \"./DataTableSettings\";\nimport { MenuButton, MenuButtonProps } from \"../MenuButton\";\nimport { Box } from \"../Box\";\nimport { DataTableRowSelectionState, DataTableRowData } from \".\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext\";\nimport { useScrollIndication } from \"./useScrollIndication\";\nimport styled from \"@emotion/styled\";\nimport { EmptyState } from \"../EmptyState\";\nimport { Button } from \"../Button\";\nimport { Callout } from \"../Callout\";\n\nexport type DataTableColumn<T extends DataTableRowData> = MRT_ColumnDef<T> & {\n /\n @deprecated use hasTextWrapping instead of enableWrapping\n /\n enableWrapping?: boolean;\n hasTextWrapping?: boolean;\n};\n\ntype DataTableColumnInstance<T extends DataTableRowData> = Omit<\n MRT_Column<T, unknown>,\n \"columnDef\"\n> & {\n columnDef: DataTableColumn<T>;\n};\n\ntype DataTableCell<T extends DataTableRowData> = Omit<MRT_Cell<T>, \"column\"> & {\n column: DataTableColumnInstance<T>;\n};\n\nexport type DataTableGetDataType = {\n page?: number;\n resultsPerPage?: number;\n search?: string;\n filters?: DataFilter[];\n sort?: MRT_SortingState;\n};\n\nexport type DataTableOnReorderRowsType = {\n rowId: string;\n newRowIndex: number;\n};\n\nexport type DataTableRenderDetailPanelType = {\n row: MRT_Row<DataTableRowData>;\n table: MRT_TableInstance<DataTableRowData>;\n};\n\nexport type DataTableProps = {\n /\n Menu items to include in the bulk actions menu, which appears above the table if a row or rows are selected\n /\n bulkActionMenuItems?: (\n selectedRows: MRT_RowSelectionState,\n ) => MenuButtonProps[\"children\"];\n /\n The columns that make up the table\n /\n columns: DataTableColumn<DataTableRowData>[];\n /\n The current page number.\n /\n currentPage?: number;\n /\n If `error` is not undefined, the DataTable will indicate an error.\n /\n errorMessage?: string;\n /\n The component to display when the table is displaying the initial empty state\n /\n emptyPlaceholder?: ReactNode;\n /\n An optional set of filters to render in the filters menu\n /\n filters?: Array<DataFilter \| DataTableColumn<DataTableRowData> \| string>;\n /\n The function to get the ID of a row\n /\n getRowId?: MRT_TableOptions<DataTableRowData>[\"getRowId\"];\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 getData: ({\n page,\n resultsPerPage,\n search,\n filters,\n sort,\n }: DataTableGetDataType) =>\n \| MRT_TableOptions<DataTableRowData>[\"data\"]\n \| Promise<MRT_TableOptions<DataTableRowData>[\"data\"]>;\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 end user can reorder rows via a drag-and-drop interface\n /\n hasRowReordering?: 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 search field will include a Search button, rather than\n * firing on input change.\n /\n hasSearchSubmitButton?: 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 will be able to change the table density.\n /\n hasChangeableDensity?: boolean;\n /\n The initial density (height & padding) of the table rows. This is available even if the\n * table density isn't changeable by the end user via hasChangeableDensity.\n /\n initialDensity?: (typeof densityValues)[number];\n /\n The initial search value\n /\n initialSearchValue?: string;\n /\n Is the next or show-more button disabled\n /\n isPaginationMoreDisabled?: boolean;\n /\n The component to display when the query returns no results\n /\n noResultsPlaceholder?: ReactNode;\n /\n The number of results per page.\n /\n resultsPerPage?: number;\n /\n The optional component to display when expanding a row.\n /\n renderDetailPanel?: MRT_TableOptions<DataTableRowData>[\"renderDetailPanel\"];\n /\n Action buttons to display in each row\n /\n rowActionButtons?: DataTableRowActionsProps[\"rowActionButtons\"];\n /\n Menu items to include in the optional actions menu on each row.\n /\n rowActionMenuItems?: DataTableRowActionsProps[\"rowActionMenuItems\"];\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 onChangeRowSelection?: (rowSelection: DataTableRowSelectionState) => void;\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 onReorderRows?: ({ rowId, newRowIndex }: DataTableOnReorderRowsType) => void;\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 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 largest number of rows allowed to be shown per page. This only affects the row input\n * in pagination.\n /\n maxResultsPerPage?: number;\n /\n The highest page number allowed to be manually input in pagination\n /\n maxPages?: number;\n};\n\nconst ScrollableTableContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"isScrollableStart\" &&\n prop !== \"isScrollableEnd\",\n})(\n ({\n odysseyDesignTokens,\n isScrollableStart,\n isScrollableEnd,\n }: {\n odysseyDesignTokens: DesignTokens;\n isScrollableStart: boolean;\n isScrollableEnd: boolean;\n }) => ({\n marginBlockEnd: odysseyDesignTokens.Spacing4,\n position: \"relative\",\n borderInlineStartColor: isScrollableStart\n ? odysseyDesignTokens.HueNeutral200\n : \"transparent\",\n borderInlineStartStyle: \"solid\",\n borderInlineStartWidth: odysseyDesignTokens.BorderWidthMain,\n \"::before\": {\n background:\n \"linear-gradient(-90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.33) 50%, rgba(0, 0, 0, 1) 100%)\",\n content: '\"\"',\n opacity: isScrollableStart ? \"0.075\" : \"0\",\n pointerEvents: \"none\",\n position: \"absolute\",\n top: 0,\n left: 0,\n bottom: 0,\n width: odysseyDesignTokens.Spacing6,\n zIndex: 100,\n transition: `opacity ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n },\n borderInlineEndColor: isScrollableEnd\n ? odysseyDesignTokens.HueNeutral200\n : \"transparent\",\n borderInlineEndStyle: \"solid\",\n borderInlineEndWidth: odysseyDesignTokens.BorderWidthMain,\n \"::after\": {\n background:\n \"linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.33) 50%, rgba(0, 0, 0, 1) 100%)\",\n content: '\"\"',\n opacity: isScrollableEnd ? \"0.075\" : \"0\",\n pointerEvents: \"none\",\n position: \"absolute\",\n top: 0,\n right: 0,\n bottom: 0,\n width: odysseyDesignTokens.Spacing6,\n transition: `opacity ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n },\n }),\n);\n\nconst DataTable = ({\n bulkActionMenuItems,\n columns,\n currentPage = 1,\n emptyPlaceholder,\n errorMessage: errorMessageProp,\n filters: filtersProp,\n getData,\n getRowId: getRowIdProp,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSearchSubmitButton,\n hasSorting,\n initialDensity = densityValues[0],\n initialSearchValue = \"\",\n isPaginationMoreDisabled,\n noResultsPlaceholder,\n onChangeRowSelection,\n onReorderRows,\n paginationType = \"paged\",\n renderDetailPanel,\n resultsPerPage = 20,\n maxResultsPerPage,\n maxPages,\n rowActionButtons,\n rowActionMenuItems,\n searchDelayTime,\n totalRows,\n}: DataTableProps) => {\n const { t } = useTranslation();\n\n const [data, setData] = useState<DataTableRowData[]>([]);\n const [pagination, setPagination] = useState({\n pageIndex: currentPage,\n pageSize: resultsPerPage,\n });\n const [draggingRow, setDraggingRow] =\n useState<MRT_Row<DataTableRowData> \| null>();\n const [isTableContainerScrolledToStart, setIsTableContainerScrolledToStart] =\n useState(true);\n const [isTableContainerScrolledToEnd, setIsTableContainerScrolledToEnd] =\n useState(true);\n const [tableInnerContainerWidth, setTableInnerContainerWidth] =\n useState<string>(\"100%\");\n const tableOuterContainerRef = useRef<HTMLDivElement>(null);\n const tableInnerContainerRef = useRef<HTMLDivElement>(null);\n const tableContentRef = useRef<HTMLTableElement>(null);\n\n // Table states\n const [columnSorting, setColumnSorting] = useState<MRT_SortingState>([]);\n const [columnVisibility, setColumnVisibility] =\n useState<MRT_VisibilityState>();\n const [rowDensity, setRowDensity] =\n useState<MRT_DensityState>(initialDensity);\n const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});\n const [search, setSearch] = useState<string>(initialSearchValue);\n const [filters, setFilters] = useState<DataFilter[]>();\n const [initialFilters, setInitialFilters] = useState<DataFilter[]>();\n const [isLoading, setIsLoading] = useState<boolean \| undefined>(true);\n const [isEmpty, setIsEmpty] = useState<boolean \| undefined>();\n const [errorMessage, setErrorMessage] = useState<string \| undefined>(\n errorMessageProp,\n );\n\n useScrollIndication({\n tableOuterContainer: tableOuterContainerRef.current,\n tableInnerContainer: tableInnerContainerRef.current,\n setIsTableContainerScrolledToStart: setIsTableContainerScrolledToStart,\n setIsTableContainerScrolledToEnd: setIsTableContainerScrolledToEnd,\n setTableInnerContainerWidth: setTableInnerContainerWidth,\n });\n\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const {\n dragHandleStyles,\n dragHandleText,\n draggableTableBodyRowClassName,\n handleDragHandleKeyDown,\n handleDragHandleOnDragCapture,\n handleDragHandleOnDragEnd,\n resetDraggingAndHoveredRow,\n updateRowOrder,\n } = useRowReordering({\n totalRows,\n onReorderRows,\n data,\n setData,\n draggingRow,\n setDraggingRow,\n resultsPerPage: pagination.pageSize,\n page: pagination.pageIndex,\n });\n\n const getRowId = getRowIdProp\n ? getRowIdProp\n : (row: DataTableRowData) => row.id;\n\n const rowDensityClassName = useMemo(() => {\n return rowDensity === \"spacious\"\n ? \"MuiTableBody-spacious\"\n : rowDensity === \"compact\"\n ? \"MuiTableBody-compact\"\n : \"MuiTableBody-default\";\n }, [rowDensity]);\n\n const renderRowActions = useCallback(\n ({ row }: { row: MRT_Row<DataTableRowData> }) => {\n const currentIndex =\n row.index + (pagination.pageIndex - 1) pagination.pageSize;\n return (\n <DataTableRowActions\n row={row}\n rowIndex={currentIndex}\n rowActionButtons={rowActionButtons}\n rowActionMenuItems={rowActionMenuItems}\n totalRows={totalRows}\n updateRowOrder={\n hasRowReordering && onReorderRows ? updateRowOrder : undefined\n }\n />\n );\n },\n [\n pagination,\n rowActionButtons,\n rowActionMenuItems,\n hasRowReordering,\n onReorderRows,\n totalRows,\n updateRowOrder,\n ],\n );\n\n /*\n This hack is to provide compatibility with Material-React-Table's\n * filterOptions format, which allows for strings and { label: string, value: string }\n /\n const convertFilterSelectOptions = useCallback(\n (options: DataTableColumn<DataTableRowData>[\"filterSelectOptions\"]) =>\n options?.map((option) =>\n typeof option === \"string\"\n ? {\n label: option,\n value: option,\n }\n : {\n // If the option isn't a string, it must have value and/or option defined\n // If either is undefined, use the other\n label: option.label ?? option.value,\n value: option.value ?? option.label,\n },\n ),\n [],\n );\n\n const convertColumnToFilter = useCallback(\n (column: DataTableColumn<DataTableRowData>) =>\n column.enableColumnFilter !== false && column.accessorKey\n ? ({\n id: column.accessorKey,\n label: column.header,\n variant: column.filterVariant,\n options: convertFilterSelectOptions(column.filterSelectOptions),\n } satisfies DataFilter as DataFilter)\n : null,\n [convertFilterSelectOptions],\n );\n\n /\n Filters default to the columns, but can be overridden\n * with the `filters` prop. `filters` should be an array\n * of column accessorKeys, column defs, or DataFilters.\n */\n const dataTableFilters = useMemo(() => {\n const providedFilters = filtersProp \|\| columns;\n return providedFilters.reduce<DataFilter[]>((accumulator, item) => {\n if (typeof item === \"string\") {\n const foundColumn = columns.find(\n (column) => column.accessorKey === item,\n );\n if (foundColumn) {\n const filter = convertColumnToFilter(foundColumn);\n if (filter) {\n return accumulator.concat(filter);\n }\n }\n } else if (\"accessorKey\" in item) {\n // Checks if it's a column\n const filter = convertColumnToFilter(item);\n if (filter) {\n return accumulator.concat(filter);\n }\n } else if (\"label\" in item) {\n // Checks if it's a DataFilter\n return accumulator.concat(item);\n }\n // If none of the conditions match, item is ignored (not mapping to undefined)\n return accumulator;\n }, []);\n }, [columns, filtersProp, convertColumnToFilter]);\n\n const defaultCell = useCallback(\n ({ cell }: { cell: DataTableCell<DataTableRowData> }) => {\n const value = cell.getValue<string>();\n const hasTextWrapping =\n cell.column.columnDef.hasTextWrapping \|\|\n cell.column.columnDef.enableWrapping;\n\n return hasTextWrapping ? (\n value\n ) : (\n <Box\n sx={{\n whiteSpace: \"nowrap\",\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n }}\n >\n {value}\n </Box>\n );\n },\n [],\n );\n\n const emptyState = useCallback(() => {\n const noResultsInnerContent = noResultsPlaceholder \|\| (\n <EmptyState\n heading={t(\"table.noresults.heading\")}\n description={t(\"table.noresults.text\")}\n />\n );\n\n const emptyStateInnerContent =\n emptyPlaceholder && isEmpty ? emptyPlaceholder : noResultsInnerContent;\n\n return (\n <Box sx={{ width: tableInnerContainerWidth }}>\n {emptyStateInnerContent}\n </Box>\n );\n }, [\n emptyPlaceholder,\n isEmpty,\n noResultsPlaceholder,\n t,\n tableInnerContainerWidth,\n ]);\n\n const columnIds = useMemo(() => {\n return columns.map((column) => column.accessorKey);\n }, [columns]);\n\n const columnOrder = useMemo(\n () => [\n \"mrt-row-drag\",\n \"mrt-row-select\",\n \"mrt-row-expand\",\n ...columnIds,\n \"mrt-row-actions\",\n ],\n [columnIds],\n ) as string[];\n\n const shouldDisplayRowActions = useMemo(\n () =>\n (hasRowReordering === true && onReorderRows) \|\|\n rowActionButtons \|\|\n rowActionMenuItems\n ? true\n : false,\n [hasRowReordering, onReorderRows, rowActionButtons, rowActionMenuItems],\n );\n\n const dataTable = useMaterialReactTable({\n columns: columns,\n data: data,\n getRowId: getRowId,\n state: {\n sorting: columnSorting,\n globalFilter: search,\n columnVisibility,\n isLoading,\n rowSelection,\n columnOrder,\n },\n icons: {\n ArrowDownwardIcon: ArrowDownIcon,\n DragHandleIcon: DragIndicatorIcon,\n SyncAltIcon: ArrowUnsortedIcon,\n ExpandMoreIcon: ChevronDownIcon,\n },\n\n // Base table settings\n enableColumnActions: false,\n enableColumnResizing: hasColumnResizing,\n enableDensityToggle: false,\n enableFilters: false,\n enableFullScreenToggle: false,\n enableGlobalFilter: false,\n enableHiding: false,\n enablePagination: false,\n layoutMode: \"grid-no-grow\",\n manualFiltering: true,\n manualSorting: true,\n muiTablePaperProps: {\n elevation: 0,\n sx: {\n overflow: \"visible\",\n },\n },\n selectAllMode: \"all\",\n displayColumnDefOptions: {\n \"mrt-row-actions\": {\n header: \"\",\n grow: true,\n muiTableBodyCellProps: {\n align: \"right\",\n sx: {\n overflow: \"visible\",\n width: \"unset\",\n },\n className: \"ods-actions-cell\",\n },\n muiTableHeadCellProps: {\n align: \"right\",\n sx: {\n width: \"unset\",\n },\n className: \"ods-actions-cell\",\n children: (\n <Box sx={{ display: \"flex\", visibility: \"hidden\" }}>\n {rowActionButtons && rowActionButtons({ id: null })}\n {((hasRowReordering && onReorderRows) \|\| rowActionMenuItems) && (\n <Box>\n <Button\n endIcon={<MoreIcon />}\n size=\"small\"\n variant=\"floating\"\n ariaLabel={t(\"table.moreactions.arialabel\")}\n isDisabled\n />\n </Box>\n )}\n </Box>\n ),\n },\n },\n \"mrt-row-drag\": {\n header: \"\",\n muiTableBodyCellProps: {\n sx: {\n minWidth: 0,\n width: \"auto\",\n },\n className: \"ods-drag-handle\",\n },\n muiTableHeadCellProps: {\n sx: {\n minWidth: 0,\n width: \"auto\",\n },\n children: (\n // Add a spacer to simulate the width of the drag handle in the column.\n // Without this, the head cells are offset from their body cell counterparts\n <Box sx={{ marginInline: \"-0.1rem\" }}>\n <DragIndicatorIcon sx={{ marginInline: 1, opacity: 0 }} />\n </Box>\n ),\n },\n },\n \"mrt-row-select\": {\n muiTableHeadCellProps: {\n padding: \"checkbox\",\n },\n muiTableBodyCellProps: {\n padding: \"checkbox\",\n },\n },\n \"mrt-row-expand\": {\n header: \"\",\n },\n },\n muiTableBodyProps: () => ({\n className: rowDensityClassName,\n }),\n defaultColumn: {\n Cell: defaultCell,\n },\n muiTableBodyCellProps: ({ column }) => ({\n className: column.getIsResizing() ? \"isResizing\" : \"\",\n }),\n\n // Reordering\n enableRowOrdering: hasRowReordering && Boolean(onReorderRows),\n enableRowDragging: hasRowReordering && Boolean(onReorderRows),\n muiTableBodyRowProps: ({ table, row }) => ({\n className: draggableTableBodyRowClassName({\n currentRowId: row.id,\n draggingRowId: draggingRow?.id,\n hoveredRowId: table.getState().hoveredRow?.id,\n }),\n }),\n muiRowDragHandleProps: ({ table, row }) => ({\n onKeyDown: (event) => handleDragHandleKeyDown({ table, row, event }),\n onBlur: () => resetDraggingAndHoveredRow(table),\n onDragEnd: () => handleDragHandleOnDragEnd(table),\n onDragCapture: () => handleDragHandleOnDragCapture(table),\n sx: dragHandleStyles,\n ...dragHandleText,\n }),\n\n // Row actions\n enableRowActions: shouldDisplayRowActions,\n positionActionsColumn:\n \"last\" as MRT_TableOptions<DataTableRowData>[\"positionActionsColumn\"],\n renderRowActions: ({ row }) => renderRowActions({ row }),\n\n // Row selection\n enableRowSelection: hasRowSelection,\n onRowSelectionChange: setRowSelection,\n\n // Sorting\n enableSorting: hasSorting,\n onSortingChange: setColumnSorting,\n muiTableHeadCellProps: ({ column: currentColumn }) => ({\n className: columnSorting.find(\n (sortedColumn) => sortedColumn.id === currentColumn.id,\n )\n ? \"isSorted\"\n : \"isUnsorted\",\n }),\n\n // Virtualization\n enableRowVirtualization:\n paginationType !== \"loadMore\" && pagination.pageSize > 50,\n rowVirtualizerInstanceRef:\n useRef<MRT_RowVirtualizer<HTMLDivElement, HTMLTableRowElement>>(null),\n rowVirtualizerOptions: {\n overscan: 4,\n },\n\n // States\n renderEmptyRowsFallback: emptyState,\n\n // Refs\n muiTableProps: {\n ref: tableContentRef,\n className:\n !shouldDisplayRowActions && hasColumnResizing\n ? \"ods-hide-spacer-column\"\n : \"\",\n },\n\n muiTableContainerProps: {\n ref: tableInnerContainerRef,\n },\n\n // Row expansion\n enableExpandAll: false,\n renderDetailPanel: renderDetailPanel,\n });\n\n // Effects\n const bulkActionMenuButton = useMemo(\n () => (\n <>\n <MenuButton\n buttonVariant=\"secondary\"\n endIcon={<MoreIcon />}\n isDisabled={Object.keys(rowSelection).length === 0}\n ariaLabel=\"More actions\"\n >\n {bulkActionMenuItems?.(rowSelection)}\n </MenuButton>\n </>\n ),\n [bulkActionMenuItems, rowSelection],\n );\n\n useEffect(() => {\n (async () => {\n setIsLoading(true);\n setErrorMessage(errorMessageProp);\n try {\n const incomingData = await getData?.({\n page: pagination.pageIndex,\n resultsPerPage: pagination.pageSize,\n search,\n filters,\n sort: columnSorting,\n });\n setData(incomingData);\n } catch (error) {\n setErrorMessage(typeof error === \"string\" ? error : t(\"table.error\"));\n } finally {\n setIsLoading(false);\n }\n })();\n }, [\n columnSorting,\n errorMessageProp,\n filters,\n getData,\n pagination,\n search,\n t,\n ]);\n\n useEffect(() => {\n if (!initialFilters && filters) {\n setInitialFilters(filters);\n }\n\n setIsEmpty(\n pagination.pageIndex === currentPage &&\n pagination.pageSize === resultsPerPage &&\n search === \"\" &&\n filters === initialFilters &&\n data.length === 0,\n );\n }, [\n filters,\n pagination,\n search,\n data,\n currentPage,\n initialFilters,\n resultsPerPage,\n ]);\n\n useEffect(() => {\n setPagination((prev) => ({\n pageIndex: 1,\n pageSize: prev.pageSize,\n }));\n }, [filters, search]);\n\n useEffect(() => {\n onChangeRowSelection?.(rowSelection);\n }, [rowSelection, onChangeRowSelection]);\n\n const { lastRow } = usePagination({\n currentRowsCount: data.length,\n pageIndex: pagination.pageIndex,\n pageSize: pagination.pageSize,\n totalRows,\n });\n\n // Render the table\n return (\n <>\n {(hasSearch \|\|\n hasFilters \|\|\n hasChangeableDensity \|\|\n hasColumnVisibility \|\|\n bulkActionMenuItems) && (\n <Box sx={{ marginBottom: 5 }}>\n <DataFilters\n onChangeSearch={hasSearch ? setSearch : undefined}\n onChangeFilters={hasFilters ? setFilters : undefined}\n hasSearchSubmitButton={hasSearchSubmitButton}\n searchDelayTime={searchDelayTime}\n filters={hasFilters ? dataTableFilters : undefined}\n defaultSearchTerm={initialSearchValue}\n isDisabled={isEmpty}\n additionalActions={\n <>\n <DataTableSettings\n hasChangeableDensity={hasChangeableDensity}\n rowDensity={rowDensity}\n setRowDensity={setRowDensity}\n hasColumnVisibility={hasColumnVisibility}\n columns={columns}\n columnVisibility={columnVisibility}\n setColumnVisibility={setColumnVisibility}\n />\n {bulkActionMenuItems && bulkActionMenuButton}\n </>\n }\n />\n </Box>\n )}\n\n {errorMessage && (\n <Box sx={{ marginBlockEnd: 2 }}>\n <Callout severity=\"error\" text={errorMessage} />\n </Box>\n )}\n\n <ScrollableTableContainer\n odysseyDesignTokens={odysseyDesignTokens}\n isScrollableStart={!isTableContainerScrolledToStart}\n isScrollableEnd={!isTableContainerScrolledToEnd}\n ref={tableOuterContainerRef}\n >\n <MRT_TableContainer table={dataTable} />\n </ScrollableTableContainer>\n\n {hasPagination && (\n <Pagination\n pageIndex={pagination.pageIndex}\n pageSize={pagination.pageSize}\n maxPageIndex={maxPages}\n maxPageSize={maxResultsPerPage}\n onPaginationChange={setPagination}\n lastRow={lastRow}\n totalRows={totalRows}\n currentRowsCount={data.length}\n isDisabled={isEmpty}\n isMoreDisabled={isPaginationMoreDisabled}\n variant={paginationType}\n rowsPerPageLabel={t(\"pagination.rowsperpage\")}\n currentPageLabel={t(\"pagination.page\")}\n previousLabel={t(\"pagination.previous\")}\n nextLabel={t(\"pagination.next\")}\n loadMoreLabel={t(\"pagination.loadmore\")}\n />\n )}\n </>\n );\n};\n\nconst MemoizedDataTable = memo(DataTable);\nMemoizedDataTable.displayName = \"DataTable\";\n\nexport { MemoizedDataTable as DataTable };\n"],"mappings":"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"}
1	+ {"version":3,"file":"DataTable.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useMaterialReactTable","MRT_TableContainer","useTranslation","ArrowDownIcon","ArrowUnsortedIcon","ChevronDownIcon","DragIndicatorIcon","MoreIcon","densityValues","Pagination","usePagination","DataFilters","DataTableRowActions","useRowReordering","DataTableSettings","MenuButton","Box","useOdysseyDesignTokens","useScrollIndication","styled","EmptyState","Button","Callout","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ScrollableTableContainer","shouldForwardProp","prop","odysseyDesignTokens","isScrollableStart","isScrollableEnd","marginBlockEnd","Spacing4","position","borderInlineStartColor","HueNeutral200","borderInlineStartStyle","borderInlineStartWidth","BorderWidthMain","background","content","opacity","pointerEvents","top","left","bottom","width","Spacing6","zIndex","transition","TransitionDurationMain","TransitionTimingMain","borderInlineEndColor","borderInlineEndStyle","borderInlineEndWidth","right","DataTable","additionalActionButton","additionalActionMenuItems","bulkActionMenuItems","columns","currentPage","emptyPlaceholder","errorMessage","errorMessageProp","filters","filtersProp","getData","getRowId","getRowIdProp","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSearchSubmitButton","hasSorting","initialDensity","initialSearchValue","isPaginationMoreDisabled","noResultsPlaceholder","onChangeRowSelection","onReorderRows","paginationType","renderDetailPanel","resultsPerPage","maxResultsPerPage","maxPages","rowActionButtons","rowActionMenuItems","searchDelayTime","totalRows","t","data","setData","pagination","setPagination","pageIndex","pageSize","draggingRow","setDraggingRow","isTableContainerScrolledToStart","setIsTableContainerScrolledToStart","isTableContainerScrolledToEnd","setIsTableContainerScrolledToEnd","tableInnerContainerWidth","setTableInnerContainerWidth","tableOuterContainerRef","tableInnerContainerRef","tableContentRef","columnSorting","setColumnSorting","columnVisibility","setColumnVisibility","rowDensity","setRowDensity","rowSelection","setRowSelection","search","setSearch","setFilters","initialFilters","setInitialFilters","isLoading","setIsLoading","isEmpty","setIsEmpty","setErrorMessage","tableOuterContainer","current","tableInnerContainer","dragHandleStyles","dragHandleText","draggableTableBodyRowClassName","handleDragHandleKeyDown","handleDragHandleOnDragCapture","handleDragHandleOnDragEnd","resetDraggingAndHoveredRow","updateRowOrder","page","row","id","rowDensityClassName","renderRowActions","currentIndex","index","rowIndex","undefined","convertFilterSelectOptions","options","map","option","label","value","convertColumnToFilter","column","enableColumnFilter","accessorKey","header","variant","filterVariant","filterSelectOptions","dataTableFilters","providedFilters","reduce","accumulator","item","foundColumn","find","filter","concat","defaultCell","cell","getValue","hasTextWrapping","columnDef","enableWrapping","sx","whiteSpace","textOverflow","overflow","children","emptyState","noResultsInnerContent","heading","description","emptyStateInnerContent","columnIds","columnOrder","shouldDisplayRowActions","dataTable","state","sorting","globalFilter","icons","ArrowDownwardIcon","DragHandleIcon","SyncAltIcon","ExpandMoreIcon","enableColumnActions","enableColumnResizing","enableDensityToggle","enableFilters","enableFullScreenToggle","enableGlobalFilter","enableHiding","enablePagination","layoutMode","manualFiltering","manualSorting","muiTablePaperProps","elevation","selectAllMode","displayColumnDefOptions","grow","muiTableBodyCellProps","align","className","muiTableHeadCellProps","display","visibility","endIcon","size","ariaLabel","isDisabled","minWidth","marginInline","padding","muiTableBodyProps","defaultColumn","Cell","getIsResizing","enableRowOrdering","Boolean","enableRowDragging","muiTableBodyRowProps","table","currentRowId","draggingRowId","hoveredRowId","getState","hoveredRow","muiRowDragHandleProps","onKeyDown","event","onBlur","onDragEnd","onDragCapture","enableRowActions","positionActionsColumn","enableRowSelection","onRowSelectionChange","enableSorting","onSortingChange","currentColumn","sortedColumn","enableRowVirtualization","rowVirtualizerInstanceRef","rowVirtualizerOptions","overscan","renderEmptyRowsFallback","muiTableProps","ref","muiTableContainerProps","enableExpandAll","bulkActionMenuButton","buttonVariant","Object","keys","length","incomingData","sort","error","prev","lastRow","currentRowsCount","marginBottom","onChangeSearch","onChangeFilters","defaultSearchTerm","additionalActions","menuAlignment","severity","text","maxPageIndex","maxPageSize","onPaginationChange","isMoreDisabled","rowsPerPageLabel","currentPageLabel","previousLabel","nextLabel","loadMoreLabel","MemoizedDataTable","displayName"],"sources":["../../src/DataTable/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 ReactNode,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport {\n MRT_Cell,\n MRT_DensityState,\n MRT_Row,\n MRT_SortingState,\n MRT_TableOptions,\n MRT_RowSelectionState,\n MRT_RowVirtualizer,\n MRT_VisibilityState,\n useMaterialReactTable,\n MRT_TableContainer,\n MRT_Column,\n MRT_ColumnDef,\n MRT_TableInstance,\n} from \"material-react-table\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n ArrowDownIcon,\n ArrowUnsortedIcon,\n ChevronDownIcon,\n DragIndicatorIcon,\n MoreIcon,\n} from \"../icons.generated\";\nimport { densityValues } from \"./constants\";\nimport { Pagination, paginationTypeValues, usePagination } from \"../Pagination\";\nimport { DataFilter, DataFilters } from \"../labs/DataFilters\";\nimport {\n DataTableRowActions,\n DataTableRowActionsProps,\n} from \"./DataTableRowActions\";\nimport { useRowReordering } from \"./useRowReordering\";\nimport { DataTableSettings } from \"./DataTableSettings\";\nimport { MenuButton, MenuButtonProps } from \"../MenuButton\";\nimport { Box } from \"../Box\";\nimport { DataTableRowSelectionState, DataTableRowData } from \".\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext\";\nimport { useScrollIndication } from \"./useScrollIndication\";\nimport styled from \"@emotion/styled\";\nimport { EmptyState } from \"../EmptyState\";\nimport { Button } from \"../Button\";\nimport { Callout } from \"../Callout\";\n\nexport type DataTableColumn<T extends DataTableRowData> = MRT_ColumnDef<T> & {\n /\n @deprecated use hasTextWrapping instead of enableWrapping\n /\n enableWrapping?: boolean;\n hasTextWrapping?: boolean;\n};\n\ntype DataTableColumnInstance<T extends DataTableRowData> = Omit<\n MRT_Column<T, unknown>,\n \"columnDef\"\n> & {\n columnDef: DataTableColumn<T>;\n};\n\ntype DataTableCell<T extends DataTableRowData> = Omit<MRT_Cell<T>, \"column\"> & {\n column: DataTableColumnInstance<T>;\n};\n\nexport type DataTableGetDataType = {\n page?: number;\n resultsPerPage?: number;\n search?: string;\n filters?: DataFilter[];\n sort?: MRT_SortingState;\n};\n\nexport type DataTableOnReorderRowsType = {\n rowId: string;\n newRowIndex: number;\n};\n\nexport type DataTableRenderDetailPanelType = {\n row: MRT_Row<DataTableRowData>;\n table: MRT_TableInstance<DataTableRowData>;\n};\n\nexport type DataTableProps = {\n /\n An optional action button above the table.\n /\n additionalActionButton?: ReactNode;\n /\n MenuItems that go in an optional action menu above the table.\n /\n additionalActionMenuItems?: ReactNode;\n /\n Menu items to include in the bulk actions menu, which appears above the table if a row or rows are selected\n /\n bulkActionMenuItems?: (\n selectedRows: MRT_RowSelectionState,\n ) => MenuButtonProps[\"children\"];\n /\n The columns that make up the table\n /\n columns: DataTableColumn<DataTableRowData>[];\n /\n The current page number.\n /\n currentPage?: number;\n /\n If `error` is not undefined, the DataTable will indicate an error.\n /\n errorMessage?: string;\n /\n The component to display when the table is displaying the initial empty state\n /\n emptyPlaceholder?: ReactNode;\n /\n An optional set of filters to render in the filters menu\n /\n filters?: Array<DataFilter \| DataTableColumn<DataTableRowData> \| string>;\n /\n The function to get the ID of a row\n /\n getRowId?: MRT_TableOptions<DataTableRowData>[\"getRowId\"];\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 getData: ({\n page,\n resultsPerPage,\n search,\n filters,\n sort,\n }: DataTableGetDataType) =>\n \| MRT_TableOptions<DataTableRowData>[\"data\"]\n \| Promise<MRT_TableOptions<DataTableRowData>[\"data\"]>;\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 end user can reorder rows via a drag-and-drop interface\n /\n hasRowReordering?: 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 search field will include a Search button, rather than\n * firing on input change.\n /\n hasSearchSubmitButton?: 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 will be able to change the table density.\n /\n hasChangeableDensity?: boolean;\n /\n The initial density (height & padding) of the table rows. This is available even if the\n * table density isn't changeable by the end user via hasChangeableDensity.\n /\n initialDensity?: (typeof densityValues)[number];\n /\n The initial search value\n /\n initialSearchValue?: string;\n /\n Is the next or show-more button disabled\n /\n isPaginationMoreDisabled?: boolean;\n /\n The component to display when the query returns no results\n /\n noResultsPlaceholder?: ReactNode;\n /\n The number of results per page.\n /\n resultsPerPage?: number;\n /\n The optional component to display when expanding a row.\n /\n renderDetailPanel?: MRT_TableOptions<DataTableRowData>[\"renderDetailPanel\"];\n /\n Action buttons to display in each row\n /\n rowActionButtons?: DataTableRowActionsProps[\"rowActionButtons\"];\n /\n Menu items to include in the optional actions menu on each row.\n /\n rowActionMenuItems?: DataTableRowActionsProps[\"rowActionMenuItems\"];\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 onChangeRowSelection?: (rowSelection: DataTableRowSelectionState) => void;\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 onReorderRows?: ({ rowId, newRowIndex }: DataTableOnReorderRowsType) => void;\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 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 largest number of rows allowed to be shown per page. This only affects the row input\n * in pagination.\n /\n maxResultsPerPage?: number;\n /\n The highest page number allowed to be manually input in pagination\n /\n maxPages?: number;\n};\n\nconst ScrollableTableContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"isScrollableStart\" &&\n prop !== \"isScrollableEnd\",\n})(\n ({\n odysseyDesignTokens,\n isScrollableStart,\n isScrollableEnd,\n }: {\n odysseyDesignTokens: DesignTokens;\n isScrollableStart: boolean;\n isScrollableEnd: boolean;\n }) => ({\n marginBlockEnd: odysseyDesignTokens.Spacing4,\n position: \"relative\",\n borderInlineStartColor: isScrollableStart\n ? odysseyDesignTokens.HueNeutral200\n : \"transparent\",\n borderInlineStartStyle: \"solid\",\n borderInlineStartWidth: odysseyDesignTokens.BorderWidthMain,\n \"::before\": {\n background:\n \"linear-gradient(-90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.33) 50%, rgba(0, 0, 0, 1) 100%)\",\n content: '\"\"',\n opacity: isScrollableStart ? \"0.075\" : \"0\",\n pointerEvents: \"none\",\n position: \"absolute\",\n top: 0,\n left: 0,\n bottom: 0,\n width: odysseyDesignTokens.Spacing6,\n zIndex: 100,\n transition: `opacity ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n },\n borderInlineEndColor: isScrollableEnd\n ? odysseyDesignTokens.HueNeutral200\n : \"transparent\",\n borderInlineEndStyle: \"solid\",\n borderInlineEndWidth: odysseyDesignTokens.BorderWidthMain,\n \"::after\": {\n background:\n \"linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.33) 50%, rgba(0, 0, 0, 1) 100%)\",\n content: '\"\"',\n opacity: isScrollableEnd ? \"0.075\" : \"0\",\n pointerEvents: \"none\",\n position: \"absolute\",\n top: 0,\n right: 0,\n bottom: 0,\n width: odysseyDesignTokens.Spacing6,\n transition: `opacity ${odysseyDesignTokens.TransitionDurationMain} ${odysseyDesignTokens.TransitionTimingMain}`,\n },\n }),\n);\n\nconst DataTable = ({\n additionalActionButton,\n additionalActionMenuItems,\n bulkActionMenuItems,\n columns,\n currentPage = 1,\n emptyPlaceholder,\n errorMessage: errorMessageProp,\n filters: filtersProp,\n getData,\n getRowId: getRowIdProp,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSearchSubmitButton,\n hasSorting,\n initialDensity = densityValues[0],\n initialSearchValue = \"\",\n isPaginationMoreDisabled,\n noResultsPlaceholder,\n onChangeRowSelection,\n onReorderRows,\n paginationType = \"paged\",\n renderDetailPanel,\n resultsPerPage = 20,\n maxResultsPerPage,\n maxPages,\n rowActionButtons,\n rowActionMenuItems,\n searchDelayTime,\n totalRows,\n}: DataTableProps) => {\n const { t } = useTranslation();\n\n const [data, setData] = useState<DataTableRowData[]>([]);\n const [pagination, setPagination] = useState({\n pageIndex: currentPage,\n pageSize: resultsPerPage,\n });\n const [draggingRow, setDraggingRow] =\n useState<MRT_Row<DataTableRowData> \| null>();\n const [isTableContainerScrolledToStart, setIsTableContainerScrolledToStart] =\n useState(true);\n const [isTableContainerScrolledToEnd, setIsTableContainerScrolledToEnd] =\n useState(true);\n const [tableInnerContainerWidth, setTableInnerContainerWidth] =\n useState<string>(\"100%\");\n const tableOuterContainerRef = useRef<HTMLDivElement>(null);\n const tableInnerContainerRef = useRef<HTMLDivElement>(null);\n const tableContentRef = useRef<HTMLTableElement>(null);\n\n // Table states\n const [columnSorting, setColumnSorting] = useState<MRT_SortingState>([]);\n const [columnVisibility, setColumnVisibility] =\n useState<MRT_VisibilityState>();\n const [rowDensity, setRowDensity] =\n useState<MRT_DensityState>(initialDensity);\n const [rowSelection, setRowSelection] = useState<MRT_RowSelectionState>({});\n const [search, setSearch] = useState<string>(initialSearchValue);\n const [filters, setFilters] = useState<DataFilter[]>();\n const [initialFilters, setInitialFilters] = useState<DataFilter[]>();\n const [isLoading, setIsLoading] = useState<boolean \| undefined>(true);\n const [isEmpty, setIsEmpty] = useState<boolean \| undefined>();\n const [errorMessage, setErrorMessage] = useState<string \| undefined>(\n errorMessageProp,\n );\n\n useScrollIndication({\n tableOuterContainer: tableOuterContainerRef.current,\n tableInnerContainer: tableInnerContainerRef.current,\n setIsTableContainerScrolledToStart: setIsTableContainerScrolledToStart,\n setIsTableContainerScrolledToEnd: setIsTableContainerScrolledToEnd,\n setTableInnerContainerWidth: setTableInnerContainerWidth,\n });\n\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const {\n dragHandleStyles,\n dragHandleText,\n draggableTableBodyRowClassName,\n handleDragHandleKeyDown,\n handleDragHandleOnDragCapture,\n handleDragHandleOnDragEnd,\n resetDraggingAndHoveredRow,\n updateRowOrder,\n } = useRowReordering({\n totalRows,\n onReorderRows,\n data,\n setData,\n draggingRow,\n setDraggingRow,\n resultsPerPage: pagination.pageSize,\n page: pagination.pageIndex,\n });\n\n const getRowId = getRowIdProp\n ? getRowIdProp\n : (row: DataTableRowData) => row.id;\n\n const rowDensityClassName = useMemo(() => {\n return rowDensity === \"spacious\"\n ? \"MuiTableBody-spacious\"\n : rowDensity === \"compact\"\n ? \"MuiTableBody-compact\"\n : \"MuiTableBody-default\";\n }, [rowDensity]);\n\n const renderRowActions = useCallback(\n ({ row }: { row: MRT_Row<DataTableRowData> }) => {\n const currentIndex =\n row.index + (pagination.pageIndex - 1) pagination.pageSize;\n return (\n <DataTableRowActions\n row={row}\n rowIndex={currentIndex}\n rowActionButtons={rowActionButtons}\n rowActionMenuItems={rowActionMenuItems}\n totalRows={totalRows}\n updateRowOrder={\n hasRowReordering && onReorderRows ? updateRowOrder : undefined\n }\n />\n );\n },\n [\n pagination,\n rowActionButtons,\n rowActionMenuItems,\n hasRowReordering,\n onReorderRows,\n totalRows,\n updateRowOrder,\n ],\n );\n\n /*\n This hack is to provide compatibility with Material-React-Table's\n * filterOptions format, which allows for strings and { label: string, value: string }\n /\n const convertFilterSelectOptions = useCallback(\n (options: DataTableColumn<DataTableRowData>[\"filterSelectOptions\"]) =>\n options?.map((option) =>\n typeof option === \"string\"\n ? {\n label: option,\n value: option,\n }\n : {\n // If the option isn't a string, it must have value and/or option defined\n // If either is undefined, use the other\n label: option.label ?? option.value,\n value: option.value ?? option.label,\n },\n ),\n [],\n );\n\n const convertColumnToFilter = useCallback(\n (column: DataTableColumn<DataTableRowData>) =>\n column.enableColumnFilter !== false && column.accessorKey\n ? ({\n id: column.accessorKey,\n label: column.header,\n variant: column.filterVariant,\n options: convertFilterSelectOptions(column.filterSelectOptions),\n } satisfies DataFilter as DataFilter)\n : null,\n [convertFilterSelectOptions],\n );\n\n /\n Filters default to the columns, but can be overridden\n * with the `filters` prop. `filters` should be an array\n * of column accessorKeys, column defs, or DataFilters.\n */\n const dataTableFilters = useMemo(() => {\n const providedFilters = filtersProp \|\| columns;\n return providedFilters.reduce<DataFilter[]>((accumulator, item) => {\n if (typeof item === \"string\") {\n const foundColumn = columns.find(\n (column) => column.accessorKey === item,\n );\n if (foundColumn) {\n const filter = convertColumnToFilter(foundColumn);\n if (filter) {\n return accumulator.concat(filter);\n }\n }\n } else if (\"accessorKey\" in item) {\n // Checks if it's a column\n const filter = convertColumnToFilter(item);\n if (filter) {\n return accumulator.concat(filter);\n }\n } else if (\"label\" in item) {\n // Checks if it's a DataFilter\n return accumulator.concat(item);\n }\n // If none of the conditions match, item is ignored (not mapping to undefined)\n return accumulator;\n }, []);\n }, [columns, filtersProp, convertColumnToFilter]);\n\n const defaultCell = useCallback(\n ({ cell }: { cell: DataTableCell<DataTableRowData> }) => {\n const value = cell.getValue<string>();\n const hasTextWrapping =\n cell.column.columnDef.hasTextWrapping \|\|\n cell.column.columnDef.enableWrapping;\n\n return hasTextWrapping ? (\n value\n ) : (\n <Box\n sx={{\n whiteSpace: \"nowrap\",\n textOverflow: \"ellipsis\",\n overflow: \"hidden\",\n }}\n >\n {value}\n </Box>\n );\n },\n [],\n );\n\n const emptyState = useCallback(() => {\n const noResultsInnerContent = noResultsPlaceholder \|\| (\n <EmptyState\n heading={t(\"table.noresults.heading\")}\n description={t(\"table.noresults.text\")}\n />\n );\n\n const emptyStateInnerContent =\n emptyPlaceholder && isEmpty ? emptyPlaceholder : noResultsInnerContent;\n\n return (\n <Box sx={{ width: tableInnerContainerWidth }}>\n {emptyStateInnerContent}\n </Box>\n );\n }, [\n emptyPlaceholder,\n isEmpty,\n noResultsPlaceholder,\n t,\n tableInnerContainerWidth,\n ]);\n\n const columnIds = useMemo(() => {\n return columns.map((column) => column.accessorKey);\n }, [columns]);\n\n const columnOrder = useMemo(\n () => [\n \"mrt-row-drag\",\n \"mrt-row-select\",\n \"mrt-row-expand\",\n ...columnIds,\n \"mrt-row-actions\",\n ],\n [columnIds],\n ) as string[];\n\n const shouldDisplayRowActions = useMemo(\n () =>\n (hasRowReordering === true && onReorderRows) \|\|\n rowActionButtons \|\|\n rowActionMenuItems\n ? true\n : false,\n [hasRowReordering, onReorderRows, rowActionButtons, rowActionMenuItems],\n );\n\n const dataTable = useMaterialReactTable({\n columns: columns,\n data: data,\n getRowId: getRowId,\n state: {\n sorting: columnSorting,\n globalFilter: search,\n columnVisibility,\n isLoading,\n rowSelection,\n columnOrder,\n },\n icons: {\n ArrowDownwardIcon: ArrowDownIcon,\n DragHandleIcon: DragIndicatorIcon,\n SyncAltIcon: ArrowUnsortedIcon,\n ExpandMoreIcon: ChevronDownIcon,\n },\n\n // Base table settings\n enableColumnActions: false,\n enableColumnResizing: hasColumnResizing,\n enableDensityToggle: false,\n enableFilters: false,\n enableFullScreenToggle: false,\n enableGlobalFilter: false,\n enableHiding: false,\n enablePagination: false,\n layoutMode: \"grid-no-grow\",\n manualFiltering: true,\n manualSorting: true,\n muiTablePaperProps: {\n elevation: 0,\n sx: {\n overflow: \"visible\",\n },\n },\n selectAllMode: \"all\",\n displayColumnDefOptions: {\n \"mrt-row-actions\": {\n header: \"\",\n grow: true,\n muiTableBodyCellProps: {\n align: \"right\",\n sx: {\n overflow: \"visible\",\n width: \"unset\",\n },\n className: \"ods-actions-cell\",\n },\n muiTableHeadCellProps: {\n align: \"right\",\n sx: {\n width: \"unset\",\n },\n className: \"ods-actions-cell\",\n children: (\n <Box sx={{ display: \"flex\", visibility: \"hidden\" }}>\n {rowActionButtons && rowActionButtons({ id: null })}\n {((hasRowReordering && onReorderRows) \|\| rowActionMenuItems) && (\n <Box>\n <Button\n endIcon={<MoreIcon />}\n size=\"small\"\n variant=\"floating\"\n ariaLabel={t(\"table.moreactions.arialabel\")}\n isDisabled\n />\n </Box>\n )}\n </Box>\n ),\n },\n },\n \"mrt-row-drag\": {\n header: \"\",\n muiTableBodyCellProps: {\n sx: {\n minWidth: 0,\n width: \"auto\",\n },\n className: \"ods-drag-handle\",\n },\n muiTableHeadCellProps: {\n sx: {\n minWidth: 0,\n width: \"auto\",\n },\n children: (\n // Add a spacer to simulate the width of the drag handle in the column.\n // Without this, the head cells are offset from their body cell counterparts\n <Box sx={{ marginInline: \"-0.1rem\" }}>\n <DragIndicatorIcon sx={{ marginInline: 1, opacity: 0 }} />\n </Box>\n ),\n },\n },\n \"mrt-row-select\": {\n muiTableHeadCellProps: {\n padding: \"checkbox\",\n },\n muiTableBodyCellProps: {\n padding: \"checkbox\",\n },\n },\n \"mrt-row-expand\": {\n header: \"\",\n },\n },\n muiTableBodyProps: () => ({\n className: rowDensityClassName,\n }),\n defaultColumn: {\n Cell: defaultCell,\n },\n muiTableBodyCellProps: ({ column }) => ({\n className: column.getIsResizing() ? \"isResizing\" : \"\",\n }),\n\n // Reordering\n enableRowOrdering: hasRowReordering && Boolean(onReorderRows),\n enableRowDragging: hasRowReordering && Boolean(onReorderRows),\n muiTableBodyRowProps: ({ table, row }) => ({\n className: draggableTableBodyRowClassName({\n currentRowId: row.id,\n draggingRowId: draggingRow?.id,\n hoveredRowId: table.getState().hoveredRow?.id,\n }),\n }),\n muiRowDragHandleProps: ({ table, row }) => ({\n onKeyDown: (event) => handleDragHandleKeyDown({ table, row, event }),\n onBlur: () => resetDraggingAndHoveredRow(table),\n onDragEnd: () => handleDragHandleOnDragEnd(table),\n onDragCapture: () => handleDragHandleOnDragCapture(table),\n sx: dragHandleStyles,\n ...dragHandleText,\n }),\n\n // Row actions\n enableRowActions: shouldDisplayRowActions,\n positionActionsColumn:\n \"last\" as MRT_TableOptions<DataTableRowData>[\"positionActionsColumn\"],\n renderRowActions: ({ row }) => renderRowActions({ row }),\n\n // Row selection\n enableRowSelection: hasRowSelection,\n onRowSelectionChange: setRowSelection,\n\n // Sorting\n enableSorting: hasSorting,\n onSortingChange: setColumnSorting,\n muiTableHeadCellProps: ({ column: currentColumn }) => ({\n className: columnSorting.find(\n (sortedColumn) => sortedColumn.id === currentColumn.id,\n )\n ? \"isSorted\"\n : \"isUnsorted\",\n }),\n\n // Virtualization\n enableRowVirtualization:\n paginationType !== \"loadMore\" && pagination.pageSize > 50,\n rowVirtualizerInstanceRef:\n useRef<MRT_RowVirtualizer<HTMLDivElement, HTMLTableRowElement>>(null),\n rowVirtualizerOptions: {\n overscan: 4,\n },\n\n // States\n renderEmptyRowsFallback: emptyState,\n\n // Refs\n muiTableProps: {\n ref: tableContentRef,\n className:\n !shouldDisplayRowActions && hasColumnResizing\n ? \"ods-hide-spacer-column\"\n : \"\",\n },\n\n muiTableContainerProps: {\n ref: tableInnerContainerRef,\n },\n\n // Row expansion\n enableExpandAll: false,\n renderDetailPanel: renderDetailPanel,\n });\n\n // Effects\n const bulkActionMenuButton = useMemo(\n () => (\n <>\n <MenuButton\n buttonVariant=\"secondary\"\n endIcon={<MoreIcon />}\n isDisabled={Object.keys(rowSelection).length === 0}\n ariaLabel=\"More actions\"\n >\n {bulkActionMenuItems?.(rowSelection)}\n </MenuButton>\n </>\n ),\n [bulkActionMenuItems, rowSelection],\n );\n\n useEffect(() => {\n (async () => {\n setIsLoading(true);\n setErrorMessage(errorMessageProp);\n try {\n const incomingData = await getData?.({\n page: pagination.pageIndex,\n resultsPerPage: pagination.pageSize,\n search,\n filters,\n sort: columnSorting,\n });\n setData(incomingData);\n } catch (error) {\n setErrorMessage(typeof error === \"string\" ? error : t(\"table.error\"));\n } finally {\n setIsLoading(false);\n }\n })();\n }, [\n columnSorting,\n errorMessageProp,\n filters,\n getData,\n pagination,\n search,\n t,\n ]);\n\n useEffect(() => {\n if (!initialFilters && filters) {\n setInitialFilters(filters);\n }\n\n setIsEmpty(\n pagination.pageIndex === currentPage &&\n pagination.pageSize === resultsPerPage &&\n search === \"\" &&\n filters === initialFilters &&\n data.length === 0,\n );\n }, [\n filters,\n pagination,\n search,\n data,\n currentPage,\n initialFilters,\n resultsPerPage,\n ]);\n\n useEffect(() => {\n setPagination((prev) => ({\n pageIndex: 1,\n pageSize: prev.pageSize,\n }));\n }, [filters, search]);\n\n useEffect(() => {\n onChangeRowSelection?.(rowSelection);\n }, [rowSelection, onChangeRowSelection]);\n\n const { lastRow } = usePagination({\n currentRowsCount: data.length,\n pageIndex: pagination.pageIndex,\n pageSize: pagination.pageSize,\n totalRows,\n });\n\n // Render the table\n return (\n <>\n {(hasSearch \|\|\n hasFilters \|\|\n hasChangeableDensity \|\|\n hasColumnVisibility \|\|\n bulkActionMenuItems \|\|\n additionalActionButton \|\|\n additionalActionMenuItems) && (\n <Box sx={{ marginBottom: 5 }}>\n <DataFilters\n onChangeSearch={hasSearch ? setSearch : undefined}\n onChangeFilters={hasFilters ? setFilters : undefined}\n hasSearchSubmitButton={hasSearchSubmitButton}\n searchDelayTime={searchDelayTime}\n filters={hasFilters ? dataTableFilters : undefined}\n defaultSearchTerm={initialSearchValue}\n isDisabled={isEmpty}\n additionalActions={\n <>\n <DataTableSettings\n hasChangeableDensity={hasChangeableDensity}\n rowDensity={rowDensity}\n setRowDensity={setRowDensity}\n hasColumnVisibility={hasColumnVisibility}\n columns={columns}\n columnVisibility={columnVisibility}\n setColumnVisibility={setColumnVisibility}\n />\n {bulkActionMenuItems && bulkActionMenuButton}\n {additionalActionButton}\n {additionalActionMenuItems && (\n <MenuButton\n endIcon={<MoreIcon />}\n ariaLabel={t(\"table.moreactions.arialabel\")}\n buttonVariant=\"secondary\"\n menuAlignment=\"right\"\n >\n {additionalActionMenuItems}\n </MenuButton>\n )}\n </>\n }\n />\n </Box>\n )}\n\n {errorMessage && (\n <Box sx={{ marginBlockEnd: 2 }}>\n <Callout severity=\"error\" text={errorMessage} />\n </Box>\n )}\n\n <ScrollableTableContainer\n odysseyDesignTokens={odysseyDesignTokens}\n isScrollableStart={!isTableContainerScrolledToStart}\n isScrollableEnd={!isTableContainerScrolledToEnd}\n ref={tableOuterContainerRef}\n >\n <MRT_TableContainer table={dataTable} />\n </ScrollableTableContainer>\n\n {hasPagination && (\n <Pagination\n pageIndex={pagination.pageIndex}\n pageSize={pagination.pageSize}\n maxPageIndex={maxPages}\n maxPageSize={maxResultsPerPage}\n onPaginationChange={setPagination}\n lastRow={lastRow}\n totalRows={totalRows}\n currentRowsCount={data.length}\n isDisabled={isEmpty}\n isMoreDisabled={isPaginationMoreDisabled}\n variant={paginationType}\n rowsPerPageLabel={t(\"pagination.rowsperpage\")}\n currentPageLabel={t(\"pagination.page\")}\n previousLabel={t(\"pagination.previous\")}\n nextLabel={t(\"pagination.next\")}\n loadMoreLabel={t(\"pagination.loadmore\")}\n />\n )}\n </>\n );\n};\n\nconst MemoizedDataTable = memo(DataTable);\nMemoizedDataTable.displayName = \"DataTable\";\n\nexport { MemoizedDataTable as DataTable };\n"],"mappings":"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"}

package/dist/DataTable/useScrollIndication.js CHANGED Viewed

@@ -44,8 +44,8 @@ export const useScrollIndication = ({
         setTableInnerContainerWidth(tableInnerContainer?.clientWidth ? `${tableInnerContainer.clientWidth}px` : "100%");
       }, 100);
     });
-    if (tableOuterContainer) {
-      resizeObserverRef.current.observe(tableOuterContainer);
+    if (tableOuterContainer && tableOuterContainer.parentElement) {
+      resizeObserverRef.current.observe(tableOuterContainer.parentElement);
     }
     return () => {
       if (resizeObserverRef.current) {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"useScrollIndication.js","names":["useCallback","useEffect","useRef","useScrollIndication","tableOuterContainer","tableInnerContainer","setIsTableContainerScrolledToStart","setIsTableContainerScrolledToEnd","setTableInnerContainerWidth","animationFrameIdRef","resizeObserverRef","checkScrollIndicators","containerWidth","clientWidth","contentWidth","scrollWidth","containerStartScrollPosition","scrollLeft","containerEndScrollPosition","current","debounceTimer","ResizeObserver","clearTimeout","setTimeout","requestAnimationFrame","observe","disconnect","cancelAnimationFrame","addEventListener","removeEventListener"],"sources":["../../src/DataTable/useScrollIndication.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 Dispatch,\n SetStateAction,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\n\ntype UseScrollIndicationProps = {\n tableOuterContainer: HTMLDivElement \| null;\n tableInnerContainer: HTMLDivElement \| null;\n setIsTableContainerScrolledToStart: Dispatch<SetStateAction<boolean>>;\n setIsTableContainerScrolledToEnd: Dispatch<SetStateAction<boolean>>;\n setTableInnerContainerWidth: Dispatch<SetStateAction<string>>;\n};\nexport const useScrollIndication = ({\n tableOuterContainer,\n tableInnerContainer,\n setIsTableContainerScrolledToStart,\n setIsTableContainerScrolledToEnd,\n setTableInnerContainerWidth,\n}: UseScrollIndicationProps) => {\n const animationFrameIdRef = useRef<number \| null>(null);\n\n const resizeObserverRef = useRef<ResizeObserver \| null>(null);\n\n const checkScrollIndicators = useCallback(() => {\n if (!tableOuterContainer \|\| !tableInnerContainer) return;\n\n const containerWidth = tableOuterContainer.clientWidth;\n const contentWidth = tableInnerContainer.scrollWidth;\n const containerStartScrollPosition = tableInnerContainer.scrollLeft;\n const containerEndScrollPosition =\n containerStartScrollPosition + containerWidth;\n\n setIsTableContainerScrolledToStart(containerStartScrollPosition <= 16);\n setIsTableContainerScrolledToEnd(\n containerEndScrollPosition >= contentWidth - 16,\n );\n }, [\n tableInnerContainer,\n tableOuterContainer,\n setIsTableContainerScrolledToEnd,\n setIsTableContainerScrolledToStart,\n ]);\n\n useEffect(() => {\n if (resizeObserverRef.current) return; // Avoid creating multiple observers\n\n let debounceTimer: ReturnType<typeof setTimeout>;\n\n resizeObserverRef.current = new ResizeObserver(() => {\n clearTimeout(debounceTimer);\n debounceTimer = setTimeout(() => {\n if (!animationFrameIdRef.current) {\n animationFrameIdRef.current = requestAnimationFrame(() => {\n checkScrollIndicators();\n animationFrameIdRef.current = null;\n });\n }\n\n setTableInnerContainerWidth(\n tableInnerContainer?.clientWidth\n ? `${tableInnerContainer.clientWidth}px`\n : \"100%\",\n );\n }, 100); // debounce delay\n });\n\n if (tableOuterContainer) {\n resizeObserverRef.current.observe(tableOuterContainer);\n }\n\n return () => {\n if (resizeObserverRef.current) {\n resizeObserverRef.current.disconnect();\n resizeObserverRef.current = null;\n }\n clearTimeout(debounceTimer); // Ensure timer is cleared on component unmount\n if (animationFrameIdRef.current) {\n cancelAnimationFrame(animationFrameIdRef.current);\n animationFrameIdRef.current = null;\n }\n };\n }, [\n checkScrollIndicators,\n setTableInnerContainerWidth,\n tableOuterContainer,\n tableInnerContainer,\n setIsTableContainerScrolledToStart,\n setIsTableContainerScrolledToEnd,\n ]);\n\n useEffect(() => {\n tableInnerContainer?.addEventListener(\"scroll\", checkScrollIndicators);\n return () =>\n tableInnerContainer?.removeEventListener(\"scroll\", checkScrollIndicators);\n }, [tableInnerContainer, checkScrollIndicators]); // Re-run when innerContainerRef changes\n\n // Initial check to set state correctly on mount\n useEffect(() => {\n checkScrollIndicators();\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAGEA,WAAW,EACXC,SAAS,EACTC,MAAM,QACD,OAAO;AASd,OAAO,MAAMC,mBAAmB,GAAGA,CAAC;EAClCC,mBAAmB;EACnBC,mBAAmB;EACnBC,kCAAkC;EAClCC,gCAAgC;EAChCC;AACwB,CAAC,KAAK;EAC9B,MAAMC,mBAAmB,GAAGP,MAAM,CAAgB,IAAI,CAAC;EAEvD,MAAMQ,iBAAiB,GAAGR,MAAM,CAAwB,IAAI,CAAC;EAE7D,MAAMS,qBAAqB,GAAGX,WAAW,CAAC,MAAM;IAC9C,IAAI,CAACI,mBAAmB,IAAI,CAACC,mBAAmB,EAAE;IAElD,MAAMO,cAAc,GAAGR,mBAAmB,CAACS,WAAW;IACtD,MAAMC,YAAY,GAAGT,mBAAmB,CAACU,WAAW;IACpD,MAAMC,4BAA4B,GAAGX,mBAAmB,CAACY,UAAU;IACnE,MAAMC,0BAA0B,GAC9BF,4BAA4B,GAAGJ,cAAc;IAE/CN,kCAAkC,CAACU,4BAA4B,IAAI,EAAE,CAAC;IACtET,gCAAgC,CAC9BW,0BAA0B,IAAIJ,YAAY,GAAG,EAC/C,CAAC;EACH,CAAC,EAAE,CACDT,mBAAmB,EACnBD,mBAAmB,EACnBG,gCAAgC,EAChCD,kCAAkC,CACnC,CAAC;EAEFL,SAAS,CAAC,MAAM;IACd,IAAIS,iBAAiB,CAACS,OAAO,EAAE;IAE/B,IAAIC,aAA4C;IAEhDV,iBAAiB,CAACS,OAAO,GAAG,IAAIE,cAAc,CAAC,MAAM;MACnDC,YAAY,CAACF,aAAa,CAAC;MAC3BA,aAAa,GAAGG,UAAU,CAAC,MAAM;QAC/B,IAAI,CAACd,mBAAmB,CAACU,OAAO,EAAE;UAChCV,mBAAmB,CAACU,OAAO,GAAGK,qBAAqB,CAAC,MAAM;YACxDb,qBAAqB,CAAC,CAAC;YACvBF,mBAAmB,CAACU,OAAO,GAAG,IAAI;UACpC,CAAC,CAAC;QACJ;QAEAX,2BAA2B,CACzBH,mBAAmB,EAAEQ,WAAW,GAC3B,GAAER,mBAAmB,CAACQ,WAAY,IAAG,GACtC,MACN,CAAC;MACH,CAAC,EAAE,GAAG,CAAC;IACT,CAAC,CAAC;IAEF,IAAIT,mBAAmB,EAAE;~~MACvBM~~,iBAAiB,CAACS,OAAO,~~CAACM~~,OAAO,~~CAACrB~~,mBAAmB,CAAC;~~IACxD~~;IAEA,OAAO,MAAM;MACX,~~IAAIM~~,iBAAiB,CAACS,OAAO,EAAE;QAC7BT,iBAAiB,CAACS,OAAO,~~CAACO~~,UAAU,CAAC,CAAC;~~QACtChB~~,iBAAiB,CAACS,OAAO,GAAG,IAAI;MAClC;MACAG,YAAY,CAACF,aAAa,CAAC;MAC3B,IAAIX,mBAAmB,CAACU,OAAO,EAAE;QAC/BQ,oBAAoB,~~CAAClB~~,mBAAmB,CAACU,OAAO,CAAC;QACjDV,mBAAmB,CAACU,OAAO,GAAG,IAAI;MACpC;IACF,CAAC;EACH,CAAC,EAAE,CACDR,qBAAqB,EACrBH,2BAA2B,EAC3BJ,mBAAmB,EACnBC,mBAAmB,EACnBC,kCAAkC,EAClCC,gCAAgC,CACjC,CAAC;EAEFN,SAAS,CAAC,MAAM;IACdI,mBAAmB,~~EAAEuB~~,gBAAgB,CAAC,QAAQ,~~EAAEjB~~,qBAAqB,CAAC;IACtE,OAAO,MACLN,mBAAmB,~~EAAEwB~~,mBAAmB,CAAC,QAAQ,~~EAAElB~~,qBAAqB,CAAC;EAC7E,CAAC,EAAE,CAACN,mBAAmB,EAAEM,qBAAqB,CAAC,CAAC;EAGhDV,SAAS,CAAC,MAAM;IACdU,qBAAqB,CAAC,CAAC;EAGzB,CAAC,EAAE,EAAE,CAAC;AACR,CAAC"}
1	+ {"version":3,"file":"useScrollIndication.js","names":["useCallback","useEffect","useRef","useScrollIndication","tableOuterContainer","tableInnerContainer","setIsTableContainerScrolledToStart","setIsTableContainerScrolledToEnd","setTableInnerContainerWidth","animationFrameIdRef","resizeObserverRef","checkScrollIndicators","containerWidth","clientWidth","contentWidth","scrollWidth","containerStartScrollPosition","scrollLeft","containerEndScrollPosition","current","debounceTimer","ResizeObserver","clearTimeout","setTimeout","requestAnimationFrame","parentElement","observe","disconnect","cancelAnimationFrame","addEventListener","removeEventListener"],"sources":["../../src/DataTable/useScrollIndication.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 Dispatch,\n SetStateAction,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\n\ntype UseScrollIndicationProps = {\n tableOuterContainer: HTMLDivElement \| null;\n tableInnerContainer: HTMLDivElement \| null;\n setIsTableContainerScrolledToStart: Dispatch<SetStateAction<boolean>>;\n setIsTableContainerScrolledToEnd: Dispatch<SetStateAction<boolean>>;\n setTableInnerContainerWidth: Dispatch<SetStateAction<string>>;\n};\nexport const useScrollIndication = ({\n tableOuterContainer,\n tableInnerContainer,\n setIsTableContainerScrolledToStart,\n setIsTableContainerScrolledToEnd,\n setTableInnerContainerWidth,\n}: UseScrollIndicationProps) => {\n const animationFrameIdRef = useRef<number \| null>(null);\n\n const resizeObserverRef = useRef<ResizeObserver \| null>(null);\n\n const checkScrollIndicators = useCallback(() => {\n if (!tableOuterContainer \|\| !tableInnerContainer) return;\n\n const containerWidth = tableOuterContainer.clientWidth;\n const contentWidth = tableInnerContainer.scrollWidth;\n const containerStartScrollPosition = tableInnerContainer.scrollLeft;\n const containerEndScrollPosition =\n containerStartScrollPosition + containerWidth;\n\n setIsTableContainerScrolledToStart(containerStartScrollPosition <= 16);\n setIsTableContainerScrolledToEnd(\n containerEndScrollPosition >= contentWidth - 16,\n );\n }, [\n tableInnerContainer,\n tableOuterContainer,\n setIsTableContainerScrolledToEnd,\n setIsTableContainerScrolledToStart,\n ]);\n\n useEffect(() => {\n if (resizeObserverRef.current) return; // Avoid creating multiple observers\n\n let debounceTimer: ReturnType<typeof setTimeout>;\n\n resizeObserverRef.current = new ResizeObserver(() => {\n clearTimeout(debounceTimer);\n debounceTimer = setTimeout(() => {\n if (!animationFrameIdRef.current) {\n animationFrameIdRef.current = requestAnimationFrame(() => {\n checkScrollIndicators();\n animationFrameIdRef.current = null;\n });\n }\n\n setTableInnerContainerWidth(\n tableInnerContainer?.clientWidth\n ? `${tableInnerContainer.clientWidth}px`\n : \"100%\",\n );\n }, 100); // debounce delay\n });\n\n if (tableOuterContainer && tableOuterContainer.parentElement) {\n resizeObserverRef.current.observe(tableOuterContainer.parentElement);\n }\n\n return () => {\n if (resizeObserverRef.current) {\n resizeObserverRef.current.disconnect();\n resizeObserverRef.current = null;\n }\n clearTimeout(debounceTimer); // Ensure timer is cleared on component unmount\n if (animationFrameIdRef.current) {\n cancelAnimationFrame(animationFrameIdRef.current);\n animationFrameIdRef.current = null;\n }\n };\n }, [\n checkScrollIndicators,\n setTableInnerContainerWidth,\n tableOuterContainer,\n tableInnerContainer,\n setIsTableContainerScrolledToStart,\n setIsTableContainerScrolledToEnd,\n ]);\n\n useEffect(() => {\n tableInnerContainer?.addEventListener(\"scroll\", checkScrollIndicators);\n return () =>\n tableInnerContainer?.removeEventListener(\"scroll\", checkScrollIndicators);\n }, [tableInnerContainer, checkScrollIndicators]); // Re-run when innerContainerRef changes\n\n // Initial check to set state correctly on mount\n useEffect(() => {\n checkScrollIndicators();\n\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n};\n"],"mappings":"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"}

package/dist/Field.js CHANGED Viewed

@@ -36,6 +36,7 @@ const Field = ({
   isFullWidth = false,
   isRadioGroup = false,
   isOptional = false,
+  isReadOnly = false,
   label,
   renderFieldComponent
 }) => {
@@ -79,7 +80,8 @@ const Field = ({
       ariaDescribedBy: localAriaDescribedBy,
       errorMessageElementId,
       id,
-      labelElementId
+      labelElementId,
+      isReadOnly
     }), (errorMessage || errorMessageList) && _jsx(FieldError, {
       id: errorMessageElementId,
       message: errorMessage,

package/dist/Field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Field.js","names":["memo","useMemo","FieldError","FieldHint","FieldLabel","Typography","useFieldset","useTranslation","useUniqueId","jsxs","_jsxs","jsx","_jsx","fieldTypeValues","Field","ariaDescribedBy","errorMessage","errorMessageList","fieldType","hasVisibleLabel","hint","HintLinkComponent","id","idOverride","isDisabled","isDisabledProp","isFullWidth","isRadioGroup","isOptional","label","renderFieldComponent","t","hintId","undefined","errorMessageElementId","labelElementId","localAriaDescribedBy","join","trim","isFieldsetDisabled","_FormControl","component","disabled","error","Boolean","Array","isArray","length","role","fullWidth","children","_FormLabel","color","inputId","text","LinkComponent","message","messageList","MemoizedField","displayName"],"sources":["../src/Field.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 { memo, ReactElement, useMemo } from \"react\";\n\nimport {\n FormControl as MuiFormControl,\n FormLabel as MuiFormLabel,\n} from \"@mui/material\";\n\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { FieldError } from \"./FieldError\";\nimport { FieldHint } from \"./FieldHint\";\nimport { FieldLabel } from \"./FieldLabel\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport { Typography } from \"./Typography\";\nimport { useFieldset } from \"./FieldsetContext\";\nimport { useTranslation } from \"react-i18next\";\nimport { useUniqueId } from \"./useUniqueId\";\n\nexport const fieldTypeValues = [\"single\", \"group\"] as const;\n\nexport type RenderFieldComponentProps = {\n ariaDescribedBy?: string;\n dataSe?: string;\n errorMessageElementId?: string;\n id: string;\n labelElementId: string;\n};\n\nexport type FieldProps = {\n /\n If `error` is not undefined, the `input` will indicate an error.\n /\n errorMessageList?: string[];\n /\n The field type determines how ARIA components are setup. It's important to use this to denote if you expect only one component (like a text field) or multiple (like a radio group).\n /\n fieldType: (typeof fieldTypeValues)[number];\n /\n If `true`, the Field label will be shown\n /\n hasVisibleLabel: boolean;\n /\n Important for narrowing down the `fieldset` role to \"radiogroup\".\n /\n isRadioGroup?: boolean;\n /\n Important for determining if children inherit error state\n /\n isCheckboxGroup?: boolean;\n /\n The label for the `input` element.\n /\n label: string;\n /\n The short hint displayed in the `input` before the user enters a value.\n /\n placeholder?: string;\n /\n Render-props function that sends back ARIA props to your field component.\n */\n renderFieldComponent: ({\n ariaDescribedBy,\n dataSe,\n errorMessageElementId,\n id,\n labelElementId,\n }: RenderFieldComponentProps) => ReactElement;\n};\n\nconst Field = ({\n ariaDescribedBy,\n errorMessage,\n errorMessageList,\n fieldType,\n hasVisibleLabel,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled: isDisabledProp = false,\n isFullWidth = false,\n isRadioGroup = false,\n isOptional = false,\n label,\n renderFieldComponent,\n}: FieldProps &\n Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"errorMessageList\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isFullWidth\"\n \| \"isOptional\"\n > &\n Pick<HtmlProps, \"ariaDescribedBy\">) => {\n const { t } = useTranslation();\n\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n const errorMessageElementId =\n errorMessage \|\| errorMessageList ? `${id}-error` : undefined;\n const labelElementId = `${id}-label`;\n\n const localAriaDescribedBy = useMemo(\n () =>\n [hintId, errorMessageElementId, ariaDescribedBy].join(\" \").trim() \|\|\n undefined,\n [ariaDescribedBy, errorMessageElementId, hintId],\n );\n\n const { isDisabled: isFieldsetDisabled } = useFieldset();\n\n const isDisabled = useMemo(\n () => isDisabledProp \|\| isFieldsetDisabled,\n [isDisabledProp, isFieldsetDisabled],\n );\n\n return (\n <MuiFormControl\n component={fieldType === \"group\" ? \"fieldset\" : \"div\"}\n disabled={isDisabled}\n error={\n Boolean(errorMessage) \|\|\n (Array.isArray(errorMessageList) && errorMessageList.length > 0)\n }\n role={isRadioGroup ? \"radiogroup\" : undefined}\n fullWidth={isFullWidth}\n >\n {fieldType === \"group\" ? (\n <MuiFormLabel component=\"legend\" id={labelElementId}>\n {label}{\" \"}\n {isOptional && label && (\n <Typography component=\"span\" color=\"textSecondary\">\n ({t(\"fieldlabel.optional.text\")})\n </Typography>\n )}\n </MuiFormLabel>\n ) : (\n <FieldLabel\n hasVisibleLabel={hasVisibleLabel}\n id={labelElementId}\n inputId={id}\n isOptional={isOptional}\n text={label}\n />\n )}\n\n {hint && (\n <FieldHint id={hintId} LinkComponent={HintLinkComponent} text={hint} />\n )}\n\n {renderFieldComponent({\n ariaDescribedBy: localAriaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n })}\n\n {(errorMessage \|\| errorMessageList) && (\n <FieldError\n id={errorMessageElementId}\n message={errorMessage}\n messageList={errorMessageList}\n />\n )}\n </MuiFormControl>\n );\n};\n\nconst MemoizedField = memo(Field);\nMemoizedField.displayName = \"Field\";\n\nexport { MemoizedField as Field };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAgBC,OAAO,QAAQ,OAAO;AAAC,~~SAQ3CC~~,UAAU;AAAA,SACVC,SAAS;AAAA,SACTC,UAAU;AAAA,SAEVC,UAAU;AAAA,SACVC,WAAW;AACpB,SAASC,cAAc,QAAQ,eAAe;AAAC,SACtCC,WAAW;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAEpB,OAAO,MAAMC,eAAe,GAAG,CAAC,QAAQ,EAAE,OAAO,CAAU;~~AAmD3D~~,MAAMC,KAAK,GAAGA,CAAC;EACbC,eAAe;EACfC,YAAY;EACZC,gBAAgB;EAChBC,SAAS;EACTC,eAAe;EACfC,IAAI;EACJC,iBAAiB;EACjBC,EAAE,EAAEC,UAAU;EACdC,UAAU,EAAEC,cAAc,GAAG,KAAK;EAClCC,WAAW,GAAG,KAAK;EACnBC,YAAY,GAAG,KAAK;EACpBC,UAAU,GAAG,KAAK;EAClBC,KAAK;EACLC;~~AAaiC~~,CAAC,KAAK;EACvC,MAAM;IAAEC;EAAE,CAAC,~~GAAGxB~~,cAAc,CAAC,CAAC;EAE9B,MAAMe,EAAE,GAAGd,WAAW,CAACe,UAAU,CAAC;EAClC,~~MAAMS~~,MAAM,~~GAAGZ~~,IAAI,GAAI,GAAEE,EAAG,OAAM,~~GAAGW~~,SAAS;EAC9C,MAAMC,qBAAqB,~~GACzBlB~~,YAAY,IAAIC,gBAAgB,GAAI,GAAEK,EAAG,QAAO,~~GAAGW~~,SAAS;EAC9D,MAAME,cAAc,GAAI,~~GAAEb~~,EAAG,QAAO;EAEpC,~~MAAMc~~,oBAAoB,~~GAAGnC~~,OAAO,CAClC,MACE,~~CAAC+B~~,MAAM,EAAEE,qBAAqB,~~EAAEnB~~,eAAe,CAAC,~~CAACsB~~,IAAI,CAAC,GAAG,CAAC,CAACC,IAAI,CAAC,CAAC,IACjEL,SAAS,EACX,~~CAAClB~~,eAAe,~~EAAEmB~~,qBAAqB,EAAEF,MAAM,CACjD,CAAC;EAED,MAAM;~~IAAER~~,UAAU,~~EAAEe~~;EAAmB,CAAC,~~GAAGjC~~,WAAW,CAAC,CAAC;EAExD,MAAMkB,UAAU,GAAGvB,OAAO,CACxB,MAAMwB,cAAc,~~IAAIc~~,kBAAkB,EAC1C,~~CAACd~~,cAAc,~~EAAEc~~,kBAAkB,CACrC,CAAC;EAED,~~OACE7B~~,KAAA,~~CAAA8B~~,YAAA;IACEC,SAAS,~~EAAEvB~~,SAAS,KAAK,OAAO,GAAG,UAAU,GAAG,KAAM;~~IACtDwB~~,QAAQ,~~EAAElB~~,UAAW;~~IACrBmB~~,KAAK,EACHC,OAAO,~~CAAC5B~~,YAAY,CAAC,~~IACpB6B~~,KAAK,CAACC,OAAO,~~CAAC7B~~,gBAAgB,CAAC,IAAIA,gBAAgB,~~CAAC8B~~,MAAM,GAAG,CAC/D;IACDC,IAAI,~~EAAErB~~,YAAY,GAAG,YAAY,~~GAAGM~~,SAAU;IAC9CgB,SAAS,~~EAAEvB~~,WAAY;~~IAAAwB~~,QAAA,~~GAEtBhC~~,SAAS,KAAK,OAAO,GACpBR,KAAA,~~CAAAyC~~,UAAA;MAAcV,SAAS,EAAC,QAAQ;~~MAACnB~~,EAAE,~~EAAEa~~,cAAe;MAAAe,QAAA,GACjDrB,KAAK,EAAE,GAAG,~~EACVD~~,UAAU,~~IAAIC~~,KAAK,~~IAClBnB~~,KAAA,CAACL,UAAU;~~QAACoC~~,SAAS,EAAC,MAAM;QAACW,KAAK,EAAC,eAAe;QAAAF,QAAA,GAAC,GAChD,EAACnB,CAAC,CAAC,0BAA0B,CAAC,EAAC,GAClC;MAAA,CAAY,CACb;IAAA,CACW,CAAC,~~GAEfnB~~,IAAA,CAACR,UAAU;MACTe,eAAe,EAAEA,eAAgB;MACjCG,EAAE,~~EAAEa~~,cAAe;MACnBkB,OAAO,~~EAAE/B~~,EAAG;MACZM,UAAU,EAAEA,UAAW;~~MACvB0B~~,IAAI,EAAEzB;IAAM,CACb,CACF,~~EAEAT~~,IAAI,IACHR,IAAA,CAACT,SAAS;MAACmB,EAAE,~~EAAEU~~,MAAO;MAACuB,aAAa,~~EAAElC~~,iBAAkB;~~MAACiC~~,IAAI,~~EAAElC~~;IAAK,CAAE,CACvE,~~EAEAU~~,oBAAoB,CAAC;~~MACpBf~~,eAAe,~~EAAEqB~~,oBAAoB;MACrCF,qBAAqB;~~MACrBZ~~,EAAE;~~MACFa~~;IACF,CAAC,CAAC,EAED,~~CAACnB~~,YAAY,IAAIC,gBAAgB,KAChCL,IAAA,CAACV,UAAU;MACToB,EAAE,~~EAAEY~~,qBAAsB;MAC1BsB,OAAO,~~EAAExC~~,YAAa;~~MACtByC~~,WAAW,~~EAAExC~~;IAAiB,CAC/B,CACF;EAAA,CACa,CAAC;AAErB,CAAC;AAED,~~MAAMyC~~,aAAa,~~GAAG1D~~,IAAI,CAACc,KAAK,CAAC;~~AACjC4C~~,aAAa,CAACC,WAAW,GAAG,OAAO;AAEnC,SAASD,aAAa,~~IAAI5C~~,KAAK"}
1	+ {"version":3,"file":"Field.js","names":["memo","useMemo","FieldError","FieldHint","FieldLabel","Typography","useFieldset","useTranslation","useUniqueId","jsxs","_jsxs","jsx","_jsx","fieldTypeValues","Field","ariaDescribedBy","errorMessage","errorMessageList","fieldType","hasVisibleLabel","hint","HintLinkComponent","id","idOverride","isDisabled","isDisabledProp","isFullWidth","isRadioGroup","isOptional","isReadOnly","label","renderFieldComponent","t","hintId","undefined","errorMessageElementId","labelElementId","localAriaDescribedBy","join","trim","isFieldsetDisabled","_FormControl","component","disabled","error","Boolean","Array","isArray","length","role","fullWidth","children","_FormLabel","color","inputId","text","LinkComponent","message","messageList","MemoizedField","displayName"],"sources":["../src/Field.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 { memo, ReactElement, useMemo } from \"react\";\nimport {\n FormControl as MuiFormControl,\n FormLabel as MuiFormLabel,\n} from \"@mui/material\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { FieldError } from \"./FieldError\";\nimport { FieldHint } from \"./FieldHint\";\nimport { FieldLabel } from \"./FieldLabel\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport { Typography } from \"./Typography\";\nimport { useFieldset } from \"./FieldsetContext\";\nimport { useTranslation } from \"react-i18next\";\nimport { useUniqueId } from \"./useUniqueId\";\n\nexport const fieldTypeValues = [\"single\", \"group\"] as const;\n\nexport type RenderFieldComponentProps = {\n ariaDescribedBy?: string;\n dataSe?: string;\n errorMessageElementId?: string;\n id: string;\n labelElementId: string;\n isReadOnly?: boolean;\n};\n\nexport type FieldProps = {\n /\n If `error` is not undefined, the `input` will indicate an error.\n /\n errorMessageList?: string[];\n /\n The field type determines how ARIA components are setup. It's important to use this to denote if you expect only one component (like a text field) or multiple (like a radio group).\n /\n fieldType: (typeof fieldTypeValues)[number];\n /\n If `true`, the Field label will be shown\n /\n hasVisibleLabel: boolean;\n /\n Important for narrowing down the `fieldset` role to \"radiogroup\".\n /\n isRadioGroup?: boolean;\n /\n Important for determining if children inherit error state\n /\n isCheckboxGroup?: boolean;\n /\n The label for the `input` element.\n /\n label: string;\n /\n The short hint displayed in the `input` before the user enters a value.\n /\n placeholder?: string;\n /\n Render-props function that sends back ARIA props to your field component.\n */\n renderFieldComponent: ({\n ariaDescribedBy,\n dataSe,\n errorMessageElementId,\n id,\n labelElementId,\n isReadOnly,\n }: RenderFieldComponentProps) => ReactElement;\n};\n\nconst Field = ({\n ariaDescribedBy,\n errorMessage,\n errorMessageList,\n fieldType,\n hasVisibleLabel,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled: isDisabledProp = false,\n isFullWidth = false,\n isRadioGroup = false,\n isOptional = false,\n isReadOnly = false,\n label,\n renderFieldComponent,\n}: FieldProps &\n Pick<\n FieldComponentProps,\n \| \"errorMessage\"\n \| \"errorMessageList\"\n \| \"hint\"\n \| \"HintLinkComponent\"\n \| \"id\"\n \| \"isDisabled\"\n \| \"isFullWidth\"\n \| \"isOptional\"\n \| \"isReadOnly\"\n > &\n Pick<HtmlProps, \"ariaDescribedBy\">) => {\n const { t } = useTranslation();\n\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n const errorMessageElementId =\n errorMessage \|\| errorMessageList ? `${id}-error` : undefined;\n const labelElementId = `${id}-label`;\n\n const localAriaDescribedBy = useMemo(\n () =>\n [hintId, errorMessageElementId, ariaDescribedBy].join(\" \").trim() \|\|\n undefined,\n [ariaDescribedBy, errorMessageElementId, hintId],\n );\n\n const { isDisabled: isFieldsetDisabled } = useFieldset();\n\n const isDisabled = useMemo(\n () => isDisabledProp \|\| isFieldsetDisabled,\n [isDisabledProp, isFieldsetDisabled],\n );\n\n return (\n <MuiFormControl\n component={fieldType === \"group\" ? \"fieldset\" : \"div\"}\n disabled={isDisabled}\n error={\n Boolean(errorMessage) \|\|\n (Array.isArray(errorMessageList) && errorMessageList.length > 0)\n }\n role={isRadioGroup ? \"radiogroup\" : undefined}\n fullWidth={isFullWidth}\n >\n {fieldType === \"group\" ? (\n <MuiFormLabel component=\"legend\" id={labelElementId}>\n {label}{\" \"}\n {isOptional && label && (\n <Typography component=\"span\" color=\"textSecondary\">\n ({t(\"fieldlabel.optional.text\")})\n </Typography>\n )}\n </MuiFormLabel>\n ) : (\n <FieldLabel\n hasVisibleLabel={hasVisibleLabel}\n id={labelElementId}\n inputId={id}\n isOptional={isOptional}\n text={label}\n />\n )}\n\n {hint && (\n <FieldHint id={hintId} LinkComponent={HintLinkComponent} text={hint} />\n )}\n\n {renderFieldComponent({\n ariaDescribedBy: localAriaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n isReadOnly,\n })}\n\n {(errorMessage \|\| errorMessageList) && (\n <FieldError\n id={errorMessageElementId}\n message={errorMessage}\n messageList={errorMessageList}\n />\n )}\n </MuiFormControl>\n );\n};\n\nconst MemoizedField = memo(Field);\nMemoizedField.displayName = \"Field\";\n\nexport { MemoizedField as Field };\n"],"mappings":"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"}

package/dist/OdysseyCacheProvider.js CHANGED Viewed

@@ -18,6 +18,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const OdysseyCacheProvider = ({
   children,
   emotionRoot,
+  emotionRootElement,
   hasShadowDom: hasShadowDomProp,
   nonce,
   shadowDomElement,
@@ -27,8 +28,8 @@ const OdysseyCacheProvider = ({
   const hasShadowDom = hasShadowDomProp || shadowDomElement;
   const emotionCache = useMemo(() => {
     return createCache({
-      ...(emotionRoot && {
-        container: emotionRoot
+      ...((emotionRootElement || emotionRoot) && {
+        container: emotionRootElement || emotionRoot
       }),
       key: uniqueAlphabeticalId,
       nonce: nonce ?? window.cspNonce,
@@ -38,7 +39,7 @@ const OdysseyCacheProvider = ({
         stylisPlugins
       })
     });
-  }, [emotionRoot, hasShadowDom, nonce, stylisPlugins, uniqueAlphabeticalId]);
+  }, [emotionRoot, emotionRootElement, hasShadowDom, nonce, stylisPlugins, uniqueAlphabeticalId]);
   return _jsx(CacheProvider, {
     value: emotionCache,
     children: children

package/dist/OdysseyCacheProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","memo","useMemo","useUniqueAlphabeticalId","CacheProvider","jsx","_jsx","OdysseyCacheProvider","children","emotionRoot","hasShadowDom","hasShadowDomProp","nonce","shadowDomElement","stylisPlugins","uniqueAlphabeticalId","emotionCache","container","key","window","cspNonce","prepend","speedy","value","MemoizedOdysseyCacheProvider","displayName"],"sources":["../src/OdysseyCacheProvider.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\ndeclare global {\n interface Window {\n cspNonce: string;\n }\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { memo, useMemo, ReactNode } from \"react\";\nimport { useUniqueAlphabeticalId } from \"./useUniqueAlphabeticalId\";\nimport { CacheProvider } from \"@emotion/react\";\n\nexport type OdysseyCacheProviderProps = {\n children: ReactNode;\n /\n Emotion caches styles into the style element.\n * When enabling this prop, Emotion caches the styles at this element, rather than in <head>.\n /\n emotionRoot?: HTMLStyleElement;\n hasShadowDom?: boolean;\n nonce?: string;\n /\n Emotion renders into this HTML element.\n * When enabling this prop, Emotion renders at the top of this component rather than the bottom like it does in the HTML `<head>`.\n /\n /\n @deprecated Will be removed in a future Odyssey version. Use `hasShadowDomElement` instead.\n */\n shadowDomElement?: HTMLDivElement \| HTMLElement;\n stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n children,\n emotionRoot,\n hasShadowDom: hasShadowDomProp,\n nonce,\n shadowDomElement,\n stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n const hasShadowDom = hasShadowDomProp \|\| shadowDomElement;\n\n const emotionCache = useMemo(() => {\n return createCache({\n ...(emotionRoot && { container: emotionRoot }),\n key: uniqueAlphabeticalId,\n nonce: nonce ?? window.cspNonce,\n prepend: true,\n speedy: hasShadowDom ? false : true, // <-- Needs to be set to false when shadow-dom is used!! https://github.com/emotion-js/emotion/issues/2053#issuecomment-713429122\n ...(stylisPlugins && { stylisPlugins }),\n });\n }, [emotionRoot, hasShadowDom, nonce, stylisPlugins, uniqueAlphabeticalId]);\n\n return <CacheProvider value={emotionCache}>{children}</CacheProvider>;\n};\n\nconst MemoizedOdysseyCacheProvider = memo(OdysseyCacheProvider);\nMemoizedOdysseyCacheProvider.displayName = \"OdysseyCacheProvider\";\n\nexport { MemoizedOdysseyCacheProvider as OdysseyCacheProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAQA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,IAAI,EAAEC,OAAO,QAAmB,OAAO;AAAC,SACxCC,uBAAuB;AAChC,SAASC,aAAa,QAAQ,gBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA;~~AAsB~~/C,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,WAAW;EACXC,YAAY,EAAEC,gBAAgB;EAC9BC,KAAK;EACLC,gBAAgB;EAChBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,oBAAoB,~~GAAGZ~~,uBAAuB,CAAC,CAAC;EAEtD,~~MAAMO~~,YAAY,GAAGC,gBAAgB,IAAIE,gBAAgB;EAEzD,MAAMG,YAAY,~~GAAGd~~,OAAO,CAAC,MAAM;IACjC,OAAOF,WAAW,CAAC;MACjB,~~IAAIS~~,WAAW,~~IAAI~~;~~QAAEQ~~,SAAS,EAAER;~~MAAY~~,CAAC,CAAC;~~MAC9CS~~,GAAG,EAAEH,oBAAoB;MACzBH,KAAK,EAAEA,KAAK,IAAIO,MAAM,CAACC,QAAQ;MAC/BC,OAAO,EAAE,IAAI;MACbC,MAAM,EAAEZ,YAAY,GAAG,KAAK,GAAG,IAAI;MACnC,IAAII,aAAa,IAAI;QAAEA;MAAc,CAAC;IACxC,CAAC,CAAC;EACJ,CAAC,EAAE,~~CAACL~~,WAAW,~~EAAEC~~,YAAY,~~EAAEE~~,KAAK,~~EAAEE~~,aAAa,~~EAAEC~~,oBAAoB,~~CAAC~~,CAAC;~~EAE3E~~,~~OAAOT~~,IAAA,CAACF,aAAa;~~IAACmB~~,KAAK,EAAEP,YAAa;~~IAAAR~~,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,~~MAAMgB~~,4BAA4B,~~GAAGvB~~,IAAI,CAACM,oBAAoB,CAAC;AAC/~~DiB~~,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,~~IAAIjB~~,oBAAoB"}
1	+ {"version":3,"file":"OdysseyCacheProvider.js","names":["createCache","memo","useMemo","useUniqueAlphabeticalId","CacheProvider","jsx","_jsx","OdysseyCacheProvider","children","emotionRoot","emotionRootElement","hasShadowDom","hasShadowDomProp","nonce","shadowDomElement","stylisPlugins","uniqueAlphabeticalId","emotionCache","container","key","window","cspNonce","prepend","speedy","value","MemoizedOdysseyCacheProvider","displayName"],"sources":["../src/OdysseyCacheProvider.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\ndeclare global {\n interface Window {\n cspNonce: string;\n }\n}\n\nimport createCache, { StylisPlugin } from \"@emotion/cache\";\nimport { memo, useMemo, ReactNode } from \"react\";\nimport { useUniqueAlphabeticalId } from \"./useUniqueAlphabeticalId\";\nimport { CacheProvider } from \"@emotion/react\";\n\nexport type OdysseyCacheProviderProps = {\n children: ReactNode;\n /\n Emotion caches styles into the style element.\n * When enabling this prop, Emotion caches the styles at this element, rather than in <head>.\n * @deprecated Use `EmotionRootElement` instead. This was incorrectly configured as an `HTMLStyleElement`, but then we're rendering `<style>` inside `<style>`. We need this to be a `<div>` instead.\n /\n emotionRoot?: HTMLStyleElement;\n /\n Emotion adds `<style>` elements into this DOM node. Normally, Emotion puts these in `document.head`.\n * This is useful if you want to render into a Shadow DOM or iframe.\n /\n emotionRootElement?: HTMLElement;\n hasShadowDom?: boolean;\n nonce?: string;\n /\n Emotion renders into this HTML element.\n * When enabling this prop, Emotion renders at the top of this component rather than the bottom like it does in the HTML `<head>`.\n * @deprecated Will be removed in a future Odyssey version. Use `hasShadowDomElement` instead.\n */\n shadowDomElement?: HTMLDivElement \| HTMLElement;\n stylisPlugins?: StylisPlugin[];\n};\n\nconst OdysseyCacheProvider = ({\n children,\n emotionRoot,\n emotionRootElement,\n hasShadowDom: hasShadowDomProp,\n nonce,\n shadowDomElement,\n stylisPlugins,\n}: OdysseyCacheProviderProps) => {\n const uniqueAlphabeticalId = useUniqueAlphabeticalId();\n\n const hasShadowDom = hasShadowDomProp \|\| shadowDomElement;\n\n const emotionCache = useMemo(() => {\n return createCache({\n ...((emotionRootElement \|\| emotionRoot) && {\n container: emotionRootElement \|\| emotionRoot,\n }),\n key: uniqueAlphabeticalId,\n nonce: nonce ?? window.cspNonce,\n prepend: true,\n speedy: hasShadowDom ? false : true, // <-- Needs to be set to false when shadow-dom is used!! https://github.com/emotion-js/emotion/issues/2053#issuecomment-713429122\n ...(stylisPlugins && { stylisPlugins }),\n });\n }, [\n emotionRoot,\n emotionRootElement,\n hasShadowDom,\n nonce,\n stylisPlugins,\n uniqueAlphabeticalId,\n ]);\n\n return <CacheProvider value={emotionCache}>{children}</CacheProvider>;\n};\n\nconst MemoizedOdysseyCacheProvider = memo(OdysseyCacheProvider);\nMemoizedOdysseyCacheProvider.displayName = \"OdysseyCacheProvider\";\n\nexport { MemoizedOdysseyCacheProvider as OdysseyCacheProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAQA,OAAOA,WAAW,MAAwB,gBAAgB;AAC1D,SAASC,IAAI,EAAEC,OAAO,QAAmB,OAAO;AAAC,SACxCC,uBAAuB;AAChC,SAASC,aAAa,QAAQ,gBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA0B/C,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,WAAW;EACXC,kBAAkB;EAClBC,YAAY,EAAEC,gBAAgB;EAC9BC,KAAK;EACLC,gBAAgB;EAChBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,oBAAoB,GAAGb,uBAAuB,CAAC,CAAC;EAEtD,MAAMQ,YAAY,GAAGC,gBAAgB,IAAIE,gBAAgB;EAEzD,MAAMG,YAAY,GAAGf,OAAO,CAAC,MAAM;IACjC,OAAOF,WAAW,CAAC;MACjB,IAAI,CAACU,kBAAkB,IAAID,WAAW,KAAK;QACzCS,SAAS,EAAER,kBAAkB,IAAID;MACnC,CAAC,CAAC;MACFU,GAAG,EAAEH,oBAAoB;MACzBH,KAAK,EAAEA,KAAK,IAAIO,MAAM,CAACC,QAAQ;MAC/BC,OAAO,EAAE,IAAI;MACbC,MAAM,EAAEZ,YAAY,GAAG,KAAK,GAAG,IAAI;MACnC,IAAII,aAAa,IAAI;QAAEA;MAAc,CAAC;IACxC,CAAC,CAAC;EACJ,CAAC,EAAE,CACDN,WAAW,EACXC,kBAAkB,EAClBC,YAAY,EACZE,KAAK,EACLE,aAAa,EACbC,oBAAoB,CACrB,CAAC;EAEF,OAAOV,IAAA,CAACF,aAAa;IAACoB,KAAK,EAAEP,YAAa;IAAAT,QAAA,EAAEA;EAAQ,CAAgB,CAAC;AACvE,CAAC;AAED,MAAMiB,4BAA4B,GAAGxB,IAAI,CAACM,oBAAoB,CAAC;AAC/DkB,4BAA4B,CAACC,WAAW,GAAG,sBAAsB;AAEjE,SAASD,4BAA4B,IAAIlB,oBAAoB"}

package/dist/OdysseyProvider.js CHANGED Viewed

@@ -20,20 +20,23 @@ const OdysseyProvider = ({
   children,
   designTokensOverride,
   emotionRoot,
+  emotionRootElement,
   shadowDomElement,
+  shadowRootElement,
   languageCode,
   nonce,
   stylisPlugins,
   themeOverride,
   translationOverrides
 }) => _jsx(OdysseyCacheProvider, {
-  nonce: nonce,
   emotionRoot: emotionRoot,
-  hasShadowDom: Boolean(shadowDomElement),
+  emotionRootElement: emotionRootElement,
+  hasShadowDom: Boolean(shadowRootElement || shadowDomElement),
+  nonce: nonce,
   stylisPlugins: stylisPlugins,
   children: _jsx(OdysseyThemeProvider, {
     designTokensOverride: designTokensOverride,
-    shadowDomElement: shadowDomElement,
+    shadowRootElement: shadowRootElement || shadowDomElement,
     themeOverride: themeOverride,
     children: _jsx(_ScopedCssBaseline, {
       children: _jsx(OdysseyTranslationProvider, {

package/dist/OdysseyProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OdysseyProvider.js","names":["memo","OdysseyCacheProvider","OdysseyThemeProvider","OdysseyTranslationProvider","jsx","_jsx","OdysseyProvider","children","designTokensOverride","emotionRoot","shadowDomElement","languageCode","nonce","stylisPlugins","themeOverride","translationOverrides","hasShadowDom","Boolean","_ScopedCssBaseline","MemoizedThemeProvider"],"sources":["../src/OdysseyProvider.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 { memo, ReactNode } from \"react\";\nimport { ScopedCssBaseline } from \"@mui/material\";\n\nimport {\n OdysseyCacheProvider,\n OdysseyCacheProviderProps,\n} from \"./OdysseyCacheProvider\";\nimport {\n OdysseyThemeProvider,\n OdysseyThemeProviderProps,\n} from \"./OdysseyThemeProvider\";\nimport {\n OdysseyTranslationProvider,\n OdysseyTranslationProviderProps,\n} from \"./OdysseyTranslationProvider\";\nimport { DefaultSupportedLanguages } from \"./OdysseyTranslationProvider.types\";\n\nexport type OdysseyProviderProps<\n SupportedLanguages extends string = DefaultSupportedLanguages,\n> = OdysseyCacheProviderProps &\n OdysseyThemeProviderProps &\n OdysseyTranslationProviderProps<SupportedLanguages> & {\n children: ReactNode;\n };\n\nconst OdysseyProvider = <SupportedLanguages extends string>({\n children,\n designTokensOverride,\n emotionRoot,\n shadowDomElement,\n languageCode,\n nonce,\n stylisPlugins,\n themeOverride,\n translationOverrides,\n}: OdysseyProviderProps<SupportedLanguages>) => (\n <OdysseyCacheProvider\n ~~nonce~~={~~nonce~~}\n ~~emotionRoot~~={~~emotionRoot~~}\n hasShadowDom={Boolean(shadowDomElement)}\n stylisPlugins={stylisPlugins}\n >\n <OdysseyThemeProvider\n designTokensOverride={designTokensOverride}\n ~~shadowDomElement~~={shadowDomElement}\n themeOverride={themeOverride}\n >\n <ScopedCssBaseline>\n <OdysseyTranslationProvider<SupportedLanguages>\n languageCode={languageCode}\n translationOverrides={translationOverrides}\n >\n {children}\n </OdysseyTranslationProvider>\n </ScopedCssBaseline>\n </OdysseyThemeProvider>\n </OdysseyCacheProvider>\n);\n\nconst MemoizedThemeProvider = memo(OdysseyProvider) as typeof OdysseyProvider;\n\nexport { MemoizedThemeProvider as OdysseyProvider };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAmB,OAAO;AAAC,SAItCC,oBAAoB;AAAA,SAIpBC,oBAAoB;AAAA,SAIpBC,0BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAa5B,MAAMC,eAAe,GAAGA,CAAoC;EAC1DC,QAAQ;EACRC,oBAAoB;EACpBC,WAAW;EACXC,gBAAgB;EAChBC,YAAY;EACZC,KAAK;EACLC,aAAa;EACbC,aAAa;EACbC;AACwC,CAAC,~~KACzCV~~,IAAA,CAACJ,oBAAoB;~~EACnBW~~,~~KAAK~~,EAAEA,~~KAAM~~;~~EACbH~~,~~WAAW~~,EAAEA,~~WAAY~~;~~EACzBO~~,YAAY,EAAEC,OAAO,CAACP,gBAAgB,CAAE;~~EACxCG~~,aAAa,EAAEA,aAAc;~~EAAAN~~,QAAA,EAE7BF,IAAA,CAACH,oBAAoB;IACnBM,oBAAoB,EAAEA,oBAAqB;~~IAC3CE~~,~~gBAAgB~~,EAAEA,gBAAiB;~~IACnCI~~,aAAa,EAAEA,aAAc;~~IAAAP~~,QAAA,EAE7BF,IAAA,~~CAAAa~~,kBAAA;~~MAAAX~~,QAAA,EACEF,IAAA,CAACF,0BAA0B;~~QACzBQ~~,YAAY,EAAEA,YAAa;QAC3BI,oBAAoB,EAAEA,oBAAqB;~~QAAAR~~,QAAA,EAE1CA;MAAQ,CACiB;IAAC,CACZ;EAAC,CACA;AAAC,CACH,CACvB;AAED,~~MAAMY~~,qBAAqB,~~GAAGnB~~,IAAI,CAACM,eAAe,CAA2B;AAE7E,~~SAASa~~,qBAAqB,~~IAAIb~~,eAAe"}
1	+ {"version":3,"file":"OdysseyProvider.js","names":["memo","OdysseyCacheProvider","OdysseyThemeProvider","OdysseyTranslationProvider","jsx","_jsx","OdysseyProvider","children","designTokensOverride","emotionRoot","emotionRootElement","shadowDomElement","shadowRootElement","languageCode","nonce","stylisPlugins","themeOverride","translationOverrides","hasShadowDom","Boolean","_ScopedCssBaseline","MemoizedThemeProvider"],"sources":["../src/OdysseyProvider.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 { memo, ReactNode } from \"react\";\nimport { ScopedCssBaseline } from \"@mui/material\";\n\nimport {\n OdysseyCacheProvider,\n OdysseyCacheProviderProps,\n} from \"./OdysseyCacheProvider\";\nimport {\n OdysseyThemeProvider,\n OdysseyThemeProviderProps,\n} from \"./OdysseyThemeProvider\";\nimport {\n OdysseyTranslationProvider,\n OdysseyTranslationProviderProps,\n} from \"./OdysseyTranslationProvider\";\nimport { DefaultSupportedLanguages } from \"./OdysseyTranslationProvider.types\";\n\nexport type OdysseyProviderProps<\n SupportedLanguages extends string = DefaultSupportedLanguages,\n> = OdysseyCacheProviderProps &\n OdysseyThemeProviderProps &\n OdysseyTranslationProviderProps<SupportedLanguages> & {\n children: ReactNode;\n };\n\nconst OdysseyProvider = <SupportedLanguages extends string>({\n children,\n designTokensOverride,\n emotionRoot,\n emotionRootElement,\n shadowDomElement,\n shadowRootElement,\n languageCode,\n nonce,\n stylisPlugins,\n themeOverride,\n translationOverrides,\n}: OdysseyProviderProps<SupportedLanguages>) => (\n <OdysseyCacheProvider\n emotionRoot={emotionRoot}\n emotionRootElement={emotionRootElement}\n hasShadowDom={Boolean(shadowRootElement \|\| shadowDomElement)}\n nonce={nonce}\n stylisPlugins={stylisPlugins}\n >\n <OdysseyThemeProvider\n designTokensOverride={designTokensOverride}\n shadowRootElement={shadowRootElement \|\| shadowDomElement}\n themeOverride={themeOverride}\n >\n <ScopedCssBaseline>\n <OdysseyTranslationProvider<SupportedLanguages>\n languageCode={languageCode}\n translationOverrides={translationOverrides}\n >\n {children}\n </OdysseyTranslationProvider>\n </ScopedCssBaseline>\n </OdysseyThemeProvider>\n </OdysseyCacheProvider>\n);\n\nconst MemoizedThemeProvider = memo(OdysseyProvider) as typeof OdysseyProvider;\n\nexport { MemoizedThemeProvider as OdysseyProvider };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAmB,OAAO;AAAC,SAItCC,oBAAoB;AAAA,SAIpBC,oBAAoB;AAAA,SAIpBC,0BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAa5B,MAAMC,eAAe,GAAGA,CAAoC;EAC1DC,QAAQ;EACRC,oBAAoB;EACpBC,WAAW;EACXC,kBAAkB;EAClBC,gBAAgB;EAChBC,iBAAiB;EACjBC,YAAY;EACZC,KAAK;EACLC,aAAa;EACbC,aAAa;EACbC;AACwC,CAAC,KACzCZ,IAAA,CAACJ,oBAAoB;EACnBQ,WAAW,EAAEA,WAAY;EACzBC,kBAAkB,EAAEA,kBAAmB;EACvCQ,YAAY,EAAEC,OAAO,CAACP,iBAAiB,IAAID,gBAAgB,CAAE;EAC7DG,KAAK,EAAEA,KAAM;EACbC,aAAa,EAAEA,aAAc;EAAAR,QAAA,EAE7BF,IAAA,CAACH,oBAAoB;IACnBM,oBAAoB,EAAEA,oBAAqB;IAC3CI,iBAAiB,EAAEA,iBAAiB,IAAID,gBAAiB;IACzDK,aAAa,EAAEA,aAAc;IAAAT,QAAA,EAE7BF,IAAA,CAAAe,kBAAA;MAAAb,QAAA,EACEF,IAAA,CAACF,0BAA0B;QACzBU,YAAY,EAAEA,YAAa;QAC3BI,oBAAoB,EAAEA,oBAAqB;QAAAV,QAAA,EAE1CA;MAAQ,CACiB;IAAC,CACZ;EAAC,CACA;AAAC,CACH,CACvB;AAED,MAAMc,qBAAqB,GAAGrB,IAAI,CAACM,eAAe,CAA2B;AAE7E,SAASe,qBAAqB,IAAIf,eAAe"}

package/dist/OdysseyThemeProvider.js CHANGED Viewed

@@ -21,6 +21,7 @@ const OdysseyThemeProvider = ({
   children,
   designTokensOverride,
   shadowDomElement,
+  shadowRootElement,
   themeOverride
 }) => {
   const odysseyTokens = useMemo(() => ({
@@ -29,8 +30,8 @@ const OdysseyThemeProvider = ({
   }), [designTokensOverride]);
   const odysseyTheme = useMemo(() => createOdysseyMuiTheme({
     odysseyTokens,
-    shadowDomElement
-  }), [odysseyTokens, shadowDomElement]);
+    shadowRootElement: shadowRootElement || shadowDomElement
+  }), [odysseyTokens, shadowDomElement, shadowRootElement]);
   const customOdysseyTheme = useMemo(() => themeOverride && createTheme(deepmerge(odysseyTheme, themeOverride)), [odysseyTheme, themeOverride]);
   return _jsx(MuiThemeProvider, {
     theme: customOdysseyTheme ?? odysseyTheme,

package/dist/OdysseyThemeProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"OdysseyThemeProvider.js","names":["createTheme","ThemeProvider","MuiThemeProvider","memo","useMemo","deepmerge","createOdysseyMuiTheme","Tokens","OdysseyDesignTokensContext","jsx","_jsx","OdysseyThemeProvider","children","designTokensOverride","shadowDomElement","themeOverride","odysseyTokens","odysseyTheme","customOdysseyTheme","theme","Provider","value","MemoizedOdysseyThemeProvider"],"sources":["../src/OdysseyThemeProvider.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 createTheme,\n ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { ThemeOptions } from \"@mui/material\";\nimport { deepmerge } from \"@mui/utils\";\nimport { createOdysseyMuiTheme, DesignTokensOverride } from \"./theme\";\nimport as Tokens from \"@okta/odyssey-design-tokens\";\nimport { OdysseyDesignTokensContext } from \"./OdysseyDesignTokensContext\";\n\nexport type OdysseyThemeProviderProps = {\n children: ReactNode;\n designTokensOverride?: DesignTokensOverride;\n shadowDomElement?: HTMLDivElement \| HTMLElement \| undefined;\n themeOverride?: ThemeOptions;\n};\n\n/*\n This function doesn't include the Emotion Cache or Translations. You should probably be using `OdysseyProvider`.\n \n Some teams have a need to wrap separately (SIW), but most teams will never need to use this explicitly.\n */\nconst OdysseyThemeProvider = ({\n children,\n designTokensOverride,\n shadowDomElement,\n themeOverride,\n}: OdysseyThemeProviderProps) => {\n const odysseyTokens = useMemo(\n () => ({ ...Tokens, ...designTokensOverride }),\n [designTokensOverride],\n );\n const odysseyTheme = useMemo(\n () =>\n createOdysseyMuiTheme({\n odysseyTokens,\n shadowDomElement,\n }),\n [odysseyTokens, shadowDomElement],\n );\n\n const customOdysseyTheme = useMemo(\n () => themeOverride && createTheme(deepmerge(odysseyTheme, themeOverride)),\n [odysseyTheme, themeOverride],\n );\n\n return (\n <MuiThemeProvider theme={customOdysseyTheme ?? odysseyTheme}>\n <OdysseyDesignTokensContext.Provider value={odysseyTokens}>\n {children}\n </OdysseyDesignTokensContext.Provider>\n </MuiThemeProvider>\n );\n};\n\nconst MemoizedOdysseyThemeProvider = memo(OdysseyThemeProvider);\n\nexport { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,WAAW,EACXC,aAAa,IAAIC,gBAAgB,QAC5B,sBAAsB;AAC7B,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAGhD,SAASC,SAAS,QAAQ,YAAY;AAAC,SAC9BC,qBAAqB;AAC9B,OAAO,KAAKC,MAAM,MAAM,6BAA6B;AAAC,SAC7CC,0BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;~~AAcnC~~,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,oBAAoB;EACpBC,gBAAgB;EAChBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,aAAa,~~GAAGZ~~,OAAO,CAC3B,OAAO;IAAE,GAAGG,MAAM;IAAE,GAAGM;EAAqB,CAAC,CAAC,EAC9C,CAACA,oBAAoB,CACvB,CAAC;~~EACD~~,~~MAAMI~~,YAAY,~~GAAGb~~,OAAO,CAC1B,MACEE,qBAAqB,CAAC;~~IACpBU~~,aAAa;IACbF;~~EACF~~,CAAC,CAAC,EACJ,~~CAACE~~,aAAa,~~EAAEF~~,gBAAgB,~~CAClC~~,CAAC;EAED,MAAMI,kBAAkB,~~GAAGd~~,OAAO,CAChC,~~MAAMW~~,aAAa,~~IAAIf~~,WAAW,CAACK,SAAS,~~CAACY~~,YAAY,EAAEF,aAAa,CAAC,CAAC,EAC1E,CAACE,YAAY,EAAEF,aAAa,CAC9B,CAAC;EAED,~~OACEL~~,IAAA,CAACR,gBAAgB;~~IAACiB~~,KAAK,EAAED,kBAAkB,IAAID,YAAa;~~IAAAL~~,QAAA,EAC1DF,IAAA,CAACF,0BAA0B,~~CAACY~~,QAAQ;MAACC,KAAK,EAAEL,aAAc;~~MAAAJ~~,QAAA,EACvDA;IAAQ,CAC0B;EAAC,CACtB,CAAC;AAEvB,CAAC;AAED,~~MAAMU~~,4BAA4B,~~GAAGnB~~,IAAI,CAACQ,oBAAoB,CAAC;AAE/D,~~SAASW~~,4BAA4B,~~IAAIX~~,oBAAoB"}
1	+ {"version":3,"file":"OdysseyThemeProvider.js","names":["createTheme","ThemeProvider","MuiThemeProvider","memo","useMemo","deepmerge","createOdysseyMuiTheme","Tokens","OdysseyDesignTokensContext","jsx","_jsx","OdysseyThemeProvider","children","designTokensOverride","shadowDomElement","shadowRootElement","themeOverride","odysseyTokens","odysseyTheme","customOdysseyTheme","theme","Provider","value","MemoizedOdysseyThemeProvider"],"sources":["../src/OdysseyThemeProvider.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 createTheme,\n ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\nimport { memo, ReactNode, useMemo } from \"react\";\n\nimport { ThemeOptions } from \"@mui/material\";\nimport { deepmerge } from \"@mui/utils\";\nimport { createOdysseyMuiTheme, DesignTokensOverride } from \"./theme\";\nimport as Tokens from \"@okta/odyssey-design-tokens\";\nimport { OdysseyDesignTokensContext } from \"./OdysseyDesignTokensContext\";\n\nexport type OdysseyThemeProviderProps = {\n children: ReactNode;\n designTokensOverride?: DesignTokensOverride;\n /** @deprecated Use `shadowRootElement` instead. /\n shadowDomElement?: HTMLDivElement \| HTMLElement \| undefined;\n shadowRootElement?: HTMLDivElement \| HTMLElement;\n themeOverride?: ThemeOptions;\n};\n\n/\n This function doesn't include the Emotion Cache or Translations. You should probably be using `OdysseyProvider`.\n \n Some teams have a need to wrap separately (SIW), but most teams will never need to use this explicitly.\n */\nconst OdysseyThemeProvider = ({\n children,\n designTokensOverride,\n shadowDomElement,\n shadowRootElement,\n themeOverride,\n}: OdysseyThemeProviderProps) => {\n const odysseyTokens = useMemo(\n () => ({ ...Tokens, ...designTokensOverride }),\n [designTokensOverride],\n );\n\n const odysseyTheme = useMemo(\n () =>\n createOdysseyMuiTheme({\n odysseyTokens,\n shadowRootElement: shadowRootElement \|\| shadowDomElement,\n }),\n [odysseyTokens, shadowDomElement, shadowRootElement],\n );\n\n const customOdysseyTheme = useMemo(\n () => themeOverride && createTheme(deepmerge(odysseyTheme, themeOverride)),\n [odysseyTheme, themeOverride],\n );\n\n return (\n <MuiThemeProvider theme={customOdysseyTheme ?? odysseyTheme}>\n <OdysseyDesignTokensContext.Provider value={odysseyTokens}>\n {children}\n </OdysseyDesignTokensContext.Provider>\n </MuiThemeProvider>\n );\n};\n\nconst MemoizedOdysseyThemeProvider = memo(OdysseyThemeProvider);\n\nexport { MemoizedOdysseyThemeProvider as OdysseyThemeProvider };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,WAAW,EACXC,aAAa,IAAIC,gBAAgB,QAC5B,sBAAsB;AAC7B,SAASC,IAAI,EAAaC,OAAO,QAAQ,OAAO;AAGhD,SAASC,SAAS,QAAQ,YAAY;AAAC,SAC9BC,qBAAqB;AAC9B,OAAO,KAAKC,MAAM,MAAM,6BAA6B;AAAC,SAC7CC,0BAA0B;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAgBnC,MAAMC,oBAAoB,GAAGA,CAAC;EAC5BC,QAAQ;EACRC,oBAAoB;EACpBC,gBAAgB;EAChBC,iBAAiB;EACjBC;AACyB,CAAC,KAAK;EAC/B,MAAMC,aAAa,GAAGb,OAAO,CAC3B,OAAO;IAAE,GAAGG,MAAM;IAAE,GAAGM;EAAqB,CAAC,CAAC,EAC9C,CAACA,oBAAoB,CACvB,CAAC;EAED,MAAMK,YAAY,GAAGd,OAAO,CAC1B,MACEE,qBAAqB,CAAC;IACpBW,aAAa;IACbF,iBAAiB,EAAEA,iBAAiB,IAAID;EAC1C,CAAC,CAAC,EACJ,CAACG,aAAa,EAAEH,gBAAgB,EAAEC,iBAAiB,CACrD,CAAC;EAED,MAAMI,kBAAkB,GAAGf,OAAO,CAChC,MAAMY,aAAa,IAAIhB,WAAW,CAACK,SAAS,CAACa,YAAY,EAAEF,aAAa,CAAC,CAAC,EAC1E,CAACE,YAAY,EAAEF,aAAa,CAC9B,CAAC;EAED,OACEN,IAAA,CAACR,gBAAgB;IAACkB,KAAK,EAAED,kBAAkB,IAAID,YAAa;IAAAN,QAAA,EAC1DF,IAAA,CAACF,0BAA0B,CAACa,QAAQ;MAACC,KAAK,EAAEL,aAAc;MAAAL,QAAA,EACvDA;IAAQ,CAC0B;EAAC,CACtB,CAAC;AAEvB,CAAC;AAED,MAAMW,4BAA4B,GAAGpB,IAAI,CAACQ,oBAAoB,CAAC;AAE/D,SAASY,4BAA4B,IAAIZ,oBAAoB"}

package/dist/Radio.js CHANGED Viewed

@@ -21,15 +21,17 @@ const Radio = ({
   hint,
   inputRef,
   isChecked,
-  isDisabled,
+  isDisabled = false,
   isInvalid,
   label: labelProp,
   name,
   testId,
   translate,
   value,
+  isReadOnly = false,
   onChange: onChangeProp,
-  onBlur: onBlurProp
+  onBlur: onBlurProp,
+  onClick
 }) => {
   const localInputRef = useRef(null);
   useImperativeHandle(inputRef, () => {
@@ -48,7 +50,19 @@ const Radio = ({
       children: hint
     })]
   }), [labelProp, hint, translate]);
-  const onChange = useCallback((event, checked) => onChangeProp?.(event, checked), [onChangeProp]);
+  const onChange = useCallback((event, checked) => {
+    if (isReadOnly) {
+      event.preventDefault();
+    } else {
+      onChangeProp?.(event, checked);
+    }
+  }, [onChangeProp, isReadOnly]);
+  const handleClick = useCallback(event => {
+    if (isReadOnly) {
+      event.stopPropagation();
+      event.preventDefault();
+    }
+  }, [isReadOnly]);
   const onBlur = useCallback(event => {
     onBlurProp?.(event);
   }, [onBlurProp]);
@@ -57,17 +71,30 @@ const Radio = ({
     className: isInvalid ? "Mui-error" : "",
     control: _jsx(_Radio, {
       inputProps: {
-        "data-se": testId
+        "data-se": testId,
+        "aria-disabled": isDisabled || isReadOnly,
+        readOnly: isReadOnly,
+        tabIndex: isReadOnly ? 0 : undefined
       },
       inputRef: localInputRef,
-      onChange: onChange
+      onChange: onChange,
+      onClick: onClick || handleClick,
+      disabled: isDisabled
     }),
-    disabled: isDisabled,
     label: label,
     name: name,
     translate: translate,
     value: value,
-    onBlur: onBlur
+    onBlur: onBlur,
+    disabled: isDisabled,
+    sx: {
+      ...(isReadOnly && {
+        cursor: "default",
+        "& .MuiTypography-root": {
+          cursor: "default"
+        }
+      })
+    }
   });
 };
 const MemoizedRadio = memo(Radio);