dinocollab-core 2.2.5 → 2.2.7
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/dist/lab/data-surface/index.js +1 -1
- package/dist/src/components/rich-tooltip.js +1 -1
- package/dist/src/components/rich-tooltip.js.map +1 -1
- package/dist/src/filter-bar/components/filter-input.js +1 -1
- package/dist/src/filter-bar/components/filter-input.js.map +1 -1
- package/dist/src/filter-bar/components/filter-input.mobile.js +2 -0
- package/dist/src/filter-bar/components/filter-input.mobile.js.map +1 -0
- package/dist/src/filter-bar/components/filter-summary.js +1 -1
- package/dist/src/filter-bar/components/filter-summary.js.map +1 -1
- package/dist/src/lab/data-surface/button-switch.js +1 -1
- package/dist/src/lab/data-surface/button-switch.js.map +1 -1
- package/dist/src/lab/data-surface/index.create.js +1 -1
- package/dist/src/lab/data-surface/index.create.js.map +1 -1
- package/dist/src/lab/data-surface/index.dino.js +1 -1
- package/dist/src/lab/data-surface/index.dino.js.map +1 -1
- package/dist/src/lab/data-surface/types.js.map +1 -1
- package/dist/src/lab/data-surface/ui.units.js +1 -1
- package/dist/src/lab/data-surface/ui.units.js.map +1 -1
- package/dist/src/lab/data-surface/view-grid.js.map +1 -1
- package/dist/src/lab/data-surface/view-list.js +1 -1
- package/dist/src/lab/data-surface/view-list.js.map +1 -1
- package/dist/src/lab/data-surface/view-list.types.js.map +1 -1
- package/dist/types/components/rich-tooltip.d.ts +3 -7
- package/dist/types/filter-bar/components/filter-input.d.ts +0 -3
- package/dist/types/filter-bar/components/filter-input.mobile.d.ts +7 -0
- package/dist/types/lab/data-surface/button-switch.d.ts +3 -3
- package/dist/types/lab/data-surface/index.create.d.ts +4 -4
- package/dist/types/lab/data-surface/index.d.ts +1 -0
- package/dist/types/lab/data-surface/index.dino.d.ts +2 -16
- package/dist/types/lab/data-surface/types.d.ts +2 -0
- package/dist/types/lab/data-surface/ui.units.d.ts +4 -3
- package/dist/types/lab/data-surface/view-grid.d.ts +1 -1
- package/dist/types/lab/data-surface/view-list.types.d.ts +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.create.js","sources":["../../../../src/lab/data-surface/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, styled } from '@mui/material'\r\nimport { useCallback, useMemo, useRef, useState } from 'react'\r\nimport { DataSurfaceViewMode, LoadingModeRule } from './types'\r\nimport { createViewGrid, createViewGridLoading } from './view-grid'\r\nimport { createViewList, createViewListLoading, viewListClasses } from './view-list'\r\nimport { createViewSwitchTransition } from './view-switch-transition'\r\nimport { PanelInfiniteScrollFooter, PanelLoadMore, PanelLoading, PanelNoData, PanelPaginationFooter } from './ui.units'\r\n// types\r\nimport type { BoxProps } from '@mui/material'\r\nimport type { ComponentType, FC, ReactNode } from 'react'\r\nimport type { TPagination, TDataSurfaceState } from './types'\r\nimport type { IViewGridConfig, IViewGridLoadingProps, IViewGridProps } from './view-grid'\r\nimport type { IViewListConfig, IViewListLoadingProps, IViewListProps } from './view-list'\r\n\r\nexport interface IDataSurfaceSlots {\r\n footer?: {\r\n status?: string | ((currentStatus: string) => ReactNode)\r\n range?: string | ((currentRange: string) => ReactNode)\r\n }\r\n}\r\n\r\nexport interface IDataSurfaceProps<T> {\r\n value?: T[]\r\n /**\r\n * @deprecated No longer used. Use `viewMode` and `loadMode` props directly instead.\r\n * Controlled state. When provided, DataSurface becomes fully controlled.\r\n */\r\n state?: TDataSurfaceState\r\n /**\r\n * @deprecated No longer used. Component now uses uncontrolled mode with props.\r\n * Called on any state change (viewMode, loadMode, page, pageSize).\r\n */\r\n onStateChange?: (state: TDataSurfaceState) => void\r\n viewMode?: DataSurfaceViewMode\r\n /** Pagination metadata shared by both modes. */\r\n pagination?: TPagination\r\n /** True while a page fetch is in flight (shows loading indicator). */\r\n loading?: boolean\r\n /**\r\n * Called when the component needs a new page of data.\r\n * - pagination mode: triggered by user clicking page control\r\n * - infiniteScroll mode: triggered automatically when scrolling near the bottom\r\n * Supports async operations - return a Promise to indicate loading state.\r\n */\r\n onPageChange?: (page: number, pageSize: number) => void | Promise<void>\r\n /** Load orchestration mode. @default 'pagination' */\r\n loadMode?: LoadingModeRule\r\n sx?: BoxProps['sx']\r\n slots?: IDataSurfaceSlots\r\n /** Enable row selection with checkboxes (List view only). */\r\n selectable?: boolean\r\n /** Array of selected row IDs (controlled). */\r\n selectedIds?: (string | number)[]\r\n /** Callback when selection changes. */\r\n onSelectionChange?: (selectedIds: (string | number)[]) => void\r\n}\r\n\r\nexport interface IDataSurfaceConfig<T> {\r\n defaultViewMode?: DataSurfaceViewMode\r\n /** Default load mode when not provided via props. @default 'pagination' */\r\n defaultLoadMode?: LoadingModeRule\r\n /** Default page size. @default 20 */\r\n defaultPageSize?: number\r\n enableSingleViewTransition?: boolean\r\n listConfig?: IViewListConfig<T>\r\n ListComponent?: ComponentType<IViewListProps<T>>\r\n gridConfig?: IViewGridConfig<T>\r\n GridComponent?: ComponentType<IViewGridProps<T>>\r\n}\r\n\r\nexport function createDataSurface<T>(config: IDataSurfaceConfig<T>) {\r\n if (!config.GridComponent) {\r\n const configInput: IViewGridConfig<T> = config.gridConfig || { getterId: (item: T, index: number) => index }\r\n config.gridConfig = configInput\r\n config.GridComponent = createViewGrid<T>(configInput)\r\n }\r\n\r\n if (!config.ListComponent) {\r\n const configInput: IViewListConfig<T> = config.listConfig || { getterId: (item: T, index: number) => index }\r\n config.listConfig = configInput\r\n config.ListComponent = createViewList<T>(configInput)\r\n }\r\n\r\n const { defaultViewMode = 'grid', defaultLoadMode = 'pagination', defaultPageSize = 20 } = config\r\n const ViewSwitchTranstionInstance = createViewSwitchTransition<DataSurfaceViewMode>({})\r\n const GridLoadingComponent = createViewGridLoading<T>(config.GridComponent as ComponentType<IViewGridProps<T>>)\r\n const ListLoadingComponent = createViewListLoading<T>(config.ListComponent as ComponentType<IViewListProps<T>>)\r\n\r\n const DataSurface: FC<IDataSurfaceProps<T>> = (props) => {\r\n // separate pagination state\r\n const [internalPagination, setInternalPagination] = useState<TPagination>({\r\n page: 0,\r\n pageSize: defaultPageSize\r\n })\r\n\r\n // resolved pagination: external takes priority over internal\r\n const paginationState = useMemo<TPagination>(() => {\r\n const p = props.pagination ?? internalPagination\r\n return {\r\n page: p.page ?? 0,\r\n pageSize: p.pageSize ?? defaultPageSize,\r\n hasNext: p.hasNext ?? false,\r\n hasPrev: p.hasPrev ?? false,\r\n total: p.total\r\n }\r\n }, [props.pagination, internalPagination])\r\n\r\n const viewMode = props.viewMode ?? defaultViewMode\r\n const loadMode = props.loadMode ?? defaultLoadMode\r\n\r\n // Determine renderStrategy based on current viewMode\r\n const renderStrategy = useMemo(() => {\r\n if (viewMode === 'grid') {\r\n return config.gridConfig?.renderStrategy ?? 'normal'\r\n }\r\n return config.listConfig?.renderStrategy ?? 'normal'\r\n }, [viewMode])\r\n\r\n const handlePrevPage = useCallback(async () => {\r\n const currentPage = paginationState.page ?? 0\r\n if (currentPage <= 0) return\r\n const prevPage = currentPage - 1\r\n if (!props.pagination) {\r\n setInternalPagination((prev) => ({ ...prev, page: prevPage }))\r\n }\r\n await props.onPageChange?.(prevPage, paginationState.pageSize ?? defaultPageSize)\r\n }, [paginationState.page, paginationState.pageSize, props.pagination, props.onPageChange])\r\n\r\n const handleNextPage = useCallback(async () => {\r\n if (!paginationState.hasNext) return\r\n const currentPage = paginationState.page ?? 0\r\n const nextPage = currentPage + 1\r\n if (!props.pagination) {\r\n setInternalPagination((prev) => ({ ...prev, page: nextPage }))\r\n }\r\n await props.onPageChange?.(nextPage, paginationState.pageSize ?? defaultPageSize)\r\n }, [paginationState.hasNext, paginationState.page, paginationState.pageSize, props.pagination, props.onPageChange])\r\n\r\n const handlePageJump = useCallback(\r\n async (targetPage: number) => {\r\n if (targetPage < 0) return\r\n if (!props.pagination) {\r\n setInternalPagination((prev) => ({ ...prev, page: targetPage }))\r\n }\r\n await props.onPageChange?.(targetPage, paginationState.pageSize ?? defaultPageSize)\r\n },\r\n [paginationState.pageSize, props.pagination, props.onPageChange]\r\n )\r\n\r\n const finalValue = props.value || []\r\n const isEmptyData = finalValue.length === 0\r\n const isInitialLoading = Boolean(props.loading && isEmptyData)\r\n const isNoData = !props.loading && isEmptyData\r\n const showLoadingOverlay = Boolean(props.loading) && !isEmptyData\r\n\r\n const handleGridPageChange = useCallback(\r\n async (page: number, pageSize: number) => {\r\n if (!props.pagination) {\r\n setInternalPagination({ page, pageSize })\r\n }\r\n await props.onPageChange?.(page, pageSize)\r\n },\r\n [props.pagination, props.onPageChange]\r\n )\r\n\r\n const gridPayload = useMemo<IViewGridLoadingProps<T>>(\r\n () => ({\r\n value: finalValue,\r\n loadMode,\r\n loading: props.loading,\r\n pagination: paginationState,\r\n onPageChange: handleGridPageChange\r\n }),\r\n [finalValue, loadMode, props.loading, paginationState, handleGridPageChange]\r\n )\r\n\r\n const gridPayloadRef = useRef<IViewGridLoadingProps<T>>(gridPayload)\r\n gridPayloadRef.current = gridPayload\r\n\r\n const listPayload = useMemo<IViewListLoadingProps<T>>(\r\n () => ({\r\n value: finalValue,\r\n loadMode,\r\n loading: props.loading,\r\n pagination: paginationState,\r\n onPageChange: handleGridPageChange,\r\n columns: config.listConfig?.columns,\r\n density: config.listConfig?.density,\r\n renderStrategy: renderStrategy,\r\n virtualizedConfig: config.listConfig?.virtualizedConfig,\r\n selectable: props.selectable ?? config.listConfig?.selectable,\r\n selectedIds: props.selectedIds,\r\n onSelectionChange: props.onSelectionChange\r\n }),\r\n [\r\n finalValue,\r\n loadMode,\r\n props.loading,\r\n paginationState,\r\n renderStrategy,\r\n handleGridPageChange,\r\n props.selectable,\r\n props.selectedIds,\r\n props.onSelectionChange\r\n ]\r\n )\r\n\r\n const listPayloadRef = useRef<IViewListLoadingProps<T>>(listPayload)\r\n listPayloadRef.current = listPayload\r\n\r\n const ListViewContent = useMemo<ComponentType<{ value: DataSurfaceViewMode }>>(() => {\r\n const ViewListContent: FC<{ value: DataSurfaceViewMode }> = () => {\r\n return <ListLoadingComponent {...listPayloadRef.current} />\r\n }\r\n return ViewListContent\r\n }, [ListLoadingComponent])\r\n\r\n const GridViewContent = useMemo<ComponentType<{ value: DataSurfaceViewMode }>>(() => {\r\n const ViewGridContent: FC<{ value: DataSurfaceViewMode }> = () => {\r\n return <GridLoadingComponent {...gridPayloadRef.current} />\r\n }\r\n return ViewGridContent\r\n }, [GridLoadingComponent])\r\n\r\n const renderFooter = () => {\r\n if (loadMode === LoadingModeRule.infiniteScroll) {\r\n const footerSlots = props.slots?.footer\r\n return (\r\n <PanelInfiniteScrollFooter\r\n loading={props.loading}\r\n hasNext={props.pagination?.hasNext}\r\n currentCount={finalValue.length}\r\n total={props.pagination?.total}\r\n slots={{\r\n statusText: footerSlots?.status,\r\n rangeText: footerSlots?.range\r\n }}\r\n />\r\n )\r\n }\r\n\r\n // pagination mode\r\n return (\r\n <PanelPaginationFooter\r\n page={paginationState.page ?? 0}\r\n pageSize={paginationState.pageSize ?? defaultPageSize}\r\n total={paginationState.total}\r\n hasNext={paginationState.hasNext}\r\n hasPrev={(paginationState.page ?? 0) > 0}\r\n loading={props.loading}\r\n onPrevPage={handlePrevPage}\r\n onNextPage={handleNextPage}\r\n onPageJump={handlePageJump}\r\n />\r\n )\r\n }\r\n\r\n return (\r\n <DataSurfaceStyled sx={props.sx}>\r\n <Box sx={{ flex: 1, minHeight: 0, position: 'relative' }}>\r\n {isInitialLoading && <PanelLoading />}\r\n {isNoData && <PanelNoData />}\r\n {!isInitialLoading && !isNoData && (\r\n <ViewSwitchTranstionInstance\r\n value={viewMode}\r\n viewA={{ value: 'list', Content: ListViewContent }}\r\n viewB={{ value: 'grid', Content: GridViewContent }}\r\n />\r\n )}\r\n {showLoadingOverlay && <PanelLoadMore />}\r\n </Box>\r\n {renderFooter()}\r\n </DataSurfaceStyled>\r\n )\r\n }\r\n return DataSurface\r\n}\r\n\r\nexport default createDataSurface\r\n\r\nconst DataSurfaceStyled = styled(Box)(({ theme }) => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n width: '100%',\r\n height: '100%',\r\n position: 'relative',\r\n flex: 1,\r\n minHeight: 0,\r\n backgroundColor: theme.palette.background.default\r\n}))\r\n"],"names":["createDataSurface","config","GridComponent","configInput","gridConfig","getterId","item","index","createViewGrid","ListComponent","listConfig","createViewList","_config$defaultViewMo","defaultViewMode","_config$defaultLoadMo","defaultLoadMode","_config$defaultPageSi","defaultPageSize","ViewSwitchTranstionInstance","createViewSwitchTransition","GridLoadingComponent","createViewGridLoading","ListLoadingComponent","createViewListLoading","props","_props$viewMode","_props$loadMode","_useState","useState","page","pageSize","_useState2","_slicedToArray","internalPagination","setInternalPagination","paginationState","useMemo","_props$pagination","_p$page","_p$pageSize","_p$hasNext","_p$hasPrev","p","pagination","hasNext","hasPrev","total","viewMode","loadMode","renderStrategy","_config$listConfig$re","_config$listConfig","_config$gridConfig$re","_config$gridConfig","handlePrevPage","useCallback","_asyncToGenerator","_regenerator","m","_callee","_paginationState$page","_props$onPageChange","_paginationState$page2","currentPage","prevPage","w","_context","n","a","prev","_objectSpread","onPageChange","call","handleNextPage","_callee2","_paginationState$page3","_props$onPageChange2","_paginationState$page4","nextPage","_context2","handlePageJump","_ref3","_callee3","targetPage","_props$onPageChange3","_paginationState$page5","_context3","_x","apply","this","arguments","finalValue","value","isEmptyData","length","isInitialLoading","Boolean","loading","isNoData","showLoadingOverlay","handleGridPageChange","_ref4","_callee4","_props$onPageChange4","_context4","_x2","_x3","gridPayload","gridPayloadRef","useRef","current","listPayload","_config$listConfig2","_config$listConfig3","_config$listConfig4","_props$selectable","_config$listConfig5","columns","density","virtualizedConfig","selectable","selectedIds","onSelectionChange","listPayloadRef","ListViewContent","_jsx","GridViewContent","_jsxs","DataSurfaceStyled","sx","children","Box","flex","minHeight","position","PanelLoading","PanelNoData","viewA","Content","viewB","PanelLoadMore","_paginationState$page6","_paginationState$page7","_paginationState$page8","LoadingModeRule","infiniteScroll","_props$slots","_props$pagination2","_props$pagination3","footerSlots","slots","footer","PanelInfiniteScrollFooter","currentCount","statusText","status","rangeText","range","PanelPaginationFooter","onPrevPage","onNextPage","onPageJump","renderFooter","styled","_ref5","display","flexDirection","width","height","backgroundColor","theme","palette","background"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.create.js","sources":["../../../../src/lab/data-surface/index.create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, styled } from '@mui/material'\r\nimport { useCallback, useMemo, useRef, useState } from 'react'\r\nimport { DataSurfaceViewMode, LoadingModeRule } from './types'\r\nimport { createViewList, createViewListLoading } from './view-list'\r\nimport { createViewGrid, createViewGridLoading } from './view-grid'\r\nimport { createViewSwitchTransition } from './view-switch-transition'\r\nimport { PanelInfiniteScrollFooter, PanelLoadMore, PanelLoading, PanelNoData, PanelPaginationFooter } from './ui.units'\r\n// types\r\nimport type { BoxProps } from '@mui/material'\r\nimport type { ComponentType, FC } from 'react'\r\nimport type { TPagination, TDataSurfaceState, TRenderableNode } from './types'\r\nimport type { IViewGridConfig, IViewGridLoadingProps, IViewGridProps } from './view-grid'\r\nimport type { IViewListConfig, IViewListLoadingProps, IViewListProps } from './view-list'\r\n\r\nexport interface IDataSurfaceSlots {\r\n footer?: {\r\n status?: TRenderableNode\r\n range?: TRenderableNode\r\n }\r\n}\r\n\r\nexport interface IDataSurfaceProps<T> {\r\n value?: T[]\r\n /**\r\n * @deprecated No longer used. Use `viewMode` and `loadMode` props directly instead.\r\n * Controlled state. When provided, DataSurface becomes fully controlled.\r\n */\r\n state?: TDataSurfaceState\r\n /**\r\n * @deprecated No longer used. Component now uses uncontrolled mode with props.\r\n * Called on any state change (viewMode, loadMode, page, pageSize).\r\n */\r\n onStateChange?: (state: TDataSurfaceState) => void\r\n viewMode?: DataSurfaceViewMode\r\n /** Pagination metadata shared by both modes. */\r\n pagination?: TPagination\r\n /** True while a page fetch is in flight (shows loading indicator). */\r\n loading?: boolean\r\n /**\r\n * Called when the component needs a new page of data.\r\n * - pagination mode: triggered by user clicking page control\r\n * - infiniteScroll mode: triggered automatically when scrolling near the bottom\r\n * Supports async operations - return a Promise to indicate loading state.\r\n */\r\n onPageChange?: (page: number, pageSize: number) => void | Promise<void>\r\n /** Load orchestration mode. @default 'pagination' */\r\n loadMode?: LoadingModeRule\r\n sx?: BoxProps['sx']\r\n slots?: IDataSurfaceSlots\r\n /** Enable row selection with checkboxes (List view only). */\r\n selectable?: boolean\r\n /** Array of selected row IDs (controlled). */\r\n selectedIds?: (string | number)[]\r\n /** Callback when selection changes. */\r\n onSelectionChange?: (selectedIds: (string | number)[]) => void\r\n}\r\n\r\nexport interface IDataSurfaceConfig<T> {\r\n defaultViewMode?: DataSurfaceViewMode\r\n /** Default load mode when not provided via props. @default 'pagination' */\r\n defaultLoadMode?: LoadingModeRule\r\n /** Default page size. @default 20 */\r\n defaultPageSize?: number\r\n enableSingleViewTransition?: boolean\r\n listConfig?: IViewListConfig<T>\r\n ListComponent?: ComponentType<IViewListProps<T>>\r\n gridConfig?: IViewGridConfig<T>\r\n GridComponent?: ComponentType<IViewGridProps<T>>\r\n}\r\n\r\nexport function createDataSurface<T>(config: IDataSurfaceConfig<T>) {\r\n if (!config.GridComponent) {\r\n const configInput: IViewGridConfig<T> = config.gridConfig || { getterId: (item: T, index: number) => index }\r\n config.gridConfig = configInput\r\n config.GridComponent = createViewGrid<T>(configInput)\r\n }\r\n\r\n if (!config.ListComponent) {\r\n const configInput: IViewListConfig<T> = config.listConfig || { getterId: (item: T, index: number) => index }\r\n config.listConfig = configInput\r\n config.ListComponent = createViewList<T>(configInput)\r\n }\r\n\r\n const { defaultViewMode = 'grid', defaultLoadMode = 'pagination', defaultPageSize = 20 } = config\r\n const ViewSwitchTranstionInstance = createViewSwitchTransition<DataSurfaceViewMode>({})\r\n const GridLoadingComponent = createViewGridLoading<T>(config.GridComponent as ComponentType<IViewGridProps<T>>)\r\n const ListLoadingComponent = createViewListLoading<T>(config.ListComponent as ComponentType<IViewListProps<T>>)\r\n\r\n const DataSurface: FC<IDataSurfaceProps<T>> = (props) => {\r\n // separate pagination state\r\n const [internalPagination, setInternalPagination] = useState<TPagination>({\r\n page: 0,\r\n pageSize: defaultPageSize\r\n })\r\n\r\n // resolved pagination: external takes priority over internal\r\n const paginationState = useMemo<TPagination>(() => {\r\n const p = props.pagination ?? internalPagination\r\n return {\r\n page: p.page ?? 0,\r\n pageSize: p.pageSize ?? defaultPageSize,\r\n hasNext: p.hasNext ?? false,\r\n hasPrev: p.hasPrev ?? false,\r\n total: p.total\r\n }\r\n }, [props.pagination, internalPagination])\r\n\r\n const viewMode = props.viewMode ?? defaultViewMode\r\n const loadMode = props.loadMode ?? defaultLoadMode\r\n\r\n // Determine renderStrategy based on current viewMode\r\n const renderStrategy = useMemo(() => {\r\n if (viewMode === 'grid') {\r\n return config.gridConfig?.renderStrategy ?? 'normal'\r\n }\r\n return config.listConfig?.renderStrategy ?? 'normal'\r\n }, [viewMode])\r\n\r\n const handlePrevPage = useCallback(async () => {\r\n const currentPage = paginationState.page ?? 0\r\n if (currentPage <= 0) return\r\n const prevPage = currentPage - 1\r\n if (!props.pagination) {\r\n setInternalPagination((prev) => ({ ...prev, page: prevPage }))\r\n }\r\n await props.onPageChange?.(prevPage, paginationState.pageSize ?? defaultPageSize)\r\n }, [paginationState.page, paginationState.pageSize, props.pagination, props.onPageChange])\r\n\r\n const handleNextPage = useCallback(async () => {\r\n if (!paginationState.hasNext) return\r\n const currentPage = paginationState.page ?? 0\r\n const nextPage = currentPage + 1\r\n if (!props.pagination) {\r\n setInternalPagination((prev) => ({ ...prev, page: nextPage }))\r\n }\r\n await props.onPageChange?.(nextPage, paginationState.pageSize ?? defaultPageSize)\r\n }, [paginationState.hasNext, paginationState.page, paginationState.pageSize, props.pagination, props.onPageChange])\r\n\r\n const handlePageJump = useCallback(\r\n async (targetPage: number) => {\r\n if (targetPage < 0) return\r\n if (!props.pagination) {\r\n setInternalPagination((prev) => ({ ...prev, page: targetPage }))\r\n }\r\n await props.onPageChange?.(targetPage, paginationState.pageSize ?? defaultPageSize)\r\n },\r\n [paginationState.pageSize, props.pagination, props.onPageChange]\r\n )\r\n\r\n const finalValue = props.value || []\r\n const isEmptyData = finalValue.length === 0\r\n const isInitialLoading = Boolean(props.loading && isEmptyData)\r\n const isNoData = !props.loading && isEmptyData\r\n const showLoadingOverlay = Boolean(props.loading) && !isEmptyData\r\n\r\n const handleGridPageChange = useCallback(\r\n async (page: number, pageSize: number) => {\r\n if (!props.pagination) {\r\n setInternalPagination({ page, pageSize })\r\n }\r\n await props.onPageChange?.(page, pageSize)\r\n },\r\n [props.pagination, props.onPageChange]\r\n )\r\n\r\n const gridPayload = useMemo<IViewGridLoadingProps<T>>(\r\n () => ({\r\n value: finalValue,\r\n loadMode,\r\n loading: props.loading,\r\n pagination: paginationState,\r\n onPageChange: handleGridPageChange\r\n }),\r\n [finalValue, loadMode, props.loading, paginationState, handleGridPageChange]\r\n )\r\n\r\n const gridPayloadRef = useRef<IViewGridLoadingProps<T>>(gridPayload)\r\n gridPayloadRef.current = gridPayload\r\n\r\n const listPayload = useMemo<IViewListLoadingProps<T>>(\r\n () => ({\r\n value: finalValue,\r\n loadMode,\r\n loading: props.loading,\r\n pagination: paginationState,\r\n onPageChange: handleGridPageChange,\r\n columns: config.listConfig?.columns,\r\n density: config.listConfig?.density,\r\n renderStrategy: renderStrategy,\r\n virtualizedConfig: config.listConfig?.virtualizedConfig,\r\n selectable: props.selectable ?? config.listConfig?.selectable,\r\n selectedIds: props.selectedIds,\r\n onSelectionChange: props.onSelectionChange\r\n }),\r\n [\r\n finalValue,\r\n loadMode,\r\n props.loading,\r\n paginationState,\r\n renderStrategy,\r\n handleGridPageChange,\r\n props.selectable,\r\n props.selectedIds,\r\n props.onSelectionChange\r\n ]\r\n )\r\n\r\n const listPayloadRef = useRef<IViewListLoadingProps<T>>(listPayload)\r\n listPayloadRef.current = listPayload\r\n\r\n const ListViewContent = useMemo<ComponentType<{ value: DataSurfaceViewMode }>>(() => {\r\n const ViewListContent: FC<{ value: DataSurfaceViewMode }> = () => {\r\n return <ListLoadingComponent {...listPayloadRef.current} />\r\n }\r\n return ViewListContent\r\n }, [ListLoadingComponent])\r\n\r\n const GridViewContent = useMemo<ComponentType<{ value: DataSurfaceViewMode }>>(() => {\r\n const ViewGridContent: FC<{ value: DataSurfaceViewMode }> = () => {\r\n return <GridLoadingComponent {...gridPayloadRef.current} />\r\n }\r\n return ViewGridContent\r\n }, [GridLoadingComponent])\r\n\r\n const renderFooter = () => {\r\n if (loadMode === LoadingModeRule.infiniteScroll) {\r\n const footerSlots = props.slots?.footer\r\n return (\r\n <PanelInfiniteScrollFooter\r\n loading={props.loading}\r\n hasNext={props.pagination?.hasNext}\r\n currentCount={finalValue.length}\r\n total={props.pagination?.total}\r\n slots={{\r\n statusText: footerSlots?.status,\r\n rangeText: footerSlots?.range\r\n }}\r\n />\r\n )\r\n }\r\n\r\n // pagination mode\r\n return (\r\n <PanelPaginationFooter\r\n page={paginationState.page ?? 0}\r\n pageSize={paginationState.pageSize ?? defaultPageSize}\r\n total={paginationState.total}\r\n hasNext={paginationState.hasNext}\r\n hasPrev={(paginationState.page ?? 0) > 0}\r\n loading={props.loading}\r\n onPrevPage={handlePrevPage}\r\n onNextPage={handleNextPage}\r\n onPageJump={handlePageJump}\r\n />\r\n )\r\n }\r\n\r\n return (\r\n <DataSurfaceStyled sx={props.sx}>\r\n <Box sx={{ flex: 1, minHeight: 0, position: 'relative' }}>\r\n {isInitialLoading && <PanelLoading />}\r\n {isNoData && <PanelNoData />}\r\n {!isInitialLoading && !isNoData && (\r\n <ViewSwitchTranstionInstance\r\n value={viewMode}\r\n viewA={{ value: 'list', Content: ListViewContent }}\r\n viewB={{ value: 'grid', Content: GridViewContent }}\r\n />\r\n )}\r\n {showLoadingOverlay && <PanelLoadMore />}\r\n </Box>\r\n {renderFooter()}\r\n </DataSurfaceStyled>\r\n )\r\n }\r\n return DataSurface\r\n}\r\n\r\nexport default createDataSurface\r\n\r\nconst DataSurfaceStyled = styled(Box)(({ theme }) => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n width: '100%',\r\n height: '100%',\r\n position: 'relative',\r\n flex: 1,\r\n minHeight: 0,\r\n backgroundColor: theme.palette.background.default\r\n}))\r\n"],"names":["createDataSurface","config","GridComponent","configInput","gridConfig","getterId","item","index","createViewGrid","ListComponent","listConfig","createViewList","_config$defaultViewMo","defaultViewMode","_config$defaultLoadMo","defaultLoadMode","_config$defaultPageSi","defaultPageSize","ViewSwitchTranstionInstance","createViewSwitchTransition","GridLoadingComponent","createViewGridLoading","ListLoadingComponent","createViewListLoading","props","_props$viewMode","_props$loadMode","_useState","useState","page","pageSize","_useState2","_slicedToArray","internalPagination","setInternalPagination","paginationState","useMemo","_props$pagination","_p$page","_p$pageSize","_p$hasNext","_p$hasPrev","p","pagination","hasNext","hasPrev","total","viewMode","loadMode","renderStrategy","_config$listConfig$re","_config$listConfig","_config$gridConfig$re","_config$gridConfig","handlePrevPage","useCallback","_asyncToGenerator","_regenerator","m","_callee","_paginationState$page","_props$onPageChange","_paginationState$page2","currentPage","prevPage","w","_context","n","a","prev","_objectSpread","onPageChange","call","handleNextPage","_callee2","_paginationState$page3","_props$onPageChange2","_paginationState$page4","nextPage","_context2","handlePageJump","_ref3","_callee3","targetPage","_props$onPageChange3","_paginationState$page5","_context3","_x","apply","this","arguments","finalValue","value","isEmptyData","length","isInitialLoading","Boolean","loading","isNoData","showLoadingOverlay","handleGridPageChange","_ref4","_callee4","_props$onPageChange4","_context4","_x2","_x3","gridPayload","gridPayloadRef","useRef","current","listPayload","_config$listConfig2","_config$listConfig3","_config$listConfig4","_props$selectable","_config$listConfig5","columns","density","virtualizedConfig","selectable","selectedIds","onSelectionChange","listPayloadRef","ListViewContent","_jsx","GridViewContent","_jsxs","DataSurfaceStyled","sx","children","Box","flex","minHeight","position","PanelLoading","PanelNoData","viewA","Content","viewB","PanelLoadMore","_paginationState$page6","_paginationState$page7","_paginationState$page8","LoadingModeRule","infiniteScroll","_props$slots","_props$pagination2","_props$pagination3","footerSlots","slots","footer","PanelInfiniteScrollFooter","currentCount","statusText","status","rangeText","range","PanelPaginationFooter","onPrevPage","onNextPage","onPageJump","renderFooter","styled","_ref5","display","flexDirection","width","height","backgroundColor","theme","palette","background"],"mappings":"6sBAyEM,SAAUA,EAAqBC,GACnC,IAAKA,EAAOC,cAAe,CACzB,IAAMC,EAAkCF,EAAOG,YAAc,CAAEC,SAAU,SAACC,EAASC,GAAa,OAAKA,CAAK,GAC1GN,EAAOG,WAAaD,EACpBF,EAAOC,cAAgBM,EAAkBL,EAC1C,CAED,IAAKF,EAAOQ,cAAe,CACzB,IAAMN,EAAkCF,EAAOS,YAAc,CAAEL,SAAU,SAACC,EAASC,GAAa,OAAKA,CAAK,GAC1GN,EAAOS,WAAaP,EACpBF,EAAOQ,cAAgBE,EAAkBR,EAC1C,CAED,IAAAS,EAA2FX,EAAnFY,gBAAAA,OAAkB,IAAHD,EAAG,OAAMA,EAAAE,EAA2Db,EAAzDc,gBAAAA,OAAkB,IAAHD,EAAG,aAAYA,EAAAE,EAA2Bf,EAAzBgB,gBAAAA,OAAkB,IAAHD,EAAG,GAAEA,EAChFE,EAA8BC,EAAgD,IAC9EC,EAAuBC,EAAyBpB,EAAOC,eACvDoB,EAAuBC,EAAyBtB,EAAOQ,eA6L7D,OA3L8C,SAACe,GAAS,IAAAC,EAAAC,EAEtDC,EAAoDC,EAAsB,CACxEC,KAAM,EACNC,SAAUb,IACVc,EAAAC,EAAAL,EAAA,GAHKM,EAAkBF,EAAA,GAAEG,EAAqBH,EAAA,GAM1CI,EAAkBC,EAAqB,WAAK,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAC1CC,EAAoB,QAAnBL,EAAGb,EAAMmB,kBAAU,IAAAN,EAAAA,EAAIJ,EAC9B,MAAO,CACLJ,KAAY,QAARS,EAAEI,EAAEb,YAAI,IAAAS,EAAAA,EAAI,EAChBR,SAAoB,QAAZS,EAAEG,EAAEZ,gBAAQ,IAAAS,EAAAA,EAAItB,EACxB2B,QAAkB,QAAXJ,EAAEE,EAAEE,eAAO,IAAAJ,GAAAA,EAClBK,QAAkB,QAAXJ,EAAEC,EAAEG,eAAO,IAAAJ,GAAAA,EAClBK,MAAOJ,EAAEI,MAEZ,EAAE,CAACtB,EAAMmB,WAAYV,IAEhBc,EAAyB,QAAjBtB,EAAGD,EAAMuB,gBAAQ,IAAAtB,EAAAA,EAAIZ,EAC7BmC,EAAyB,QAAjBtB,EAAGF,EAAMwB,gBAAQ,IAAAtB,EAAAA,EAAIX,EAG7BkC,EAAiBb,EAAQ,WAAK,IAAAc,EAAAC,EACTC,EAAAC,EAAzB,MAAiB,SAAbN,EACsC,QAAxCK,EAAwBC,QAAxBA,EAAOpD,EAAOG,kBAAPiD,IAAiBA,OAAjBA,EAAAA,EAAmBJ,sBAAcG,IAAAA,EAAAA,EAAI,SAEN,QAAxCF,EAAwBC,QAAxBA,EAAOlD,EAAOS,kBAAPyC,IAAiBA,OAAjBA,EAAAA,EAAmBF,sBAAcC,IAAAA,EAAAA,EAAI,QAC9C,EAAG,CAACH,IAEEO,EAAiBC,EAAWC,EAAAC,IAAAC,EAAC,SAAAC,IAAA,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAA,OAAAP,IAAAQ,EAAA,SAAAC,GAAA,cAAAA,EAAAC,GAAA,KAAA,EACY,MAAvCJ,EAAkC,QAAvBH,EAAGzB,EAAgBN,YAAI,IAAA+B,EAAAA,EAAI,IACzB,GAAC,CAAAM,EAAAC,EAAA,EAAA,KAAA,CAAA,OAAAD,EAAAE,EAAA,GAAA,KAAA,EAInB,OAHKJ,EAAWD,EAAc,EAC1BvC,EAAMmB,YACTT,EAAsB,SAACmC,GAAI,OAAAC,EAAAA,EAAA,CAAA,EAAWD,GAAI,CAAA,EAAA,CAAExC,KAAMmC,GAAQ,GAC3DE,EAAAC,EAAA,EACuBN,QADvBA,EACKrC,EAAM+C,oBAANV,IAAkBA,OAAlBA,EAAAA,EAAAW,KAAAhD,EAAqBwC,EAAkCF,QAA1BA,EAAE3B,EAAgBL,gBAAQgC,IAAAA,EAAAA,EAAI7C,GAAgB,KAAA,EAAA,OAAAiD,EAAAE,EAAA,GAAA,EAAAT,EAClF,IAAE,CAACxB,EAAgBN,KAAMM,EAAgBL,SAAUN,EAAMmB,WAAYnB,EAAM+C,eAEtEE,EAAiBlB,EAAWC,EAAAC,IAAAC,EAAC,SAAAgB,IAAA,IAAAC,EAAAC,EAAAC,EAAAd,EAAAe,EAAA,OAAArB,IAAAQ,EAAA,SAAAc,GAAA,cAAAA,EAAAZ,GAAA,KAAA,EAAA,GAC5BhC,EAAgBS,QAAO,CAAAmC,EAAAZ,EAAA,EAAA,KAAA,CAAA,OAAAY,EAAAX,EAAA,GAAA,KAAA,EAK3B,OAJKL,EAAkC,QAAvBY,EAAGxC,EAAgBN,YAAI,IAAA8C,EAAAA,EAAI,EACtCG,EAAWf,EAAc,EAC1BvC,EAAMmB,YACTT,EAAsB,SAACmC,GAAI,OAAAC,EAAAA,EAAA,CAAA,EAAWD,GAAI,CAAA,EAAA,CAAExC,KAAMiD,GAAQ,GAC3DC,EAAAZ,EAAA,EACuBS,QADvBA,EACKpD,EAAM+C,oBAANK,IAAkBA,OAAlBA,EAAAA,EAAAJ,KAAAhD,EAAqBsD,EAAkCD,QAA1BA,EAAE1C,EAAgBL,gBAAQ+C,IAAAA,EAAAA,EAAI5D,GAAgB,KAAA,EAAA,OAAA8D,EAAAX,EAAA,GAAA,EAAAM,EAClF,IAAE,CAACvC,EAAgBS,QAAST,EAAgBN,KAAMM,EAAgBL,SAAUN,EAAMmB,WAAYnB,EAAM+C,eAE/FS,EAAiBzB,EAAW,WAAA,IAAA0B,EAAAzB,EAAAC,IAAAC,EAChC,SAAAwB,EAAOC,GAAkB,IAAAC,EAAAC,EAAA,OAAA5B,IAAAQ,EAAA,SAAAqB,GAAA,cAAAA,EAAAnB,GAAA,KAAA,EAAA,KACnBgB,EAAa,GAAC,CAAAG,EAAAnB,EAAA,EAAA,KAAA,CAAA,OAAAmB,EAAAlB,EAAA,GAAA,KAAA,EAGjB,OAFI5C,EAAMmB,YACTT,EAAsB,SAACmC,GAAI,OAAAC,EAAAA,EAAA,CAAA,EAAWD,GAAI,CAAA,EAAA,CAAExC,KAAMsD,GAAU,GAC7DG,EAAAnB,EAAA,EACuBiB,QADvBA,EACK5D,EAAM+C,oBAANa,IAAkBA,OAAlBA,EAAAA,EAAAZ,KAAAhD,EAAqB2D,EAAoCE,QAA1BA,EAAElD,EAAgBL,gBAAQuD,IAAAA,EAAAA,EAAIpE,GAAgB,KAAA,EAAA,OAAAqE,EAAAlB,EAAA,GAAA,EAAAc,MACpF,OAAA,SAAAK,GAAA,OAAAN,EAAAO,MAAAC,KAAAC,UAAA,CAAA,CAP+B,GAQhC,CAACvD,EAAgBL,SAAUN,EAAMmB,WAAYnB,EAAM+C,eAG/CoB,EAAanE,EAAMoE,OAAS,GAC5BC,EAAoC,IAAtBF,EAAWG,OACzBC,EAAmBC,QAAQxE,EAAMyE,SAAWJ,GAC5CK,GAAY1E,EAAMyE,SAAWJ,EAC7BM,EAAqBH,QAAQxE,EAAMyE,WAAaJ,EAEhDO,EAAuB7C,EAAW,WAAA,IAAA8C,EAAA7C,EAAAC,IAAAC,EACtC,SAAA4C,EAAOzE,EAAcC,GAAgB,IAAAyE,EAAA,OAAA9C,IAAAQ,EAAA,SAAAuC,GAAA,cAAAA,EAAArC,GAAA,KAAA,EAGlC,OAFI3C,EAAMmB,YACTT,EAAsB,CAAEL,KAAAA,EAAMC,SAAAA,IAC/B0E,EAAArC,EAAA,UAAAoC,EACK/E,EAAM+C,oBAAY,IAAAgC,OAAA,EAAlBA,EAAA/B,KAAAhD,EAAqBK,EAAMC,GAAS,KAAA,EAAA,OAAA0E,EAAApC,EAAA,GAAA,EAAAkC,MAC3C,OAAAG,SAAAA,EAAAC,GAAA,OAAAL,EAAAb,MAAAC,KAAAC,UAAA,CACD,CAPsC,GAOtC,CAAClE,EAAMmB,WAAYnB,EAAM+C,eAGrBoC,EAAcvE,EAClB,WAAA,MAAO,CACLwD,MAAOD,EACP3C,SAAAA,EACAiD,QAASzE,EAAMyE,QACftD,WAAYR,EACZoC,aAAc6B,EACf,EACD,CAACT,EAAY3C,EAAUxB,EAAMyE,QAAS9D,EAAiBiE,IAGnDQ,EAAiBC,EAAiCF,GACxDC,EAAeE,QAAUH,EAEzB,IAAMI,EAAc3E,EAClB,WAAA,IAAA4E,EAAAC,EAAAC,EAAAC,EAAAC,EAAA,MAAO,CACLxB,MAAOD,EACP3C,SAAAA,EACAiD,QAASzE,EAAMyE,QACftD,WAAYR,EACZoC,aAAc6B,EACdiB,QAA0B,QAAnBL,EAAE/G,EAAOS,kBAAU,IAAAsG,OAAA,EAAjBA,EAAmBK,QAC5BC,QAA0B,QAAnBL,EAAEhH,EAAOS,kBAAU,IAAAuG,OAAA,EAAjBA,EAAmBK,QAC5BrE,eAAgBA,EAChBsE,kBAAoC,QAAnBL,EAAEjH,EAAOS,kBAAU,IAAAwG,OAAA,EAAjBA,EAAmBK,kBACtCC,WAA4B,QAAlBL,EAAE3F,EAAMgG,kBAAUL,IAAAA,EAAAA,UAAAC,EAAInH,EAAOS,kBAAU,IAAA0G,OAAA,EAAjBA,EAAmBI,WACnDC,YAAajG,EAAMiG,YACnBC,kBAAmBlG,EAAMkG,kBAC1B,EACD,CACE/B,EACA3C,EACAxB,EAAMyE,QACN9D,EACAc,EACAmD,EACA5E,EAAMgG,WACNhG,EAAMiG,YACNjG,EAAMkG,oBAIJC,EAAiBd,EAAiCE,GACxDY,EAAeb,QAAUC,EAEzB,IAAMa,EAAkBxF,EAAuD,WAI7E,OAH4D,WAC1D,OAAOyF,EAACvG,EAAoBgD,KAAKqD,EAAeb,SACjD,CAEH,EAAG,CAACxF,IAEEwG,EAAkB1F,EAAuD,WAI7E,OAH4D,WAC1D,OAAOyF,EAACzG,EAAoBkD,KAAKsC,EAAeE,SACjD,CAEH,EAAG,CAAC1F,IAmCJ,OACE2G,EAACC,EAAiB,CAACC,GAAIzG,EAAMyG,GAAEC,SAAA,CAC7BH,EAACI,EAAG,CAACF,GAAI,CAAEG,KAAM,EAAGC,UAAW,EAAGC,SAAU,sBACzCvC,GAAoB8B,EAACU,EAAY,CAAA,GACjCrC,GAAY2B,EAACW,EAAW,CAAA,IACvBzC,IAAqBG,GACrB2B,EAAC3G,EACC,CAAA0E,MAAO7C,EACP0F,MAAO,CAAE7C,MAAO,OAAQ8C,QAASd,GACjCe,MAAO,CAAE/C,MAAO,OAAQ8C,QAASZ,KAGpC3B,GAAsB0B,EAACe,SA7CT,WAAK,IAAAC,EAAAC,EAAAC,EACxB,GAAI/F,IAAagG,EAAgBC,eAAgB,CAAA,IAAAC,EAAAC,EAAAC,EACzCC,EAAyB,QAAdH,EAAG1H,EAAM8H,aAAK,IAAAJ,OAAA,EAAXA,EAAaK,OACjC,OACE1B,EAAC2B,EAAyB,CACxBvD,QAASzE,EAAMyE,QACfrD,QAAyB,QAAlBuG,EAAE3H,EAAMmB,kBAAU,IAAAwG,OAAA,EAAhBA,EAAkBvG,QAC3B6G,aAAc9D,EAAWG,OACzBhD,MAAuB,QAAlBsG,EAAE5H,EAAMmB,kBAAU,IAAAyG,OAAA,EAAhBA,EAAkBtG,MACzBwG,MAAO,CACLI,WAAYL,aAAAA,EAAAA,EAAaM,OACzBC,UAAWP,aAAW,EAAXA,EAAaQ,QAI/B,CAGD,OACEhC,EAACiC,EAAqB,CACpBjI,KAA0B,QAAtBgH,EAAE1G,EAAgBN,YAAI,IAAAgH,EAAAA,EAAI,EAC9B/G,SAAkC,QAA1BgH,EAAE3G,EAAgBL,gBAAQ,IAAAgH,EAAAA,EAAI7H,EACtC6B,MAAOX,EAAgBW,MACvBF,QAAST,EAAgBS,QACzBC,SAA8BkG,QAArBA,EAAC5G,EAAgBN,YAAIkH,IAAAA,EAAAA,EAAI,GAAK,EACvC9C,QAASzE,EAAMyE,QACf8D,WAAYzG,EACZ0G,WAAYvF,EACZwF,WAAYjF,GAGjB,CAgBIkF,KAGN,CAEH,CAIA,IAAMlC,EAAoBmC,EAAOhC,EAAPgC,CAAY,SAAAC,GAAQ,MAAQ,CACpDC,QAAS,OACTC,cAAe,SACfC,MAAO,OACPC,OAAQ,OACRlC,SAAU,WACVF,KAAM,EACNC,UAAW,EACXoC,gBAR4CL,EAALM,MAQhBC,QAAQC,WAAU,QAC1C"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createClass as t,classCallCheck as e,defineProperty as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{setViewModeToURL as r,getViewModeFromURL as o,setPaginationToURL as s,getPaginationFromURL as a}from"./helpers.js";import{createViewGrid as n}from"./view-grid.js";import h
|
|
1
|
+
import{createClass as t,classCallCheck as e,defineProperty as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{setViewModeToURL as r,getViewModeFromURL as o,setPaginationToURL as s,getPaginationFromURL as a}from"./helpers.js";import{createViewGrid as n}from"./view-grid.js";import{ButtonSwitch as h}from"./button-switch.js";import{createDataSurface as c}from"./index.create.js";var m=t(function t(){e(this,t),i(this,"createDataSurface",c),i(this,"createViewGrid",n),i(this,"ButtonSwitch",h),i(this,"createButtonSwitch",function(){return h}),i(this,"setViewModeToURL",r),i(this,"getViewModeFromURL",o),i(this,"setPaginationToURL",s),i(this,"getPaginationFromURL",a)}),l=new m;export{m as DinoDataSurFace,l as dinoDataSurface};
|
|
2
2
|
//# sourceMappingURL=index.dino.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.dino.js","sources":["../../../../src/lab/data-surface/index.dino.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { setViewModeToURL, getViewModeFromURL, setPaginationToURL, getPaginationFromURL } from './helpers'\r\nimport createViewGrid from './view-grid'\r\nimport ButtonSwitch from './button-switch'\r\nimport createDataSurface from './index.create'\r\n\r\nexport class DinoDataSurFace {\r\n createDataSurface = createDataSurface\r\n createViewGrid = createViewGrid\r\n ButtonSwitch = ButtonSwitch\r\n createButtonSwitch = () => ButtonSwitch\r\n\r\n // helpers\r\n setViewModeToURL = setViewModeToURL\r\n getViewModeFromURL = getViewModeFromURL\r\n setPaginationToURL = setPaginationToURL\r\n getPaginationFromURL = getPaginationFromURL\r\n}\r\n\r\nexport const dinoDataSurface = new DinoDataSurFace()\r\n"],"names":["DinoDataSurFace","_createClass","_classCallCheck","_defineProperty","createDataSurface","createViewGrid","ButtonSwitch","this","setViewModeToURL","getViewModeFromURL","setPaginationToURL","getPaginationFromURL","dinoDataSurface"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.dino.js","sources":["../../../../src/lab/data-surface/index.dino.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { setViewModeToURL, getViewModeFromURL, setPaginationToURL, getPaginationFromURL } from './helpers'\r\nimport createViewGrid from './view-grid'\r\nimport ButtonSwitch from './button-switch'\r\nimport createDataSurface from './index.create'\r\n\r\nexport class DinoDataSurFace {\r\n createDataSurface = createDataSurface\r\n createViewGrid = createViewGrid\r\n ButtonSwitch = ButtonSwitch\r\n createButtonSwitch = () => ButtonSwitch\r\n\r\n // helpers\r\n setViewModeToURL = setViewModeToURL\r\n getViewModeFromURL = getViewModeFromURL\r\n setPaginationToURL = setPaginationToURL\r\n getPaginationFromURL = getPaginationFromURL\r\n}\r\n\r\nexport const dinoDataSurface = new DinoDataSurFace()\r\n"],"names":["DinoDataSurFace","_createClass","_classCallCheck","_defineProperty","createDataSurface","createViewGrid","ButtonSwitch","this","setViewModeToURL","getViewModeFromURL","setPaginationToURL","getPaginationFromURL","dinoDataSurface"],"mappings":"uYAOA,IAAaA,EAAeC,EAAA,SAAAD,IAAAE,OAAAF,GAAAG,2BACNC,GAAiBD,wBACpBE,GAAcF,sBAChBG,GAAYH,EACNI,KAAA,qBAAA,WAAA,OAAMD,CAAY,GAEvCH,0BACmBK,GAAgBL,4BACdM,GAAkBN,4BAClBO,GAAkBP,8BAChBQ,EAAoB,GAGhCC,EAAkB,IAAIZ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../../../../src/lab/data-surface/types.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nexport type TGetterId<T> = (item: T, index: number) => string | number\r\n\r\nexport type TPagination = {\r\n page?: number\r\n pageSize?: number\r\n hasNext?: boolean\r\n hasPrev?: boolean\r\n total?: number\r\n}\r\n\r\n/**\r\n * Virtualized rendering configuration.\r\n * Used by both grid and list views for windowing optimization.\r\n */\r\nexport type TVirtualizedConfig = {\r\n scrollTop: number\r\n viewportHeight: number\r\n /** Number of extra rows/columns rendered outside the viewport as a buffer. Defaults to `4` (grid) / `6` (table). */\r\n overscan?: number\r\n gap?: number\r\n}\r\n\r\n/**\r\n * Controls how the list is rendered into the DOM.\r\n * - `normal` — all rows are mounted (suitable for small datasets)\r\n * - `virtualized` — only visible rows are mounted (optimized for large datasets)\r\n */\r\nexport const RenderStrategyRule = {\r\n normal: 'normal',\r\n virtualized: 'virtualized'\r\n} as const\r\nexport type RenderStrategyRule = keyof typeof RenderStrategyRule\r\n\r\n/**\r\n * Controls how the list is displayed.\r\n * - `list` — items are displayed in a single column\r\n * - `grid` — items are displayed in multiple columns (number of columns is determined by the available width)\r\n */\r\nexport const DataSurfaceViewMode = {\r\n list: 'list',\r\n grid: 'grid'\r\n} as const\r\nexport type DataSurfaceViewMode = keyof typeof DataSurfaceViewMode\r\n/**\r\n * Controls how the data is loaded and when the loading indicator is shown.\r\n * - `pagination` — loading indicator is shown when the user clicks on the pagination controls\r\n * - `infiniteScroll` — loading indicator is shown when the user scrolls to the end of the list\r\n */\r\nexport const LoadingModeRule = {\r\n pagination: 'pagination',\r\n infiniteScroll: 'infiniteScroll'\r\n} as const\r\nexport type LoadingModeRule = keyof typeof LoadingModeRule\r\n\r\
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../src/lab/data-surface/types.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { ReactNode } from 'react'\r\n\r\nexport type TGetterId<T> = (item: T, index: number) => string | number\r\n\r\nexport type TRenderableNode = ReactNode | ((currentNode: ReactNode, rawText: string) => ReactNode)\r\n\r\nexport type TPagination = {\r\n page?: number\r\n pageSize?: number\r\n hasNext?: boolean\r\n hasPrev?: boolean\r\n total?: number\r\n}\r\n\r\n/**\r\n * Virtualized rendering configuration.\r\n * Used by both grid and list views for windowing optimization.\r\n */\r\nexport type TVirtualizedConfig = {\r\n scrollTop: number\r\n viewportHeight: number\r\n /** Number of extra rows/columns rendered outside the viewport as a buffer. Defaults to `4` (grid) / `6` (table). */\r\n overscan?: number\r\n gap?: number\r\n}\r\n\r\n/**\r\n * Controls how the list is rendered into the DOM.\r\n * - `normal` — all rows are mounted (suitable for small datasets)\r\n * - `virtualized` — only visible rows are mounted (optimized for large datasets)\r\n */\r\nexport const RenderStrategyRule = {\r\n normal: 'normal',\r\n virtualized: 'virtualized'\r\n} as const\r\nexport type RenderStrategyRule = keyof typeof RenderStrategyRule\r\n\r\n/**\r\n * Controls how the list is displayed.\r\n * - `list` — items are displayed in a single column\r\n * - `grid` — items are displayed in multiple columns (number of columns is determined by the available width)\r\n */\r\nexport const DataSurfaceViewMode = {\r\n list: 'list',\r\n grid: 'grid'\r\n} as const\r\nexport type DataSurfaceViewMode = keyof typeof DataSurfaceViewMode\r\n/**\r\n * Controls how the data is loaded and when the loading indicator is shown.\r\n * - `pagination` — loading indicator is shown when the user clicks on the pagination controls\r\n * - `infiniteScroll` — loading indicator is shown when the user scrolls to the end of the list\r\n */\r\nexport const LoadingModeRule = {\r\n pagination: 'pagination',\r\n infiniteScroll: 'infiniteScroll'\r\n} as const\r\nexport type LoadingModeRule = keyof typeof LoadingModeRule\r\n\r\nexport type TDataSurfaceState = {\r\n viewMode?: DataSurfaceViewMode\r\n loadMode?: LoadingModeRule\r\n renderStrategy?: RenderStrategyRule\r\n}\r\n"],"names":["RenderStrategyRule","normal","virtualized","DataSurfaceViewMode","list","grid","LoadingModeRule","pagination","infiniteScroll"],"mappings":"AAiCO,IAAMA,EAAqB,CAChCC,OAAQ,SACRC,YAAa,eASFC,EAAsB,CACjCC,KAAM,OACNC,KAAM,QAQKC,EAAkB,CAC7BC,WAAY,aACZC,eAAgB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectSpread2 as e
|
|
1
|
+
import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as n}from"react/jsx-runtime";import{colors as t,styled as o,Box as i,alpha as a,CircularProgress as l,Typography as c,Pagination as d,Stack as u}from"@mui/material";var s={padding:"8px",height:"100%",minHeight:180,width:"100%","& > .inner":{width:"100%",height:"100%",padding:"24px 16px",border:"1px dashed ".concat(t.grey[400]),borderRadius:6,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center"}},g=function(t){return r(p,e(e({},t),{},{children:n("div",{className:"inner",children:[r(l,{size:24}),r(c,{variant:"body2",color:"primary",children:"Loading..."})]})}))},p=o(i)(e(e({},s),{},{"& > div":{gap:8,borderColor:t.blue[400],backgroundColor:t.blue[50]}}));o(i)(e(e({},s),{},{"& > div":{borderColor:t.red[400],backgroundColor:t.red[50],color:t.red[900],flexDirection:"column"}}));var h=function(){return r(m,{children:n("div",{className:"inner",children:[r(c,{variant:"h6",gutterBottom:!0,children:"No data available"}),r(c,{variant:"body2",children:"Try changing the filter or search keyword"})]})})},m=o(i)(e(e({},s),{},{"& > div":{borderColor:t.grey[400],backgroundColor:t.grey[50],color:t.grey[700],flexDirection:"column"}}));o(i)(e(e({},s),{},{"& > div":{borderColor:t.blue[400],backgroundColor:t.blue[50],color:t.blue[900],flexDirection:"column"}})),o(i)(e(e({},s),{},{"& > div":{borderColor:t.red[700],backgroundColor:t.red[50],color:t.red[900],flexDirection:"column"}}));var b=function(){return r(x,{children:n("div",{children:[r(l,{size:24,thickness:4}),r(c,{variant:"body2",color:"text.primary",children:"Loading more..."})]})})},x=o(i)(function(e){return{position:"absolute",inset:0,bgcolor:"dark"===e.theme.palette.mode?"rgba(0,0,0,0.12)":"rgba(255,255,255,0.12)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:10,backdropFilter:"blur(1px)",transition:"opacity 0.2s","& > div":{display:"flex",alignItems:"center",gap:10}}}),v=function(e){var t,o=e.slots,i=e.loading,a=e.hasNext,d=e.currentCount,s=e.total,g=function(e){return"string"!=typeof e?e:r(c,{variant:"caption",color:"text.secondary",children:e})},p=function(e,t){var o="Loading more...",i="Scroll for more",a="No more items";return e?{currentNode:n(u,{flexDirection:"row",alignItems:"center",gap:1,children:[r(l,{color:"primary",size:12,thickness:3}),r(c,{variant:"caption",color:"primary.main",children:o})]}),rawText:o}:t?{currentNode:i,rawText:i}:{currentNode:a,rawText:a}}(i,a),h=p.currentNode;"function"==typeof(null==o?void 0:o.statusText)?h=o.statusText(g(p.currentNode),p.rawText):null!=o&&o.statusText&&(h=o.statusText);var m=d>0?null!=s?"1–".concat(d," of ").concat(s):"1–".concat(d):"—",b="function"==typeof(null==o?void 0:o.rangeText)?o.rangeText(m,m):null!==(t=null==o?void 0:o.rangeText)&&void 0!==t?t:m;return r(f,{children:n("div",{children:[g(h),g(b)]})})},f=o(i)(function(e){var r=e.theme;return{"& > div":{display:"flex",alignItems:"center",justifyContent:"space-between",padding:r.spacing(1,1.5),backgroundColor:a(r.palette.grey[500],.08),borderTop:"1px solid ".concat(a(r.palette.common.black,.08))},".MuiTypography-root":{lineHeight:1}}}),y=function(e){var t=e.page,o=e.pageSize,i=e.total,a=e.hasNext,l=e.loading,u=e.onPrevPage,s=e.onNextPage,g=e.onPageJump,p=t*o+1,h=null!=i?Math.min(p+o-1,i):p+o-1,m=null!=i?Math.ceil(i/o):void 0;return n(C,{children:[r(c,{variant:"caption",color:"text.secondary",children:null!=i?"".concat(p,"–").concat(h," / ").concat(i):"Page ".concat(t+1)}),r(d,{count:m,page:t+1,onChange:function(e,r){var n=r-1;g?g(n):n<t?null==u||u():n>t&&(null==s||s())},disabled:l,size:"small",showFirstButton:null!=m&&m>5,showLastButton:null!=m&&m>5,siblingCount:0,boundaryCount:1,hidePrevButton:null==m&&!a,hideNextButton:null==m&&!a})]})},C=o(i)(function(e){var r=e.theme;return{padding:"8px 16px",display:"flex",alignItems:"center",justifyContent:"space-between",backgroundColor:r.palette.background.paper,borderTop:"1px solid ".concat("dark"===r.palette.mode?"rgba(255, 255, 255, 0.12)":"rgba(0, 0, 0, 0.12)")}});export{v as PanelInfiniteScrollFooter,b as PanelLoadMore,g as PanelLoading,h as PanelNoData,y as PanelPaginationFooter};
|
|
2
2
|
//# sourceMappingURL=ui.units.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui.units.js","sources":["../../../../src/lab/data-surface/ui.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, CircularProgress, Pagination, Typography, colors, styled, alpha } from '@mui/material'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { BoxProps } from '@mui/material'\r\n\r\nconst stateWrapBase = {\r\n padding: '8px',\r\n height: '100%',\r\n minHeight: 180,\r\n width: '100%',\r\n '& > .inner': {\r\n width: '100%',\r\n height: '100%',\r\n padding: '24px 16px',\r\n border: `1px dashed ${colors.grey[400]}`,\r\n borderRadius: 6,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n textAlign: 'center'\r\n }\r\n} as const\r\n\r\nexport const PanelLoading: FC<BoxProps> = (props) => (\r\n <PanelLoadingStyled {...props}>\r\n <div className='inner'>\r\n <CircularProgress size={24} />\r\n <Typography variant='body2' color='primary'>\r\n Loading...\r\n </Typography>\r\n </div>\r\n </PanelLoadingStyled>\r\n)\r\n\r\nconst PanelLoadingStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': { gap: 8, borderColor: colors.blue[400], backgroundColor: colors.blue[50] }\r\n})\r\n\r\nexport const PanelError: FC<{ error: string }> = ({ error }) => (\r\n <PanelErrorStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' gutterBottom>\r\n An error occurred\r\n </Typography>\r\n {error && <Typography variant='body2'>{error}</Typography>}\r\n </div>\r\n </PanelErrorStyled>\r\n)\r\n\r\nconst PanelErrorStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.red[400],\r\n backgroundColor: colors.red[50],\r\n color: colors.red[900],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelNoData: FC = () => (\r\n <PanelNoDataStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' gutterBottom>\r\n No data available\r\n </Typography>\r\n <Typography variant='body2'>Try changing the filter or search keyword</Typography>\r\n </div>\r\n </PanelNoDataStyled>\r\n)\r\n\r\nconst PanelNoDataStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.grey[400],\r\n backgroundColor: colors.grey[50],\r\n color: colors.grey[700],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelWaiting: FC = () => (\r\n <PanelWaitingStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' color='text.primary' sx={{ fontWeight: 'bold' }}>\r\n Waiting for data...\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary'>\r\n Please wait while we fetch the data.\r\n </Typography>\r\n </div>\r\n </PanelWaitingStyled>\r\n)\r\n\r\nconst PanelWaitingStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.blue[400],\r\n backgroundColor: colors.blue[50],\r\n color: colors.blue[900],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelMissingConfig: FC = () => (\r\n <PanelMissingConfigStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' sx={{ fontWeight: 'bold' }}>\r\n Missing Configuration\r\n </Typography>\r\n <Typography variant='body2'>A required configuration is missing for this view to work correctly.</Typography>\r\n </div>\r\n </PanelMissingConfigStyled>\r\n)\r\n\r\nconst PanelMissingConfigStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.red[700],\r\n backgroundColor: colors.red[50],\r\n color: colors.red[900],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelLoadMore: FC = () => (\r\n <PanelLoadMoreStyled>\r\n <div>\r\n <CircularProgress size={24} thickness={4} />\r\n <Typography variant='body2' color='text.primary'>\r\n Loading more...\r\n </Typography>\r\n </div>\r\n </PanelLoadMoreStyled>\r\n)\r\n\r\nconst PanelLoadMoreStyled = styled(Box)(({ theme }) => ({\r\n position: 'absolute',\r\n inset: 0,\r\n bgcolor: theme.palette.mode === 'dark' ? 'rgba(0,0,0,0.12)' : 'rgba(255,255,255,0.12)',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n zIndex: 10,\r\n backdropFilter: 'blur(1px)',\r\n transition: 'opacity 0.2s',\r\n '& > div': { display: 'flex', alignItems: 'center', gap: 10 }\r\n}))\r\n\r\nexport interface IPanelInfiniteScrollFooterSlots {\r\n statusText?: string | ((currentStatus: string) => ReactNode)\r\n rangeText?: string | ((currentRange: string) => ReactNode)\r\n}\r\n\r\nexport interface IPanelInfiniteScrollFooterProps {\r\n loading?: boolean\r\n hasNext?: boolean\r\n currentCount: number\r\n total?: number\r\n slots?: IPanelInfiniteScrollFooterSlots\r\n}\r\n\r\nexport const PanelInfiniteScrollFooter: FC<IPanelInfiniteScrollFooterProps> = (props) => {\r\n const { slots, loading, hasNext, currentCount, total } = props\r\n // Status text on the left\r\n let statusText = ''\r\n if (loading) {\r\n statusText = 'Loading more...'\r\n } else if (hasNext) {\r\n statusText = 'Scroll for more'\r\n } else {\r\n statusText = 'No more items'\r\n }\r\n\r\n // Range text on the right\r\n const rangeText = currentCount > 0 ? (total != null ? `1–${currentCount} of ${total}` : `1–${currentCount}`) : '—'\r\n const finalStatusText = typeof slots?.statusText === 'function' ? slots.statusText(statusText) : (slots?.statusText ?? statusText)\r\n const finalRangeText = typeof slots?.rangeText === 'function' ? slots.rangeText(rangeText) : (slots?.rangeText ?? rangeText)\r\n\r\n const renderText = (value: ReactNode) => {\r\n if (typeof value !== 'string') return value\r\n return (\r\n <Typography variant='caption' color='text.secondary'>\r\n {value}\r\n </Typography>\r\n )\r\n }\r\n\r\n return (\r\n <PanelInfiniteScrollFooterStyled>\r\n <div>\r\n {renderText(finalStatusText)}\r\n {renderText(finalRangeText)}\r\n </div>\r\n </PanelInfiniteScrollFooterStyled>\r\n )\r\n}\r\n\r\nconst PanelInfiniteScrollFooterStyled = styled(Box)(({ theme }) => ({\r\n // padding: theme.spacing(0, 1),\r\n ['& > div']: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n padding: theme.spacing(1, 1.5),\r\n backgroundColor: alpha(theme.palette.grey[500], 0.08),\r\n borderTop: `1px solid ${alpha(theme.palette.common.black, 0.08)}`\r\n },\r\n '.MuiTypography-root': { lineHeight: 1 }\r\n}))\r\n\r\nexport interface IPanelPaginationFooterProps {\r\n page: number\r\n pageSize: number\r\n total?: number\r\n hasNext?: boolean\r\n hasPrev?: boolean\r\n loading?: boolean\r\n onPrevPage?: () => void\r\n onNextPage?: () => void\r\n onPageJump?: (page: number) => void\r\n}\r\n\r\nexport const PanelPaginationFooter: FC<IPanelPaginationFooterProps> = (props) => {\r\n const { page, pageSize, total, hasNext, loading, onPrevPage, onNextPage, onPageJump } = props\r\n const from = page * pageSize + 1\r\n const to = total != null ? Math.min(from + pageSize - 1, total) : from + pageSize - 1\r\n\r\n // Calculate page count for MUI Pagination (1-indexed)\r\n const pageCount = total != null ? Math.ceil(total / pageSize) : undefined\r\n\r\n const handlePageChange = (_event: any, value: number) => {\r\n // MUI Pagination uses 1-indexed, convert to 0-indexed\r\n const targetPage = value - 1\r\n\r\n if (onPageJump) {\r\n // Use direct page jump if available\r\n onPageJump(targetPage)\r\n } else {\r\n // Fallback to prev/next if no jump handler\r\n if (targetPage < page) {\r\n onPrevPage?.()\r\n } else if (targetPage > page) {\r\n onNextPage?.()\r\n }\r\n }\r\n }\r\n\r\n return (\r\n <PanelPaginationFooterStyled>\r\n <Typography variant='caption' color='text.secondary'>\r\n {total != null ? `${from}–${to} / ${total}` : `Page ${page + 1}`}\r\n </Typography>\r\n <Pagination\r\n count={pageCount}\r\n page={page + 1}\r\n onChange={handlePageChange}\r\n disabled={loading}\r\n size='small'\r\n showFirstButton={pageCount != null && pageCount > 5}\r\n showLastButton={pageCount != null && pageCount > 5}\r\n siblingCount={0}\r\n boundaryCount={1}\r\n hidePrevButton={pageCount == null && !hasNext}\r\n hideNextButton={pageCount == null && !hasNext}\r\n />\r\n </PanelPaginationFooterStyled>\r\n )\r\n}\r\n\r\nconst PanelPaginationFooterStyled = styled(Box)(({ theme }) => ({\r\n padding: '8px 16px',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n backgroundColor: theme.palette.background.paper,\r\n borderTop: `1px solid ${theme.palette.mode === 'dark' ? 'rgba(255, 255, 255, 0.12)' : 'rgba(0, 0, 0, 0.12)'}`\r\n}))\r\n"],"names":["stateWrapBase","padding","height","minHeight","width","border","concat","colors","grey","borderRadius","display","alignItems","justifyContent","textAlign","PanelLoading","props","_jsx","PanelLoadingStyled","_objectSpread","children","_jsxs","className","CircularProgress","size","Typography","variant","color","styled","Box","gap","borderColor","blue","backgroundColor","red","flexDirection","PanelNoData","PanelNoDataStyled","gutterBottom","PanelLoadMore","PanelLoadMoreStyled","thickness","_ref2","position","inset","bgcolor","theme","palette","mode","zIndex","backdropFilter","transition","PanelInfiniteScrollFooter","_slots$statusText","_slots$rangeText","slots","loading","hasNext","currentCount","total","statusText","rangeText","finalStatusText","finalRangeText","renderText","value","PanelInfiniteScrollFooterStyled","_ref3","_defineProperty","spacing","alpha","borderTop","common","black","lineHeight","PanelPaginationFooter","page","pageSize","onPrevPage","onNextPage","onPageJump","from","to","Math","min","pageCount","ceil","undefined","PanelPaginationFooterStyled","Pagination","count","onChange","_event","targetPage","disabled","showFirstButton","showLastButton","siblingCount","boundaryCount","hidePrevButton","hideNextButton","_ref5","background","paper"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ui.units.js","sources":["../../../../src/lab/data-surface/ui.units.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, CircularProgress, Pagination, Typography, colors, styled, alpha, Stack } from '@mui/material'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { BoxProps } from '@mui/material'\r\nimport { TRenderableNode } from './types'\r\n\r\nconst stateWrapBase = {\r\n padding: '8px',\r\n height: '100%',\r\n minHeight: 180,\r\n width: '100%',\r\n '& > .inner': {\r\n width: '100%',\r\n height: '100%',\r\n padding: '24px 16px',\r\n border: `1px dashed ${colors.grey[400]}`,\r\n borderRadius: 6,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n textAlign: 'center'\r\n }\r\n} as const\r\n\r\nexport const PanelLoading: FC<BoxProps> = (props) => (\r\n <PanelLoadingStyled {...props}>\r\n <div className='inner'>\r\n <CircularProgress size={24} />\r\n <Typography variant='body2' color='primary'>\r\n Loading...\r\n </Typography>\r\n </div>\r\n </PanelLoadingStyled>\r\n)\r\n\r\nconst PanelLoadingStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': { gap: 8, borderColor: colors.blue[400], backgroundColor: colors.blue[50] }\r\n})\r\n\r\nexport const PanelError: FC<{ error: string }> = ({ error }) => (\r\n <PanelErrorStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' gutterBottom>\r\n An error occurred\r\n </Typography>\r\n {error && <Typography variant='body2'>{error}</Typography>}\r\n </div>\r\n </PanelErrorStyled>\r\n)\r\n\r\nconst PanelErrorStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.red[400],\r\n backgroundColor: colors.red[50],\r\n color: colors.red[900],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelNoData: FC = () => (\r\n <PanelNoDataStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' gutterBottom>\r\n No data available\r\n </Typography>\r\n <Typography variant='body2'>Try changing the filter or search keyword</Typography>\r\n </div>\r\n </PanelNoDataStyled>\r\n)\r\n\r\nconst PanelNoDataStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.grey[400],\r\n backgroundColor: colors.grey[50],\r\n color: colors.grey[700],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelWaiting: FC = () => (\r\n <PanelWaitingStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' color='text.primary' sx={{ fontWeight: 'bold' }}>\r\n Waiting for data...\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary'>\r\n Please wait while we fetch the data.\r\n </Typography>\r\n </div>\r\n </PanelWaitingStyled>\r\n)\r\n\r\nconst PanelWaitingStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.blue[400],\r\n backgroundColor: colors.blue[50],\r\n color: colors.blue[900],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelMissingConfig: FC = () => (\r\n <PanelMissingConfigStyled>\r\n <div className='inner'>\r\n <Typography variant='h6' sx={{ fontWeight: 'bold' }}>\r\n Missing Configuration\r\n </Typography>\r\n <Typography variant='body2'>A required configuration is missing for this view to work correctly.</Typography>\r\n </div>\r\n </PanelMissingConfigStyled>\r\n)\r\n\r\nconst PanelMissingConfigStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n borderColor: colors.red[700],\r\n backgroundColor: colors.red[50],\r\n color: colors.red[900],\r\n flexDirection: 'column'\r\n }\r\n})\r\n\r\nexport const PanelLoadMore: FC = () => (\r\n <PanelLoadMoreStyled>\r\n <div>\r\n <CircularProgress size={24} thickness={4} />\r\n <Typography variant='body2' color='text.primary'>\r\n Loading more...\r\n </Typography>\r\n </div>\r\n </PanelLoadMoreStyled>\r\n)\r\n\r\nconst PanelLoadMoreStyled = styled(Box)(({ theme }) => ({\r\n position: 'absolute',\r\n inset: 0,\r\n bgcolor: theme.palette.mode === 'dark' ? 'rgba(0,0,0,0.12)' : 'rgba(255,255,255,0.12)',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n zIndex: 10,\r\n backdropFilter: 'blur(1px)',\r\n transition: 'opacity 0.2s',\r\n '& > div': { display: 'flex', alignItems: 'center', gap: 10 }\r\n}))\r\n\r\nexport interface IPanelInfiniteScrollFooterSlots {\r\n statusText?: TRenderableNode\r\n rangeText?: TRenderableNode\r\n}\r\n\r\nexport interface IPanelInfiniteScrollFooterProps {\r\n loading?: boolean\r\n hasNext?: boolean\r\n currentCount: number\r\n total?: number\r\n slots?: IPanelInfiniteScrollFooterSlots\r\n}\r\n\r\nconst mapStatusText = (loading?: boolean, hasNext?: boolean): { currentNode: ReactNode; rawText: string } => {\r\n const mapRawText: Record<string, string> = { loading: 'Loading more...', hasNext: 'Scroll for more', noMore: 'No more items' }\r\n if (loading) {\r\n return {\r\n currentNode: (\r\n <Stack flexDirection='row' alignItems='center' gap={1}>\r\n <CircularProgress color='primary' size={12} thickness={3} />\r\n <Typography variant='caption' color='primary.main'>\r\n {mapRawText.loading}\r\n </Typography>\r\n </Stack>\r\n ),\r\n rawText: mapRawText.loading\r\n }\r\n } else if (hasNext) {\r\n return { currentNode: mapRawText.hasNext, rawText: mapRawText.hasNext }\r\n } else {\r\n return { currentNode: mapRawText.noMore, rawText: mapRawText.noMore }\r\n }\r\n}\r\n\r\nexport const PanelInfiniteScrollFooter: FC<IPanelInfiniteScrollFooterProps> = (props) => {\r\n const { slots, loading, hasNext, currentCount, total } = props\r\n\r\n const renderText = (value: ReactNode) => {\r\n if (typeof value !== 'string') return value\r\n return (\r\n <Typography variant='caption' color='text.secondary'>\r\n {value}\r\n </Typography>\r\n )\r\n }\r\n\r\n // Status text on the left\r\n let obj = mapStatusText(loading, hasNext)\r\n let finalStatusText: ReactNode = obj.currentNode\r\n if (typeof slots?.statusText === 'function') {\r\n finalStatusText = slots.statusText(renderText(obj.currentNode), obj.rawText)\r\n } else if (slots?.statusText) {\r\n finalStatusText = slots.statusText\r\n }\r\n\r\n // Range text on the right\r\n const rangeText = currentCount > 0 ? (total != null ? `1–${currentCount} of ${total}` : `1–${currentCount}`) : '—'\r\n const finalRangeText = typeof slots?.rangeText === 'function' ? slots.rangeText(rangeText, rangeText) : (slots?.rangeText ?? rangeText)\r\n\r\n return (\r\n <PanelInfiniteScrollFooterStyled>\r\n <div>\r\n {renderText(finalStatusText)}\r\n {renderText(finalRangeText)}\r\n </div>\r\n </PanelInfiniteScrollFooterStyled>\r\n )\r\n}\r\n\r\nconst PanelInfiniteScrollFooterStyled = styled(Box)(({ theme }) => ({\r\n // padding: theme.spacing(0, 1),\r\n '& > div': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n padding: theme.spacing(1, 1.5),\r\n backgroundColor: alpha(theme.palette.grey[500], 0.08),\r\n borderTop: `1px solid ${alpha(theme.palette.common.black, 0.08)}`\r\n },\r\n '.MuiTypography-root': { lineHeight: 1 }\r\n}))\r\n\r\nexport interface IPanelPaginationFooterProps {\r\n page: number\r\n pageSize: number\r\n total?: number\r\n hasNext?: boolean\r\n hasPrev?: boolean\r\n loading?: boolean\r\n onPrevPage?: () => void\r\n onNextPage?: () => void\r\n onPageJump?: (page: number) => void\r\n}\r\n\r\nexport const PanelPaginationFooter: FC<IPanelPaginationFooterProps> = (props) => {\r\n const { page, pageSize, total, hasNext, loading, onPrevPage, onNextPage, onPageJump } = props\r\n const from = page * pageSize + 1\r\n const to = total != null ? Math.min(from + pageSize - 1, total) : from + pageSize - 1\r\n\r\n // Calculate page count for MUI Pagination (1-indexed)\r\n const pageCount = total != null ? Math.ceil(total / pageSize) : undefined\r\n\r\n const handlePageChange = (_event: any, value: number) => {\r\n // MUI Pagination uses 1-indexed, convert to 0-indexed\r\n const targetPage = value - 1\r\n\r\n if (onPageJump) {\r\n // Use direct page jump if available\r\n onPageJump(targetPage)\r\n } else {\r\n // Fallback to prev/next if no jump handler\r\n if (targetPage < page) {\r\n onPrevPage?.()\r\n } else if (targetPage > page) {\r\n onNextPage?.()\r\n }\r\n }\r\n }\r\n\r\n return (\r\n <PanelPaginationFooterStyled>\r\n <Typography variant='caption' color='text.secondary'>\r\n {total != null ? `${from}–${to} / ${total}` : `Page ${page + 1}`}\r\n </Typography>\r\n <Pagination\r\n count={pageCount}\r\n page={page + 1}\r\n onChange={handlePageChange}\r\n disabled={loading}\r\n size='small'\r\n showFirstButton={pageCount != null && pageCount > 5}\r\n showLastButton={pageCount != null && pageCount > 5}\r\n siblingCount={0}\r\n boundaryCount={1}\r\n hidePrevButton={pageCount == null && !hasNext}\r\n hideNextButton={pageCount == null && !hasNext}\r\n />\r\n </PanelPaginationFooterStyled>\r\n )\r\n}\r\n\r\nconst PanelPaginationFooterStyled = styled(Box)(({ theme }) => ({\r\n padding: '8px 16px',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n backgroundColor: theme.palette.background.paper,\r\n borderTop: `1px solid ${theme.palette.mode === 'dark' ? 'rgba(255, 255, 255, 0.12)' : 'rgba(0, 0, 0, 0.12)'}`\r\n}))\r\n"],"names":["stateWrapBase","padding","height","minHeight","width","border","concat","colors","grey","borderRadius","display","alignItems","justifyContent","textAlign","PanelLoading","props","_jsx","PanelLoadingStyled","_objectSpread","children","_jsxs","className","CircularProgress","size","Typography","variant","color","styled","Box","gap","borderColor","blue","backgroundColor","red","flexDirection","PanelNoData","PanelNoDataStyled","gutterBottom","PanelLoadMore","PanelLoadMoreStyled","thickness","_ref2","position","inset","bgcolor","theme","palette","mode","zIndex","backdropFilter","transition","PanelInfiniteScrollFooter","_slots$rangeText","slots","loading","hasNext","currentCount","total","renderText","value","obj","mapRawText","currentNode","Stack","rawText","mapStatusText","finalStatusText","statusText","rangeText","finalRangeText","PanelInfiniteScrollFooterStyled","_ref3","spacing","alpha","borderTop","common","black","lineHeight","PanelPaginationFooter","page","pageSize","onPrevPage","onNextPage","onPageJump","from","to","Math","min","pageCount","ceil","undefined","PanelPaginationFooterStyled","Pagination","count","onChange","_event","targetPage","disabled","showFirstButton","showLastButton","siblingCount","boundaryCount","hidePrevButton","hideNextButton","_ref4","background","paper"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"view-grid.js","sources":["../../../../src/lab/data-surface/view-grid.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, Grid, styled } from '@mui/material'\r\nimport { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react'\r\nimport { getGridItemSizes, getMaxGridGap, getMaxGridItemHeight, GridItemDefault, resolveGridColumnsFromWidth } from './view-grid.units'\r\n// types\r\nimport type { BoxProps } from '@mui/material'\r\nimport type { ComponentType, FC } from 'react'\r\nimport type { TGetterId, LoadingModeRule, TPagination, TVirtualizedConfig, RenderStrategyRule } from './types'\r\nimport type { IViewGridItemProps, TGridSizes } from './view-grid.types'\r\n\r\nexport interface IViewGridBase<T> {\r\n gap?: number\r\n sizes?: TGridSizes\r\n gridItemHeight?: number\r\n /**\r\n * Controls how the list is rendered into the DOM.\r\n * - `normal` — all rows are mounted (suitable for small datasets)\r\n * - `virtualized` — only visible rows are mounted (optimized for large datasets)\r\n * @default 'normal'\r\n */\r\n renderStrategy?: RenderStrategyRule\r\n Component?: ComponentType<IViewGridItemProps<T>>\r\n virtualizedConfig?: TVirtualizedConfig\r\n /** Called when user scrolls near the bottom of the list. Use this to trigger pagination or infinity load. */\r\n onNearEnd?: () => void\r\n}\r\n\r\nexport interface IViewGridConfig<T> extends IViewGridBase<T> {\r\n getterId: TGetterId<T>\r\n}\r\n\r\nexport interface IViewGridProps<T> extends IViewGridBase<T> {\r\n value: T[]\r\n}\r\n\r\nexport interface IViewGridLoadingProps<T> extends IViewGridBase<T> {\r\n value: T[]\r\n loadMode: LoadingModeRule\r\n loading?: boolean\r\n pagination?: TPagination\r\n onPageChange?: (page: number, pageSize: number) => void | Promise<void>\r\n}\r\n\r\nfunction createViewGridNormal<T>(config: IViewGridConfig<T>) {\r\n const ViewGridNormal: FC<IViewGridProps<T>> = (props) => {\r\n const mergedConfig = useMemo(() => {\r\n return {\r\n gap: getMaxGridGap(props.gap, config.gap),\r\n sizes: getGridItemSizes(props.sizes ?? config.sizes),\r\n getterId: config.getterId,\r\n Component: props.Component ?? config.Component ?? GridItemDefault,\r\n gridItemHeight: getMaxGridItemHeight(props.gridItemHeight, config.gridItemHeight)\r\n }\r\n }, [props.value, props.gap, props.sizes, props.Component, config])\r\n\r\n const gridItems = useMemo(() => {\r\n return props.value\r\n }, [props.value])\r\n\r\n const renderItem = (item: T, index: number) => {\r\n const ItemComponent = mergedConfig.Component\r\n return <ItemComponent value={item} index={index} />\r\n }\r\n\r\n return (\r\n <ViewGridNormalStyled className={classes.root}>\r\n <div\r\n className={classes.scrollContainer}\r\n onScroll={(e) => {\r\n const t = e.currentTarget\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= 80) {\r\n props.onNearEnd?.()\r\n }\r\n }}\r\n >\r\n <Grid container spacing={`${mergedConfig.gap}px`}>\r\n {gridItems.map((item, index) => {\r\n const key = mergedConfig.getterId(item, index) ?? index\r\n return (\r\n <Grid key={key} className={classes.gridItem} item {...mergedConfig.sizes} sx={{ height: mergedConfig.gridItemHeight }}>\r\n {renderItem(item, index)}\r\n </Grid>\r\n )\r\n })}\r\n </Grid>\r\n </div>\r\n </ViewGridNormalStyled>\r\n )\r\n }\r\n return ViewGridNormal\r\n}\r\n\r\nfunction createViewGridVirtualized<T>(config: IViewGridConfig<T>) {\r\n const ViewGridVirtualized: FC<IViewGridProps<T>> = (props) => {\r\n const finalItems = useMemo(() => {\r\n return props.value\r\n }, [props.value])\r\n\r\n const mergedConfig = useMemo(() => {\r\n return {\r\n gap: getMaxGridGap(props.gap, config.gap, 8),\r\n sizes: getGridItemSizes(props.sizes ?? config.sizes),\r\n getterId: config.getterId,\r\n Component: props.Component ?? config.Component ?? GridItemDefault,\r\n gridItemHeight: getMaxGridItemHeight(props.gridItemHeight, config.gridItemHeight),\r\n virtualized: Object.assign({}, config.virtualizedConfig, props.virtualizedConfig) as TVirtualizedConfig\r\n }\r\n }, [props.gap, props.sizes, props.Component, config])\r\n\r\n const { sizes, getterId, virtualized, gridItemHeight } = mergedConfig\r\n\r\n const wrapRef = useRef<HTMLDivElement | null>(null)\r\n const [containerWidth, setContainerWidth] = useState(0)\r\n const [containerHeight, setContainerHeight] = useState(0)\r\n const [scrollTopState, setScrollTopState] = useState(virtualized.scrollTop ?? 0)\r\n\r\n const itemHeight = getMaxGridItemHeight(gridItemHeight)\r\n const overscan = Math.max(1, virtualized.overscan ?? 4)\r\n const gapPx = getMaxGridGap(mergedConfig.gap)\r\n const outerGutterPx = gapPx / 2\r\n\r\n useLayoutEffect(() => {\r\n if (!wrapRef.current) return\r\n\r\n const updateSize = () => {\r\n const nextWidth = wrapRef.current?.clientWidth ?? 0\r\n const nextHeight = wrapRef.current?.clientHeight ?? 0\r\n setContainerWidth((prev) => (prev === nextWidth ? prev : nextWidth))\r\n setContainerHeight((prev) => (prev === nextHeight ? prev : nextHeight))\r\n }\r\n\r\n updateSize()\r\n\r\n const observer = new ResizeObserver(() => {\r\n updateSize()\r\n })\r\n\r\n observer.observe(wrapRef.current)\r\n return () => observer.disconnect()\r\n }, [])\r\n\r\n // sync external virtualized.scrollTop when provided\r\n useLayoutEffect(() => {\r\n if (typeof virtualized.scrollTop === 'number') {\r\n setScrollTopState(virtualized.scrollTop)\r\n }\r\n }, [virtualized.scrollTop])\r\n\r\n const columns = resolveGridColumnsFromWidth(containerWidth, sizes)\r\n const rowHeight = itemHeight + gapPx\r\n\r\n const windowed = useMemo(() => {\r\n const totalItems = finalItems.length\r\n if (totalItems === 0) {\r\n return { startRow: 0, endRow: -1, topSpacerHeight: 0, bottomSpacerHeight: 0, startIndex: 0, endIndex: -1 }\r\n }\r\n\r\n const totalRows = Math.ceil(totalItems / columns)\r\n const safeViewportHeight = Math.max(1, virtualized.viewportHeight ?? containerHeight ?? 1)\r\n const effectiveScrollTop = typeof virtualized.scrollTop === 'number' ? virtualized.scrollTop : scrollTopState\r\n const startRow = Math.max(0, Math.floor(effectiveScrollTop / rowHeight) - overscan)\r\n const visibleRows = Math.ceil(safeViewportHeight / rowHeight)\r\n const endRow = Math.min(totalRows - 1, startRow + visibleRows + overscan * 2)\r\n const startIndex = startRow * columns\r\n const endIndex = Math.min(totalItems - 1, (endRow + 1) * columns - 1)\r\n const topSpacerHeight = startRow * rowHeight\r\n const bottomSpacerHeight = Math.max(0, (totalRows - endRow - 1) * rowHeight)\r\n\r\n return { startRow, endRow, topSpacerHeight, bottomSpacerHeight, startIndex, endIndex }\r\n }, [columns, finalItems.length, overscan, rowHeight, virtualized, scrollTopState, containerHeight])\r\n\r\n const getSxForContent = (): BoxProps['sx'] => ({\r\n display: 'grid',\r\n gap: `${gapPx}px`,\r\n gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`\r\n })\r\n\r\n const visibleItems = windowed.endIndex >= windowed.startIndex ? finalItems.slice(windowed.startIndex, windowed.endIndex + 1) : []\r\n\r\n const renderItem = (item: T, index: number) => {\r\n const ItemComponent = mergedConfig.Component\r\n return <ItemComponent value={item} index={index} />\r\n }\r\n\r\n const rootClasses = [classes.gridVirtualized, classes.grid].join(' ')\r\n return (\r\n <ViewGridVirtualizedStyled className={rootClasses}>\r\n <Box\r\n ref={wrapRef}\r\n sx={{ p: `${outerGutterPx}px`, overflowY: 'auto', height: '100%', boxSizing: 'border-box' }}\r\n onScroll={(e) => {\r\n const t = e.currentTarget as HTMLDivElement\r\n if (typeof virtualized.scrollTop !== 'number') {\r\n setScrollTopState(t.scrollTop)\r\n }\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= 80) {\r\n props.onNearEnd?.()\r\n }\r\n }}\r\n >\r\n {windowed.topSpacerHeight > 0 ? <Box sx={{ height: windowed.topSpacerHeight }} /> : null}\r\n\r\n <Box sx={getSxForContent()}>\r\n {visibleItems.map((item, offset) => {\r\n const index = windowed.startIndex + offset\r\n const key = getterId(item, index) ?? index\r\n return (\r\n <Box key={key} sx={{ minHeight: itemHeight, height: itemHeight }}>\r\n {renderItem(item, index)}\r\n </Box>\r\n )\r\n })}\r\n </Box>\r\n\r\n {windowed.bottomSpacerHeight > 0 ? <Box sx={{ height: windowed.bottomSpacerHeight }} /> : null}\r\n </Box>\r\n </ViewGridVirtualizedStyled>\r\n )\r\n }\r\n return ViewGridVirtualized\r\n}\r\n\r\nexport function createViewGrid<T>(config: IViewGridConfig<T>) {\r\n const ViewGridNormal = createViewGridNormal<T>(config)\r\n const ViewGridVirtualized = createViewGridVirtualized<T>(config)\r\n\r\n const ViewGrid: FC<IViewGridProps<T>> = (props) => {\r\n const renderStrategy = props.renderStrategy ?? config.renderStrategy ?? 'normal'\r\n if (renderStrategy === 'virtualized') {\r\n return <ViewGridVirtualized {...props} />\r\n }\r\n return <ViewGridNormal {...props} />\r\n }\r\n return ViewGrid\r\n}\r\n\r\nexport function createViewGridLoading<T>(GridComponent: ComponentType<IViewGridProps<T>>) {\r\n const ViewGridLoading: FC<IViewGridLoadingProps<T>> = (props) => {\r\n const handleNearEnd = useCallback(async () => {\r\n if (props.loadMode !== 'infiniteScroll') return\r\n if (!props.pagination?.hasNext) return\r\n if (props.loading) return\r\n\r\n const currentPage = props.pagination?.page ?? 0\r\n const currentPageSize = props.pagination?.pageSize ?? 20\r\n const nextPage = currentPage + 1\r\n await props.onPageChange?.(nextPage, currentPageSize)\r\n }, [props.loadMode, props.pagination?.hasNext, props.pagination?.page, props.pagination?.pageSize, props.loading, props.onPageChange])\r\n\r\n return (\r\n <GridComponent\r\n value={props.value}\r\n gap={props.gap}\r\n sizes={props.sizes}\r\n gridItemHeight={props.gridItemHeight}\r\n renderStrategy={props.renderStrategy}\r\n Component={props.Component}\r\n virtualizedConfig={props.virtualizedConfig}\r\n onNearEnd={props.loadMode === 'infiniteScroll' ? handleNearEnd : undefined}\r\n />\r\n )\r\n }\r\n\r\n return ViewGridLoading\r\n}\r\n\r\nexport default createViewGrid\r\n\r\nexport const viewGridClasses = {\r\n root: 'DinoViewGrid-root',\r\n scrollContainer: 'DinoViewGrid-scrollContainer',\r\n grid: 'DinoViewGrid-grid',\r\n gridVirtualized: 'DinoViewGrid-gridVirtualized',\r\n gridItem: 'DinoViewGrid-item'\r\n}\r\nconst classes = viewGridClasses\r\n\r\nconst ViewGridNormalStyled = styled(Box)(({ theme }) => ({\r\n position: 'relative',\r\n width: '100%',\r\n height: '100%',\r\n overflow: 'hidden',\r\n [`& .${classes.scrollContainer}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n overflowY: 'auto',\r\n padding: theme.spacing(1)\r\n }\r\n}))\r\n\r\nconst ViewGridVirtualizedStyled = styled(Box)(({ theme }) => ({\r\n position: 'relative',\r\n width: '100%',\r\n height: '100%',\r\n overflow: 'hidden',\r\n boxSizing: 'border-box',\r\n '& > div': {\r\n height: '100%'\r\n },\r\n [`& .${classes.scrollContainer}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n overflowY: 'auto',\r\n padding: theme.spacing(1)\r\n }\r\n}))\r\n"],"names":["createViewGrid","config","ViewGridNormal","props","mergedConfig","useMemo","_props$sizes","_ref","_props$Component","gap","getMaxGridGap","sizes","getGridItemSizes","getterId","Component","GridItemDefault","gridItemHeight","getMaxGridItemHeight","value","gridItems","renderItem","item","index","ItemComponent","_jsx","ViewGridNormalStyled","className","classes","root","children","scrollContainer","onScroll","e","_props$onNearEnd","t","currentTarget","scrollHeight","scrollTop","clientHeight","onNearEnd","call","Grid","container","spacing","concat","map","_mergedConfig$getterI","key","_objectSpread","gridItem","sx","height","createViewGridNormal","ViewGridVirtualized","_virtualized$scrollTo","_virtualized$overscan","finalItems","_props$sizes2","_ref2","_props$Component2","virtualized","Object","assign","virtualizedConfig","wrapRef","useRef","_useState","useState","_useState2","_slicedToArray","containerWidth","setContainerWidth","_useState3","_useState4","containerHeight","setContainerHeight","_useState5","_useState6","scrollTopState","setScrollTopState","itemHeight","overscan","Math","max","gapPx","outerGutterPx","useLayoutEffect","current","updateSize","_wrapRef$current$clie","_wrapRef$current","_wrapRef$current$clie2","_wrapRef$current2","nextWidth","clientWidth","nextHeight","prev","observer","ResizeObserver","observe","disconnect","columns","resolveGridColumnsFromWidth","rowHeight","windowed","_ref3","_virtualized$viewport","totalItems","length","startRow","endRow","topSpacerHeight","bottomSpacerHeight","startIndex","endIndex","totalRows","ceil","safeViewportHeight","viewportHeight","effectiveScrollTop","floor","visibleRows","min","visibleItems","slice","rootClasses","gridVirtualized","grid","join","ViewGridVirtualizedStyled","_jsxs","Box","ref","p","overflowY","boxSizing","_props$onNearEnd2","display","gridTemplateColumns","offset","_getterId","minHeight","createViewGridVirtualized","_ref4","_props$renderStrategy","renderStrategy","createViewGridLoading","GridComponent","_props$pagination4","_props$pagination5","_props$pagination6","handleNearEnd","useCallback","_asyncToGenerator","_regenerator","m","_callee","_props$pagination","_props$pagination$pag","_props$pagination2","_props$pagination$pag2","_props$pagination3","_props$onPageChange","currentPage","currentPageSize","nextPage","w","_context","n","loadMode","a","pagination","hasNext","loading","page","pageSize","onPageChange","undefined","viewGridClasses","styled","_ref6","theme","_defineProperty","position","width","overflow","top","left","right","bottom","padding","_ref8"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"view-grid.js","sources":["../../../../src/lab/data-surface/view-grid.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { Box, Grid, styled } from '@mui/material'\r\nimport { useCallback, useLayoutEffect, useMemo, useRef, useState } from 'react'\r\nimport { getGridItemSizes, getMaxGridGap, getMaxGridItemHeight, GridItemDefault, resolveGridColumnsFromWidth } from './view-grid.units'\r\n// types\r\nimport type { BoxProps } from '@mui/material'\r\nimport type { ComponentType, FC } from 'react'\r\nimport type { IViewGridItemProps, TGridSizes } from './view-grid.types'\r\nimport type { TGetterId, LoadingModeRule, TPagination, TVirtualizedConfig, RenderStrategyRule } from './types'\r\n\r\nexport interface IViewGridBase<T> {\r\n gap?: number\r\n sizes?: TGridSizes\r\n gridItemHeight?: number\r\n /**\r\n * Controls how the list is rendered into the DOM.\r\n * - `normal` — all rows are mounted (suitable for small datasets)\r\n * - `virtualized` — only visible rows are mounted (optimized for large datasets)\r\n * @default 'normal'\r\n */\r\n renderStrategy?: RenderStrategyRule\r\n Component?: ComponentType<IViewGridItemProps<T>>\r\n virtualizedConfig?: TVirtualizedConfig\r\n /** Called when user scrolls near the bottom of the list. Use this to trigger pagination or infinity load. */\r\n onNearEnd?: () => void\r\n}\r\n\r\nexport interface IViewGridConfig<T> extends IViewGridBase<T> {\r\n getterId: TGetterId<T>\r\n}\r\n\r\nexport interface IViewGridProps<T> extends IViewGridBase<T> {\r\n value: T[]\r\n}\r\n\r\nexport interface IViewGridLoadingProps<T> extends IViewGridBase<T> {\r\n value: T[]\r\n loadMode: LoadingModeRule\r\n loading?: boolean\r\n pagination?: TPagination\r\n onPageChange?: (page: number, pageSize: number) => void | Promise<void>\r\n}\r\n\r\nfunction createViewGridNormal<T>(config: IViewGridConfig<T>) {\r\n const ViewGridNormal: FC<IViewGridProps<T>> = (props) => {\r\n const mergedConfig = useMemo(() => {\r\n return {\r\n gap: getMaxGridGap(props.gap, config.gap),\r\n sizes: getGridItemSizes(props.sizes ?? config.sizes),\r\n getterId: config.getterId,\r\n Component: props.Component ?? config.Component ?? GridItemDefault,\r\n gridItemHeight: getMaxGridItemHeight(props.gridItemHeight, config.gridItemHeight)\r\n }\r\n }, [props.value, props.gap, props.sizes, props.Component, config])\r\n\r\n const gridItems = useMemo(() => {\r\n return props.value\r\n }, [props.value])\r\n\r\n const renderItem = (item: T, index: number) => {\r\n const ItemComponent = mergedConfig.Component\r\n return <ItemComponent value={item} index={index} />\r\n }\r\n\r\n return (\r\n <ViewGridNormalStyled className={classes.root}>\r\n <div\r\n className={classes.scrollContainer}\r\n onScroll={(e) => {\r\n const t = e.currentTarget\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= 80) {\r\n props.onNearEnd?.()\r\n }\r\n }}\r\n >\r\n <Grid container spacing={`${mergedConfig.gap}px`}>\r\n {gridItems.map((item, index) => {\r\n const key = mergedConfig.getterId(item, index) ?? index\r\n return (\r\n <Grid key={key} className={classes.gridItem} item {...mergedConfig.sizes} sx={{ height: mergedConfig.gridItemHeight }}>\r\n {renderItem(item, index)}\r\n </Grid>\r\n )\r\n })}\r\n </Grid>\r\n </div>\r\n </ViewGridNormalStyled>\r\n )\r\n }\r\n return ViewGridNormal\r\n}\r\n\r\nfunction createViewGridVirtualized<T>(config: IViewGridConfig<T>) {\r\n const ViewGridVirtualized: FC<IViewGridProps<T>> = (props) => {\r\n const finalItems = useMemo(() => {\r\n return props.value\r\n }, [props.value])\r\n\r\n const mergedConfig = useMemo(() => {\r\n return {\r\n gap: getMaxGridGap(props.gap, config.gap, 8),\r\n sizes: getGridItemSizes(props.sizes ?? config.sizes),\r\n getterId: config.getterId,\r\n Component: props.Component ?? config.Component ?? GridItemDefault,\r\n gridItemHeight: getMaxGridItemHeight(props.gridItemHeight, config.gridItemHeight),\r\n virtualized: Object.assign({}, config.virtualizedConfig, props.virtualizedConfig) as TVirtualizedConfig\r\n }\r\n }, [props.gap, props.sizes, props.Component, config])\r\n\r\n const { sizes, getterId, virtualized, gridItemHeight } = mergedConfig\r\n\r\n const wrapRef = useRef<HTMLDivElement | null>(null)\r\n const [containerWidth, setContainerWidth] = useState(0)\r\n const [containerHeight, setContainerHeight] = useState(0)\r\n const [scrollTopState, setScrollTopState] = useState(virtualized.scrollTop ?? 0)\r\n\r\n const itemHeight = getMaxGridItemHeight(gridItemHeight)\r\n const overscan = Math.max(1, virtualized.overscan ?? 4)\r\n const gapPx = getMaxGridGap(mergedConfig.gap)\r\n const outerGutterPx = gapPx / 2\r\n\r\n useLayoutEffect(() => {\r\n if (!wrapRef.current) return\r\n\r\n const updateSize = () => {\r\n const nextWidth = wrapRef.current?.clientWidth ?? 0\r\n const nextHeight = wrapRef.current?.clientHeight ?? 0\r\n setContainerWidth((prev) => (prev === nextWidth ? prev : nextWidth))\r\n setContainerHeight((prev) => (prev === nextHeight ? prev : nextHeight))\r\n }\r\n\r\n updateSize()\r\n\r\n const observer = new ResizeObserver(() => {\r\n updateSize()\r\n })\r\n\r\n observer.observe(wrapRef.current)\r\n return () => observer.disconnect()\r\n }, [])\r\n\r\n // sync external virtualized.scrollTop when provided\r\n useLayoutEffect(() => {\r\n if (typeof virtualized.scrollTop === 'number') {\r\n setScrollTopState(virtualized.scrollTop)\r\n }\r\n }, [virtualized.scrollTop])\r\n\r\n const columns = resolveGridColumnsFromWidth(containerWidth, sizes)\r\n const rowHeight = itemHeight + gapPx\r\n\r\n const windowed = useMemo(() => {\r\n const totalItems = finalItems.length\r\n if (totalItems === 0) {\r\n return { startRow: 0, endRow: -1, topSpacerHeight: 0, bottomSpacerHeight: 0, startIndex: 0, endIndex: -1 }\r\n }\r\n\r\n const totalRows = Math.ceil(totalItems / columns)\r\n const safeViewportHeight = Math.max(1, virtualized.viewportHeight ?? containerHeight ?? 1)\r\n const effectiveScrollTop = typeof virtualized.scrollTop === 'number' ? virtualized.scrollTop : scrollTopState\r\n const startRow = Math.max(0, Math.floor(effectiveScrollTop / rowHeight) - overscan)\r\n const visibleRows = Math.ceil(safeViewportHeight / rowHeight)\r\n const endRow = Math.min(totalRows - 1, startRow + visibleRows + overscan * 2)\r\n const startIndex = startRow * columns\r\n const endIndex = Math.min(totalItems - 1, (endRow + 1) * columns - 1)\r\n const topSpacerHeight = startRow * rowHeight\r\n const bottomSpacerHeight = Math.max(0, (totalRows - endRow - 1) * rowHeight)\r\n\r\n return { startRow, endRow, topSpacerHeight, bottomSpacerHeight, startIndex, endIndex }\r\n }, [columns, finalItems.length, overscan, rowHeight, virtualized, scrollTopState, containerHeight])\r\n\r\n const getSxForContent = (): BoxProps['sx'] => ({\r\n display: 'grid',\r\n gap: `${gapPx}px`,\r\n gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`\r\n })\r\n\r\n const visibleItems = windowed.endIndex >= windowed.startIndex ? finalItems.slice(windowed.startIndex, windowed.endIndex + 1) : []\r\n\r\n const renderItem = (item: T, index: number) => {\r\n const ItemComponent = mergedConfig.Component\r\n return <ItemComponent value={item} index={index} />\r\n }\r\n\r\n const rootClasses = [classes.gridVirtualized, classes.grid].join(' ')\r\n return (\r\n <ViewGridVirtualizedStyled className={rootClasses}>\r\n <Box\r\n ref={wrapRef}\r\n sx={{ p: `${outerGutterPx}px`, overflowY: 'auto', height: '100%', boxSizing: 'border-box' }}\r\n onScroll={(e) => {\r\n const t = e.currentTarget as HTMLDivElement\r\n if (typeof virtualized.scrollTop !== 'number') {\r\n setScrollTopState(t.scrollTop)\r\n }\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= 80) {\r\n props.onNearEnd?.()\r\n }\r\n }}\r\n >\r\n {windowed.topSpacerHeight > 0 ? <Box sx={{ height: windowed.topSpacerHeight }} /> : null}\r\n\r\n <Box sx={getSxForContent()}>\r\n {visibleItems.map((item, offset) => {\r\n const index = windowed.startIndex + offset\r\n const key = getterId(item, index) ?? index\r\n return (\r\n <Box key={key} sx={{ minHeight: itemHeight, height: itemHeight }}>\r\n {renderItem(item, index)}\r\n </Box>\r\n )\r\n })}\r\n </Box>\r\n\r\n {windowed.bottomSpacerHeight > 0 ? <Box sx={{ height: windowed.bottomSpacerHeight }} /> : null}\r\n </Box>\r\n </ViewGridVirtualizedStyled>\r\n )\r\n }\r\n return ViewGridVirtualized\r\n}\r\n\r\nexport function createViewGrid<T>(config: IViewGridConfig<T>) {\r\n const ViewGridNormal = createViewGridNormal<T>(config)\r\n const ViewGridVirtualized = createViewGridVirtualized<T>(config)\r\n\r\n const ViewGrid: FC<IViewGridProps<T>> = (props) => {\r\n const renderStrategy = props.renderStrategy ?? config.renderStrategy ?? 'normal'\r\n if (renderStrategy === 'virtualized') {\r\n return <ViewGridVirtualized {...props} />\r\n }\r\n return <ViewGridNormal {...props} />\r\n }\r\n return ViewGrid\r\n}\r\n\r\nexport function createViewGridLoading<T>(GridComponent: ComponentType<IViewGridProps<T>>) {\r\n const ViewGridLoading: FC<IViewGridLoadingProps<T>> = (props) => {\r\n const handleNearEnd = useCallback(async () => {\r\n if (props.loadMode !== 'infiniteScroll') return\r\n if (!props.pagination?.hasNext) return\r\n if (props.loading) return\r\n\r\n const currentPage = props.pagination?.page ?? 0\r\n const currentPageSize = props.pagination?.pageSize ?? 20\r\n const nextPage = currentPage + 1\r\n await props.onPageChange?.(nextPage, currentPageSize)\r\n }, [props.loadMode, props.pagination?.hasNext, props.pagination?.page, props.pagination?.pageSize, props.loading, props.onPageChange])\r\n\r\n return (\r\n <GridComponent\r\n value={props.value}\r\n gap={props.gap}\r\n sizes={props.sizes}\r\n gridItemHeight={props.gridItemHeight}\r\n renderStrategy={props.renderStrategy}\r\n Component={props.Component}\r\n virtualizedConfig={props.virtualizedConfig}\r\n onNearEnd={props.loadMode === 'infiniteScroll' ? handleNearEnd : undefined}\r\n />\r\n )\r\n }\r\n\r\n return ViewGridLoading\r\n}\r\n\r\nexport default createViewGrid\r\n\r\nexport const viewGridClasses = {\r\n root: 'DinoViewGrid-root',\r\n scrollContainer: 'DinoViewGrid-scrollContainer',\r\n grid: 'DinoViewGrid-grid',\r\n gridVirtualized: 'DinoViewGrid-gridVirtualized',\r\n gridItem: 'DinoViewGrid-item'\r\n}\r\nconst classes = viewGridClasses\r\n\r\nconst ViewGridNormalStyled = styled(Box)(({ theme }) => ({\r\n position: 'relative',\r\n width: '100%',\r\n height: '100%',\r\n overflow: 'hidden',\r\n [`& .${classes.scrollContainer}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n overflowY: 'auto',\r\n padding: theme.spacing(1)\r\n }\r\n}))\r\n\r\nconst ViewGridVirtualizedStyled = styled(Box)(({ theme }) => ({\r\n position: 'relative',\r\n width: '100%',\r\n height: '100%',\r\n overflow: 'hidden',\r\n boxSizing: 'border-box',\r\n '& > div': {\r\n height: '100%'\r\n },\r\n [`& .${classes.scrollContainer}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n overflowY: 'auto',\r\n padding: theme.spacing(1)\r\n }\r\n}))\r\n"],"names":["createViewGrid","config","ViewGridNormal","props","mergedConfig","useMemo","_props$sizes","_ref","_props$Component","gap","getMaxGridGap","sizes","getGridItemSizes","getterId","Component","GridItemDefault","gridItemHeight","getMaxGridItemHeight","value","gridItems","renderItem","item","index","ItemComponent","_jsx","ViewGridNormalStyled","className","classes","root","children","scrollContainer","onScroll","e","_props$onNearEnd","t","currentTarget","scrollHeight","scrollTop","clientHeight","onNearEnd","call","Grid","container","spacing","concat","map","_mergedConfig$getterI","key","_objectSpread","gridItem","sx","height","createViewGridNormal","ViewGridVirtualized","_virtualized$scrollTo","_virtualized$overscan","finalItems","_props$sizes2","_ref2","_props$Component2","virtualized","Object","assign","virtualizedConfig","wrapRef","useRef","_useState","useState","_useState2","_slicedToArray","containerWidth","setContainerWidth","_useState3","_useState4","containerHeight","setContainerHeight","_useState5","_useState6","scrollTopState","setScrollTopState","itemHeight","overscan","Math","max","gapPx","outerGutterPx","useLayoutEffect","current","updateSize","_wrapRef$current$clie","_wrapRef$current","_wrapRef$current$clie2","_wrapRef$current2","nextWidth","clientWidth","nextHeight","prev","observer","ResizeObserver","observe","disconnect","columns","resolveGridColumnsFromWidth","rowHeight","windowed","_ref3","_virtualized$viewport","totalItems","length","startRow","endRow","topSpacerHeight","bottomSpacerHeight","startIndex","endIndex","totalRows","ceil","safeViewportHeight","viewportHeight","effectiveScrollTop","floor","visibleRows","min","visibleItems","slice","rootClasses","gridVirtualized","grid","join","ViewGridVirtualizedStyled","_jsxs","Box","ref","p","overflowY","boxSizing","_props$onNearEnd2","display","gridTemplateColumns","offset","_getterId","minHeight","createViewGridVirtualized","_ref4","_props$renderStrategy","renderStrategy","createViewGridLoading","GridComponent","_props$pagination4","_props$pagination5","_props$pagination6","handleNearEnd","useCallback","_asyncToGenerator","_regenerator","m","_callee","_props$pagination","_props$pagination$pag","_props$pagination2","_props$pagination$pag2","_props$pagination3","_props$onPageChange","currentPage","currentPageSize","nextPage","w","_context","n","loadMode","a","pagination","hasNext","loading","page","pageSize","onPageChange","undefined","viewGridClasses","styled","_ref6","theme","_defineProperty","position","width","overflow","top","left","right","bottom","padding","_ref8"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as e,objectSpread2 as l,asyncToGenerator as n,regenerator as t,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as r}from"react/jsx-runtime";import{useCallback as o,useMemo as d,useRef as c,useState as s,useLayoutEffect as u}from"react";import{styled as h,Box as v,alpha as g,TableContainer as p,Table as f,TableHead as m,TableRow as b,TableCell as w,Checkbox as S,TableBody as x,Typography as C}from"@mui/material";import{ListDensity as y}from"./view-list.types.js";import{useListSelection as H,LIST_HEADER_HEIGHT as N,LIST_ROW_HEIGHT_BY_DENSITY as k,LIST_CELL_PADDING_BY_DENSITY as T}from"./view-list.units.js";var W=function(e,l){if(void 0!==e.width)return e.width;if(e.flex&&e.flex>0&&l>0){var n=e.flex/l*100;return"".concat(n,"%")}};function z(e,l,n){var t=e.valueGetter?e.valueGetter(l,n):l[e.field],i={value:t,row:l,index:n,field:e.field};if(e.renderCell)return e.renderCell(i);var r=String(null!=t?t:"");return a(C,{variant:"body2",noWrap:!0,title:r,children:r})}var B=function(e,n){return n?Object.keys(n).map(function(e){var t,i=null!==(t=n[e])&&void 0!==t?t:{};return l({field:e},i)}):function(e){if(0===e.length)return[];var l=e[0];return Object.keys(l).map(function(e){return{field:e,label:String(e),flex:1}})}(e)};function L(e){var n=function(e){return function(l){var n,t,i,o,d,c,s=null!==(n=null!==(t=l.density)&&void 0!==t?t:e.density)&&void 0!==n?n:y.standard,u=B(l.value,null!==(i=l.columns)&&void 0!==i?i:e.columns),h=u.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),g=k[s],C=T[s],N=null!==(o=null!==(d=l.selectable)&&void 0!==d?d:e.selectable)&&void 0!==o&&o,L=null!==(c=l.onSelectionChange)&&void 0!==c?c:e.onSelectionChange,I=H(l.value,e.getterId,N,l.selectedIds,L),M=I.selectedIds,j=I.isAllSelected,O=I.isSomeSelected,R=I.handleToggleAll,A=I.handleToggleRow;return a(V,{className:D.root,children:a(p,{className:D.scrollContainer,onScroll:function(e){var n,t=e.currentTarget;t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:r(f,{size:"small",className:D.table,children:[a(m,{className:D.tableHeader,children:r(b,{children:[N&&a(w,{padding:"checkbox",className:D.tableHeaderCell,sx:{width:48},children:a(S,{checked:j,indeterminate:O,onChange:R})}),u.map(function(e){var l,n,t=W(e,h),i=void 0!==e.width;return a(w,{className:D.tableHeaderCell,align:e.align,sx:{width:t,minWidth:i?t:e.minWidth,maxWidth:null!==(l=e.maxWidth)&&void 0!==l?l:t,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:null!==(n=e.label)&&void 0!==n?n:String(e.field)},String(e.field))})]})}),a(x,{children:l.value.map(function(l,n){var t,i=null!==(t=e.getterId(l,n))&&void 0!==t?t:n,o=M.includes(i);return r(b,{hover:!0,sx:{height:g},selected:o,children:[N&&a(w,{padding:"checkbox",className:D.tableBodyCell,sx:{height:g,padding:C},children:a(S,{checked:o,onChange:function(){return A(i)}})}),u.map(function(e){var t,r=W(e,h),o=void 0!==e.width;return a(w,{className:D.tableBodyCell,align:e.align,sx:{height:g,padding:C,width:r,minWidth:o?r:e.minWidth,maxWidth:null!==(t=e.maxWidth)&&void 0!==t?t:r,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:a(v,{className:D.tableCellContent,children:z(e,l,n)})},"".concat(String(i),"-").concat(String(e.field)))})]},i)})})]})})})}}(e),t=function(e){return function(l){var n,t,o,h,g,C,L,I=null!==(n=null!==(t=l.density)&&void 0!==t?t:e.density)&&void 0!==n?n:y.standard,M=B(l.value,l.columns||e.columns),j=M.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),O=k[I],R=T[I],A=null!==(o=null!==(h=l.selectable)&&void 0!==h?h:e.selectable)&&void 0!==o&&o,P=null!==(g=l.onSelectionChange)&&void 0!==g?g:e.onSelectionChange,E=H(l.value,e.getterId,A,l.selectedIds,P),G=E.selectedIds,_=E.isAllSelected,Y=E.isSomeSelected,q=E.handleToggleAll,F=E.handleToggleRow,J=d(function(){return Object.assign({},e.virtualizedConfig,l.virtualizedConfig)},[l.virtualizedConfig]),K=c(null),Q=c(null),U=s(0),X=i(U,2),Z=X[0],$=X[1],ee=s(null!==(C=null==J?void 0:J.scrollTop)&&void 0!==C?C:0),le=i(ee,2),ne=le[0],te=le[1],ie=s(N),ae=i(ie,2),re=ae[0],oe=ae[1],de=Math.max(1,null!==(L=null==J?void 0:J.overscan)&&void 0!==L?L:6);u(function(){if(K.current){var e=function(){var e,l,n=null!==(e=null===(l=K.current)||void 0===l?void 0:l.clientHeight)&&void 0!==e?e:0;$(function(e){return e===n?e:n})};e();var l=new ResizeObserver(function(){e()});return l.observe(K.current),function(){return l.disconnect()}}},[]),u(function(){J&&"number"==typeof J.scrollTop&&te(J.scrollTop)},[null==J?void 0:J.scrollTop]),u(function(){var e,l,n=null!==(e=null===(l=Q.current)||void 0===l?void 0:l.offsetHeight)&&void 0!==e?e:0;n>0&&n!==re&&oe(n)},[M.length,re]);var ce=d(function(){var e,n=l.value.length;if(0===n)return{start:0,end:-1,topSpacerHeight:0,bottomSpacerHeight:0};var t=J&&"number"==typeof J.scrollTop?J.scrollTop:ne,i=Math.max(1,(null!==(e=null==J?void 0:J.viewportHeight)&&void 0!==e?e:Z)-re),a=Math.max(0,t-re),r=Math.max(0,Math.floor(a/O)-de),o=Math.ceil(i/O),d=Math.min(n-1,r+o+2*de);return{start:r,end:d,topSpacerHeight:r*O,bottomSpacerHeight:Math.max(0,(n-d-1)*O)}},[l.value.length,re,de,O,J,ne,Z]),se=ce.end>=ce.start?l.value.slice(ce.start,ce.end+1):[],ue=[D.root,D.virtualized].filter(Boolean).join(" ");return a(V,{className:ue,children:a(p,{ref:K,className:D.scrollContainer,onScroll:function(e){var n,t=e.currentTarget;J&&"number"==typeof J.scrollTop||te(t.scrollTop),t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:r(f,{size:"small",className:D.table,children:[a(m,{className:D.tableHeader,children:r(b,{ref:Q,children:[A&&a(w,{padding:"checkbox",className:D.tableHeaderCell,sx:{width:48},children:a(S,{checked:_,indeterminate:Y,onChange:q})}),M.map(function(e){var l,n,t=W(e,j),i=void 0!==e.width;return a(w,{className:D.tableHeaderCell,align:e.align,sx:{width:t,minWidth:i?t:e.minWidth,maxWidth:null!==(l=e.maxWidth)&&void 0!==l?l:t,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:null!==(n=e.label)&&void 0!==n?n:String(e.field)},String(e.field))})]})}),r(x,{children:[ce.topSpacerHeight>0?a(b,{className:D.tableSpacerRow,children:a(w,{colSpan:M.length+(A?1:0),className:D.tableSpacerCell,sx:{height:ce.topSpacerHeight,padding:0,border:0}})}):null,se.map(function(l,n){var t,i=ce.start+n,o=null!==(t=e.getterId(l,i))&&void 0!==t?t:i,d=G.includes(o);return r(b,{hover:!0,sx:{height:O},selected:d,children:[A&&a(w,{padding:"checkbox",className:D.tableBodyCell,sx:{height:O,padding:R},children:a(S,{checked:d,onChange:function(){return F(o)}})}),M.map(function(e){var n,t=W(e,j),r=void 0!==e.width;return a(w,{className:D.tableBodyCell,align:e.align,sx:{height:O,padding:R,width:t,minWidth:r?t:e.minWidth,maxWidth:null!==(n=e.maxWidth)&&void 0!==n?n:t,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:a(v,{className:D.tableCellContent,children:z(e,l,i)})},"".concat(String(o),"-").concat(String(e.field)))})]},o)}),ce.bottomSpacerHeight>0?a(b,{className:D.tableSpacerRow,children:a(w,{colSpan:M.length+(A?1:0),className:D.tableSpacerCell,sx:{height:ce.bottomSpacerHeight,padding:0,border:0}})}):null]})]})})})}}(e);return function(i){var r,o,d=null!==(r=null!==(o=i.renderStrategy)&&void 0!==o?o:e.renderStrategy)&&void 0!==r?r:"normal";return a("virtualized"===d?t:n,l({},i))}}function I(e){return function(l){var i,r,d,c=o(n(t().m(function e(){var n,i,a,r,o,d,c,s,u;return t().w(function(e){for(;;)switch(e.n){case 0:if("infiniteScroll"===l.loadMode){e.n=1;break}return e.a(2);case 1:if(null!==(n=l.pagination)&&void 0!==n&&n.hasNext){e.n=2;break}return e.a(2);case 2:if(!l.loading){e.n=3;break}return e.a(2);case 3:return c=null!==(i=null===(a=l.pagination)||void 0===a?void 0:a.page)&&void 0!==i?i:0,s=null!==(r=null===(o=l.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==r?r:20,u=c+1,e.n=4,null===(d=l.onPageChange)||void 0===d?void 0:d.call(l,u,s);case 4:return e.a(2)}},e)})),[l.loadMode,null===(i=l.pagination)||void 0===i?void 0:i.hasNext,null===(r=l.pagination)||void 0===r?void 0:r.page,null===(d=l.pagination)||void 0===d?void 0:d.pageSize,l.loading,l.onPageChange]);return a(e,{value:l.value,columns:l.columns,density:l.density,renderStrategy:l.renderStrategy,virtualizedConfig:l.virtualizedConfig,onNearEnd:"infiniteScroll"===l.loadMode?c:void 0,selectable:l.selectable,selectedIds:l.selectedIds,onSelectionChange:l.onSelectionChange})}}var M={root:"DinoViewList-root",virtualized:"DinoViewList-virtualized",scrollContainer:"DinoViewList-scrollContainer",table:"DinoViewList-table",tableHeader:"DinoViewList-tableHeader",tableHeaderCell:"DinoViewList-tableHeaderCell",tableBodyCell:"DinoViewList-tableBodyCell",tableSpacerRow:"DinoViewList-tableSpacerRow",tableSpacerCell:"DinoViewList-tableSpacerCell",tableCellContent:"DinoViewList-tableCellContent"},D=M,V=h(v)(function(l){var n=l.theme,t=n.palette.mode,i=g(n.palette.common.black,"dark"===t?.24:.08),a="dark"===t?n.palette.grey[800]:n.palette.grey[50];return e(e(e(e(e(e(e(e({},"&.".concat(D.root),{position:"relative",width:"100%",height:"100%",overflow:"hidden"}),".".concat(D.scrollContainer),{position:"absolute",inset:0,overflowY:"auto",padding:n.spacing(0,.5),margin:n.spacing(0,-.5),"&::-webkit-scrollbar":{width:8,height:8},"&::-webkit-scrollbar-thumb":{backgroundColor:n.palette.grey[300],borderRadius:4},"&::-webkit-scrollbar-thumb:hover":{backgroundColor:n.palette.grey[500]}}),".".concat(D.table),{tableLayout:"auto",width:"100%",borderCollapse:"separate",borderSpacing:"0 ".concat(n.spacing(.5)),marginTop:n.spacing(-.5)}),".".concat(D.tableHeader),{position:"sticky",top:0,zIndex:2,backgroundColor:a}),".".concat(D.tableHeaderCell),{fontWeight:500,paddingTop:n.spacing(1.5),paddingBottom:n.spacing(1.5),overflow:"hidden",borderBottom:"unset"}),".".concat(D.tableBodyCell),{overflow:"hidden",borderTop:"0.5px dashed ".concat(i),borderBottom:"0.5px dashed ".concat(i),"&:first-of-type":{borderLeft:"0.5px dashed ".concat(i)},"&:last-of-type":{borderRight:"0.5px dashed ".concat(i)}}),".".concat(D.tableCellContent),{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0,width:"100%"}),"&.".concat(D.virtualized),{boxSizing:"border-box"})});export{L as createViewList,I as createViewListLoading,L as default,M as viewListClasses};
|
|
1
|
+
import{defineProperty as e,objectSpread2 as l,asyncToGenerator as n,regenerator as t,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as r}from"react/jsx-runtime";import{useCallback as o,useMemo as d,useRef as c,useState as s,useLayoutEffect as u}from"react";import{styled as h,Box as v,alpha as g,TableContainer as p,Table as f,TableHead as m,TableRow as b,TableCell as w,Checkbox as S,TableBody as x,Typography as C}from"@mui/material";import{ListDensity as y}from"./view-list.types.js";import{useListSelection as H,LIST_HEADER_HEIGHT as N,LIST_ROW_HEIGHT_BY_DENSITY as k,LIST_CELL_PADDING_BY_DENSITY as T}from"./view-list.units.js";var W=function(e,l){if(void 0!==e.width)return e.width;if(e.flex&&e.flex>0&&l>0){var n=e.flex/l*100;return"".concat(n,"%")}};function z(e,l,n){var t=l[e.field],i=e.valueGetter?e.valueGetter(t,l,n):t,r={value:i,row:l,index:n,field:e.field};if(e.renderCell)return e.renderCell(r);var o=String(null!=i?i:"");return a(C,{variant:"body2",noWrap:!0,title:o,children:o})}var B=function(e,n){return n?Object.keys(n).map(function(e){var t,i=null!==(t=n[e])&&void 0!==t?t:{};return l({field:e},i)}):function(e){if(0===e.length)return[];var l=e[0];return Object.keys(l).map(function(e){return{field:e,label:String(e),flex:1}})}(e)};function L(e){var n=function(e){return function(l){var n,t,i,o,d,c,s=null!==(n=null!==(t=l.density)&&void 0!==t?t:e.density)&&void 0!==n?n:y.standard,u=B(l.value,null!==(i=l.columns)&&void 0!==i?i:e.columns),h=u.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),g=k[s],C=T[s],N=null!==(o=null!==(d=l.selectable)&&void 0!==d?d:e.selectable)&&void 0!==o&&o,L=null!==(c=l.onSelectionChange)&&void 0!==c?c:e.onSelectionChange,I=H(l.value,e.getterId,N,l.selectedIds,L),M=I.selectedIds,j=I.isAllSelected,O=I.isSomeSelected,R=I.handleToggleAll,A=I.handleToggleRow;return a(V,{className:D.root,children:a(p,{className:D.scrollContainer,onScroll:function(e){var n,t=e.currentTarget;t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:r(f,{size:"small",className:D.table,children:[a(m,{className:D.tableHeader,children:r(b,{children:[N&&a(w,{padding:"checkbox",className:D.tableHeaderCell,sx:{width:48},children:a(S,{checked:j,indeterminate:O,onChange:R})}),u.map(function(e){var l,n,t=W(e,h),i=void 0!==e.width;return a(w,{className:D.tableHeaderCell,align:e.align,sx:{width:t,minWidth:i?t:e.minWidth,maxWidth:null!==(l=e.maxWidth)&&void 0!==l?l:t,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:null!==(n=e.label)&&void 0!==n?n:String(e.field)},String(e.field))})]})}),a(x,{children:l.value.map(function(l,n){var t,i=null!==(t=e.getterId(l,n))&&void 0!==t?t:n,o=M.includes(i);return r(b,{hover:!0,sx:{height:g},selected:o,children:[N&&a(w,{padding:"checkbox",className:D.tableBodyCell,sx:{height:g,padding:C},children:a(S,{checked:o,onChange:function(){return A(i)}})}),u.map(function(e){var t,r=W(e,h),o=void 0!==e.width;return a(w,{className:D.tableBodyCell,align:e.align,sx:{height:g,padding:C,width:r,minWidth:o?r:e.minWidth,maxWidth:null!==(t=e.maxWidth)&&void 0!==t?t:r,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:a(v,{className:D.tableCellContent,children:z(e,l,n)})},"".concat(String(i),"-").concat(String(e.field)))})]},i)})})]})})})}}(e),t=function(e){return function(l){var n,t,o,h,g,C,L,I=null!==(n=null!==(t=l.density)&&void 0!==t?t:e.density)&&void 0!==n?n:y.standard,M=B(l.value,l.columns||e.columns),j=M.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),O=k[I],R=T[I],A=null!==(o=null!==(h=l.selectable)&&void 0!==h?h:e.selectable)&&void 0!==o&&o,P=null!==(g=l.onSelectionChange)&&void 0!==g?g:e.onSelectionChange,E=H(l.value,e.getterId,A,l.selectedIds,P),G=E.selectedIds,_=E.isAllSelected,Y=E.isSomeSelected,q=E.handleToggleAll,F=E.handleToggleRow,J=d(function(){return Object.assign({},e.virtualizedConfig,l.virtualizedConfig)},[l.virtualizedConfig]),K=c(null),Q=c(null),U=s(0),X=i(U,2),Z=X[0],$=X[1],ee=s(null!==(C=null==J?void 0:J.scrollTop)&&void 0!==C?C:0),le=i(ee,2),ne=le[0],te=le[1],ie=s(N),ae=i(ie,2),re=ae[0],oe=ae[1],de=Math.max(1,null!==(L=null==J?void 0:J.overscan)&&void 0!==L?L:6);u(function(){if(K.current){var e=function(){var e,l,n=null!==(e=null===(l=K.current)||void 0===l?void 0:l.clientHeight)&&void 0!==e?e:0;$(function(e){return e===n?e:n})};e();var l=new ResizeObserver(function(){e()});return l.observe(K.current),function(){return l.disconnect()}}},[]),u(function(){J&&"number"==typeof J.scrollTop&&te(J.scrollTop)},[null==J?void 0:J.scrollTop]),u(function(){var e,l,n=null!==(e=null===(l=Q.current)||void 0===l?void 0:l.offsetHeight)&&void 0!==e?e:0;n>0&&n!==re&&oe(n)},[M.length,re]);var ce=d(function(){var e,n=l.value.length;if(0===n)return{start:0,end:-1,topSpacerHeight:0,bottomSpacerHeight:0};var t=J&&"number"==typeof J.scrollTop?J.scrollTop:ne,i=Math.max(1,(null!==(e=null==J?void 0:J.viewportHeight)&&void 0!==e?e:Z)-re),a=Math.max(0,t-re),r=Math.max(0,Math.floor(a/O)-de),o=Math.ceil(i/O),d=Math.min(n-1,r+o+2*de);return{start:r,end:d,topSpacerHeight:r*O,bottomSpacerHeight:Math.max(0,(n-d-1)*O)}},[l.value.length,re,de,O,J,ne,Z]),se=ce.end>=ce.start?l.value.slice(ce.start,ce.end+1):[],ue=[D.root,D.virtualized].filter(Boolean).join(" ");return a(V,{className:ue,children:a(p,{ref:K,className:D.scrollContainer,onScroll:function(e){var n,t=e.currentTarget;J&&"number"==typeof J.scrollTop||te(t.scrollTop),t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:r(f,{size:"small",className:D.table,children:[a(m,{className:D.tableHeader,children:r(b,{ref:Q,children:[A&&a(w,{padding:"checkbox",className:D.tableHeaderCell,sx:{width:48},children:a(S,{checked:_,indeterminate:Y,onChange:q})}),M.map(function(e){var l,n,t=W(e,j),i=void 0!==e.width;return a(w,{className:D.tableHeaderCell,align:e.align,sx:{width:t,minWidth:i?t:e.minWidth,maxWidth:null!==(l=e.maxWidth)&&void 0!==l?l:t,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:null!==(n=e.label)&&void 0!==n?n:String(e.field)},String(e.field))})]})}),r(x,{children:[ce.topSpacerHeight>0?a(b,{className:D.tableSpacerRow,children:a(w,{colSpan:M.length+(A?1:0),className:D.tableSpacerCell,sx:{height:ce.topSpacerHeight,padding:0,border:0}})}):null,se.map(function(l,n){var t,i=ce.start+n,o=null!==(t=e.getterId(l,i))&&void 0!==t?t:i,d=G.includes(o);return r(b,{hover:!0,sx:{height:O},selected:d,children:[A&&a(w,{padding:"checkbox",className:D.tableBodyCell,sx:{height:O,padding:R},children:a(S,{checked:d,onChange:function(){return F(o)}})}),M.map(function(e){var n,t=W(e,j),r=void 0!==e.width;return a(w,{className:D.tableBodyCell,align:e.align,sx:{height:O,padding:R,width:t,minWidth:r?t:e.minWidth,maxWidth:null!==(n=e.maxWidth)&&void 0!==n?n:t,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:a(v,{className:D.tableCellContent,children:z(e,l,i)})},"".concat(String(o),"-").concat(String(e.field)))})]},o)}),ce.bottomSpacerHeight>0?a(b,{className:D.tableSpacerRow,children:a(w,{colSpan:M.length+(A?1:0),className:D.tableSpacerCell,sx:{height:ce.bottomSpacerHeight,padding:0,border:0}})}):null]})]})})})}}(e);return function(i){var r,o,d=null!==(r=null!==(o=i.renderStrategy)&&void 0!==o?o:e.renderStrategy)&&void 0!==r?r:"normal";return a("virtualized"===d?t:n,l({},i))}}function I(e){return function(l){var i,r,d,c=o(n(t().m(function e(){var n,i,a,r,o,d,c,s,u;return t().w(function(e){for(;;)switch(e.n){case 0:if("infiniteScroll"===l.loadMode){e.n=1;break}return e.a(2);case 1:if(null!==(n=l.pagination)&&void 0!==n&&n.hasNext){e.n=2;break}return e.a(2);case 2:if(!l.loading){e.n=3;break}return e.a(2);case 3:return c=null!==(i=null===(a=l.pagination)||void 0===a?void 0:a.page)&&void 0!==i?i:0,s=null!==(r=null===(o=l.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==r?r:20,u=c+1,e.n=4,null===(d=l.onPageChange)||void 0===d?void 0:d.call(l,u,s);case 4:return e.a(2)}},e)})),[l.loadMode,null===(i=l.pagination)||void 0===i?void 0:i.hasNext,null===(r=l.pagination)||void 0===r?void 0:r.page,null===(d=l.pagination)||void 0===d?void 0:d.pageSize,l.loading,l.onPageChange]);return a(e,{value:l.value,columns:l.columns,density:l.density,renderStrategy:l.renderStrategy,virtualizedConfig:l.virtualizedConfig,onNearEnd:"infiniteScroll"===l.loadMode?c:void 0,selectable:l.selectable,selectedIds:l.selectedIds,onSelectionChange:l.onSelectionChange})}}var M={root:"DinoViewList-root",virtualized:"DinoViewList-virtualized",scrollContainer:"DinoViewList-scrollContainer",table:"DinoViewList-table",tableHeader:"DinoViewList-tableHeader",tableHeaderCell:"DinoViewList-tableHeaderCell",tableBodyCell:"DinoViewList-tableBodyCell",tableSpacerRow:"DinoViewList-tableSpacerRow",tableSpacerCell:"DinoViewList-tableSpacerCell",tableCellContent:"DinoViewList-tableCellContent"},D=M,V=h(v)(function(l){var n=l.theme,t=n.palette.mode,i=g(n.palette.common.black,"dark"===t?.24:.08),a="dark"===t?n.palette.grey[800]:n.palette.grey[50];return e(e(e(e(e(e(e(e({},"&.".concat(D.root),{position:"relative",width:"100%",height:"100%",overflow:"hidden"}),".".concat(D.scrollContainer),{position:"absolute",inset:0,overflowY:"auto",padding:n.spacing(0,.5),margin:n.spacing(0,-.5),"&::-webkit-scrollbar":{width:8,height:8},"&::-webkit-scrollbar-thumb":{backgroundColor:n.palette.grey[300],borderRadius:4},"&::-webkit-scrollbar-thumb:hover":{backgroundColor:n.palette.grey[500]}}),".".concat(D.table),{tableLayout:"auto",width:"100%",borderCollapse:"separate",borderSpacing:"0 ".concat(n.spacing(.5)),marginTop:n.spacing(-.5)}),".".concat(D.tableHeader),{position:"sticky",top:0,zIndex:2,backgroundColor:a}),".".concat(D.tableHeaderCell),{fontWeight:500,paddingTop:n.spacing(1.5),paddingBottom:n.spacing(1.5),overflow:"hidden",borderBottom:"unset"}),".".concat(D.tableBodyCell),{overflow:"hidden",borderTop:"0.5px dashed ".concat(i),borderBottom:"0.5px dashed ".concat(i),"&:first-of-type":{borderLeft:"0.5px dashed ".concat(i)},"&:last-of-type":{borderRight:"0.5px dashed ".concat(i)}}),".".concat(D.tableCellContent),{overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap",minWidth:0,width:"100%"}),"&.".concat(D.virtualized),{boxSizing:"border-box"})});export{L as createViewList,I as createViewListLoading,L as default,M as viewListClasses};
|
|
2
2
|
//# sourceMappingURL=view-list.js.map
|