@okta/odyssey-react-mui 1.14.8 → 1.15.8
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.
- package/CHANGELOG.md +50 -0
- package/dist/Autocomplete.js +84 -2
- package/dist/Autocomplete.js.map +1 -1
- package/dist/Breadcrumbs.js +10 -1
- package/dist/Breadcrumbs.js.map +1 -1
- package/dist/Button.js +2 -2
- package/dist/Button.js.map +1 -1
- package/dist/Callout.js.map +1 -1
- package/dist/Checkbox.js +8 -4
- package/dist/Checkbox.js.map +1 -1
- package/dist/CheckboxGroup.js.map +1 -1
- package/dist/DataTable/DataTable.js +37 -9
- package/dist/DataTable/DataTable.js.map +1 -1
- package/dist/MenuButton.js.map +1 -1
- package/dist/RadioGroup.js.map +1 -1
- package/dist/Select.js +3 -4
- package/dist/Select.js.map +1 -1
- package/dist/Tabs.js +21 -0
- package/dist/Tabs.js.map +1 -1
- package/dist/Tile.js +14 -18
- package/dist/Tile.js.map +1 -1
- package/dist/labs/DataFilters.js +98 -97
- package/dist/labs/DataFilters.js.map +1 -1
- package/dist/labs/index.js +0 -1
- package/dist/labs/index.js.map +1 -1
- package/dist/src/Autocomplete.d.ts +7 -1
- package/dist/src/Autocomplete.d.ts.map +1 -1
- package/dist/src/Breadcrumbs.d.ts.map +1 -1
- package/dist/src/Button.d.ts +31 -15
- package/dist/src/Button.d.ts.map +1 -1
- package/dist/src/Callout.d.ts +1 -1
- package/dist/src/Checkbox.d.ts.map +1 -1
- package/dist/src/CheckboxGroup.d.ts +2 -3
- package/dist/src/CheckboxGroup.d.ts.map +1 -1
- package/dist/src/DataTable/DataTable.d.ts +6 -2
- package/dist/src/DataTable/DataTable.d.ts.map +1 -1
- package/dist/src/MenuButton.d.ts +3 -4
- package/dist/src/MenuButton.d.ts.map +1 -1
- package/dist/src/RadioGroup.d.ts +3 -3
- package/dist/src/RadioGroup.d.ts.map +1 -1
- package/dist/src/Select.d.ts.map +1 -1
- package/dist/src/Tabs.d.ts.map +1 -1
- package/dist/src/Tile.d.ts.map +1 -1
- package/dist/src/labs/DataFilters.d.ts +9 -1
- package/dist/src/labs/DataFilters.d.ts.map +1 -1
- package/dist/src/labs/index.d.ts +0 -1
- package/dist/src/labs/index.d.ts.map +1 -1
- package/dist/src/theme/components.d.ts.map +1 -1
- package/dist/theme/components.js +15 -7
- package/dist/theme/components.js.map +1 -1
- package/dist/tsconfig.production.tsbuildinfo +1 -1
- package/package.json +9 -7
- package/src/Autocomplete.tsx +124 -1
- package/src/Breadcrumbs.tsx +9 -1
- package/src/Button.tsx +32 -16
- package/src/Callout.tsx +1 -1
- package/src/Checkbox.tsx +4 -3
- package/src/CheckboxGroup.tsx +2 -5
- package/src/DataTable/DataTable.tsx +75 -13
- package/src/MenuButton.tsx +11 -21
- package/src/RadioGroup.tsx +3 -3
- package/src/Select.tsx +5 -2
- package/src/Tabs.tsx +40 -1
- package/src/Tile.tsx +12 -14
- package/src/labs/DataFilters.tsx +211 -177
- package/src/labs/index.ts +0 -1
- package/src/theme/components.tsx +16 -7
- package/dist/labs/VirtualizedAutocomplete.js +0 -134
- package/dist/labs/VirtualizedAutocomplete.js.map +0 -1
- package/dist/src/labs/VirtualizedAutocomplete.d.ts +0 -90
- package/dist/src/labs/VirtualizedAutocomplete.d.ts.map +0 -1
- package/src/labs/VirtualizedAutocomplete.tsx +0 -365
|
@@ -157,7 +157,8 @@ const DataTable = ({
|
|
|
157
157
|
bulkActionMenuItems,
|
|
158
158
|
errorMessage: errorMessageProp,
|
|
159
159
|
emptyPlaceholder,
|
|
160
|
-
noResultsPlaceholder
|
|
160
|
+
noResultsPlaceholder,
|
|
161
|
+
filters: filtersProp
|
|
161
162
|
}) => {
|
|
162
163
|
const [data, setData] = useState([]);
|
|
163
164
|
const [pagination, setPagination] = useState({
|
|
@@ -225,14 +226,41 @@ const DataTable = ({
|
|
|
225
226
|
updateRowOrder: hasRowReordering && onReorderRows ? updateRowOrder : undefined
|
|
226
227
|
});
|
|
227
228
|
}, [pagination, rowActionButtons, rowActionMenuItems, hasRowReordering, onReorderRows, totalRows, updateRowOrder]);
|
|
228
|
-
const
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
229
|
+
const convertFilterSelectOptions = useCallback(options => options?.map(option => typeof option === "string" ? {
|
|
230
|
+
label: option,
|
|
231
|
+
value: option
|
|
232
|
+
} : {
|
|
233
|
+
label: option.label ?? option.value,
|
|
234
|
+
value: option.value ?? option.label
|
|
235
|
+
}), []);
|
|
236
|
+
const convertColumnToFilter = useCallback(column => column.enableColumnFilter !== false && column.accessorKey ? {
|
|
237
|
+
id: column.accessorKey,
|
|
238
|
+
label: column.header,
|
|
239
|
+
variant: column.filterVariant,
|
|
240
|
+
options: convertFilterSelectOptions(column.filterSelectOptions)
|
|
241
|
+
} : null, [convertFilterSelectOptions]);
|
|
242
|
+
const dataTableFilters = useMemo(() => {
|
|
243
|
+
const providedFilters = filtersProp || columns;
|
|
244
|
+
return providedFilters.reduce((accumulator, item) => {
|
|
245
|
+
if (typeof item === "string") {
|
|
246
|
+
const foundColumn = columns.find(column => column.accessorKey === item);
|
|
247
|
+
if (foundColumn) {
|
|
248
|
+
const filter = convertColumnToFilter(foundColumn);
|
|
249
|
+
if (filter) {
|
|
250
|
+
return accumulator.concat(filter);
|
|
251
|
+
}
|
|
252
|
+
}
|
|
253
|
+
} else if ("accessorKey" in item) {
|
|
254
|
+
const filter = convertColumnToFilter(item);
|
|
255
|
+
if (filter) {
|
|
256
|
+
return accumulator.concat(filter);
|
|
257
|
+
}
|
|
258
|
+
} else if ("label" in item) {
|
|
259
|
+
return accumulator.concat(item);
|
|
260
|
+
}
|
|
261
|
+
return accumulator;
|
|
262
|
+
}, []);
|
|
263
|
+
}, [columns, filtersProp, convertColumnToFilter]);
|
|
236
264
|
const defaultCell = useCallback(({
|
|
237
265
|
cell
|
|
238
266
|
}) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useMaterialReactTable","MRT_TableContainer","ArrowDownIcon","ArrowUnsortedIcon","DragIndicatorIcon","MoreIcon","densityValues","DataTablePagination","DataFilters","DataTableRowActions","useRowReordering","DataTableSettings","MenuButton","Box","useOdysseyDesignTokens","useScrollIndication","styled","DataTableEmptyState","Callout","t","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","displayColumnDefOptions","header","grow","muiTableBodyCellProps","align","sx","overflow","width","className","muiTableHeadCellProps","minWidth","children","marginInline","opacity","padding","ScrollableTableContainer","shouldForwardProp","prop","odysseyDesignTokens","isScrollableStart","isScrollableEnd","borderBlockEndColor","HueNeutral100","borderBlockEndStyle","borderBlockEndWidth","BorderWidthMain","marginBlockEnd","Spacing4","position","borderInlineStartColor","HueNeutral200","borderInlineStartStyle","borderInlineStartWidth","background","content","pointerEvents","top","left","bottom","Spacing6","zIndex","transition","TransitionDurationMain","TransitionTimingMain","borderInlineEndColor","borderInlineEndStyle","borderInlineEndWidth","right","DataTable","columns","getRowId","getRowIdProp","currentPage","initialDensity","resultsPerPage","getData","onReorderRows","totalRows","hasSearchSubmitButton","searchDelayTime","paginationType","onChangeRowSelection","rowActionButtons","rowActionMenuItems","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSorting","bulkActionMenuItems","errorMessage","errorMessageProp","emptyPlaceholder","noResultsPlaceholder","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","filters","setFilters","initialFilters","setInitialFilters","isLoading","setIsLoading","isEmpty","setIsEmpty","setErrorMessage","tableOuterContainer","current","tableInnerContainer","dragHandleStyles","dragHandleText","draggableTableBodyRowClassName","handleDragHandleKeyDown","handleDragHandleOnDragCapture","handleDragHandleOnDragEnd","resetDraggingAndHoveredRow","updateRowOrder","page","row","id","rowDensityCellClassName","renderRowActions","currentIndex","index","rowIndex","undefined","dataTableFilters","filter","column","enableColumnFilter","map","accessorKey","label","variant","filterVariant","options","filterSelectOptions","defaultCell","cell","value","getValue","whiteSpace","textOverflow","emptyState","noResultsInnerContent","heading","text","emptyStateInnerContent","dataTable","state","density","sorting","globalFilter","icons","ArrowDownwardIcon","DragHandleIcon","SyncAltIcon","enableColumnActions","enableColumnResizing","enableDensityToggle","enableFilters","enableFullScreenToggle","enableGlobalFilter","enableHiding","enablePagination","layoutMode","manualFiltering","manualSorting","muiTablePaperProps","elevation","selectAllMode","defaultColumn","Cell","enableRowOrdering","Boolean","enableRowDragging","muiTableBodyRowProps","table","currentRowId","draggingRowId","hoveredRowId","getState","hoveredRow","muiRowDragHandleProps","onKeyDown","event","onBlur","onDragEnd","onDragCapture","enableRowActions","positionActionsColumn","enableRowSelection","onRowSelectionChange","enableSorting","onSortingChange","currentColumn","find","sortedColumn","enableRowVirtualization","rowVirtualizerInstanceRef","rowVirtualizerOptions","overscan","renderEmptyRowsFallback","muiTableProps","ref","muiTableContainerProps","bulkActionMenuButton","buttonVariant","endIcon","isDisabled","Object","keys","length","ariaLabel","incomingData","sort","error","marginBottom","onChangeSearch","onChangeFilters","additionalActions","severity","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_RowData,\n MRT_SortingState,\n MRT_TableOptions,\n MRT_RowSelectionState,\n MRT_RowVirtualizer,\n MRT_VisibilityState,\n useMaterialReactTable,\n MRT_TableContainer,\n} from \"material-react-table\";\nimport {\n ArrowDownIcon,\n ArrowUnsortedIcon,\n DragIndicatorIcon,\n MoreIcon,\n} from \"../icons.generated\";\nimport { densityValues, paginationTypeValues } from \"./constants\";\nimport { DataTablePagination } from \"./DataTablePagination\";\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 } from \".\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext\";\nimport { useScrollIndication } from \"./useScrollIndication\";\nimport styled from \"@emotion/styled\";\nimport { DataTableEmptyState } from \"./DataTableEmptyState\";\nimport { Callout } from \"../Callout\";\nimport { t } from \"i18next\";\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 DataTableProps = {\n /**\n * The columns that make up the table\n */\n columns: MRT_TableOptions<MRT_RowData>[\"columns\"];\n /**\n * The total number of rows in the table. Optional, because it's sometimes impossible\n * to calculate. Used in table pagination to know when to disable the \"next\"/\"more\" button.\n */\n totalRows?: number;\n /**\n * The function to get the ID of a row\n */\n getRowId?: MRT_TableOptions<MRT_RowData>[\"getRowId\"];\n /**\n * The initial density (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 * If true, the end user will be able to change the table density.\n */\n hasChangeableDensity?: boolean;\n /**\n * If true, the end user can resize individual columns.\n */\n hasColumnResizing?: boolean;\n /**\n * If true, the end user will be able to show/hide columns.\n */\n hasColumnVisibility?: boolean;\n /**\n * If true, the end user will be able to filter columns.\n */\n hasFilters?: boolean;\n /**\n * If true, the table will include pagination controls.\n */\n hasPagination?: boolean;\n /**\n * If true, the table will include checkboxes on each row, enabling\n * the user to select some or all rows.\n */\n hasRowSelection?: boolean;\n /**\n * If true, the global table search controls will be shown.\n */\n hasSearch?: boolean;\n /**\n * If true, the end user can sort columns (ascending, descending, or neither)\n */\n hasSorting?: boolean;\n /**\n * If true, the end user can reorder rows via a drag-and-drop interface\n */\n hasRowReordering?: boolean;\n /**\n * If true, the search field will include a Search button, rather than\n * firing on input change.\n */\n hasSearchSubmitButton?: boolean;\n /**\n * The debounce time, in milliseconds, for the search input firing\n * `onChangeSearch` when changed. If `hasSearchSubmitButton` is true,\n * this doesn't do anything.\n */\n searchDelayTime?: number;\n /**\n * Callback that fires when a row (or rows) is selected or unselected.\n */\n onChangeRowSelection?: (rowSelection: DataTableRowSelectionState) => void;\n /**\n * Callback that fires whenever the table needs to fetch new data, due to changes in\n * page, results per page, search input, filters, or sorting\n */\n getData: ({\n page,\n resultsPerPage,\n search,\n filters,\n sort,\n }: DataTableGetDataType) =>\n | MRT_TableOptions<MRT_RowData>[\"data\"]\n | Promise<MRT_TableOptions<MRT_RowData>[\"data\"]>;\n /**\n * Callback that fires when the user reorders rows within the table. Can be used\n * to propogate order change to the backend.\n */\n onReorderRows?: ({ rowId, newRowIndex }: DataTableOnReorderRowsType) => void;\n /**\n * The current page number.\n */\n currentPage?: number;\n /**\n * The number of results per page.\n */\n resultsPerPage?: number;\n /**\n * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n * set to a simple \"Load more\" button by setting to \"loadMore\".\n */\n paginationType?: (typeof paginationTypeValues)[number];\n /**\n * Action buttons to display in each row\n */\n rowActionButtons?: DataTableRowActionsProps[\"rowActionButtons\"];\n /**\n * Menu items to include in the optional actions menu on each row.\n */\n rowActionMenuItems?: DataTableRowActionsProps[\"rowActionMenuItems\"];\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 * 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 * The component to display when the query returns no results\n */\n noResultsPlaceholder?: ReactNode;\n};\n\nconst 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 },\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};\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 borderBlockEndColor: odysseyDesignTokens.HueNeutral100,\n borderBlockEndStyle: \"solid\",\n borderBlockEndWidth: odysseyDesignTokens.BorderWidthMain,\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 columns,\n getRowId: getRowIdProp,\n currentPage = 1,\n initialDensity = densityValues[0],\n resultsPerPage = 20,\n getData,\n onReorderRows,\n totalRows,\n hasSearchSubmitButton,\n searchDelayTime,\n paginationType = \"paged\",\n onChangeRowSelection,\n rowActionButtons,\n rowActionMenuItems,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSorting,\n bulkActionMenuItems,\n errorMessage: errorMessageProp,\n emptyPlaceholder,\n noResultsPlaceholder,\n}: DataTableProps) => {\n const [data, setData] = useState<MRT_RowData[]>([]);\n const [pagination, setPagination] = useState({\n pageIndex: currentPage,\n pageSize: resultsPerPage,\n });\n const [draggingRow, setDraggingRow] = useState<MRT_Row<MRT_RowData> | 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>(\"\");\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 ? getRowIdProp : (row: MRT_RowData) => row.id;\n\n const rowDensityCellClassName = useMemo(() => {\n return rowDensity === \"spacious\"\n ? \"MuiTableCell-spacious\"\n : rowDensity === \"compact\"\n ? \"MuiTableCell-compact\"\n : \"MuiTableCell-default\";\n }, [rowDensity]);\n\n const renderRowActions = useCallback(\n ({ row }: { row: MRT_Row<MRT_RowData> }) => {\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 const dataTableFilters = useMemo(\n () =>\n columns\n .filter((column) => column.enableColumnFilter !== false)\n .map((column) => {\n return {\n id: column.accessorKey as string,\n label: column.header,\n variant: column.filterVariant ?? \"text\",\n options: column.filterSelectOptions,\n } as DataFilter;\n }),\n [columns],\n );\n\n const defaultCell = useCallback(\n ({ cell }: { cell: MRT_Cell<MRT_RowData> }) => {\n const value = cell.getValue<string>();\n return (\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 <DataTableEmptyState\n heading={t(\"table.noresults.heading\")}\n text={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 tableInnerContainerWidth,\n emptyPlaceholder,\n noResultsPlaceholder,\n isEmpty,\n ]);\n\n const dataTable = useMaterialReactTable({\n columns: columns,\n data: data,\n getRowId: getRowId,\n state: {\n density: rowDensity,\n sorting: columnSorting,\n globalFilter: search,\n columnVisibility,\n isLoading,\n rowSelection,\n },\n icons: {\n ArrowDownwardIcon: ArrowDownIcon,\n DragHandleIcon: DragIndicatorIcon,\n SyncAltIcon: ArrowUnsortedIcon,\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 displayColumnDefOptions as MRT_TableOptions<MRT_RowData>[\"displayColumnDefOptions\"],\n muiTableBodyCellProps: () => ({\n className: rowDensityCellClassName,\n }),\n defaultColumn: {\n Cell: defaultCell,\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:\n (hasRowReordering === true && onReorderRows) ||\n rowActionButtons ||\n rowActionMenuItems\n ? true\n : false,\n positionActionsColumn:\n \"last\" as MRT_TableOptions<MRT_RowData>[\"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 },\n\n muiTableContainerProps: {\n ref: tableInnerContainerRef,\n },\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 }, [pagination, columnSorting, search, filters, getData, errorMessageProp]);\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 onChangeRowSelection?.(rowSelection);\n }, [rowSelection, onChangeRowSelection]);\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 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 <DataTablePagination\n pagination={pagination}\n setPagination={setPagination}\n totalRows={totalRows}\n isDisabled={isEmpty}\n variant={paginationType}\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","ArrowDownIcon","ArrowUnsortedIcon","DragIndicatorIcon","MoreIcon","densityValues","DataTablePagination","DataFilters","DataTableRowActions","useRowReordering","DataTableSettings","MenuButton","Box","useOdysseyDesignTokens","useScrollIndication","styled","DataTableEmptyState","Callout","t","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","displayColumnDefOptions","header","grow","muiTableBodyCellProps","align","sx","overflow","width","className","muiTableHeadCellProps","minWidth","children","marginInline","opacity","padding","ScrollableTableContainer","shouldForwardProp","prop","odysseyDesignTokens","isScrollableStart","isScrollableEnd","borderBlockEndColor","HueNeutral100","borderBlockEndStyle","borderBlockEndWidth","BorderWidthMain","marginBlockEnd","Spacing4","position","borderInlineStartColor","HueNeutral200","borderInlineStartStyle","borderInlineStartWidth","background","content","pointerEvents","top","left","bottom","Spacing6","zIndex","transition","TransitionDurationMain","TransitionTimingMain","borderInlineEndColor","borderInlineEndStyle","borderInlineEndWidth","right","DataTable","columns","getRowId","getRowIdProp","currentPage","initialDensity","resultsPerPage","getData","onReorderRows","totalRows","hasSearchSubmitButton","searchDelayTime","paginationType","onChangeRowSelection","rowActionButtons","rowActionMenuItems","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSorting","bulkActionMenuItems","errorMessage","errorMessageProp","emptyPlaceholder","noResultsPlaceholder","filters","filtersProp","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","rowDensityCellClassName","renderRowActions","currentIndex","index","rowIndex","undefined","convertFilterSelectOptions","options","map","option","label","value","convertColumnToFilter","column","enableColumnFilter","accessorKey","variant","filterVariant","filterSelectOptions","dataTableFilters","providedFilters","reduce","accumulator","item","foundColumn","find","filter","concat","defaultCell","cell","getValue","whiteSpace","textOverflow","emptyState","noResultsInnerContent","heading","text","emptyStateInnerContent","dataTable","state","density","sorting","globalFilter","icons","ArrowDownwardIcon","DragHandleIcon","SyncAltIcon","enableColumnActions","enableColumnResizing","enableDensityToggle","enableFilters","enableFullScreenToggle","enableGlobalFilter","enableHiding","enablePagination","layoutMode","manualFiltering","manualSorting","muiTablePaperProps","elevation","selectAllMode","defaultColumn","Cell","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","bulkActionMenuButton","buttonVariant","endIcon","isDisabled","Object","keys","length","ariaLabel","incomingData","sort","error","marginBottom","onChangeSearch","onChangeFilters","additionalActions","severity","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_RowData,\n MRT_SortingState,\n MRT_TableOptions,\n MRT_RowSelectionState,\n MRT_RowVirtualizer,\n MRT_VisibilityState,\n useMaterialReactTable,\n MRT_TableContainer,\n} from \"material-react-table\";\nimport {\n ArrowDownIcon,\n ArrowUnsortedIcon,\n DragIndicatorIcon,\n MoreIcon,\n} from \"../icons.generated\";\nimport { densityValues, paginationTypeValues } from \"./constants\";\nimport { DataTablePagination } from \"./DataTablePagination\";\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 {\n DataTableColumn,\n DataTableRowData,\n DataTableRowSelectionState,\n} from \".\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext\";\nimport { useScrollIndication } from \"./useScrollIndication\";\nimport styled from \"@emotion/styled\";\nimport { DataTableEmptyState } from \"./DataTableEmptyState\";\nimport { Callout } from \"../Callout\";\nimport { t } from \"i18next\";\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 DataTableProps = {\n /**\n * The columns that make up the table\n */\n columns: MRT_TableOptions<MRT_RowData>[\"columns\"];\n /**\n * The total number of rows in the table. Optional, because it's sometimes impossible\n * to calculate. Used in table pagination to know when to disable the \"next\"/\"more\" button.\n */\n totalRows?: number;\n /**\n * The function to get the ID of a row\n */\n getRowId?: MRT_TableOptions<MRT_RowData>[\"getRowId\"];\n /**\n * The initial density (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 * If true, the end user will be able to change the table density.\n */\n hasChangeableDensity?: boolean;\n /**\n * If true, the end user can resize individual columns.\n */\n hasColumnResizing?: boolean;\n /**\n * If true, the end user will be able to show/hide columns.\n */\n hasColumnVisibility?: boolean;\n /**\n * If true, the end user will be able to filter columns.\n */\n hasFilters?: boolean;\n /**\n * If true, the table will include pagination controls.\n */\n hasPagination?: boolean;\n /**\n * If true, the table will include checkboxes on each row, enabling\n * the user to select some or all rows.\n */\n hasRowSelection?: boolean;\n /**\n * If true, the global table search controls will be shown.\n */\n hasSearch?: boolean;\n /**\n * If true, the end user can sort columns (ascending, descending, or neither)\n */\n hasSorting?: boolean;\n /**\n * If true, the end user can reorder rows via a drag-and-drop interface\n */\n hasRowReordering?: boolean;\n /**\n * If true, the search field will include a Search button, rather than\n * firing on input change.\n */\n hasSearchSubmitButton?: boolean;\n /**\n * The debounce time, in milliseconds, for the search input firing\n * `onChangeSearch` when changed. If `hasSearchSubmitButton` is true,\n * this doesn't do anything.\n */\n searchDelayTime?: number;\n /**\n * Callback that fires when a row (or rows) is selected or unselected.\n */\n onChangeRowSelection?: (rowSelection: DataTableRowSelectionState) => void;\n /**\n * Callback that fires whenever the table needs to fetch new data, due to changes in\n * page, results per page, search input, filters, or sorting\n */\n getData: ({\n page,\n resultsPerPage,\n search,\n filters,\n sort,\n }: DataTableGetDataType) =>\n | MRT_TableOptions<MRT_RowData>[\"data\"]\n | Promise<MRT_TableOptions<MRT_RowData>[\"data\"]>;\n /**\n * Callback that fires when the user reorders rows within the table. Can be used\n * to propogate order change to the backend.\n */\n onReorderRows?: ({ rowId, newRowIndex }: DataTableOnReorderRowsType) => void;\n /**\n * The current page number.\n */\n currentPage?: number;\n /**\n * The number of results per page.\n */\n resultsPerPage?: number;\n /**\n * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n * set to a simple \"Load more\" button by setting to \"loadMore\".\n */\n paginationType?: (typeof paginationTypeValues)[number];\n /**\n * Action buttons to display in each row\n */\n rowActionButtons?: DataTableRowActionsProps[\"rowActionButtons\"];\n /**\n * Menu items to include in the optional actions menu on each row.\n */\n rowActionMenuItems?: DataTableRowActionsProps[\"rowActionMenuItems\"];\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 * 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 * The component to display when the query returns no results\n */\n noResultsPlaceholder?: ReactNode;\n /**\n * An optional set of filters to render in the filters menu\n */\n filters?: Array<DataFilter | DataTableColumn<DataTableRowData> | string>;\n};\n\nconst 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 },\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};\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 borderBlockEndColor: odysseyDesignTokens.HueNeutral100,\n borderBlockEndStyle: \"solid\",\n borderBlockEndWidth: odysseyDesignTokens.BorderWidthMain,\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 columns,\n getRowId: getRowIdProp,\n currentPage = 1,\n initialDensity = densityValues[0],\n resultsPerPage = 20,\n getData,\n onReorderRows,\n totalRows,\n hasSearchSubmitButton,\n searchDelayTime,\n paginationType = \"paged\",\n onChangeRowSelection,\n rowActionButtons,\n rowActionMenuItems,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSorting,\n bulkActionMenuItems,\n errorMessage: errorMessageProp,\n emptyPlaceholder,\n noResultsPlaceholder,\n filters: filtersProp,\n}: DataTableProps) => {\n const [data, setData] = useState<MRT_RowData[]>([]);\n const [pagination, setPagination] = useState({\n pageIndex: currentPage,\n pageSize: resultsPerPage,\n });\n const [draggingRow, setDraggingRow] = useState<MRT_Row<MRT_RowData> | 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>(\"\");\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 ? getRowIdProp : (row: MRT_RowData) => row.id;\n\n const rowDensityCellClassName = useMemo(() => {\n return rowDensity === \"spacious\"\n ? \"MuiTableCell-spacious\"\n : rowDensity === \"compact\"\n ? \"MuiTableCell-compact\"\n : \"MuiTableCell-default\";\n }, [rowDensity]);\n\n const renderRowActions = useCallback(\n ({ row }: { row: MRT_Row<MRT_RowData> }) => {\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: MRT_Cell<MRT_RowData> }) => {\n const value = cell.getValue<string>();\n return (\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 <DataTableEmptyState\n heading={t(\"table.noresults.heading\")}\n text={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 tableInnerContainerWidth,\n emptyPlaceholder,\n noResultsPlaceholder,\n isEmpty,\n ]);\n\n const dataTable = useMaterialReactTable({\n columns: columns,\n data: data,\n getRowId: getRowId,\n state: {\n density: rowDensity,\n sorting: columnSorting,\n globalFilter: search,\n columnVisibility,\n isLoading,\n rowSelection,\n },\n icons: {\n ArrowDownwardIcon: ArrowDownIcon,\n DragHandleIcon: DragIndicatorIcon,\n SyncAltIcon: ArrowUnsortedIcon,\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 displayColumnDefOptions as MRT_TableOptions<MRT_RowData>[\"displayColumnDefOptions\"],\n muiTableBodyCellProps: () => ({\n className: rowDensityCellClassName,\n }),\n defaultColumn: {\n Cell: defaultCell,\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:\n (hasRowReordering === true && onReorderRows) ||\n rowActionButtons ||\n rowActionMenuItems\n ? true\n : false,\n positionActionsColumn:\n \"last\" as MRT_TableOptions<MRT_RowData>[\"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 },\n\n muiTableContainerProps: {\n ref: tableInnerContainerRef,\n },\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 }, [pagination, columnSorting, search, filters, getData, errorMessageProp]);\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 onChangeRowSelection?.(rowSelection);\n }, [rowSelection, onChangeRowSelection]);\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 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 <DataTablePagination\n pagination={pagination}\n setPagination={setPagination}\n totalRows={totalRows}\n isDisabled={isEmpty}\n variant={paginationType}\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/MenuButton.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuButton.js","names":["memo","useCallback","useMemo","useState","Button","useUniqueId","ChevronDownIcon","MoreIcon","MenuContext","jsx","_jsx","jsxs","_jsxs","menuAlignmentValues","MenuButton","ariaLabel","ariaLabelledBy","ariaDescribedBy","buttonLabel","buttonVariant","children","shouldCloseOnSelect","endIcon","endIconProp","id","idOverride","isDisabled","isOverflow","menuAlignment","size","testId","tooltipText","translate","anchorEl","setAnchorEl","isOpen","Boolean","closeMenu","openMenu","event","currentTarget","uniqueId","menuListProps","providerValue","anchorOrigin","horizontal","vertical","transformOrigin","ariaControls","undefined","ariaExpanded","ariaHasPopup","label","onClick","variant","_Menu","MenuListProps","onClose","open","Provider","value","MemoizedMenuButton","displayName"],"sources":["../src/MenuButton.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 {
|
|
1
|
+
{"version":3,"file":"MenuButton.js","names":["memo","useCallback","useMemo","useState","Button","useUniqueId","ChevronDownIcon","MoreIcon","MenuContext","jsx","_jsx","jsxs","_jsxs","menuAlignmentValues","MenuButton","ariaLabel","ariaLabelledBy","ariaDescribedBy","buttonLabel","buttonVariant","children","shouldCloseOnSelect","endIcon","endIconProp","id","idOverride","isDisabled","isOverflow","menuAlignment","size","testId","tooltipText","translate","anchorEl","setAnchorEl","isOpen","Boolean","closeMenu","openMenu","event","currentTarget","uniqueId","menuListProps","providerValue","anchorOrigin","horizontal","vertical","transformOrigin","ariaControls","undefined","ariaExpanded","ariaHasPopup","label","onClick","variant","_Menu","MenuListProps","onClose","open","Provider","value","MemoizedMenuButton","displayName"],"sources":["../src/MenuButton.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n memo,\n type ReactElement,\n useCallback,\n useMemo,\n useState,\n ReactNode,\n} from \"react\";\nimport { Menu as MuiMenu, PopoverOrigin } from \"@mui/material\";\n\nimport { Button, buttonSizeValues, buttonVariantValues, useUniqueId } from \"./\";\nimport { ChevronDownIcon, MoreIcon } from \"./icons.generated\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { MenuContext, MenuContextType } from \"./MenuContext\";\nimport { NullElement } from \"./NullElement\";\nimport type { HtmlProps } from \"./HtmlProps\";\n\nexport const menuAlignmentValues = [\"left\", \"right\"] as const;\n\nexport type MenuButtonProps = {\n /**\n * The label on the triggering Button\n */\n buttonLabel?: string;\n /**\n * The variant of the triggering Button\n */\n buttonVariant?: (typeof buttonVariantValues)[number];\n /**\n * The <MenuItem> components within the Menu.\n */\n children: ReactNode | NullElement;\n /**\n * The end Icon on the trigggering Button\n */\n endIcon?: ReactElement;\n /**\n * The id of the Button\n */\n id?: string;\n /**\n * If the MenuButton is an overflow menu or standard menu.\n */\n isOverflow?: boolean;\n /**\n * The horizontal alignment of the menu.\n */\n menuAlignment?: (typeof menuAlignmentValues)[number];\n /**\n * If true (the default), the menu will close when a child MenuItem is clicked.\n * Otherwise, it will remain open.\n */\n shouldCloseOnSelect?: boolean;\n /**\n * The size of the button\n */\n size?: (typeof buttonSizeValues)[number];\n /**\n * The tooltip text for the Button if it's icon-only\n */\n tooltipText?: string;\n} & Pick<\n HtmlProps,\n \"ariaDescribedBy\" | \"ariaLabel\" | \"ariaLabelledBy\" | \"testId\" | \"translate\"\n> &\n Pick<FieldComponentProps, \"isDisabled\"> &\n (\n | { buttonLabel: string }\n | (Required<Pick<HtmlProps, \"ariaLabelledBy\">> &\n Partial<Pick<HtmlProps, \"ariaLabel\">> & {\n buttonLabel?: undefined | \"\";\n })\n | (Required<Pick<HtmlProps, \"ariaLabel\">> &\n Partial<Pick<HtmlProps, \"ariaLabelledBy\">> & {\n buttonLabel?: undefined | \"\";\n })\n );\n\nconst MenuButton = ({\n ariaLabel,\n ariaLabelledBy,\n ariaDescribedBy,\n buttonLabel = \"\",\n buttonVariant = \"secondary\",\n children,\n shouldCloseOnSelect = true,\n endIcon: endIconProp,\n id: idOverride,\n isDisabled,\n isOverflow,\n menuAlignment = \"left\",\n size,\n testId,\n tooltipText,\n translate,\n}: MenuButtonProps) => {\n const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n\n const isOpen = Boolean(anchorEl);\n\n const closeMenu = useCallback(() => {\n setAnchorEl(null);\n }, []);\n\n const openMenu = useCallback<MenuContextType[\"openMenu\"]>((event) => {\n setAnchorEl(event.currentTarget);\n }, []);\n\n const uniqueId = useUniqueId(idOverride);\n\n const menuListProps = useMemo(\n () => ({ \"aria-labelledby\": `${uniqueId}-button` }),\n [uniqueId],\n );\n\n const providerValue = useMemo<MenuContextType>(\n () => ({\n closeMenu,\n openMenu,\n shouldCloseOnSelect,\n }),\n [closeMenu, openMenu, shouldCloseOnSelect],\n );\n\n const endIcon = endIconProp ? (\n endIconProp\n ) : isOverflow ? (\n <MoreIcon />\n ) : (\n <ChevronDownIcon />\n );\n\n const anchorOrigin = useMemo(\n () =>\n ({\n horizontal: menuAlignment,\n vertical: \"bottom\",\n }) as PopoverOrigin,\n [menuAlignment],\n );\n\n const transformOrigin = useMemo(\n () =>\n ({\n horizontal: menuAlignment,\n vertical: \"top\",\n }) as PopoverOrigin,\n [menuAlignment],\n );\n\n return (\n <div>\n <Button\n ariaControls={isOpen ? `${uniqueId}-menu` : undefined}\n ariaExpanded={isOpen ? \"true\" : undefined}\n ariaHasPopup=\"true\"\n ariaDescribedBy={ariaDescribedBy}\n ariaLabel={ariaLabel}\n ariaLabelledBy={ariaLabelledBy}\n testId={testId}\n endIcon={endIcon}\n id={`${uniqueId}-button`}\n isDisabled={isDisabled}\n label={buttonLabel}\n onClick={openMenu}\n size={size}\n tooltipText={tooltipText}\n translate={translate}\n variant={buttonVariant}\n />\n\n <MuiMenu\n anchorOrigin={anchorOrigin}\n transformOrigin={transformOrigin}\n anchorEl={anchorEl}\n id={`${uniqueId}-menu`}\n MenuListProps={menuListProps}\n onClose={closeMenu}\n open={isOpen}\n >\n <MenuContext.Provider value={providerValue}>\n {children}\n </MenuContext.Provider>\n </MuiMenu>\n </div>\n );\n};\n\nconst MemoizedMenuButton = memo(MenuButton);\nMemoizedMenuButton.displayName = \"MenuButton\";\n\nexport { MemoizedMenuButton as MenuButton };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SACEA,IAAI,EAEJC,WAAW,EACXC,OAAO,EACPC,QAAQ,QAEH,OAAO;AAAC,SAGNC,MAAM,EAAyCC,WAAW;AAAA,SAC1DC,eAAe,EAAEC,QAAQ;AAAA,SAEzBC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAIpB,OAAO,MAAMC,mBAAmB,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU;AA6D7D,MAAMC,UAAU,GAAGA,CAAC;EAClBC,SAAS;EACTC,cAAc;EACdC,eAAe;EACfC,WAAW,GAAG,EAAE;EAChBC,aAAa,GAAG,WAAW;EAC3BC,QAAQ;EACRC,mBAAmB,GAAG,IAAI;EAC1BC,OAAO,EAAEC,WAAW;EACpBC,EAAE,EAAEC,UAAU;EACdC,UAAU;EACVC,UAAU;EACVC,aAAa,GAAG,MAAM;EACtBC,IAAI;EACJC,MAAM;EACNC,WAAW;EACXC;AACe,CAAC,KAAK;EACrB,MAAM,CAACC,QAAQ,EAAEC,WAAW,CAAC,GAAG/B,QAAQ,CAAqB,IAAI,CAAC;EAElE,MAAMgC,MAAM,GAAGC,OAAO,CAACH,QAAQ,CAAC;EAEhC,MAAMI,SAAS,GAAGpC,WAAW,CAAC,MAAM;IAClCiC,WAAW,CAAC,IAAI,CAAC;EACnB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMI,QAAQ,GAAGrC,WAAW,CAA+BsC,KAAK,IAAK;IACnEL,WAAW,CAACK,KAAK,CAACC,aAAa,CAAC;EAClC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMC,QAAQ,GAAGpC,WAAW,CAACoB,UAAU,CAAC;EAExC,MAAMiB,aAAa,GAAGxC,OAAO,CAC3B,OAAO;IAAE,iBAAiB,EAAG,GAAEuC,QAAS;EAAS,CAAC,CAAC,EACnD,CAACA,QAAQ,CACX,CAAC;EAED,MAAME,aAAa,GAAGzC,OAAO,CAC3B,OAAO;IACLmC,SAAS;IACTC,QAAQ;IACRjB;EACF,CAAC,CAAC,EACF,CAACgB,SAAS,EAAEC,QAAQ,EAAEjB,mBAAmB,CAC3C,CAAC;EAED,MAAMC,OAAO,GAAGC,WAAW,GACzBA,WAAW,GACTI,UAAU,GACZjB,IAAA,CAACH,QAAQ,IAAE,CAAC,GAEZG,IAAA,CAACJ,eAAe,IAAE,CACnB;EAED,MAAMsC,YAAY,GAAG1C,OAAO,CAC1B,OACG;IACC2C,UAAU,EAAEjB,aAAa;IACzBkB,QAAQ,EAAE;EACZ,CAAC,CAAkB,EACrB,CAAClB,aAAa,CAChB,CAAC;EAED,MAAMmB,eAAe,GAAG7C,OAAO,CAC7B,OACG;IACC2C,UAAU,EAAEjB,aAAa;IACzBkB,QAAQ,EAAE;EACZ,CAAC,CAAkB,EACrB,CAAClB,aAAa,CAChB,CAAC;EAED,OACEhB,KAAA;IAAAQ,QAAA,GACEV,IAAA,CAACN,MAAM;MACL4C,YAAY,EAAEb,MAAM,GAAI,GAAEM,QAAS,OAAM,GAAGQ,SAAU;MACtDC,YAAY,EAAEf,MAAM,GAAG,MAAM,GAAGc,SAAU;MAC1CE,YAAY,EAAC,MAAM;MACnBlC,eAAe,EAAEA,eAAgB;MACjCF,SAAS,EAAEA,SAAU;MACrBC,cAAc,EAAEA,cAAe;MAC/Bc,MAAM,EAAEA,MAAO;MACfR,OAAO,EAAEA,OAAQ;MACjBE,EAAE,EAAG,GAAEiB,QAAS,SAAS;MACzBf,UAAU,EAAEA,UAAW;MACvB0B,KAAK,EAAElC,WAAY;MACnBmC,OAAO,EAAEf,QAAS;MAClBT,IAAI,EAAEA,IAAK;MACXE,WAAW,EAAEA,WAAY;MACzBC,SAAS,EAAEA,SAAU;MACrBsB,OAAO,EAAEnC;IAAc,CACxB,CAAC,EAEFT,IAAA,CAAA6C,KAAA;MACEX,YAAY,EAAEA,YAAa;MAC3BG,eAAe,EAAEA,eAAgB;MACjCd,QAAQ,EAAEA,QAAS;MACnBT,EAAE,EAAG,GAAEiB,QAAS,OAAO;MACvBe,aAAa,EAAEd,aAAc;MAC7Be,OAAO,EAAEpB,SAAU;MACnBqB,IAAI,EAAEvB,MAAO;MAAAf,QAAA,EAEbV,IAAA,CAACF,WAAW,CAACmD,QAAQ;QAACC,KAAK,EAAEjB,aAAc;QAAAvB,QAAA,EACxCA;MAAQ,CACW;IAAC,CAChB,CAAC;EAAA,CACP,CAAC;AAEV,CAAC;AAED,MAAMyC,kBAAkB,GAAG7D,IAAI,CAACc,UAAU,CAAC;AAC3C+C,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAI/C,UAAU"}
|
package/dist/RadioGroup.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.js","names":["memo","useCallback","useRef","Field","getControlState","useInputValues","jsx","_jsx","RadioGroup","ariaDescribedBy","children","defaultValue","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","isDisabled","label","name","nameOverride","onChange","onChangeProp","testId","translate","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","renderFieldComponent","errorMessageElementId","labelElementId","_RadioGroup","fieldType","hasVisibleLabel","MemoizedRadioGroup","displayName"],"sources":["../src/RadioGroup.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 RadioGroup as MuiRadioGroup,\n type RadioGroupProps as MuiRadioGroupProps,\n} from \"@mui/material\";\nimport { memo,
|
|
1
|
+
{"version":3,"file":"RadioGroup.js","names":["memo","useCallback","useRef","Field","getControlState","useInputValues","jsx","_jsx","RadioGroup","ariaDescribedBy","children","defaultValue","errorMessage","errorMessageList","hint","HintLinkComponent","id","idOverride","isDisabled","label","name","nameOverride","onChange","onChangeProp","testId","translate","value","controlledStateRef","controlledValue","uncontrolledValue","inputValues","controlState","current","event","renderFieldComponent","errorMessageElementId","labelElementId","_RadioGroup","fieldType","hasVisibleLabel","MemoizedRadioGroup","displayName"],"sources":["../src/RadioGroup.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 RadioGroup as MuiRadioGroup,\n type RadioGroupProps as MuiRadioGroupProps,\n} from \"@mui/material\";\nimport { memo, ReactNode, useCallback, useRef } from \"react\";\n\nimport { RadioProps } from \"./Radio\";\nimport { Field } from \"./Field\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport { getControlState, useInputValues } from \"./inputUtils\";\n\nexport type RadioGroupProps = {\n /**\n * The Radio components within the group. Must include two or more.\n */\n children: ReactNode;\n /**\n * The text value of the Radio that should be selected by default\n */\n defaultValue?: string;\n /**\n * The text label for the RadioGroup\n */\n label: string;\n /**\n * Listen for changes in the browser that change `value`\n */\n onChange?: MuiRadioGroupProps[\"onChange\"];\n /**\n * The `value` on the selected Radio\n */\n value?: RadioProps[\"value\"];\n} & Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"errorMessageList\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"id\"\n | \"isDisabled\"\n | \"name\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" | \"testId\" | \"translate\">;\n\ntype FieldRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" | \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" | \"labelElementId\">;\n\nconst RadioGroup = ({\n ariaDescribedBy,\n children,\n defaultValue,\n errorMessage,\n errorMessageList,\n hint,\n HintLinkComponent,\n id: idOverride,\n isDisabled,\n label,\n name: nameOverride,\n onChange: onChangeProp,\n testId,\n translate,\n value,\n}: RadioGroupProps) => {\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<NonNullable<MuiRadioGroupProps[\"onChange\"]>>(\n (event, value) => {\n onChangeProp?.(event, value);\n },\n [onChangeProp],\n );\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: FieldRenderProps) => (\n <MuiRadioGroup\n {...inputValues}\n aria-describedby={ariaDescribedBy}\n aria-errormessage={errorMessageElementId}\n aria-labelledby={labelElementId}\n data-se={testId}\n id={id}\n name={nameOverride ?? id}\n onChange={onChange}\n translate={translate}\n >\n {children}\n </MuiRadioGroup>\n ),\n [children, inputValues, nameOverride, onChange, testId, translate],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n fieldType=\"group\"\n hasVisibleLabel={false}\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n};\n\nconst MemoizedRadioGroup = memo(RadioGroup);\nMemoizedRadioGroup.displayName = \"RadioGroup\";\n\nexport { MemoizedRadioGroup as RadioGroup };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA,SAASA,IAAI,EAAaC,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAAC,SAGpDC,KAAK;AAAA,SAMLC,eAAe,EAAEC,cAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAwCxC,MAAMC,UAAU,GAAGA,CAAC;EAClBC,eAAe;EACfC,QAAQ;EACRC,YAAY;EACZC,YAAY;EACZC,gBAAgB;EAChBC,IAAI;EACJC,iBAAiB;EACjBC,EAAE,EAAEC,UAAU;EACdC,UAAU;EACVC,KAAK;EACLC,IAAI,EAAEC,YAAY;EAClBC,QAAQ,EAAEC,YAAY;EACtBC,MAAM;EACNC,SAAS;EACTC;AACe,CAAC,KAAK;EACrB,MAAMC,kBAAkB,GAAGzB,MAAM,CAC/BE,eAAe,CAAC;IACdwB,eAAe,EAAEF,KAAK;IACtBG,iBAAiB,EAAElB;EACrB,CAAC,CACH,CAAC;EACD,MAAMmB,WAAW,GAAGzB,cAAc,CAAC;IACjCM,YAAY;IACZe,KAAK;IACLK,YAAY,EAAEJ,kBAAkB,CAACK;EACnC,CAAC,CAAC;EAEF,MAAMV,QAAQ,GAAGrB,WAAW,CAC1B,CAACgC,KAAK,EAAEP,KAAK,KAAK;IAChBH,YAAY,GAAGU,KAAK,EAAEP,KAAK,CAAC;EAC9B,CAAC,EACD,CAACH,YAAY,CACf,CAAC;EACD,MAAMW,oBAAoB,GAAGjC,WAAW,CACtC,CAAC;IACCQ,eAAe;IACf0B,qBAAqB;IACrBnB,EAAE;IACFoB;EACgB,CAAC,KACjB7B,IAAA,CAAA8B,WAAA;IAAA,GACMP,WAAW;IACf,oBAAkBrB,eAAgB;IAClC,qBAAmB0B,qBAAsB;IACzC,mBAAiBC,cAAe;IAChC,WAASZ,MAAO;IAChBR,EAAE,EAAEA,EAAG;IACPI,IAAI,EAAEC,YAAY,IAAIL,EAAG;IACzBM,QAAQ,EAAEA,QAAS;IACnBG,SAAS,EAAEA,SAAU;IAAAf,QAAA,EAEpBA;EAAQ,CACI,CAChB,EACD,CAACA,QAAQ,EAAEoB,WAAW,EAAET,YAAY,EAAEC,QAAQ,EAAEE,MAAM,EAAEC,SAAS,CACnE,CAAC;EAED,OACElB,IAAA,CAACJ,KAAK;IACJM,eAAe,EAAEA,eAAgB;IACjCG,YAAY,EAAEA,YAAa;IAC3BC,gBAAgB,EAAEA,gBAAiB;IACnCyB,SAAS,EAAC,OAAO;IACjBC,eAAe,EAAE,KAAM;IACvBzB,IAAI,EAAEA,IAAK;IACXC,iBAAiB,EAAEA,iBAAkB;IACrCC,EAAE,EAAEC,UAAW;IACfC,UAAU,EAAEA,UAAW;IACvBC,KAAK,EAAEA,KAAM;IACbe,oBAAoB,EAAEA;EAAqB,CAC5C,CAAC;AAEN,CAAC;AAED,MAAMM,kBAAkB,GAAGxC,IAAI,CAACQ,UAAU,CAAC;AAC3CgC,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIhC,UAAU"}
|
package/dist/Select.js
CHANGED
|
@@ -66,6 +66,7 @@ const NonInteractiveIcon = styled(CloseCircleFilledIcon, {
|
|
|
66
66
|
margin-inline-end: -${({
|
|
67
67
|
odysseyDesignTokens
|
|
68
68
|
}) => odysseyDesignTokens.Spacing1};
|
|
69
|
+
margin-block-end: -1px;
|
|
69
70
|
`;
|
|
70
71
|
const ChipsInnerContainer = styled(_Box, {
|
|
71
72
|
shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "isInteractive"
|
|
@@ -75,9 +76,7 @@ const ChipsInnerContainer = styled(_Box, {
|
|
|
75
76
|
gap: ${({
|
|
76
77
|
odysseyDesignTokens
|
|
77
78
|
}) => odysseyDesignTokens.Spacing1};
|
|
78
|
-
pointer-events:
|
|
79
|
-
isInteractive
|
|
80
|
-
}) => isInteractive ? "auto" : "none"};
|
|
79
|
+
pointer-events: none;
|
|
81
80
|
opacity: ${({
|
|
82
81
|
isInteractive
|
|
83
82
|
}) => isInteractive ? 1 : 0};
|
|
@@ -190,7 +189,7 @@ const Select = ({
|
|
|
190
189
|
return _jsxs(ChipsInnerContainer, {
|
|
191
190
|
isInteractive: isInteractive,
|
|
192
191
|
odysseyDesignTokens: odysseyDesignTokens,
|
|
193
|
-
children: [_jsx(ChipsSpacer, {
|
|
192
|
+
children: [selection.length <= 0 && _jsx(ChipsSpacer, {
|
|
194
193
|
odysseyDesignTokens: odysseyDesignTokens
|
|
195
194
|
}), selection.map(item => item?.length > 0 && _jsx(_Chip, {
|
|
196
195
|
label: _jsxs(_Fragment, {
|
package/dist/Select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useImperativeHandle","Field","CheckIcon","CloseCircleFilledIcon","ComponentControlledState","useInputValues","getControlState","normalizedKey","styled","useOdysseyDesignTokens","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","SelectContainer","div","ChipsPositioningContainer","shouldForwardProp","prop","odysseyDesignTokens","Spacing0","Spacing5","Spacing1","BorderWidthMain","NonInteractiveIcon","Spacing2","ChipsInnerContainer","_Box","isInteractive","ChipsSpacer","Spacing6","CONTROLLED","Select","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","inputRef","isDisabled","isFullWidth","isMultiSelect","isOptional","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","options","testId","translate","value","undefined","controlledStateRef","controlledValue","uncontrolledValue","internalSelectedValues","setInternalSelectedValues","current","localInputRef","focus","inputValues","controlState","event","child","target","split","normalizedOptions","map","option","text","type","Chips","selection","removeSelection","itemToRemove","Array","isArray","newValue","filter","item","syntheticEvent","stopPropagation","children","length","_Chip","tabIndex","onDelete","deleteIcon","sx","pointerEvents","onMouseDown","index","_ListSubheader","isSelected","includes","_MenuItem","selected","_Checkbox","checked","_ListItemSecondaryAction","toString","renderValue","renderFieldComponent","errorMessageElementId","labelElementId","_Select","inputProps","labelId","multiple","fieldType","hasVisibleLabel","MemoizedSelect","displayName"],"sources":["../src/Select.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n useImperativeHandle,\n MouseEvent,\n} from \"react\";\nimport {\n Box as MuiBox,\n Checkbox as MuiCheckbox,\n Chip as MuiChip,\n ListItemSecondaryAction,\n ListSubheader,\n MenuItem as MuiMenuItem,\n Select as MuiSelect,\n SelectChangeEvent,\n} from \"@mui/material\";\nimport { SelectProps as MuiSelectProps } from \"@mui/material\";\n\nimport { Field } from \"./Field\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps\";\nimport { CheckIcon, CloseCircleFilledIcon } from \"./icons.generated\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport {\n ComponentControlledState,\n FocusHandle,\n useInputValues,\n getControlState,\n} from \"./inputUtils\";\nimport { normalizedKey } from \"./useNormalizedKey\";\nimport styled from \"@emotion/styled\";\n\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"./OdysseyDesignTokensContext\";\n\nexport type SelectOption = {\n text: string;\n type?: \"heading\" | \"option\";\n value?: string;\n};\n\nconst SelectContainer = styled.div`\n position: relative;\n width: 100%;\n display: flex;\n`;\n\nconst ChipsPositioningContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>`\n display: flex;\n align-items: center;\n position: absolute;\n top: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing0};\n right: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing5};\n bottom: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing0};\n left: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n margin-inline-start: ${({ odysseyDesignTokens }) =>\n odysseyDesignTokens.BorderWidthMain};\n opacity: 1;\n pointer-events: none;\n`;\n\nconst NonInteractiveIcon = styled(CloseCircleFilledIcon, {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>`\n font-size: 1em;\n margin-inline-start: ${({ odysseyDesignTokens }) =>\n odysseyDesignTokens.Spacing2};\n margin-inline-end: -${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n`;\n\nconst ChipsInnerContainer = styled(MuiBox, {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" && prop !== \"isInteractive\",\n})<{\n isInteractive?: boolean;\n odysseyDesignTokens: DesignTokens;\n}>`\n display: flex;\n flex-wrap: wrap;\n gap: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n pointer-events: ${({ isInteractive }) => (isInteractive ? \"auto\" : \"none\")};\n opacity: ${({ isInteractive }) => (isInteractive ? 1 : 0)};\n`;\n\nconst ChipsSpacer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>`\n display: inline-block;\n border-color: transparent;\n border-style: solid none;\n border-width: 1px;\n height: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing6};\n`;\n\nexport type SelectValueType<HasMultipleChoices> =\n HasMultipleChoices extends true ? string[] : string;\n\nexport type SelectProps<\n Value extends SelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n> = {\n /**\n * The default value. Use when the component is not controlled.\n */\n defaultValue?: MuiSelectProps<Value>[\"defaultValue\"];\n /**\n * If `true`, the Select allows multiple selections\n */\n hasMultipleChoices?: HasMultipleChoices;\n /**\n * The ref forwarded to the Select\n */\n inputRef?: React.RefObject<FocusHandle>;\n /**\n * @deprecated Use `hasMultipleChoices` instead.\n */\n /** **Deprecated:** use `hasMultipleChoices` */\n isMultiSelect?: HasMultipleChoices;\n /**\n * The label text for the Select\n */\n label: string;\n /**\n * Callback fired when the Select loses focus\n */\n onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n /**\n * Callback fired when the value of the Select changes\n */\n onChange?: MuiSelectProps<Value>[\"onChange\"];\n /**\n * Callback fired when the Select gains focus\n */\n onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n /**\n * The options for the Select\n */\n options: (string | SelectOption)[];\n /**\n * The value or values selected in the Select\n */\n value?: Value;\n} & Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"errorMessageList\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"id\"\n | \"isDisabled\"\n | \"isFullWidth\"\n | \"isOptional\"\n | \"name\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" | \"testId\" | \"translate\">;\n\ntype SelectRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" | \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" | \"labelElementId\">;\n\n/**\n * Options in Odyssey <Select> are passed as an array, which can contain any combination\n * of the following:\n * - string — A simple string. The string will be both the text and the value of the resulting option.\n * <option value=\"string\">string</option>\n *\n * - { text: string } — Same as above, but the string is contained within an object.\n * <option value=\"text\">text</option>\n *\n * - { text: string, value: string } — The option text will be text, and the option value will be value.\n * <option value=\"value\">text</option>\n *\n * - { text: string, type: \"heading\" } — Used to display a group heading with the text\n */\n\nconst { CONTROLLED } = ComponentControlledState;\nconst Select = <\n Value extends SelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n>({\n ariaDescribedBy,\n defaultValue,\n errorMessage,\n errorMessageList,\n hasMultipleChoices: hasMultipleChoicesProp,\n hint,\n HintLinkComponent,\n id: idOverride,\n inputRef,\n isDisabled = false,\n isFullWidth = false,\n isMultiSelect,\n isOptional = false,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n options,\n testId,\n translate,\n value,\n}: SelectProps<Value, HasMultipleChoices>) => {\n const hasMultipleChoices = useMemo(\n () =>\n hasMultipleChoicesProp === undefined\n ? isMultiSelect\n : hasMultipleChoicesProp,\n [hasMultipleChoicesProp, isMultiSelect],\n );\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n const [internalSelectedValues, setInternalSelectedValues] = useState(\n controlledStateRef.current === CONTROLLED ? value : defaultValue,\n );\n const localInputRef = useRef<HTMLSelectElement>(null);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n useImperativeHandle(\n inputRef,\n () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\n },\n };\n },\n [],\n );\n\n useEffect(() => {\n if (controlledStateRef.current === CONTROLLED) {\n setInternalSelectedValues(value);\n }\n }, [value]);\n\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<NonNullable<MuiSelectProps<Value>[\"onChange\"]>>(\n (event, child) => {\n const {\n target: { value },\n } = event;\n if (controlledStateRef.current !== CONTROLLED) {\n setInternalSelectedValues(\n (typeof value === \"string\" ? value.split(\",\") : value) as Value,\n );\n }\n onChangeProp?.(event, child);\n },\n [onChangeProp],\n );\n\n // Normalize the options array to accommodate the various\n // data types that might be passed\n const normalizedOptions = useMemo(\n () =>\n options.map((option) => {\n if (typeof option === \"object\") {\n /**\n * If the value of `option?.value is an empty string, we need to make sure that we\n * set an empty string to `value` in the normalized option so that the select component\n * can potentially set it as the selected one in the text input\n */\n const value =\n option?.value === \"\" ? option.value : option.value || option.text;\n return {\n text: option.text,\n value,\n type: option.type === \"heading\" ? \"heading\" : \"option\",\n };\n }\n return { text: option, value: option, type: \"option\" };\n }),\n [options],\n );\n\n const Chips = useCallback(\n ({\n selection,\n isInteractive,\n }: {\n selection: string[];\n isInteractive: boolean;\n }) => {\n const removeSelection = (itemToRemove: string) => {\n if (Array.isArray(internalSelectedValues)) {\n const newValue = internalSelectedValues.filter(\n (item: string) => item !== itemToRemove,\n );\n\n const syntheticEvent = {\n target: { value: newValue },\n } as SelectChangeEvent<Value>;\n\n onChange(syntheticEvent, null);\n }\n };\n\n const stopPropagation = (event: MouseEvent<SVGSVGElement>) =>\n event.stopPropagation();\n\n return (\n <ChipsInnerContainer\n isInteractive={isInteractive}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <ChipsSpacer odysseyDesignTokens={odysseyDesignTokens} />\n {selection.map(\n (item: string) =>\n item?.length > 0 && (\n <MuiChip\n key={item}\n label={\n <>\n {item}\n {!isInteractive &&\n controlledStateRef.current === CONTROLLED &&\n hasMultipleChoices && (\n <NonInteractiveIcon\n odysseyDesignTokens={odysseyDesignTokens}\n />\n )}\n </>\n }\n tabIndex={-1}\n onDelete={\n isInteractive && controlledStateRef.current === CONTROLLED\n ? () => removeSelection(item)\n : undefined\n }\n deleteIcon={\n <CloseCircleFilledIcon\n sx={{ pointerEvents: \"auto\" }}\n // We need to stop event propagation on mouse down to prevent the deletion\n // from being blocked by the Select list opening, and also ensure that\n // the pointerEvent is registered even when the parent's are not\n onMouseDown={stopPropagation}\n />\n }\n />\n ),\n )}\n </ChipsInnerContainer>\n );\n },\n [\n controlledStateRef,\n hasMultipleChoices,\n internalSelectedValues,\n odysseyDesignTokens,\n onChange,\n ],\n );\n\n // Convert the options into the ReactNode children\n // that will populate the <Select>\n const children = useMemo(\n () =>\n normalizedOptions.map((option, index) => {\n if (option.type === \"heading\") {\n return (\n <ListSubheader key={option.text}> {option.text} </ListSubheader>\n );\n }\n\n const isSelected = hasMultipleChoices\n ? internalSelectedValues?.includes(option.value)\n : internalSelectedValues === option.value;\n\n return (\n <MuiMenuItem\n key={normalizedKey(option.text, index.toString())}\n value={option.value}\n selected={isSelected}\n >\n {hasMultipleChoices && <MuiCheckbox checked={isSelected} />}\n {option.text}\n {!hasMultipleChoices &&\n (internalSelectedValues?.includes(option.value) ||\n internalSelectedValues === option.value) && (\n <ListItemSecondaryAction>\n <CheckIcon />\n </ListItemSecondaryAction>\n )}\n </MuiMenuItem>\n );\n }),\n [hasMultipleChoices, normalizedOptions, internalSelectedValues],\n );\n\n const renderValue = useCallback(\n (value: Value) =>\n Array.isArray(value) && <Chips selection={value} isInteractive={false} />,\n [Chips],\n );\n\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: SelectRenderProps) => (\n <SelectContainer>\n <MuiSelect\n {...inputValues}\n aria-describedby={ariaDescribedBy}\n aria-errormessage={errorMessageElementId}\n children={children}\n id={id}\n inputProps={{ \"data-se\": testId }}\n inputRef={localInputRef}\n labelId={labelElementId}\n multiple={hasMultipleChoices}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n renderValue={hasMultipleChoices ? renderValue : undefined}\n translate={translate}\n />\n {hasMultipleChoices && Array.isArray(value) && (\n <ChipsPositioningContainer odysseyDesignTokens={odysseyDesignTokens}>\n <Chips selection={value} isInteractive={true} />\n </ChipsPositioningContainer>\n )}\n </SelectContainer>\n ),\n [\n children,\n Chips,\n inputValues,\n hasMultipleChoices,\n nameOverride,\n odysseyDesignTokens,\n onBlur,\n onChange,\n onFocus,\n renderValue,\n testId,\n translate,\n value,\n ],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n};\n\nconst MemoizedSelect = memo(Select);\nMemoizedSelect.displayName = \"Select\";\n\nexport { MemoizedSelect as Select };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Select.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","useImperativeHandle","Field","CheckIcon","CloseCircleFilledIcon","ComponentControlledState","useInputValues","getControlState","normalizedKey","styled","useOdysseyDesignTokens","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","SelectContainer","div","ChipsPositioningContainer","shouldForwardProp","prop","odysseyDesignTokens","Spacing0","Spacing5","Spacing1","BorderWidthMain","NonInteractiveIcon","Spacing2","ChipsInnerContainer","_Box","isInteractive","ChipsSpacer","Spacing6","CONTROLLED","Select","ariaDescribedBy","defaultValue","errorMessage","errorMessageList","hasMultipleChoices","hasMultipleChoicesProp","hint","HintLinkComponent","id","idOverride","inputRef","isDisabled","isFullWidth","isMultiSelect","isOptional","label","name","nameOverride","onBlur","onChange","onChangeProp","onFocus","options","testId","translate","value","undefined","controlledStateRef","controlledValue","uncontrolledValue","internalSelectedValues","setInternalSelectedValues","current","localInputRef","focus","inputValues","controlState","event","child","target","split","normalizedOptions","map","option","text","type","Chips","selection","removeSelection","itemToRemove","Array","isArray","newValue","filter","item","syntheticEvent","stopPropagation","children","length","_Chip","tabIndex","onDelete","deleteIcon","sx","pointerEvents","onMouseDown","index","_ListSubheader","isSelected","includes","_MenuItem","selected","_Checkbox","checked","_ListItemSecondaryAction","toString","renderValue","renderFieldComponent","errorMessageElementId","labelElementId","_Select","inputProps","labelId","multiple","fieldType","hasVisibleLabel","MemoizedSelect","displayName"],"sources":["../src/Select.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n useImperativeHandle,\n MouseEvent,\n} from \"react\";\nimport {\n Box as MuiBox,\n Checkbox as MuiCheckbox,\n Chip as MuiChip,\n ListItemSecondaryAction,\n ListSubheader,\n MenuItem as MuiMenuItem,\n Select as MuiSelect,\n SelectChangeEvent,\n} from \"@mui/material\";\nimport { SelectProps as MuiSelectProps } from \"@mui/material\";\n\nimport { Field } from \"./Field\";\nimport {\n FieldComponentProps,\n FieldComponentRenderProps,\n} from \"./FieldComponentProps\";\nimport { CheckIcon, CloseCircleFilledIcon } from \"./icons.generated\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport {\n ComponentControlledState,\n FocusHandle,\n useInputValues,\n getControlState,\n} from \"./inputUtils\";\nimport { normalizedKey } from \"./useNormalizedKey\";\nimport styled from \"@emotion/styled\";\n\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"./OdysseyDesignTokensContext\";\n\nexport type SelectOption = {\n text: string;\n type?: \"heading\" | \"option\";\n value?: string;\n};\n\nconst SelectContainer = styled.div`\n position: relative;\n width: 100%;\n display: flex;\n`;\n\nconst ChipsPositioningContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>`\n display: flex;\n align-items: center;\n position: absolute;\n top: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing0};\n right: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing5};\n bottom: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing0};\n left: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n margin-inline-start: ${({ odysseyDesignTokens }) =>\n odysseyDesignTokens.BorderWidthMain};\n opacity: 1;\n pointer-events: none;\n`;\n\nconst NonInteractiveIcon = styled(CloseCircleFilledIcon, {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>`\n font-size: 1em;\n margin-inline-start: ${({ odysseyDesignTokens }) =>\n odysseyDesignTokens.Spacing2};\n margin-inline-end: -${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n margin-block-end: -1px;\n`;\n\nconst ChipsInnerContainer = styled(MuiBox, {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" && prop !== \"isInteractive\",\n})<{\n isInteractive?: boolean;\n odysseyDesignTokens: DesignTokens;\n}>`\n display: flex;\n flex-wrap: wrap;\n gap: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing1};\n pointer-events: none;\n opacity: ${({ isInteractive }) => (isInteractive ? 1 : 0)};\n`;\n\nconst ChipsSpacer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>`\n display: inline-block;\n border-color: transparent;\n border-style: solid none;\n border-width: 1px;\n height: ${({ odysseyDesignTokens }) => odysseyDesignTokens.Spacing6};\n`;\n\nexport type SelectValueType<HasMultipleChoices> =\n HasMultipleChoices extends true ? string[] : string;\n\nexport type SelectProps<\n Value extends SelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n> = {\n /**\n * The default value. Use when the component is not controlled.\n */\n defaultValue?: MuiSelectProps<Value>[\"defaultValue\"];\n /**\n * If `true`, the Select allows multiple selections\n */\n hasMultipleChoices?: HasMultipleChoices;\n /**\n * The ref forwarded to the Select\n */\n inputRef?: React.RefObject<FocusHandle>;\n /**\n * @deprecated Use `hasMultipleChoices` instead.\n */\n /** **Deprecated:** use `hasMultipleChoices` */\n isMultiSelect?: HasMultipleChoices;\n /**\n * The label text for the Select\n */\n label: string;\n /**\n * Callback fired when the Select loses focus\n */\n onBlur?: MuiSelectProps<Value>[\"onBlur\"];\n /**\n * Callback fired when the value of the Select changes\n */\n onChange?: MuiSelectProps<Value>[\"onChange\"];\n /**\n * Callback fired when the Select gains focus\n */\n onFocus?: MuiSelectProps<Value>[\"onFocus\"];\n /**\n * The options for the Select\n */\n options: (string | SelectOption)[];\n /**\n * The value or values selected in the Select\n */\n value?: Value;\n} & Pick<\n FieldComponentProps,\n | \"errorMessage\"\n | \"errorMessageList\"\n | \"hint\"\n | \"HintLinkComponent\"\n | \"id\"\n | \"isDisabled\"\n | \"isFullWidth\"\n | \"isOptional\"\n | \"name\"\n> &\n Pick<HtmlProps, \"ariaDescribedBy\" | \"testId\" | \"translate\">;\n\ntype SelectRenderProps = Partial<\n Pick<FieldComponentRenderProps, \"ariaDescribedBy\" | \"errorMessageElementId\">\n> &\n Pick<FieldComponentRenderProps, \"id\" | \"labelElementId\">;\n\n/**\n * Options in Odyssey <Select> are passed as an array, which can contain any combination\n * of the following:\n * - string — A simple string. The string will be both the text and the value of the resulting option.\n * <option value=\"string\">string</option>\n *\n * - { text: string } — Same as above, but the string is contained within an object.\n * <option value=\"text\">text</option>\n *\n * - { text: string, value: string } — The option text will be text, and the option value will be value.\n * <option value=\"value\">text</option>\n *\n * - { text: string, type: \"heading\" } — Used to display a group heading with the text\n */\n\nconst { CONTROLLED } = ComponentControlledState;\nconst Select = <\n Value extends SelectValueType<HasMultipleChoices>,\n HasMultipleChoices extends boolean,\n>({\n ariaDescribedBy,\n defaultValue,\n errorMessage,\n errorMessageList,\n hasMultipleChoices: hasMultipleChoicesProp,\n hint,\n HintLinkComponent,\n id: idOverride,\n inputRef,\n isDisabled = false,\n isFullWidth = false,\n isMultiSelect,\n isOptional = false,\n label,\n name: nameOverride,\n onBlur,\n onChange: onChangeProp,\n onFocus,\n options,\n testId,\n translate,\n value,\n}: SelectProps<Value, HasMultipleChoices>) => {\n const hasMultipleChoices = useMemo(\n () =>\n hasMultipleChoicesProp === undefined\n ? isMultiSelect\n : hasMultipleChoicesProp,\n [hasMultipleChoicesProp, isMultiSelect],\n );\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: value,\n uncontrolledValue: defaultValue,\n }),\n );\n const [internalSelectedValues, setInternalSelectedValues] = useState(\n controlledStateRef.current === CONTROLLED ? value : defaultValue,\n );\n const localInputRef = useRef<HTMLSelectElement>(null);\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n useImperativeHandle(\n inputRef,\n () => {\n return {\n focus: () => {\n localInputRef.current?.focus();\n },\n };\n },\n [],\n );\n\n useEffect(() => {\n if (controlledStateRef.current === CONTROLLED) {\n setInternalSelectedValues(value);\n }\n }, [value]);\n\n const inputValues = useInputValues({\n defaultValue,\n value,\n controlState: controlledStateRef.current,\n });\n\n const onChange = useCallback<NonNullable<MuiSelectProps<Value>[\"onChange\"]>>(\n (event, child) => {\n const {\n target: { value },\n } = event;\n if (controlledStateRef.current !== CONTROLLED) {\n setInternalSelectedValues(\n (typeof value === \"string\" ? value.split(\",\") : value) as Value,\n );\n }\n onChangeProp?.(event, child);\n },\n [onChangeProp],\n );\n\n // Normalize the options array to accommodate the various\n // data types that might be passed\n const normalizedOptions = useMemo(\n () =>\n options.map((option) => {\n if (typeof option === \"object\") {\n /**\n * If the value of `option?.value is an empty string, we need to make sure that we\n * set an empty string to `value` in the normalized option so that the select component\n * can potentially set it as the selected one in the text input\n */\n const value =\n option?.value === \"\" ? option.value : option.value || option.text;\n return {\n text: option.text,\n value,\n type: option.type === \"heading\" ? \"heading\" : \"option\",\n };\n }\n return { text: option, value: option, type: \"option\" };\n }),\n [options],\n );\n\n const Chips = useCallback(\n ({\n selection,\n isInteractive,\n }: {\n selection: string[];\n isInteractive: boolean;\n }) => {\n const removeSelection = (itemToRemove: string) => {\n if (Array.isArray(internalSelectedValues)) {\n const newValue = internalSelectedValues.filter(\n (item: string) => item !== itemToRemove,\n );\n\n const syntheticEvent = {\n target: { value: newValue },\n } as SelectChangeEvent<Value>;\n\n onChange(syntheticEvent, null);\n }\n };\n\n const stopPropagation = (event: MouseEvent<SVGSVGElement>) =>\n event.stopPropagation();\n\n return (\n <ChipsInnerContainer\n isInteractive={isInteractive}\n odysseyDesignTokens={odysseyDesignTokens}\n >\n {selection.length <= 0 && (\n <ChipsSpacer odysseyDesignTokens={odysseyDesignTokens} />\n )}\n {selection.map(\n (item: string) =>\n item?.length > 0 && (\n <MuiChip\n key={item}\n label={\n <>\n {item}\n {!isInteractive &&\n controlledStateRef.current === CONTROLLED &&\n hasMultipleChoices && (\n <NonInteractiveIcon\n odysseyDesignTokens={odysseyDesignTokens}\n />\n )}\n </>\n }\n tabIndex={-1}\n onDelete={\n isInteractive && controlledStateRef.current === CONTROLLED\n ? () => removeSelection(item)\n : undefined\n }\n deleteIcon={\n <CloseCircleFilledIcon\n sx={{ pointerEvents: \"auto\" }}\n // We need to stop event propagation on mouse down to prevent the deletion\n // from being blocked by the Select list opening, and also ensure that\n // the pointerEvent is registered even when the parent's are not\n onMouseDown={stopPropagation}\n />\n }\n />\n ),\n )}\n </ChipsInnerContainer>\n );\n },\n [\n controlledStateRef,\n hasMultipleChoices,\n internalSelectedValues,\n odysseyDesignTokens,\n onChange,\n ],\n );\n\n // Convert the options into the ReactNode children\n // that will populate the <Select>\n const children = useMemo(\n () =>\n normalizedOptions.map((option, index) => {\n if (option.type === \"heading\") {\n return (\n <ListSubheader key={option.text}> {option.text} </ListSubheader>\n );\n }\n\n const isSelected = hasMultipleChoices\n ? internalSelectedValues?.includes(option.value)\n : internalSelectedValues === option.value;\n\n return (\n <MuiMenuItem\n key={normalizedKey(option.text, index.toString())}\n value={option.value}\n selected={isSelected}\n >\n {hasMultipleChoices && <MuiCheckbox checked={isSelected} />}\n {option.text}\n {!hasMultipleChoices &&\n (internalSelectedValues?.includes(option.value) ||\n internalSelectedValues === option.value) && (\n <ListItemSecondaryAction>\n <CheckIcon />\n </ListItemSecondaryAction>\n )}\n </MuiMenuItem>\n );\n }),\n [hasMultipleChoices, normalizedOptions, internalSelectedValues],\n );\n\n const renderValue = useCallback(\n (value: Value) =>\n Array.isArray(value) && <Chips selection={value} isInteractive={false} />,\n [Chips],\n );\n\n const renderFieldComponent = useCallback(\n ({\n ariaDescribedBy,\n errorMessageElementId,\n id,\n labelElementId,\n }: SelectRenderProps) => (\n <SelectContainer>\n <MuiSelect\n {...inputValues}\n aria-describedby={ariaDescribedBy}\n aria-errormessage={errorMessageElementId}\n children={children}\n id={id}\n inputProps={{ \"data-se\": testId }}\n inputRef={localInputRef}\n labelId={labelElementId}\n multiple={hasMultipleChoices}\n name={nameOverride ?? id}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n renderValue={hasMultipleChoices ? renderValue : undefined}\n translate={translate}\n />\n {hasMultipleChoices && Array.isArray(value) && (\n <ChipsPositioningContainer odysseyDesignTokens={odysseyDesignTokens}>\n <Chips selection={value} isInteractive={true} />\n </ChipsPositioningContainer>\n )}\n </SelectContainer>\n ),\n [\n children,\n Chips,\n inputValues,\n hasMultipleChoices,\n nameOverride,\n odysseyDesignTokens,\n onBlur,\n onChange,\n onFocus,\n renderValue,\n testId,\n translate,\n value,\n ],\n );\n\n return (\n <Field\n ariaDescribedBy={ariaDescribedBy}\n errorMessage={errorMessage}\n errorMessageList={errorMessageList}\n fieldType=\"single\"\n hasVisibleLabel\n hint={hint}\n HintLinkComponent={HintLinkComponent}\n id={idOverride}\n isDisabled={isDisabled}\n isFullWidth={isFullWidth}\n isOptional={isOptional}\n label={label}\n renderFieldComponent={renderFieldComponent}\n />\n );\n};\n\nconst MemoizedSelect = memo(Select);\nMemoizedSelect.displayName = \"Select\";\n\nexport { MemoizedSelect as Select };\n"],"mappings":"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"}
|
package/dist/Tabs.js
CHANGED
|
@@ -48,6 +48,7 @@ const Tabs = ({
|
|
|
48
48
|
onChange: onChangeProp
|
|
49
49
|
}) => {
|
|
50
50
|
const [tabState, setTabState] = useState(initialValue ?? value ?? "0");
|
|
51
|
+
const [scrollButtons, setScrollButtons] = useState(false);
|
|
51
52
|
const onChange = useCallback((event, value) => {
|
|
52
53
|
setTabState(value);
|
|
53
54
|
onChangeProp?.(event, value);
|
|
@@ -57,6 +58,25 @@ const Tabs = ({
|
|
|
57
58
|
setTabState(value);
|
|
58
59
|
}
|
|
59
60
|
}, [value]);
|
|
61
|
+
useEffect(() => {
|
|
62
|
+
let animationFrame;
|
|
63
|
+
const cleanup = () => {
|
|
64
|
+
cancelAnimationFrame(animationFrame);
|
|
65
|
+
document.removeEventListener("visibilitychange", refreshScrollButtons);
|
|
66
|
+
};
|
|
67
|
+
function refreshScrollButtons() {
|
|
68
|
+
animationFrame = requestAnimationFrame(() => {
|
|
69
|
+
cleanup();
|
|
70
|
+
setScrollButtons("auto");
|
|
71
|
+
});
|
|
72
|
+
}
|
|
73
|
+
if (scrollButtons !== "auto") {
|
|
74
|
+
document.addEventListener("visibilitychange", refreshScrollButtons);
|
|
75
|
+
}
|
|
76
|
+
return () => {
|
|
77
|
+
cleanup();
|
|
78
|
+
};
|
|
79
|
+
}, [scrollButtons]);
|
|
60
80
|
const renderTab = useCallback((tab, index) => {
|
|
61
81
|
const {
|
|
62
82
|
testId,
|
|
@@ -88,6 +108,7 @@ const Tabs = ({
|
|
|
88
108
|
onChange: onChange,
|
|
89
109
|
"aria-label": ariaLabel,
|
|
90
110
|
variant: "scrollable",
|
|
111
|
+
scrollButtons: scrollButtons,
|
|
91
112
|
children: tabs.map((tab, index) => renderTab(tab, index))
|
|
92
113
|
}), tabs.map((tab, index) => _jsx(MuiTabPanel, {
|
|
93
114
|
value: tab.value ? tab.value : index.toString(),
|