dinocollab-core 2.2.18 → 2.2.20
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/src/api-context/alert-global.js +1 -1
- package/dist/src/api-context/alert-global.js.map +1 -1
- package/dist/src/data-surface/ui.units.js +1 -1
- package/dist/src/data-surface/ui.units.js.map +1 -1
- package/dist/src/data-surface/view-grid/helpers.js.map +1 -1
- package/dist/src/data-surface/view-list/helpers.js +1 -1
- package/dist/src/data-surface/view-list/helpers.js.map +1 -1
- package/dist/src/data-surface/view-list/hooks.js +1 -1
- package/dist/src/data-surface/view-list/hooks.js.map +1 -1
- package/dist/src/data-surface/view-list/index.js +1 -1
- package/dist/src/data-surface/view-list/index.js.map +1 -1
- package/dist/src/data-surface/view-list/types.js.map +1 -1
- package/dist/types/data-surface/view-grid/types.d.ts +1 -0
- package/dist/types/data-surface/view-list/helpers.d.ts +4 -0
- package/dist/types/data-surface/view-list/hooks.d.ts +1 -0
- package/dist/types/data-surface/view-list/types.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{slicedToArray as e,toConsumableArray as t,objectSpread2 as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import a,{useState as o,useCallback as l,useEffect as u}from"react";import{styled as s,Box as d,Stack as c,Dialog as
|
|
1
|
+
import{slicedToArray as e,toConsumableArray as t,objectSpread2 as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import a,{useState as o,useCallback as l,useEffect as u}from"react";import{styled as s,Box as d,Stack as c,Dialog as p,DialogTitle as f,DialogContent as h,DialogContentText as g,DialogActions as m,Button as x}from"@mui/material";import v from"@mui/material/Alert";var C=a.forwardRef(function(e,t){return n(v,i(i({elevation:6,ref:t,variant:"standard"},e),{},{style:{minWidth:"300px"}}))}),y={};function A(){var r,a,s=o([]),d=e(s,2),p=d[0],f=d[1],h=l(function(e){f(function(i){return[].concat(t(i),[e])})},[]),g=l(function(e){var i=p.findIndex(function(t){return t.id===e.id});p.splice(i,1),f(t(p))},[p]);return u(function(){y.ApiAlert=i(i({},y.ApiAlert?y.ApiAlert:{}),{},{PushMessage:h,PushError:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"error",duration:(null==t?void 0:t.duration)||15e3})},PushInfo:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"info",duration:(null==t?void 0:t.duration)||6e3})},PushWarning:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"warning",duration:(null==t?void 0:t.duration)||6e3})},PushSuccess:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"success",duration:(null==t?void 0:t.duration)||3e3})}})},[h]),n(b,{children:n(c,{spacing:2,sx:{maxWidth:"300px"},children:(r=p,a=g,r.map(function(e,t){return n(P,{data:e,IsOpen:!0,handleClose:a,autoDurationHide:e.duration},e.id+t)}))})})}var P=function(e){var t=l(function(){return e.handleClose(e.data)},[e]);return u(function(){var t=null;return e.autoDurationHide&&(t=setTimeout(function(){e.handleClose(e.data)},e.autoDurationHide)),function(){clearTimeout(t)}},[e]),n(C,{sx:{whiteSpace:"pre-line"},onClose:t,severity:e.data.type,children:e.data.text})},b=s(d)({position:"fixed",top:"calc(var(--height-header) + 20px)",right:"50px",zIndex:2e3,display:"flex",justifyContent:"flex-start",alignItems:"center"}),S=function(t){var i=a.useState(t.IsOpen),o=e(i,2),l=o[0],u=o[1];a.useEffect(function(){u(t.IsOpen)},[t.IsOpen]);var s=a.useCallback(function(){u(!1),t.onClose&&t.onClose()},[t]);return n("div",{children:r(p,{open:l,onClose:s,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",children:[n(f,{id:"alert-dialog-title",children:t.Title}),n(h,{children:n(g,{id:"alert-dialog-description",sx:{whiteSpace:"pre-line"},children:t.Message})}),r(m,{children:[n(x,{onClick:t.onAccept,autoFocus:!0,color:"info",children:"Ok"}),n(x,{onClick:s,color:"error",children:"Cancel"})]})]})})};globalThis.ApiAlertContext=y;export{S as AlertDialog,y as ApiAlertContext,A as default};
|
|
2
2
|
//# sourceMappingURL=alert-global.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-global.js","sources":["../../../src/api-context/alert-global.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Box, Stack, styled, Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@mui/material'\r\nimport MuiAlert, { AlertProps, AlertColor } from '@mui/material/Alert'\r\n\r\nconst Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(props, ref) {\r\n return <MuiAlert elevation={6} ref={ref} variant='standard' {...props} style={{ minWidth: '300px' }} />\r\n})\r\n\r\ninterface MessageData {\r\n id: string\r\n text: string\r\n type: AlertColor\r\n duration?: number\r\n}\r\n\r\ninterface IOptions {\r\n duration?: number\r\n}\r\n\r\ninterface IApiAlert {\r\n PushMessage: (data: MessageData) => void\r\n PushInfo: (data: string) => void\r\n PushError: (data: string) => void\r\n PushWarning: (data: string) => void\r\n PushSuccess: (data: string) => void\r\n}\r\n\r\nexport interface IApiContext {\r\n ApiAlert?: IApiAlert\r\n}\r\n\r\nexport const ApiAlertContext: IApiContext = {}\r\n\r\nconst RenderArea = (messages: MessageData[], onClose: (data: MessageData) => void) => {\r\n return messages.map((x, i) => {\r\n return <Message key={x.id + i} data={x} IsOpen={true} handleClose={onClose} autoDurationHide={x.duration} />\r\n })\r\n}\r\n\r\nfunction AlertGlobal() {\r\n const [Messages, setMessages] = useState<MessageData[]>([])\r\n const _PushMessage = useCallback((data: MessageData) => {\r\n setMessages((st) => [...st, data])\r\n }, [])\r\n const _HandleClose = useCallback(\r\n (data: MessageData) => {\r\n const index = Messages.findIndex((x) => x.id === data.id)\r\n Messages.splice(index, 1)\r\n setMessages([...Messages])\r\n },\r\n [Messages]\r\n )\r\n\r\n useEffect(() => {\r\n ApiAlertContext.ApiAlert = {\r\n ...(ApiAlertContext.ApiAlert ? ApiAlertContext.ApiAlert : {}),\r\n PushMessage: _PushMessage,\r\n PushError: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'error',\r\n duration: options?.duration || 15000\r\n })\r\n },\r\n PushInfo: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'info',\r\n duration: options?.duration || 6000\r\n })\r\n },\r\n PushWarning: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'warning',\r\n duration: options?.duration || 6000\r\n })\r\n },\r\n PushSuccess: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'success',\r\n duration: options?.duration || 3000\r\n })\r\n }\r\n }\r\n }, [_PushMessage])\r\n\r\n return (\r\n <Wrap>\r\n <Stack spacing={2} sx={{ maxWidth: '300px' }}>\r\n {RenderArea(Messages, _HandleClose)}\r\n </Stack>\r\n </Wrap>\r\n )\r\n}\r\nexport default AlertGlobal\r\n\r\ninterface MessageProps {\r\n IsOpen: boolean\r\n handleClose: (data: MessageData) => void\r\n data: MessageData\r\n autoDurationHide?: number\r\n}\r\nconst Message: FC<MessageProps> = (props) => {\r\n const _handleClose = useCallback(() => props.handleClose(props.data), [props])\r\n\r\n useEffect(() => {\r\n let Timer: any = null\r\n if (props.autoDurationHide) {\r\n Timer = setTimeout(() => {\r\n props.handleClose(props.data)\r\n }, props.autoDurationHide)\r\n }\r\n return () => {\r\n clearTimeout(Timer as any)\r\n }\r\n }, [props])\r\n return (\r\n <Alert sx={{ whiteSpace: 'pre-line' }} onClose={_handleClose} severity={props.data.type}>\r\n {props.data.text}\r\n </Alert>\r\n )\r\n}\r\n\r\nconst Wrap = styled(Box)({\r\n position: 'fixed',\r\n top: 'calc(var(--height-header) + 20px)',\r\n right: '50px',\r\n zIndex: 2000,\r\n display: 'flex',\r\n justifyContent: 'flex-start',\r\n alignItems: 'center'\r\n})\r\n\r\ninterface AlertDialogProps {\r\n IsOpen: boolean\r\n onClose?: () => void\r\n onAccept?: () => void\r\n Title: string\r\n Message: string\r\n}\r\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\r\n const [Open, setOpen] = React.useState(props.IsOpen)\r\n React.useEffect(() => {\r\n setOpen(props.IsOpen)\r\n }, [props.IsOpen])\r\n const _handleClose = React.useCallback(() => {\r\n setOpen(false)\r\n props.onClose && props.onClose()\r\n }, [props])\r\n return (\r\n <div>\r\n <Dialog open={Open} onClose={_handleClose} aria-labelledby='alert-dialog-title' aria-describedby='alert-dialog-description'>\r\n <DialogTitle id='alert-dialog-title'>{props.Title}</DialogTitle>\r\n <DialogContent>\r\n <DialogContentText id='alert-dialog-description' sx={{ whiteSpace: 'pre-line' }}>\r\n {props.Message}\r\n </DialogContentText>\r\n </DialogContent>\r\n <DialogActions>\r\n <Button onClick={props.onAccept} autoFocus color='info'>\r\n Ok\r\n </Button>\r\n <Button onClick={_handleClose} color='error'>\r\n Cancel\r\n </Button>\r\n </DialogActions>\r\n </Dialog>\r\n </div>\r\n )\r\n}\r\n"],"names":["Alert","React","forwardRef","props","ref","_jsx","MuiAlert","_objectSpread","elevation","variant","style","minWidth","ApiAlertContext","AlertGlobal","messages","onClose","_useState","useState","_useState2","_slicedToArray","Messages","setMessages","_PushMessage","useCallback","data","st","concat","_toConsumableArray","_HandleClose","index","findIndex","x","id","splice","useEffect","ApiAlert","PushMessage","PushError","options","this","Date","getTime","toString","text","type","duration","PushInfo","PushWarning","PushSuccess","Wrap","children","Stack","spacing","sx","maxWidth","map","i","Message","IsOpen","handleClose","autoDurationHide","_handleClose","Timer","setTimeout","clearTimeout","whiteSpace","severity","styled","Box","position","top","right","zIndex","display","justifyContent","alignItems","AlertDialog","_React$useState","_React$useState2","Open","setOpen","_jsxs","Dialog","open","DialogTitle","Title","DialogContent","DialogContentText","DialogActions","Button","onClick","onAccept","autoFocus","color"],"mappings":"gbAIA,IAAMA,EAAQC,EAAMC,WAAuC,SAAeC,EAAOC,GAC/E,OAAOC,EAACC,EAAQC,EAAAA,EAAA,CAACC,UAAW,EAAGJ,IAAKA,EAAKK,QAAQ,YAAeN,GAAK,GAAA,CAAEO,MAAO,CAAEC,SAAU,WAC5F,GAyBaC,EAA+B,CAAA,EAQ5C,SAASC,IACP,IAPkBC,EAAyBC,EAO3CC,EAAgCC,EAAwB,IAAGC,EAAAC,EAAAH,EAAA,GAApDI,EAAQF,EAAA,GAAEG,EAAWH,EAAA,GACtBI,EAAeC,EAAY,SAACC,GAChCH,EAAY,SAACI,GAAE,MAAA,GAAAC,OAAAC,EAASF,IAAID,GAAI,EACjC,EAAE,IACGI,EAAeL,EACnB,SAACC,GACC,IAAMK,EAAQT,EAASU,UAAU,SAACC,GAAC,OAAKA,EAAEC,KAAOR,EAAKQ,KACtDZ,EAASa,OAAOJ,EAAO,GACvBR,EAAWM,EAAKP,GAClB,EACA,CAACA,IA0CH,OAvCAc,EAAU,WACRtB,EAAgBuB,SAAQ5B,EAAAA,EAClBK,CAAAA,EAAAA,EAAgBuB,SAAWvB,EAAgBuB,SAAW,CAAE,GAAA,CAAA,EAAA,CAC5DC,YAAad,EACbe,UAAW,SAAUb,EAAcc,GACjCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,QACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,MAElC,EACDC,SAAU,SAAUtB,EAAcc,GAChCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,OACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,KAElC,EACDE,YAAa,SAAUvB,EAAcc,GACnCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,UACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,KAElC,EACDG,YAAa,SAAUxB,EAAcc,GACnCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,UACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,KAEnC,GAEJ,EAAG,CAACvB,IAGFjB,EAAC4C,EAAI,CAAAC,SACH7C,EAAC8C,EAAM,CAAAC,QAAS,EAAGC,GAAI,CAAEC,SAAU,SAChCJ,UA9DWpC,EA8DAM,EA9DyBL,EA8Dfa,EA7DrBd,EAASyC,IAAI,SAACxB,EAAGyB,GACtB,OAAOnD,EAACoD,EAAO,CAAgBjC,KAAMO,EAAG2B,QAAQ,EAAMC,YAAa5C,EAAS6C,iBAAkB7B,EAAEc,UAA3Ed,EAAEC,GAAKwB,EAC9B,OA+DF,CASA,IAAMC,EAA4B,SAACtD,GACjC,IAAM0D,EAAetC,EAAY,WAAA,OAAMpB,EAAMwD,YAAYxD,EAAMqB,OAAO,CAACrB,IAavE,OAXA+B,EAAU,WACR,IAAI4B,EAAa,KAMjB,OALI3D,EAAMyD,mBACRE,EAAQC,WAAW,WACjB5D,EAAMwD,YAAYxD,EAAMqB,KAC1B,EAAGrB,EAAMyD,mBAEJ,WACLI,aAAaF,EACd,CACH,EAAG,CAAC3D,IAEFE,EAACL,EAAK,CAACqD,GAAI,CAAEY,WAAY,YAAclD,QAAS8C,EAAcK,SAAU/D,EAAMqB,KAAKoB,KAAIM,SACpF/C,EAAMqB,KAAKmB,MAGlB,EAEMM,EAAOkB,EAAOC,EAAPD,CAAY,CACvBE,SAAU,QACVC,IAAK,oCACLC,MAAO,OACPC,OAAQ,IACRC,QAAS,OACTC,eAAgB,aAChBC,WAAY,WAUDC,EAA0C,SAACzE,GACtD,IAAA0E,EAAwB5E,EAAMgB,SAASd,EAAMuD,QAAOoB,EAAA3D,EAAA0D,EAAA,GAA7CE,EAAID,EAAA,GAAEE,EAAOF,EAAA,GACpB7E,EAAMiC,UAAU,WACd8C,EAAQ7E,EAAMuD,OAChB,EAAG,CAACvD,EAAMuD,SACV,IAAMG,EAAe5D,EAAMsB,YAAY,WACrCyD,GAAQ,GACR7E,EAAMY,SAAWZ,EAAMY,SACzB,EAAG,CAACZ,IACJ,OACEE,EACE,MAAA,CAAA6C,SAAA+B,EAACC,EAAO,CAAAC,KAAMJ,EAAMhE,QAAS8C,EAA8B,kBAAA,wCAAsC,2BAA0BX,SAAA,CACzH7C,EAAC+E,EAAW,CAACpD,GAAG,qBAAsBkB,SAAA/C,EAAMkF,QAC5ChF,EAACiF,YACCjF,EAACkF,GAAkBvD,GAAG,2BAA2BqB,GAAI,CAAEY,WAAY,YAChEf,SAAA/C,EAAMsD,YAGXwB,EAACO,EACC,CAAAtC,SAAA,CAAA7C,EAACoF,EAAO,CAAAC,QAASvF,EAAMwF,SAAUC,WAAU,EAAAC,MAAM,OAAM3C,SAAA,OAGvD7C,EAACoF,GAAOC,QAAS7B,EAAcgC,MAAM,QAAO3C,SAAA,kBAOtD"}
|
|
1
|
+
{"version":3,"file":"alert-global.js","sources":["../../../src/api-context/alert-global.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Box, Stack, styled, Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@mui/material'\r\nimport MuiAlert, { AlertProps, AlertColor } from '@mui/material/Alert'\r\n\r\nconst Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(props, ref) {\r\n return <MuiAlert elevation={6} ref={ref} variant='standard' {...props} style={{ minWidth: '300px' }} />\r\n})\r\n\r\ninterface MessageData {\r\n id: string\r\n text: string\r\n type: AlertColor\r\n duration?: number\r\n}\r\n\r\ninterface IOptions {\r\n duration?: number\r\n}\r\n\r\ninterface IApiAlert {\r\n PushMessage: (data: MessageData) => void\r\n PushInfo: (data: string) => void\r\n PushError: (data: string) => void\r\n PushWarning: (data: string) => void\r\n PushSuccess: (data: string) => void\r\n}\r\n\r\nexport interface IApiContext {\r\n ApiAlert?: IApiAlert\r\n}\r\n\r\nexport const ApiAlertContext: IApiContext = {}\r\n\r\nconst RenderArea = (messages: MessageData[], onClose: (data: MessageData) => void) => {\r\n return messages.map((x, i) => {\r\n return <Message key={x.id + i} data={x} IsOpen={true} handleClose={onClose} autoDurationHide={x.duration} />\r\n })\r\n}\r\n\r\nfunction AlertGlobal() {\r\n const [Messages, setMessages] = useState<MessageData[]>([])\r\n const _PushMessage = useCallback((data: MessageData) => {\r\n setMessages((st) => [...st, data])\r\n }, [])\r\n const _HandleClose = useCallback(\r\n (data: MessageData) => {\r\n const index = Messages.findIndex((x) => x.id === data.id)\r\n Messages.splice(index, 1)\r\n setMessages([...Messages])\r\n },\r\n [Messages]\r\n )\r\n\r\n useEffect(() => {\r\n ApiAlertContext.ApiAlert = {\r\n ...(ApiAlertContext.ApiAlert ? ApiAlertContext.ApiAlert : {}),\r\n PushMessage: _PushMessage,\r\n PushError: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'error',\r\n duration: options?.duration || 15000\r\n })\r\n },\r\n PushInfo: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'info',\r\n duration: options?.duration || 6000\r\n })\r\n },\r\n PushWarning: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'warning',\r\n duration: options?.duration || 6000\r\n })\r\n },\r\n PushSuccess: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'success',\r\n duration: options?.duration || 3000\r\n })\r\n }\r\n }\r\n }, [_PushMessage])\r\n\r\n return (\r\n <Wrap>\r\n <Stack spacing={2} sx={{ maxWidth: '300px' }}>\r\n {RenderArea(Messages, _HandleClose)}\r\n </Stack>\r\n </Wrap>\r\n )\r\n}\r\nexport default AlertGlobal\r\n\r\ninterface MessageProps {\r\n IsOpen: boolean\r\n handleClose: (data: MessageData) => void\r\n data: MessageData\r\n autoDurationHide?: number\r\n}\r\nconst Message: FC<MessageProps> = (props) => {\r\n const _handleClose = useCallback(() => props.handleClose(props.data), [props])\r\n\r\n useEffect(() => {\r\n let Timer: any = null\r\n if (props.autoDurationHide) {\r\n Timer = setTimeout(() => {\r\n props.handleClose(props.data)\r\n }, props.autoDurationHide)\r\n }\r\n return () => {\r\n clearTimeout(Timer as any)\r\n }\r\n }, [props])\r\n return (\r\n <Alert sx={{ whiteSpace: 'pre-line' }} onClose={_handleClose} severity={props.data.type}>\r\n {props.data.text}\r\n </Alert>\r\n )\r\n}\r\n\r\nconst Wrap = styled(Box)({\r\n position: 'fixed',\r\n top: 'calc(var(--height-header) + 20px)',\r\n right: '50px',\r\n zIndex: 2000,\r\n display: 'flex',\r\n justifyContent: 'flex-start',\r\n alignItems: 'center'\r\n})\r\n\r\ninterface AlertDialogProps {\r\n IsOpen: boolean\r\n onClose?: () => void\r\n onAccept?: () => void\r\n Title: string\r\n Message: string\r\n}\r\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\r\n const [Open, setOpen] = React.useState(props.IsOpen)\r\n React.useEffect(() => {\r\n setOpen(props.IsOpen)\r\n }, [props.IsOpen])\r\n const _handleClose = React.useCallback(() => {\r\n setOpen(false)\r\n props.onClose && props.onClose()\r\n }, [props])\r\n return (\r\n <div>\r\n <Dialog open={Open} onClose={_handleClose} aria-labelledby='alert-dialog-title' aria-describedby='alert-dialog-description'>\r\n <DialogTitle id='alert-dialog-title'>{props.Title}</DialogTitle>\r\n <DialogContent>\r\n <DialogContentText id='alert-dialog-description' sx={{ whiteSpace: 'pre-line' }}>\r\n {props.Message}\r\n </DialogContentText>\r\n </DialogContent>\r\n <DialogActions>\r\n <Button onClick={props.onAccept} autoFocus color='info'>\r\n Ok\r\n </Button>\r\n <Button onClick={_handleClose} color='error'>\r\n Cancel\r\n </Button>\r\n </DialogActions>\r\n </Dialog>\r\n </div>\r\n )\r\n}\r\n\r\n(globalThis as any).ApiAlertContext = ApiAlertContext"],"names":["Alert","React","forwardRef","props","ref","_jsx","MuiAlert","_objectSpread","elevation","variant","style","minWidth","ApiAlertContext","AlertGlobal","messages","onClose","_useState","useState","_useState2","_slicedToArray","Messages","setMessages","_PushMessage","useCallback","data","st","concat","_toConsumableArray","_HandleClose","index","findIndex","x","id","splice","useEffect","ApiAlert","PushMessage","PushError","options","this","Date","getTime","toString","text","type","duration","PushInfo","PushWarning","PushSuccess","Wrap","children","Stack","spacing","sx","maxWidth","map","i","Message","IsOpen","handleClose","autoDurationHide","_handleClose","Timer","setTimeout","clearTimeout","whiteSpace","severity","styled","Box","position","top","right","zIndex","display","justifyContent","alignItems","AlertDialog","_React$useState","_React$useState2","Open","setOpen","_jsxs","Dialog","open","DialogTitle","Title","DialogContent","DialogContentText","DialogActions","Button","onClick","onAccept","autoFocus","color","globalThis"],"mappings":"gbAIA,IAAMA,EAAQC,EAAMC,WAAuC,SAAeC,EAAOC,GAC/E,OAAOC,EAACC,EAAQC,EAAAA,EAAA,CAACC,UAAW,EAAGJ,IAAKA,EAAKK,QAAQ,YAAeN,GAAK,GAAA,CAAEO,MAAO,CAAEC,SAAU,WAC5F,GAyBaC,EAA+B,CAAA,EAQ5C,SAASC,IACP,IAPkBC,EAAyBC,EAO3CC,EAAgCC,EAAwB,IAAGC,EAAAC,EAAAH,EAAA,GAApDI,EAAQF,EAAA,GAAEG,EAAWH,EAAA,GACtBI,EAAeC,EAAY,SAACC,GAChCH,EAAY,SAACI,GAAE,MAAA,GAAAC,OAAAC,EAASF,IAAID,GAAI,EACjC,EAAE,IACGI,EAAeL,EACnB,SAACC,GACC,IAAMK,EAAQT,EAASU,UAAU,SAACC,GAAC,OAAKA,EAAEC,KAAOR,EAAKQ,KACtDZ,EAASa,OAAOJ,EAAO,GACvBR,EAAWM,EAAKP,GAClB,EACA,CAACA,IA0CH,OAvCAc,EAAU,WACRtB,EAAgBuB,SAAQ5B,EAAAA,EAClBK,CAAAA,EAAAA,EAAgBuB,SAAWvB,EAAgBuB,SAAW,CAAE,GAAA,CAAA,EAAA,CAC5DC,YAAad,EACbe,UAAW,SAAUb,EAAcc,GACjCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,QACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,MAElC,EACDC,SAAU,SAAUtB,EAAcc,GAChCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,OACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,KAElC,EACDE,YAAa,SAAUvB,EAAcc,GACnCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,UACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,KAElC,EACDG,YAAa,SAAUxB,EAAcc,GACnCC,KAAKH,YAAY,CACfJ,IAAI,IAAIQ,MAAOC,UAAUC,WACzBC,KAAMnB,EACNoB,KAAM,UACNC,UAAUP,aAAAA,EAAAA,EAASO,WAAY,KAEnC,GAEJ,EAAG,CAACvB,IAGFjB,EAAC4C,EAAI,CAAAC,SACH7C,EAAC8C,EAAM,CAAAC,QAAS,EAAGC,GAAI,CAAEC,SAAU,SAChCJ,UA9DWpC,EA8DAM,EA9DyBL,EA8Dfa,EA7DrBd,EAASyC,IAAI,SAACxB,EAAGyB,GACtB,OAAOnD,EAACoD,EAAO,CAAgBjC,KAAMO,EAAG2B,QAAQ,EAAMC,YAAa5C,EAAS6C,iBAAkB7B,EAAEc,UAA3Ed,EAAEC,GAAKwB,EAC9B,OA+DF,CASA,IAAMC,EAA4B,SAACtD,GACjC,IAAM0D,EAAetC,EAAY,WAAA,OAAMpB,EAAMwD,YAAYxD,EAAMqB,OAAO,CAACrB,IAavE,OAXA+B,EAAU,WACR,IAAI4B,EAAa,KAMjB,OALI3D,EAAMyD,mBACRE,EAAQC,WAAW,WACjB5D,EAAMwD,YAAYxD,EAAMqB,KAC1B,EAAGrB,EAAMyD,mBAEJ,WACLI,aAAaF,EACd,CACH,EAAG,CAAC3D,IAEFE,EAACL,EAAK,CAACqD,GAAI,CAAEY,WAAY,YAAclD,QAAS8C,EAAcK,SAAU/D,EAAMqB,KAAKoB,KAAIM,SACpF/C,EAAMqB,KAAKmB,MAGlB,EAEMM,EAAOkB,EAAOC,EAAPD,CAAY,CACvBE,SAAU,QACVC,IAAK,oCACLC,MAAO,OACPC,OAAQ,IACRC,QAAS,OACTC,eAAgB,aAChBC,WAAY,WAUDC,EAA0C,SAACzE,GACtD,IAAA0E,EAAwB5E,EAAMgB,SAASd,EAAMuD,QAAOoB,EAAA3D,EAAA0D,EAAA,GAA7CE,EAAID,EAAA,GAAEE,EAAOF,EAAA,GACpB7E,EAAMiC,UAAU,WACd8C,EAAQ7E,EAAMuD,OAChB,EAAG,CAACvD,EAAMuD,SACV,IAAMG,EAAe5D,EAAMsB,YAAY,WACrCyD,GAAQ,GACR7E,EAAMY,SAAWZ,EAAMY,SACzB,EAAG,CAACZ,IACJ,OACEE,EACE,MAAA,CAAA6C,SAAA+B,EAACC,EAAO,CAAAC,KAAMJ,EAAMhE,QAAS8C,EAA8B,kBAAA,wCAAsC,2BAA0BX,SAAA,CACzH7C,EAAC+E,EAAW,CAACpD,GAAG,qBAAsBkB,SAAA/C,EAAMkF,QAC5ChF,EAACiF,YACCjF,EAACkF,GAAkBvD,GAAG,2BAA2BqB,GAAI,CAAEY,WAAY,YAChEf,SAAA/C,EAAMsD,YAGXwB,EAACO,EACC,CAAAtC,SAAA,CAAA7C,EAACoF,EAAO,CAAAC,QAASvF,EAAMwF,SAAUC,WAAU,EAAAC,MAAM,OAAM3C,SAAA,OAGvD7C,EAACoF,GAAOC,QAAS7B,EAAcgC,MAAM,QAAO3C,SAAA,kBAOtD,EAEC4C,WAAmBlF,gBAAkBA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectSpread2 as e,objectWithoutProperties as
|
|
1
|
+
import{objectSpread2 as e,defineProperty as r,objectWithoutProperties as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as o}from"react/jsx-runtime";import{colors as i,styled as a,Box as l,alpha as c,typographyClasses as d,Typography as u,Pagination as s,CircularProgress as g,Stack as p}from"@mui/material";var h=["viewMode"],b={padding:"8px",height:"100%",minHeight:180,width:"100%","& > .inner":{width:"100%",height:"100%",padding:"24px 16px",border:"1px dashed ".concat(i.grey[400]),borderRadius:6,display:"flex",alignItems:"center",justifyContent:"center",textAlign:"center"}},m=function(r){r.viewMode;var i=n(r,h);return o(x,e(e({},i),{},{children:t("div",{className:"inner",children:[o(g,{size:24}),o(u,{variant:"body2",color:"primary",children:"Loading..."})]})}))},x=a(l)(e(e({},b),{},{"& > div":{gap:8,borderColor:i.blue[400],backgroundColor:c(i.blue[50],.12)}}));a(l)(e(e({},b),{},{"& > div":{borderColor:i.red[400],backgroundColor:i.red[50],color:i.red[900],flexDirection:"column"}}));var v=function(){return o(f,{children:t("div",{className:"inner",children:[o(u,{variant:"h6",gutterBottom:!0,children:"No data available"}),o(u,{variant:"body2",children:"Try changing the filter or search keyword"})]})})},f=a(l)(e(e({},b),{},{"& > div":{borderColor:i.grey[400],backgroundColor:i.grey[50],color:i.grey[700],flexDirection:"column"}}));a(l)(e(e({},b),{},{"& > div":{borderColor:i.blue[400],backgroundColor:i.blue[50],color:i.blue[900],flexDirection:"column"}})),a(l)(e(e({},b),{},{"& > div":{borderColor:i.red[700],backgroundColor:i.red[50],color:i.red[900],flexDirection:"column"}}));var y=function(){return o(C,{children:o("div",{children:o(g,{size:28,thickness:4})})})},C=a(l)(function(e){return{position:"absolute",inset:0,backgroundColor:"dark"===e.theme.palette.mode?"rgba(0,0,0,0.24)":"rgba(255,255,255,0.24)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:10,backdropFilter:"blur(1.5px)",transition:"opacity 0.2s","& > div":{display:"flex",alignItems:"center",gap:10}}}),k=function(e){var r,n=e.slots,i=e.loading,a=e.hasNext,l=e.currentCount,c=e.total,d=function(e){return"string"!=typeof e?e:o(u,{variant:"caption",color:"text.secondary",children:e})},s=function(e,r){var n="Loading more...",i="Scroll for more",a="No more items";return e?{currentNode:t(p,{flexDirection:"row",alignItems:"center",gap:1,children:[o(g,{color:"primary",size:12,thickness:3}),o(u,{variant:"caption",color:"primary.main",children:n})]}),rawText:n}:r?{currentNode:i,rawText:i}:{currentNode:a,rawText:a}}(i,a),h=s.currentNode;"function"==typeof(null==n?void 0:n.statusText)?h=n.statusText(d(s.currentNode),s.rawText):null!=n&&n.statusText&&(h=n.statusText);var b=l>0?null!=c?"1–".concat(l," of ").concat(c):"1–".concat(l):"—",m="function"==typeof(null==n?void 0:n.rangeText)?n.rangeText(b,b):null!==(r=null==n?void 0:n.rangeText)&&void 0!==r?r:b;return o(w,{children:t("div",{children:[d(h),d(m)]})})},w=a(l)(function(e){var n=e.theme;return r({"& > div":{display:"flex",alignItems:"center",justifyContent:"space-between",padding:n.spacing(1,1.5),backgroundColor:c(n.palette.grey[500],.08),borderTop:"1px solid ".concat(c(n.palette.common.black,.08))}},".".concat(d.root),{lineHeight:1,fontWeight:500})}),T=function(e){var r=e.page,n=e.pageSize,i=e.total,a=e.hasNext,l=e.loading,c=e.onPrevPage,d=e.onNextPage,g=e.onPageJump,p=r*n+1,h=null!=i?Math.min(p+n-1,i):p+n-1,b=null!=i?Math.ceil(i/n):void 0;return t(N,{children:[o(u,{variant:"caption",color:"text.secondary",children:null!=i?"".concat(p,"–").concat(h," / ").concat(i):"Page ".concat(r+1)}),o(s,{count:b,page:r+1,onChange:function(e,n){var t=n-1;g?g(t):t<r?null==c||c():t>r&&(null==d||d())},disabled:l,size:"small",showFirstButton:null!=b&&b>5,showLastButton:null!=b&&b>5,siblingCount:0,boundaryCount:1,hidePrevButton:null==b&&!a,hideNextButton:null==b&&!a})]})},N=a(l)(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{k as PanelInfiniteScrollFooter,y as PanelLoadMore,m as PanelLoading,v as PanelNoData,T as PanelPaginationFooter};
|
|
2
2
|
//# sourceMappingURL=ui.units.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ui.units.js","sources":["../../../src/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 { DataSurfaceViewMode, 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 & { viewMode: DataSurfaceViewMode }> = (props) => {\r\n const { viewMode, ...rest } = props\r\n return (\r\n <PanelLoadingStyled {...rest}>\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\n\r\nconst PanelLoadingStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n gap: 8,\r\n borderColor: colors.blue[400],\r\n backgroundColor: colors.blue[50]\r\n }\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","viewMode","rest","_objectWithoutProperties","_excluded","_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
|
+
{"version":3,"file":"ui.units.js","sources":["../../../src/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, typographyClasses } from '@mui/material'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { BoxProps } from '@mui/material'\r\nimport { DataSurfaceViewMode, 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 & { viewMode: DataSurfaceViewMode }> = (props) => {\r\n const { viewMode, ...rest } = props\r\n return (\r\n <PanelLoadingStyled {...rest}>\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\n\r\nconst PanelLoadingStyled = styled(Box)({\r\n ...stateWrapBase,\r\n '& > div': {\r\n gap: 8,\r\n borderColor: colors.blue[400],\r\n backgroundColor: alpha(colors.blue[50], 0.12)\r\n }\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={28} thickness={4} />\r\n {/* <Typography variant='body2'>Loading more...</Typography> */}\r\n </div>\r\n </PanelLoadMoreStyled>\r\n)\r\n\r\nconst PanelLoadMoreStyled = styled(Box)(({ theme }) => {\r\n const isDark = theme.palette.mode === 'dark'\r\n const bgColor = isDark ? 'rgba(0,0,0,0.24)' : 'rgba(255,255,255,0.24)'\r\n // const textColor = theme.palette.text.primary\r\n return {\r\n position: 'absolute',\r\n inset: 0,\r\n backgroundColor: bgColor,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n zIndex: 10,\r\n backdropFilter: 'blur(1.5px)',\r\n transition: 'opacity 0.2s',\r\n '& > div': { display: 'flex', alignItems: 'center', gap: 10 }\r\n // [`.${typographyClasses.root}`]: { color: textColor }\r\n }\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 '& > 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 [`.${typographyClasses.root}`]: { lineHeight: 1, fontWeight: 500 }\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","viewMode","rest","_objectWithoutProperties","_excluded","_jsx","PanelLoadingStyled","_objectSpread","children","_jsxs","className","CircularProgress","size","Typography","variant","color","styled","Box","gap","borderColor","blue","backgroundColor","alpha","red","flexDirection","PanelNoData","PanelNoDataStyled","gutterBottom","PanelLoadMore","PanelLoadMoreStyled","thickness","_ref2","position","inset","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","_defineProperty","spacing","borderTop","common","black","typographyClasses","root","lineHeight","fontWeight","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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.js","sources":["../../../../src/data-surface/view-grid/helpers.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// types\r\nimport type { TGridSizes } from './types'\r\n\r\n/** Default spacing between grid items in pixels. */\r\nexport const DEFAULT_GRID_SPACING_PX = 8\r\n/** Resolves the final grid spacing from multiple optional values. */\r\nexport const resolveGridSpacing = (...spacing: (number | undefined)[]) => {\r\n const finalSpacing = spacing.filter((value) => typeof value === 'number')\r\n if (finalSpacing.length === 0) return DEFAULT_GRID_SPACING_PX\r\n return Math.max(0, ...finalSpacing.map((value) => value ?? DEFAULT_GRID_SPACING_PX))\r\n}\r\n/** Default scrolling threshold in pixels for triggering near-end events. */\r\nexport const DEFAULT_GRID_SCROLLING_THRESHOLD_PX = 80\r\n/** Resolves the final scrolling threshold from multiple optional values. */\r\nexport const resolveGridScrollingThreshold = (...threshold: (number | undefined)[]) => {\r\n const finalThreshold = threshold.filter((value) => typeof value === 'number')\r\n if (finalThreshold.length === 0) return DEFAULT_GRID_SCROLLING_THRESHOLD_PX\r\n return Math.max(0, ...finalThreshold.map((value) => value ?? DEFAULT_GRID_SCROLLING_THRESHOLD_PX))\r\n}\r\n/** Default near-end threshold in pixels for triggering near-end events. */\r\nexport const DEFAULT_GRID_NEAR_END_THRESHOLD_PX = 80\r\n/** Resolves the final near-end threshold from multiple optional values. */\r\nexport const resolveGridNearEndThreshold = (...threshold: (number | undefined)[]) => {\r\n const finalThreshold = threshold.filter((value) => typeof value === 'number')\r\n if (finalThreshold.length === 0) return DEFAULT_GRID_NEAR_END_THRESHOLD_PX\r\n return Math.max(0, ...finalThreshold.map((value) => value ?? DEFAULT_GRID_NEAR_END_THRESHOLD_PX))\r\n}\r\n/** Default grid item height estimate in pixels, used for virtualization calculations. */\r\nexport const DEFAULT_GRID_ITEM_HEIGHT_ESTIMATE = 120\r\n/** Default grid item sizes for each breakpoint. */\r\nexport const DEFAULT_GRID_ITEM_SIZES: TGridSizes = { xs: 12, sm: 6, md: 4, lg: 3 }\r\n/** Returns the grid item sizes, falling back to defaults if not provided. */\r\nexport const getGridItemSizes = (sizes?: TGridSizes): TGridSizes => {\r\n return sizes ?? DEFAULT_GRID_ITEM_SIZES\r\n}\r\n/** Normalizes grid item sizes, ensuring all breakpoints have a value. */\r\nexport const normalizeGridSizes = (sizes?: TGridSizes): Required<TGridSizes> => {\r\n const { xs, sm, md, lg, xl } = sizes ?? {}\r\n return {\r\n xs: xs ?? DEFAULT_GRID_ITEM_SIZES.xs ?? 12,\r\n sm: sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.sm ?? 6,\r\n md: md ?? sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.md ?? 4,\r\n lg: lg ?? md ?? sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.lg ?? 3,\r\n xl: xl ?? lg ?? md ?? sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.xl ?? 3\r\n }\r\n}\r\n/** Resolves the active breakpoint based on the container width. */\r\nconst resolveActiveBreakpoint = (width: number): keyof TGridSizes => {\r\n if (width >= 1536) return 'xl'\r\n if (width >= 1200) return 'lg'\r\n if (width >= 900) return 'md'\r\n if (width >= 600) return 'sm'\r\n return 'xs'\r\n}\r\n/** Resolves the number of grid columns based on the container width and item sizes. */\r\nexport const resolveGridColumnsFromWidth = (width: number, sizes?: TGridSizes): number => {\r\n const normalized = normalizeGridSizes(sizes)\r\n const breakpoint = resolveActiveBreakpoint(width)\r\n const span = normalized[breakpoint] ?? 12\r\n const safeSpan = Math.min(12, Math.max(1, span))\r\n return Math.max(1, Math.floor(12 / safeSpan))\r\n}\r\n"],"names":["DEFAULT_GRID_SPACING_PX","resolveGridSpacing","_len","arguments","length","spacing","Array","_key","finalSpacing","filter","value","Math","max","apply","concat","_toConsumableArray","map","DEFAULT_GRID_SCROLLING_THRESHOLD_PX","resolveGridScrollingThreshold","_len2","threshold","_key2","finalThreshold","DEFAULT_GRID_NEAR_END_THRESHOLD_PX","resolveGridNearEndThreshold","_len3","_key3","DEFAULT_GRID_ITEM_HEIGHT_ESTIMATE","DEFAULT_GRID_ITEM_SIZES","xs","sm","md","lg","getGridItemSizes","sizes","normalizeGridSizes","_ref2","_ref3","_ref4","_ref5","_ref6","_ref7","_ref8","_ref9","_ref0","_ref1","_ref10","_ref11","_ref12","_ref13","_ref14","_ref","xl","resolveGridColumnsFromWidth","width","_normalized$breakpoin","normalized","breakpoint","resolveActiveBreakpoint","span","safeSpan","min","floor"],"mappings":"mFAMO,IAAMA,EAA0B,
|
|
1
|
+
{"version":3,"file":"helpers.js","sources":["../../../../src/data-surface/view-grid/helpers.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// types\r\nimport type { TGridSizes } from './types'\r\n\r\n/** Default spacing between grid items in pixels. */\r\nexport const DEFAULT_GRID_SPACING_PX = 8\r\n\r\n/** Resolves the final grid spacing from multiple optional values. */\r\nexport const resolveGridSpacing = (...spacing: (number | undefined)[]) => {\r\n const finalSpacing = spacing.filter((value) => typeof value === 'number')\r\n if (finalSpacing.length === 0) return DEFAULT_GRID_SPACING_PX\r\n return Math.max(0, ...finalSpacing.map((value) => value ?? DEFAULT_GRID_SPACING_PX))\r\n}\r\n\r\n/** Default scrolling threshold in pixels for triggering near-end events. */\r\nexport const DEFAULT_GRID_SCROLLING_THRESHOLD_PX = 80\r\n\r\n/** Resolves the final scrolling threshold from multiple optional values. */\r\nexport const resolveGridScrollingThreshold = (...threshold: (number | undefined)[]) => {\r\n const finalThreshold = threshold.filter((value) => typeof value === 'number')\r\n if (finalThreshold.length === 0) return DEFAULT_GRID_SCROLLING_THRESHOLD_PX\r\n return Math.max(0, ...finalThreshold.map((value) => value ?? DEFAULT_GRID_SCROLLING_THRESHOLD_PX))\r\n}\r\n\r\n/** Default near-end threshold in pixels for triggering near-end events. */\r\nexport const DEFAULT_GRID_NEAR_END_THRESHOLD_PX = 80\r\n\r\n/** Resolves the final near-end threshold from multiple optional values. */\r\nexport const resolveGridNearEndThreshold = (...threshold: (number | undefined)[]) => {\r\n const finalThreshold = threshold.filter((value) => typeof value === 'number')\r\n if (finalThreshold.length === 0) return DEFAULT_GRID_NEAR_END_THRESHOLD_PX\r\n return Math.max(0, ...finalThreshold.map((value) => value ?? DEFAULT_GRID_NEAR_END_THRESHOLD_PX))\r\n}\r\n\r\n/** Default grid item height estimate in pixels, used for virtualization calculations. */\r\nexport const DEFAULT_GRID_ITEM_HEIGHT_ESTIMATE = 120\r\n\r\n/** Default grid item sizes for each breakpoint. */\r\nexport const DEFAULT_GRID_ITEM_SIZES: TGridSizes = { xs: 12, sm: 6, md: 4, lg: 3 }\r\n\r\n/** Returns the grid item sizes, falling back to defaults if not provided. */\r\nexport const getGridItemSizes = (sizes?: TGridSizes): TGridSizes => {\r\n return sizes ?? DEFAULT_GRID_ITEM_SIZES\r\n}\r\n\r\n/** Normalizes grid item sizes, ensuring all breakpoints have a value. */\r\nexport const normalizeGridSizes = (sizes?: TGridSizes): Required<TGridSizes> => {\r\n const { xs, sm, md, lg, xl } = sizes ?? {}\r\n return {\r\n xs: xs ?? DEFAULT_GRID_ITEM_SIZES.xs ?? 12,\r\n sm: sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.sm ?? 6,\r\n md: md ?? sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.md ?? 4,\r\n lg: lg ?? md ?? sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.lg ?? 3,\r\n xl: xl ?? lg ?? md ?? sm ?? xs ?? DEFAULT_GRID_ITEM_SIZES.xl ?? 3\r\n }\r\n}\r\n\r\n/** Resolves the active breakpoint based on the container width. */\r\nconst resolveActiveBreakpoint = (width: number): keyof TGridSizes => {\r\n if (width >= 1536) return 'xl'\r\n if (width >= 1200) return 'lg'\r\n if (width >= 900) return 'md'\r\n if (width >= 600) return 'sm'\r\n return 'xs'\r\n}\r\n\r\n/** Resolves the number of grid columns based on the container width and item sizes. */\r\nexport const resolveGridColumnsFromWidth = (width: number, sizes?: TGridSizes): number => {\r\n const normalized = normalizeGridSizes(sizes)\r\n const breakpoint = resolveActiveBreakpoint(width)\r\n const span = normalized[breakpoint] ?? 12\r\n const safeSpan = Math.min(12, Math.max(1, span))\r\n return Math.max(1, Math.floor(12 / safeSpan))\r\n}\r\n"],"names":["DEFAULT_GRID_SPACING_PX","resolveGridSpacing","_len","arguments","length","spacing","Array","_key","finalSpacing","filter","value","Math","max","apply","concat","_toConsumableArray","map","DEFAULT_GRID_SCROLLING_THRESHOLD_PX","resolveGridScrollingThreshold","_len2","threshold","_key2","finalThreshold","DEFAULT_GRID_NEAR_END_THRESHOLD_PX","resolveGridNearEndThreshold","_len3","_key3","DEFAULT_GRID_ITEM_HEIGHT_ESTIMATE","DEFAULT_GRID_ITEM_SIZES","xs","sm","md","lg","getGridItemSizes","sizes","normalizeGridSizes","_ref2","_ref3","_ref4","_ref5","_ref6","_ref7","_ref8","_ref9","_ref0","_ref1","_ref10","_ref11","_ref12","_ref13","_ref14","_ref","xl","resolveGridColumnsFromWidth","width","_normalized$breakpoin","normalized","breakpoint","resolveActiveBreakpoint","span","safeSpan","min","floor"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectSpread2 as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{ListDensity as
|
|
1
|
+
import{objectSpread2 as r,toConsumableArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{ListDensity as n}from"./types.js";var e=48,a=4,i={compact:36,standard:48,comfortable:56},u={compact:"6px 10px",standard:"10px 12px",comfortable:"12px 14px"},o=function(t,n){return n?Object.keys(n).map(function(t){var e,a=null!==(e=n[t])&&void 0!==e?e:{};return r({field:t},a)}):function(r){if(0===r.length)return[];var t=r[0];return Object.keys(t).map(function(r){return{field:r,label:String(r),flex:1}})}(t)};function f(r){if("number"==typeof r&&Number.isFinite(r)&&r>0)return r;var t="number"==typeof r?n.standard:null!=r?r:n.standard;return i[t]}function l(r){if("number"==typeof r)return u[n.standard];var t="number"==typeof r?n.standard:null!=r?r:n.standard;return u[t]}function d(r){return"number"==typeof r&&Number.isFinite(r)&&r>=0?r:4}var c=80;function m(){for(var r=arguments.length,n=new Array(r),e=0;e<r;e++)n[e]=arguments[e];var a=n.filter(function(r){return"number"==typeof r});return 0===a.length?80:Math.max.apply(Math,[0].concat(t(a)))}function p(r,t,n){return r<=0?0:r*t+Math.max(0,r-1)*n}var s=function(t,n,e){var a,i=function(r,t){if(void 0!==r.width)return r.width;if(r.flex&&r.flex>0&&t>0){var n=r.flex/t*100;return"".concat(n,"%")}}(t,n),u=void 0!==t.width;return r({width:i,minWidth:u?i:t.minWidth,maxWidth:null!==(a=t.maxWidth)&&void 0!==a?a:i},e)};export{u as LIST_CELL_PADDING_BY_DENSITY,c as LIST_DEFAULT_NEAR_END_THRESHOLD,a as LIST_DEFAULT_ROW_SPACING,e as LIST_HEADER_HEIGHT,i as LIST_ROW_HEIGHT_BY_DENSITY,o as columnsRecordToArray,s as mapSxTableCell,l as resolveListCellPadding,m as resolveListNearEndThreshold,f as resolveListRowHeight,d as resolveListRowSpacing,p as resolveListSpacerHeight};
|
|
2
2
|
//# sourceMappingURL=helpers.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.js","sources":["../../../../src/data-surface/view-list/helpers.ts"],"sourcesContent":["import { TableCellProps } from '@mui/material'\r\nimport { IViewListConfig, IViewListProps, ListDensity, TListColumn, TListColumns } from './types'\r\nimport { VIEW_LIST_ROW_SPACING_VAR } from './styled'\r\nimport { CSSProperties } from 'react'\r\n\r\nexport const LIST_HEADER_HEIGHT = 48\r\nexport const LIST_DEFAULT_ROW_SPACING = 4\r\n\r\nexport const LIST_ROW_HEIGHT_BY_DENSITY: Record<ListDensity, number> = {\r\n compact: 36,\r\n standard: 48,\r\n comfortable: 56\r\n}\r\n\r\nexport const LIST_CELL_PADDING_BY_DENSITY: Record<ListDensity, string> = {\r\n compact: '6px 10px',\r\n standard: '10px 12px',\r\n comfortable: '12px 14px'\r\n}\r\n\r\nconst buildDefaultColumns = <T>(data: T[]): TListColumn<T>[] => {\r\n if (data.length === 0) return []\r\n const firstRow = data[0]\r\n return Object.keys(firstRow as object).map((key) => ({\r\n field: key as keyof T,\r\n label: String(key),\r\n flex: 1\r\n }))\r\n}\r\n\r\n/**\r\n * Converts TListColumns<T> Record type to TListColumn<T>[] array for internal use.\r\n */\r\nexport const columnsRecordToArray = <T>(value: T[], columnsRecord?: TListColumns<T>): TListColumn<T>[] => {\r\n if (!columnsRecord) return buildDefaultColumns(value)\r\n const keys = Object.keys(columnsRecord) as (keyof T)[]\r\n return keys.map((key) => {\r\n const colConfig = columnsRecord[key] ?? {}\r\n return { field: key, ...colConfig } as TListColumn<T>\r\n })\r\n}\r\n\r\nexport function resolveListRowHeight(density?: number | ListDensity): number {\r\n if (typeof density === 'number' && Number.isFinite(density) && density > 0) {\r\n return density\r\n }\r\n\r\n const resolvedDensity: ListDensity = typeof density === 'number' ? ListDensity.standard : (density ?? ListDensity.standard)\r\n return LIST_ROW_HEIGHT_BY_DENSITY[resolvedDensity]\r\n}\r\n\r\nexport function resolveListCellPadding(density?: number | ListDensity): string {\r\n if (typeof density === 'number') {\r\n return LIST_CELL_PADDING_BY_DENSITY[ListDensity.standard]\r\n }\r\n\r\n const resolvedDensity: ListDensity = typeof density === 'number' ? ListDensity.standard : (density ?? ListDensity.standard)\r\n return LIST_CELL_PADDING_BY_DENSITY[resolvedDensity]\r\n}\r\n\r\nexport function resolveListRowSpacing(spacing?: number): number {\r\n if (typeof spacing === 'number' && Number.isFinite(spacing) && spacing >= 0) {\r\n return spacing\r\n }\r\n\r\n return LIST_DEFAULT_ROW_SPACING\r\n}\r\n\r\nexport function resolveListSpacerHeight(count: number, rowHeight: number, rowSpacing: number): number {\r\n if (count <= 0) return 0\r\n return count * rowHeight + Math.max(0, count - 1) * rowSpacing\r\n}\r\n\r\n\r\nconst getColumnWidth = <T>(column: TListColumn<T>, totalFlex: number): number | string | undefined => {\r\n // Priority 1: Explicit width always wins\r\n if (column.width !== undefined) return column.width\r\n\r\n // Priority 2: Flex-based proportional width\r\n if (column.flex && column.flex > 0 && totalFlex > 0) {\r\n const percent = (column.flex / totalFlex) * 100\r\n return `${percent}%`\r\n }\r\n\r\n // Priority 3: Auto-width (no width or flex specified)\r\n // Let the table auto-calculate based on content\r\n return undefined\r\n}\r\n\r\nexport const mapSxTableCell = <T>(col: TListColumn<T>, totalFlex: number, sx?: TableCellProps['sx']): TableCellProps['sx'] => {\r\n const colWidth = getColumnWidth(col, totalFlex)\r\n const hasFixedWidth = col.width !== undefined\r\n return {\r\n width: colWidth,\r\n // For fixed-width columns, enforce minWidth = width to prevent shrinking\r\n minWidth: hasFixedWidth ? colWidth : col.minWidth,\r\n // Lock all columns with maxWidth to prevent text overflow expansion\r\n maxWidth: col.maxWidth ?? colWidth,\r\n ...sx\r\n }\r\n}\r\n"],"names":["LIST_HEADER_HEIGHT","LIST_DEFAULT_ROW_SPACING","LIST_ROW_HEIGHT_BY_DENSITY","compact","standard","comfortable","LIST_CELL_PADDING_BY_DENSITY","columnsRecordToArray","value","columnsRecord","Object","keys","map","key","_columnsRecord$key","colConfig","_objectSpread","field","data","length","firstRow","label","String","flex","buildDefaultColumns","resolveListRowHeight","density","Number","isFinite","resolvedDensity","ListDensity","resolveListCellPadding","resolveListRowSpacing","spacing","
|
|
1
|
+
{"version":3,"file":"helpers.js","sources":["../../../../src/data-surface/view-list/helpers.ts"],"sourcesContent":["import { TableCellProps } from '@mui/material'\r\nimport { IViewListConfig, IViewListProps, ListDensity, TListColumn, TListColumns } from './types'\r\nimport { VIEW_LIST_ROW_SPACING_VAR } from './styled'\r\nimport { CSSProperties } from 'react'\r\n\r\nexport const LIST_HEADER_HEIGHT = 48\r\nexport const LIST_DEFAULT_ROW_SPACING = 4\r\n\r\nexport const LIST_ROW_HEIGHT_BY_DENSITY: Record<ListDensity, number> = {\r\n compact: 36,\r\n standard: 48,\r\n comfortable: 56\r\n}\r\n\r\nexport const LIST_CELL_PADDING_BY_DENSITY: Record<ListDensity, string> = {\r\n compact: '6px 10px',\r\n standard: '10px 12px',\r\n comfortable: '12px 14px'\r\n}\r\n\r\nconst buildDefaultColumns = <T>(data: T[]): TListColumn<T>[] => {\r\n if (data.length === 0) return []\r\n const firstRow = data[0]\r\n return Object.keys(firstRow as object).map((key) => ({\r\n field: key as keyof T,\r\n label: String(key),\r\n flex: 1\r\n }))\r\n}\r\n\r\n/**\r\n * Converts TListColumns<T> Record type to TListColumn<T>[] array for internal use.\r\n */\r\nexport const columnsRecordToArray = <T>(value: T[], columnsRecord?: TListColumns<T>): TListColumn<T>[] => {\r\n if (!columnsRecord) return buildDefaultColumns(value)\r\n const keys = Object.keys(columnsRecord) as (keyof T)[]\r\n return keys.map((key) => {\r\n const colConfig = columnsRecord[key] ?? {}\r\n return { field: key, ...colConfig } as TListColumn<T>\r\n })\r\n}\r\n\r\nexport function resolveListRowHeight(density?: number | ListDensity): number {\r\n if (typeof density === 'number' && Number.isFinite(density) && density > 0) {\r\n return density\r\n }\r\n\r\n const resolvedDensity: ListDensity = typeof density === 'number' ? ListDensity.standard : (density ?? ListDensity.standard)\r\n return LIST_ROW_HEIGHT_BY_DENSITY[resolvedDensity]\r\n}\r\n\r\nexport function resolveListCellPadding(density?: number | ListDensity): string {\r\n if (typeof density === 'number') {\r\n return LIST_CELL_PADDING_BY_DENSITY[ListDensity.standard]\r\n }\r\n\r\n const resolvedDensity: ListDensity = typeof density === 'number' ? ListDensity.standard : (density ?? ListDensity.standard)\r\n return LIST_CELL_PADDING_BY_DENSITY[resolvedDensity]\r\n}\r\n\r\nexport function resolveListRowSpacing(spacing?: number): number {\r\n if (typeof spacing === 'number' && Number.isFinite(spacing) && spacing >= 0) {\r\n return spacing\r\n }\r\n\r\n return LIST_DEFAULT_ROW_SPACING\r\n}\r\n\r\n/** Default near-end threshold in pixels for triggering near-end events. */\r\nexport const LIST_DEFAULT_NEAR_END_THRESHOLD = 80\r\n/** Resolves the final near-end threshold from multiple optional values. */\r\nexport function resolveListNearEndThreshold(...threshold: (number | undefined)[]): number {\r\n const finalThreshold = threshold.filter((value): value is number => typeof value === 'number')\r\n if (finalThreshold.length === 0) return LIST_DEFAULT_NEAR_END_THRESHOLD\r\n return Math.max(0, ...finalThreshold)\r\n}\r\n\r\nexport function resolveListSpacerHeight(count: number, rowHeight: number, rowSpacing: number): number {\r\n if (count <= 0) return 0\r\n return count * rowHeight + Math.max(0, count - 1) * rowSpacing\r\n}\r\n\r\n\r\nconst getColumnWidth = <T>(column: TListColumn<T>, totalFlex: number): number | string | undefined => {\r\n // Priority 1: Explicit width always wins\r\n if (column.width !== undefined) return column.width\r\n\r\n // Priority 2: Flex-based proportional width\r\n if (column.flex && column.flex > 0 && totalFlex > 0) {\r\n const percent = (column.flex / totalFlex) * 100\r\n return `${percent}%`\r\n }\r\n\r\n // Priority 3: Auto-width (no width or flex specified)\r\n // Let the table auto-calculate based on content\r\n return undefined\r\n}\r\n\r\nexport const mapSxTableCell = <T>(col: TListColumn<T>, totalFlex: number, sx?: TableCellProps['sx']): TableCellProps['sx'] => {\r\n const colWidth = getColumnWidth(col, totalFlex)\r\n const hasFixedWidth = col.width !== undefined\r\n return {\r\n width: colWidth,\r\n // For fixed-width columns, enforce minWidth = width to prevent shrinking\r\n minWidth: hasFixedWidth ? colWidth : col.minWidth,\r\n // Lock all columns with maxWidth to prevent text overflow expansion\r\n maxWidth: col.maxWidth ?? colWidth,\r\n ...sx\r\n }\r\n}\r\n"],"names":["LIST_HEADER_HEIGHT","LIST_DEFAULT_ROW_SPACING","LIST_ROW_HEIGHT_BY_DENSITY","compact","standard","comfortable","LIST_CELL_PADDING_BY_DENSITY","columnsRecordToArray","value","columnsRecord","Object","keys","map","key","_columnsRecord$key","colConfig","_objectSpread","field","data","length","firstRow","label","String","flex","buildDefaultColumns","resolveListRowHeight","density","Number","isFinite","resolvedDensity","ListDensity","resolveListCellPadding","resolveListRowSpacing","spacing","LIST_DEFAULT_NEAR_END_THRESHOLD","resolveListNearEndThreshold","_len","arguments","threshold","Array","_key","finalThreshold","filter","Math","max","apply","concat","_toConsumableArray","resolveListSpacerHeight","count","rowHeight","rowSpacing","mapSxTableCell","col","totalFlex","sx","_col$maxWidth","colWidth","column","undefined","width","percent","getColumnWidth","hasFixedWidth","minWidth","maxWidth"],"mappings":"+IAKO,IAAMA,EAAqB,GACrBC,EAA2B,EAE3BC,EAA0D,CACrEC,QAAS,GACTC,SAAU,GACVC,YAAa,IAGFC,EAA4D,CACvEH,QAAS,WACTC,SAAU,YACVC,YAAa,aAgBFE,EAAuB,SAAIC,EAAYC,GAClD,OAAKA,EACQC,OAAOC,KAAKF,GACbG,IAAI,SAACC,GAAO,IAAAC,EAChBC,EAA8B,QAArBD,EAAGL,EAAcI,UAAI,IAAAC,EAAAA,EAAI,CAAE,EAC1C,OAAAE,EAAA,CAASC,MAAOJ,GAAQE,EAC1B,GAnB0B,SAAIG,GAC9B,GAAoB,IAAhBA,EAAKC,OAAc,MAAO,GAC9B,IAAMC,EAAWF,EAAK,GACtB,OAAOR,OAAOC,KAAKS,GAAoBR,IAAI,SAACC,GAAG,MAAM,CACnDI,MAAOJ,EACPQ,MAAOC,OAAOT,GACdU,KAAM,EACP,EACH,CAM6BC,CAAoBhB,EAMjD,EAEM,SAAUiB,EAAqBC,GACnC,GAAuB,iBAAZA,GAAwBC,OAAOC,SAASF,IAAYA,EAAU,EACvE,OAAOA,EAGT,IAAMG,EAAkD,iBAAZH,EAAuBI,EAAY1B,SAAYsB,QAAAA,EAAWI,EAAY1B,SAClH,OAAOF,EAA2B2B,EACpC,CAEM,SAAUE,EAAuBL,GACrC,GAAuB,iBAAZA,EACT,OAAOpB,EAA6BwB,EAAY1B,UAGlD,IAAMyB,EAAkD,iBAAZH,EAAuBI,EAAY1B,SAAYsB,QAAAA,EAAWI,EAAY1B,SAClH,OAAOE,EAA6BuB,EACtC,CAEM,SAAUG,EAAsBC,GACpC,MAAuB,iBAAZA,GAAwBN,OAAOC,SAASK,IAAYA,GAAW,EACjEA,EAxD6B,CA4DxC,CAGO,IAAMC,EAAkC,GAE/B,SAAAC,IAAgE,IAAA,IAAAC,EAAAC,UAAAlB,OAAjCmB,EAAiCC,IAAAA,MAAAH,GAAAI,EAAA,EAAAA,EAAAJ,EAAAI,IAAjCF,EAAiCE,GAAAH,UAAAG,GAC9E,IAAMC,EAAiBH,EAAUI,OAAO,SAAClC,GAAK,MAAuC,iBAAVA,IAC3E,OAA8B,IAA1BiC,EAAetB,OAJ0B,GAKtCwB,KAAKC,IAAGC,MAARF,KAAS,CAAA,GAACG,OAAAC,EAAKN,IACxB,UAEgBO,EAAwBC,EAAeC,EAAmBC,GACxE,OAAIF,GAAS,EAAU,EAChBA,EAAQC,EAAYP,KAAKC,IAAI,EAAGK,EAAQ,GAAKE,CACtD,CAGA,IAeaC,EAAiB,SAAIC,EAAqBC,EAAmBC,GAAmD,IAAAC,EACrHC,EAhBe,SAAIC,EAAwBJ,GAEjD,QAAqBK,IAAjBD,EAAOE,MAAqB,OAAOF,EAAOE,MAG9C,GAAIF,EAAOnC,MAAQmC,EAAOnC,KAAO,GAAK+B,EAAY,EAAG,CACnD,IAAMO,EAAWH,EAAOnC,KAAO+B,EAAa,IAC5C,MAAAR,GAAAA,OAAUe,EAAO,IAClB,CAKH,CAGmBC,CAAeT,EAAKC,GAC/BS,OAA8BJ,IAAdN,EAAIO,MAC1B,OAAA5C,EAAA,CACE4C,MAAOH,EAEPO,SAAUD,EAAgBN,EAAWJ,EAAIW,SAEzCC,SAAsBT,QAAdA,EAAEH,EAAIY,gBAAQT,IAAAA,EAAAA,EAAIC,GACvBF,EAEP"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as n,toConsumableArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useMemo as l}from"react";import{VIEW_LIST_ROW_SPACING_VAR as
|
|
1
|
+
import{defineProperty as n,toConsumableArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{useMemo as l}from"react";import{VIEW_LIST_ROW_SPACING_VAR as r}from"./styled.js";import{resolveListRowSpacing as o,resolveListNearEndThreshold as t,resolveListCellPadding as i,resolveListRowHeight as s,columnsRecordToArray as a}from"./helpers.js";function u(e,u){return l(function(){var l,c,d,p,f,m=null!==(l=u.density)&&void 0!==l?l:e.density,v=o(null!==(c=u.spacing)&&void 0!==c?c:e.spacing),g=Object.assign({autoHeight:!1},e.normalOptions,u.normalOptions),h=Object.assign({overscan:6},e.virtualizedOptions,u.virtualizedOptions);return{columns:a(u.value,null!==(d=u.columns)&&void 0!==d?d:e.columns),selectable:null!==(p=null!==(f=u.selectable)&&void 0!==f?f:e.selectable)&&void 0!==p&&p,rowHeight:s(m),cellPadding:i(m),rowSpacing:v,nearEndThreshold:t(u.nearEndThreshold,e.nearEndThreshold),normalOptions:g,virtualizedOptions:h,rootStyle:n({},r,"".concat(v,"px"))}},[u,e])}function c(n,r,o,t,i){var s=null!=t?t:[],a=l(function(){var e=new Map;return n.forEach(function(n,l){var o=r(n,l);null!=o&&e.set(o,n)}),e},[n,r]),u=l(function(){return Array.from(a.keys())},[a]),c=u.length>0&&u.every(function(n){return s.includes(n)}),d=s.length>0&&!c;return{selectedIds:s,isAllSelected:c,isSomeSelected:d,handleToggleAll:function(){o&&i&&i(c?[]:u)},handleToggleRow:function(n){if(o&&i){var l=s.includes(n)?s.filter(function(e){return e!==n}):[].concat(e(s),[n]);i(l)}}}}export{c as useListSelection,u as useMergedConfig};
|
|
2
2
|
//# sourceMappingURL=hooks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hooks.js","sources":["../../../../src/data-surface/view-list/hooks.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { CSSProperties, useMemo } from 'react'\r\nimport { VIEW_LIST_ROW_SPACING_VAR } from './styled'\r\nimport { columnsRecordToArray, resolveListCellPadding, resolveListRowHeight, resolveListRowSpacing } from './helpers'\r\nimport type { TGetterId } from '../types'\r\nimport type { IViewListConfig, IViewListProps } from './types'\r\n\r\nexport function useMergedConfig<T>(config: IViewListConfig<T>, props: IViewListProps<T>) {\r\n return useMemo(() => {\r\n const density = props.density ?? config.density\r\n const rowSpacing = resolveListRowSpacing(props.spacing ?? config.spacing)\r\n const normalOptions = Object.assign({ autoHeight: false }, config.normalOptions, props.normalOptions)\r\n const virtualizedOptions = Object.assign({ overscan: 6 }, config.virtualizedOptions, props.virtualizedOptions)\r\n return {\r\n columns: columnsRecordToArray(props.value, props.columns ?? config.columns),\r\n selectable: props.selectable ?? config.selectable ?? false,\r\n rowHeight: resolveListRowHeight(density),\r\n cellPadding: resolveListCellPadding(density),\r\n rowSpacing,\r\n normalOptions,\r\n virtualizedOptions,\r\n rootStyle: { [VIEW_LIST_ROW_SPACING_VAR]: `${rowSpacing}px` } as CSSProperties\r\n }\r\n }, [props, config])\r\n}\r\n\r\n/**\r\n * Custom hook to manage list row selection logic.\r\n * Handles select all, individual row selection, and indeterminate state.\r\n *\r\n * @param value - The array of data items\r\n * @param getterId - Function to extract unique ID from each row\r\n * @param selectable - Whether selection is enabled\r\n * @param selectedIds - Controlled array of selected row IDs\r\n * @param onSelectionChange - Callback when selection changes\r\n * @returns Selection state and handlers\r\n */\r\nexport function useListSelection<T>(\r\n value: T[],\r\n getterId: TGetterId<T>,\r\n selectable: boolean,\r\n selectedIds?: (string | number)[],\r\n onSelectionChange?: (selectedIds: (string | number)[]) => void\r\n) {\r\n const safeSelectedIds = selectedIds ?? []\r\n\r\n // Build map of row IDs for quick lookup\r\n const rowIdMap = useMemo(() => {\r\n const map = new Map<string | number, T>()\r\n value.forEach((row, index) => {\r\n const id = getterId(row, index)\r\n if (id !== null && id !== undefined) {\r\n map.set(id, row)\r\n }\r\n })\r\n return map\r\n }, [value, getterId])\r\n\r\n const allRowIds = useMemo(() => Array.from(rowIdMap.keys()), [rowIdMap])\r\n\r\n const isAllSelected = allRowIds.length > 0 && allRowIds.every((id) => safeSelectedIds.includes(id))\r\n const isSomeSelected = safeSelectedIds.length > 0 && !isAllSelected\r\n\r\n const handleToggleAll = () => {\r\n if (!selectable || !onSelectionChange) return\r\n if (isAllSelected) {\r\n onSelectionChange([])\r\n } else {\r\n onSelectionChange(allRowIds)\r\n }\r\n }\r\n\r\n const handleToggleRow = (rowId: string | number) => {\r\n if (!selectable || !onSelectionChange) return\r\n const newSelected = safeSelectedIds.includes(rowId) ? safeSelectedIds.filter((id) => id !== rowId) : [...safeSelectedIds, rowId]\r\n onSelectionChange(newSelected)\r\n }\r\n\r\n return {\r\n selectedIds: safeSelectedIds,\r\n isAllSelected,\r\n isSomeSelected,\r\n handleToggleAll,\r\n handleToggleRow\r\n }\r\n}\r\n"],"names":["useMergedConfig","config","props","useMemo","_props$density","_props$spacing","_props$columns","_ref","_props$selectable","density","rowSpacing","resolveListRowSpacing","spacing","normalOptions","Object","assign","autoHeight","virtualizedOptions","overscan","columns","columnsRecordToArray","value","selectable","rowHeight","resolveListRowHeight","cellPadding","resolveListCellPadding","rootStyle","_defineProperty","VIEW_LIST_ROW_SPACING_VAR","concat","useListSelection","getterId","selectedIds","onSelectionChange","safeSelectedIds","rowIdMap","map","Map","forEach","row","index","id","set","allRowIds","Array","from","keys","isAllSelected","length","every","includes","isSomeSelected","handleToggleAll","handleToggleRow","rowId","newSelected","filter","_toConsumableArray"],"mappings":"
|
|
1
|
+
{"version":3,"file":"hooks.js","sources":["../../../../src/data-surface/view-list/hooks.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport { CSSProperties, useMemo } from 'react'\r\nimport { VIEW_LIST_ROW_SPACING_VAR } from './styled'\r\nimport { columnsRecordToArray, resolveListCellPadding, resolveListNearEndThreshold, resolveListRowHeight, resolveListRowSpacing } from './helpers'\r\nimport type { TGetterId } from '../types'\r\nimport type { IViewListConfig, IViewListProps } from './types'\r\n\r\nexport function useMergedConfig<T>(config: IViewListConfig<T>, props: IViewListProps<T>) {\r\n return useMemo(() => {\r\n const density = props.density ?? config.density\r\n const rowSpacing = resolveListRowSpacing(props.spacing ?? config.spacing)\r\n const normalOptions = Object.assign({ autoHeight: false }, config.normalOptions, props.normalOptions)\r\n const virtualizedOptions = Object.assign({ overscan: 6 }, config.virtualizedOptions, props.virtualizedOptions)\r\n return {\r\n columns: columnsRecordToArray(props.value, props.columns ?? config.columns),\r\n selectable: props.selectable ?? config.selectable ?? false,\r\n rowHeight: resolveListRowHeight(density),\r\n cellPadding: resolveListCellPadding(density),\r\n rowSpacing,\r\n nearEndThreshold: resolveListNearEndThreshold(props.nearEndThreshold, config.nearEndThreshold),\r\n normalOptions,\r\n virtualizedOptions,\r\n rootStyle: { [VIEW_LIST_ROW_SPACING_VAR]: `${rowSpacing}px` } as CSSProperties\r\n }\r\n }, [props, config])\r\n}\r\n\r\n/**\r\n * Custom hook to manage list row selection logic.\r\n * Handles select all, individual row selection, and indeterminate state.\r\n *\r\n * @param value - The array of data items\r\n * @param getterId - Function to extract unique ID from each row\r\n * @param selectable - Whether selection is enabled\r\n * @param selectedIds - Controlled array of selected row IDs\r\n * @param onSelectionChange - Callback when selection changes\r\n * @returns Selection state and handlers\r\n */\r\nexport function useListSelection<T>(\r\n value: T[],\r\n getterId: TGetterId<T>,\r\n selectable: boolean,\r\n selectedIds?: (string | number)[],\r\n onSelectionChange?: (selectedIds: (string | number)[]) => void\r\n) {\r\n const safeSelectedIds = selectedIds ?? []\r\n\r\n // Build map of row IDs for quick lookup\r\n const rowIdMap = useMemo(() => {\r\n const map = new Map<string | number, T>()\r\n value.forEach((row, index) => {\r\n const id = getterId(row, index)\r\n if (id !== null && id !== undefined) {\r\n map.set(id, row)\r\n }\r\n })\r\n return map\r\n }, [value, getterId])\r\n\r\n const allRowIds = useMemo(() => Array.from(rowIdMap.keys()), [rowIdMap])\r\n\r\n const isAllSelected = allRowIds.length > 0 && allRowIds.every((id) => safeSelectedIds.includes(id))\r\n const isSomeSelected = safeSelectedIds.length > 0 && !isAllSelected\r\n\r\n const handleToggleAll = () => {\r\n if (!selectable || !onSelectionChange) return\r\n if (isAllSelected) {\r\n onSelectionChange([])\r\n } else {\r\n onSelectionChange(allRowIds)\r\n }\r\n }\r\n\r\n const handleToggleRow = (rowId: string | number) => {\r\n if (!selectable || !onSelectionChange) return\r\n const newSelected = safeSelectedIds.includes(rowId) ? safeSelectedIds.filter((id) => id !== rowId) : [...safeSelectedIds, rowId]\r\n onSelectionChange(newSelected)\r\n }\r\n\r\n return {\r\n selectedIds: safeSelectedIds,\r\n isAllSelected,\r\n isSomeSelected,\r\n handleToggleAll,\r\n handleToggleRow\r\n }\r\n}\r\n"],"names":["useMergedConfig","config","props","useMemo","_props$density","_props$spacing","_props$columns","_ref","_props$selectable","density","rowSpacing","resolveListRowSpacing","spacing","normalOptions","Object","assign","autoHeight","virtualizedOptions","overscan","columns","columnsRecordToArray","value","selectable","rowHeight","resolveListRowHeight","cellPadding","resolveListCellPadding","nearEndThreshold","resolveListNearEndThreshold","rootStyle","_defineProperty","VIEW_LIST_ROW_SPACING_VAR","concat","useListSelection","getterId","selectedIds","onSelectionChange","safeSelectedIds","rowIdMap","map","Map","forEach","row","index","id","set","allRowIds","Array","from","keys","isAllSelected","length","every","includes","isSomeSelected","handleToggleAll","handleToggleRow","rowId","newSelected","filter","_toConsumableArray"],"mappings":"qWAQgB,SAAAA,EAAmBC,EAA4BC,GAC7D,OAAOC,EAAQ,WAAK,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EACZC,EAAuBL,QAAhBA,EAAGF,EAAMO,eAAOL,IAAAA,EAAAA,EAAIH,EAAOQ,QAClCC,EAAaC,EAAmC,QAAdN,EAACH,EAAMU,eAAOP,IAAAA,EAAAA,EAAIJ,EAAOW,SAC3DC,EAAgBC,OAAOC,OAAO,CAAEC,YAAY,GAASf,EAAOY,cAAeX,EAAMW,eACjFI,EAAqBH,OAAOC,OAAO,CAAEG,SAAU,GAAKjB,EAAOgB,mBAAoBf,EAAMe,oBAC3F,MAAO,CACLE,QAASC,EAAqBlB,EAAMmB,MAAoB,QAAff,EAAEJ,EAAMiB,eAAOb,IAAAA,EAAAA,EAAIL,EAAOkB,SACnEG,mBAAUf,EAAkBC,QAAlBA,EAAEN,EAAMoB,sBAAUd,EAAAA,EAAIP,EAAOqB,kBAAU,IAAAf,GAAAA,EACjDgB,UAAWC,EAAqBf,GAChCgB,YAAaC,EAAuBjB,GACpCC,WAAAA,EACAiB,iBAAkBC,EAA4B1B,EAAMyB,iBAAkB1B,EAAO0B,kBAC7Ed,cAAAA,EACAI,mBAAAA,EACAY,UAASC,EAAA,GAAKC,EAAyBC,GAAAA,OAAMtB,EAAU,OAE3D,EAAG,CAACR,EAAOD,GACb,CAaM,SAAUgC,EACdZ,EACAa,EACAZ,EACAa,EACAC,GAEA,IAAMC,EAAkBF,QAAAA,EAAe,GAGjCG,EAAWnC,EAAQ,WACvB,IAAMoC,EAAM,IAAIC,IAOhB,OANAnB,EAAMoB,QAAQ,SAACC,EAAKC,GAClB,IAAMC,EAAKV,EAASQ,EAAKC,GACrBC,SACFL,EAAIM,IAAID,EAAIF,EAEhB,GACOH,CACT,EAAG,CAAClB,EAAOa,IAELY,EAAY3C,EAAQ,WAAA,OAAM4C,MAAMC,KAAKV,EAASW,SAAS,CAACX,IAExDY,EAAgBJ,EAAUK,OAAS,GAAKL,EAAUM,MAAM,SAACR,GAAE,OAAKP,EAAgBgB,SAAST,KACzFU,EAAiBjB,EAAgBc,OAAS,IAAMD,EAiBtD,MAAO,CACLf,YAAaE,EACba,cAAAA,EACAI,eAAAA,EACAC,gBAnBsB,WACjBjC,GAAec,GAElBA,EADEc,EACgB,GAEAJ,EAErB,EAaCU,gBAXsB,SAACC,GACvB,GAAKnC,GAAec,EAApB,CACA,IAAMsB,EAAcrB,EAAgBgB,SAASI,GAASpB,EAAgBsB,OAAO,SAACf,GAAE,OAAKA,IAAOa,IAAM,GAAAzB,OAAA4B,EAAOvB,GAAe,CAAEoB,IAC1HrB,EAAkBsB,EAFqB,CAGxC,EASH"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{objectSpread2 as e,asyncToGenerator as l,regenerator as n,slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as a}from"react/jsx-runtime";import{useCallback as i,useRef as o,useState as c,useEffect as d,useLayoutEffect as s,useMemo as u}from"react";import{TableContainer as
|
|
1
|
+
import{objectSpread2 as e,asyncToGenerator as l,regenerator as n,slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as r,jsxs as a}from"react/jsx-runtime";import{useCallback as i,useRef as o,useState as c,useEffect as d,useLayoutEffect as s,useMemo as u}from"react";import{TableContainer as h,Table as g,TableHead as v,TableRow as f,TableCell as m,Checkbox as p,TableBody as b,Box as S,Typography as x}from"@mui/material";import{useMergedConfig as C,useListSelection as N}from"./hooks.js";import{ViewListStyled as H,viewListClasses as T}from"./styled.js";import{LIST_HEADER_HEIGHT as k,resolveListSpacerHeight as y,mapSxTableCell as w}from"./helpers.js";function M(e,l,n){var t=l[e.field],a=e.valueGetter?e.valueGetter(t,l,n):t,i={value:a,row:l,index:n,field:e.field};if(e.renderCell)return e.renderCell(i);var o=String(null!=a?a:"");return r(x,{variant:"body2",noWrap:!0,title:o,children:o})}function R(l){var n=function(e){return function(l){var n=C(e,l),t=1==n.normalOptions.autoHeight,i=n.columns.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),c=l.onSelectionChange,s=o(null);d(function(){"client"===l.featureMode&&!t&&void 0!==l.scrollResetToken&&s.current&&(s.current.scrollTop=0)},[l.featureMode,l.scrollResetToken]);var x=N(l.value,e.getterId,n.selectable,l.selectedIds,c),k=x.selectedIds,y=x.isAllSelected,R=x.isSomeSelected,z=x.handleToggleAll,I=x.handleToggleRow,j=u(function(){var e=[T.root,T.normal];return t&&e.push(T.autoHeight),e.join(" ")},[t]);return r(H,{className:j,style:n.rootStyle,children:r(h,{ref:s,className:T.scrollContainer,onScroll:function(e){if(!t){var r,a=e.currentTarget;a.scrollHeight-a.scrollTop-a.clientHeight<=n.nearEndThreshold&&(null===(r=l.onNearEnd)||void 0===r||r.call(l))}},children:a(g,{size:"small",className:T.table,children:[r(v,{className:T.tableHeader,children:a(f,{children:[n.selectable&&r(m,{padding:"checkbox",className:T.tableHeaderCell,sx:{width:48},children:r(p,{checked:y,indeterminate:R,onChange:z})}),n.columns.map(function(e){var l;return r(m,{className:T.tableHeaderCell,align:e.align,sx:w(e,i),children:null!==(l=e.label)&&void 0!==l?l:String(e.field)},String(e.field))})]})}),r(b,{children:l.value.map(function(l,t){var o,c=null!==(o=e.getterId(l,t))&&void 0!==o?o:t,d=k.includes(c),s=n.rowHeight,u=n.cellPadding;return a(f,{hover:!0,sx:{height:s},selected:d,children:[n.selectable&&r(m,{padding:"checkbox",className:T.tableBodyCell,sx:{height:s,padding:u},children:r(p,{checked:d,onChange:function(){return I(c)}})}),n.columns.map(function(e){return r(m,{className:T.tableBodyCell,align:e.align,sx:w(e,i,{height:s,padding:u}),children:r(S,{className:T.tableCellContent,children:M(e,l,t)})},"".concat(String(c),"-").concat(String(e.field)))})]},c)})})]})})})}}(l),i=function(e){return function(l){var n=C(e,l),i=n.columns.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),x=l.onSelectionChange,R=N(l.value,e.getterId,n.selectable,l.selectedIds,x),z=R.selectedIds,I=R.isAllSelected,j=R.isSomeSelected,O=R.handleToggleAll,B=R.handleToggleRow,A=o(null),E=o(null),P=c(0),G=t(P,2),_=G[0],W=G[1],q=c(0),D=t(q,2),F=D[0],J=D[1],K=c(k),L=t(K,2),Q=L[0],U=L[1],V=Math.max(1,n.virtualizedOptions.overscan);d(function(){"client"===l.featureMode&&void 0!==l.scrollResetToken&&(A.current&&(A.current.scrollTop=0),J(0))},[l.featureMode,l.scrollResetToken]),s(function(){if(A.current){var e=function(){var e,l,n=null!==(e=null===(l=A.current)||void 0===l?void 0:l.clientHeight)&&void 0!==e?e:0;W(function(e){return e===n?e:n})};e();var l=new ResizeObserver(function(){return e()});return l.observe(A.current),function(){return l.disconnect()}}},[]),s(function(){var e,l,n=null!==(e=null===(l=E.current)||void 0===l?void 0:l.offsetHeight)&&void 0!==e?e:0;n>0&&n!==Q&&U(n)},[n.columns.length,Q]);var X=u(function(){var e=l.value.length;if(0===e)return{start:0,end:-1,topSpacerHeight:0,bottomSpacerHeight:0};var t=n.rowHeight,r=n.rowSpacing,a=t+r,i=F,o=Math.max(1,_-Q),c=Math.max(0,i-Q),d=Math.max(0,Math.floor(c/a)-V),s=Math.ceil(o/a),u=Math.min(e-1,d+s+2*V);return{start:d,end:u,topSpacerHeight:y(d,t,r),bottomSpacerHeight:y(e-u-1,t,r)}},[l.value.length,Q,V,n,F,_]),Y=X.end>=X.start?l.value.slice(X.start,X.end+1):[],Z=[T.root,T.virtualized].filter(Boolean).join(" ");return r(H,{className:Z,style:n.rootStyle,children:r(h,{ref:A,className:T.scrollContainer,onScroll:function(e){var t,r=e.currentTarget;J(r.scrollTop),r.scrollHeight-r.scrollTop-r.clientHeight<=n.nearEndThreshold&&(null===(t=l.onNearEnd)||void 0===t||t.call(l))},children:a(g,{size:"small",className:T.table,children:[r(v,{className:T.tableHeader,children:a(f,{ref:E,children:[n.selectable&&r(m,{padding:"checkbox",className:T.tableHeaderCell,sx:{width:48},children:r(p,{checked:I,indeterminate:j,onChange:O})}),n.columns.map(function(e){var l;return r(m,{className:T.tableHeaderCell,align:e.align,sx:w(e,i),children:null!==(l=e.label)&&void 0!==l?l:String(e.field)},String(e.field))})]})}),a(b,{children:[X.topSpacerHeight>0?r(f,{className:T.tableSpacerRow,children:r(m,{colSpan:n.columns.length+(n.selectable?1:0),className:T.tableSpacerCell,sx:{height:X.topSpacerHeight,padding:0,border:0}})}):null,Y.map(function(l,t){var o,c=X.start+t,d=null!==(o=e.getterId(l,c))&&void 0!==o?o:c,s=z.includes(d),u=n.rowHeight,h=n.cellPadding;return a(f,{hover:!0,sx:{height:u},selected:s,children:[n.selectable&&r(m,{padding:"checkbox",className:T.tableBodyCell,sx:{height:u,padding:h},children:r(p,{checked:s,onChange:function(){return B(d)}})}),n.columns.map(function(e){return r(m,{className:T.tableBodyCell,align:e.align,sx:w(e,i,{height:u,padding:h}),children:r(S,{className:T.tableCellContent,children:M(e,l,c)})},"".concat(String(d),"-").concat(String(e.field)))})]},d)}),X.bottomSpacerHeight>0?r(f,{className:T.tableSpacerRow,children:r(m,{colSpan:n.columns.length+(n.selectable?1:0),className:T.tableSpacerCell,sx:{height:X.bottomSpacerHeight,padding:0,border:0}})}):null]})]})})})}}(l);return function(t){var a,o,c=null!==(a=null!==(o=t.renderStrategy)&&void 0!==o?o:l.renderStrategy)&&void 0!==a?a:"normal";return r("virtualized"===c?i:n,e({},t))}}function z(e){return function(t){var a,o,c,d=i(l(n().m(function e(){var l,r,a,i,o,c,d,s,u;return n().w(function(e){for(;;)switch(e.n){case 0:if("infiniteScroll"===t.loadMode){e.n=1;break}return e.a(2);case 1:if(null!==(l=t.pagination)&&void 0!==l&&l.hasNext){e.n=2;break}return e.a(2);case 2:if(!t.loading){e.n=3;break}return e.a(2);case 3:return d=null!==(r=null===(a=t.pagination)||void 0===a?void 0:a.page)&&void 0!==r?r:0,s=null!==(i=null===(o=t.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==i?i:20,u=d+1,e.n=4,null===(c=t.onPageChange)||void 0===c?void 0:c.call(t,u,s);case 4:return e.a(2)}},e)})),[t.loadMode,null===(a=t.pagination)||void 0===a?void 0:a.hasNext,null===(o=t.pagination)||void 0===o?void 0:o.page,null===(c=t.pagination)||void 0===c?void 0:c.pageSize,t.loading,t.onPageChange]);return r(e,{value:t.value,columns:t.columns,density:t.density,spacing:t.spacing,renderStrategy:t.renderStrategy,normalOptions:t.normalOptions,virtualizedOptions:t.virtualizedOptions,onNearEnd:"infiniteScroll"===t.loadMode?d:void 0,selectable:t.selectable,selectedIds:t.selectedIds,onSelectionChange:t.onSelectionChange,scrollResetToken:t.scrollResetToken})}}export{R as createViewList,z as createViewListLoading,R as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/data-surface/view-list/index.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, Checkbox, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography } from '@mui/material'\r\nimport { useListSelection, useMergedConfig } from './hooks'\r\nimport { ViewListStyled, viewListClasses as classes } from './styled'\r\nimport { LIST_HEADER_HEIGHT, mapSxTableCell, resolveListSpacerHeight } from './helpers'\r\n// types\r\nimport type { TableContainerProps } from '@mui/material'\r\nimport type { ComponentType, FC, ReactNode } from 'react'\r\nimport type { LoadingModeRule, TPagination } from '../types'\r\nimport type { IListCellParams, IViewListConfig, IViewListProps, TListColumn } from './types'\r\n\r\nexport * from './types'\r\n\r\n//#region Helpers\r\nfunction renderCellValue<T>(column: TListColumn<T>, row: T, index: number): ReactNode {\r\n const currentValue = (row as any)[column.field]\r\n const value = column.valueGetter ? column.valueGetter(currentValue, row, index) : currentValue\r\n const params: IListCellParams<T> = { value, row, index, field: column.field }\r\n if (column.renderCell) return column.renderCell(params)\r\n const valueLabel = String(value ?? '')\r\n return (\r\n <Typography variant='body2' noWrap title={valueLabel}>\r\n {valueLabel}\r\n </Typography>\r\n )\r\n}\r\n\r\n//#endregion\r\n//#region Normal List\r\nfunction createViewListNormal<T>(config: IViewListConfig<T>) {\r\n const ViewListNormal: FC<IViewListProps<T>> = (props) => {\r\n const mergedConfig = useMergedConfig(config, props)\r\n const { normalOptions } = mergedConfig\r\n const isAutoHeight = normalOptions.autoHeight == true\r\n const totalFlex = mergedConfig.columns.reduce((sum, col) => sum + (col.flex && col.flex > 0 ? col.flex : 0), 0)\r\n\r\n const onSelectionChange = props.onSelectionChange\r\n const scrollContainerRef = useRef<HTMLDivElement | null>(null)\r\n\r\n // Reset scroll to top when token changes (client-side filter reset)\r\n useEffect(() => {\r\n const isClient = props.featureMode === 'client'\r\n if (!isClient || isAutoHeight || props.scrollResetToken === undefined) return\r\n if (scrollContainerRef.current) scrollContainerRef.current.scrollTop = 0\r\n }, [props.featureMode, props.scrollResetToken])\r\n\r\n const handleScroll: TableContainerProps['onScroll'] = (e) => {\r\n if (isAutoHeight) return\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 // Use selection hook to manage checkbox state and handlers\r\n const selection = useListSelection(props.value, config.getterId, mergedConfig.selectable, props.selectedIds, onSelectionChange)\r\n const { selectedIds, isAllSelected, isSomeSelected, handleToggleAll, handleToggleRow } = selection\r\n\r\n const rootClasses = useMemo(() => {\r\n const l = [classes.root, classes.normal]\r\n if (isAutoHeight) l.push(classes.autoHeight)\r\n return l.join(' ')\r\n }, [isAutoHeight])\r\n\r\n return (\r\n <ViewListStyled className={rootClasses} style={mergedConfig.rootStyle}>\r\n <TableContainer ref={scrollContainerRef} className={classes.scrollContainer} onScroll={handleScroll}>\r\n <Table size='small' className={classes.table}>\r\n <TableHead className={classes.tableHeader}>\r\n <TableRow>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableHeaderCell} sx={{ width: 48 }}>\r\n <Checkbox checked={isAllSelected} indeterminate={isSomeSelected} onChange={handleToggleAll} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell key={String(col.field)} className={classes.tableHeaderCell} align={col.align} sx={mapSxTableCell(col, totalFlex)}>\r\n {col.label ?? String(col.field)}\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n </TableHead>\r\n <TableBody>\r\n {props.value.map((row, index) => {\r\n const rowKey = config.getterId(row, index) ?? index\r\n const isSelected = selectedIds.includes(rowKey)\r\n const { rowHeight, cellPadding } = mergedConfig\r\n return (\r\n <TableRow key={rowKey} hover sx={{ height: rowHeight }} selected={isSelected}>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableBodyCell} sx={{ height: rowHeight, padding: cellPadding }}>\r\n <Checkbox checked={isSelected} onChange={() => handleToggleRow(rowKey)} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell\r\n key={`${String(rowKey)}-${String(col.field)}`}\r\n className={classes.tableBodyCell}\r\n align={col.align}\r\n sx={mapSxTableCell(col, totalFlex, { height: rowHeight, padding: cellPadding })}\r\n >\r\n <Box className={classes.tableCellContent}>{renderCellValue(col, row, index)}</Box>\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n )\r\n })}\r\n </TableBody>\r\n </Table>\r\n </TableContainer>\r\n </ViewListStyled>\r\n )\r\n }\r\n return ViewListNormal\r\n}\r\n//#endregion\r\n//#region Virtualized List\r\nfunction createViewListVirtualized<T>(config: IViewListConfig<T>) {\r\n const ViewListVirtualized: FC<IViewListProps<T>> = (props) => {\r\n const mergedConfig = useMergedConfig(config, props)\r\n const totalFlex = mergedConfig.columns.reduce((sum, col) => sum + (col.flex && col.flex > 0 ? col.flex : 0), 0)\r\n\r\n const onSelectionChange = props.onSelectionChange\r\n\r\n // Use selection hook to manage checkbox state and handlers\r\n const selection = useListSelection(props.value, config.getterId, mergedConfig.selectable, props.selectedIds, onSelectionChange)\r\n const { selectedIds, isAllSelected, isSomeSelected, handleToggleAll, handleToggleRow } = selection\r\n\r\n const wrapRef = useRef<HTMLDivElement | null>(null)\r\n const headerRowRef = useRef<HTMLTableRowElement | null>(null)\r\n const [containerHeight, setContainerHeight] = useState(0)\r\n const [scrollTopState, setScrollTopState] = useState(0)\r\n const [headerHeight, setHeaderHeight] = useState(LIST_HEADER_HEIGHT)\r\n\r\n const overscan = Math.max(1, mergedConfig.virtualizedOptions.overscan)\r\n\r\n // Reset scroll to top when token changes (client-side filter reset)\r\n useEffect(() => {\r\n if (props.featureMode !== 'client' || props.scrollResetToken === undefined) return\r\n if (wrapRef.current) wrapRef.current.scrollTop = 0\r\n setScrollTopState(0)\r\n }, [props.featureMode, props.scrollResetToken])\r\n\r\n const handleScroll: TableContainerProps['onScroll'] = (e) => {\r\n const t = e.currentTarget\r\n setScrollTopState(t.scrollTop)\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= 80) {\r\n props.onNearEnd?.()\r\n }\r\n }\r\n\r\n useLayoutEffect(() => {\r\n if (!wrapRef.current) return\r\n\r\n const updateSize = () => {\r\n const nextHeight = wrapRef.current?.clientHeight ?? 0\r\n setContainerHeight((prev) => (prev === nextHeight ? prev : nextHeight))\r\n }\r\n\r\n updateSize()\r\n\r\n const observer = new ResizeObserver(() => updateSize())\r\n observer.observe(wrapRef.current)\r\n return () => observer.disconnect()\r\n }, [])\r\n\r\n useLayoutEffect(() => {\r\n const measured = headerRowRef.current?.offsetHeight ?? 0\r\n if (measured > 0 && measured !== headerHeight) {\r\n setHeaderHeight(measured)\r\n }\r\n }, [mergedConfig.columns.length, headerHeight])\r\n\r\n const windowed = useMemo(() => {\r\n const totalItems = props.value.length\r\n if (totalItems === 0) {\r\n return { start: 0, end: -1, topSpacerHeight: 0, bottomSpacerHeight: 0 }\r\n }\r\n const { rowHeight, rowSpacing } = mergedConfig\r\n const rowStride = rowHeight + rowSpacing\r\n const effectiveScrollTop = scrollTopState\r\n const safeViewportHeight = Math.max(1, containerHeight - headerHeight)\r\n const adjustedScrollTop = Math.max(0, effectiveScrollTop - headerHeight)\r\n const start = Math.max(0, Math.floor(adjustedScrollTop / rowStride) - overscan)\r\n const visibleCount = Math.ceil(safeViewportHeight / rowStride)\r\n const end = Math.min(totalItems - 1, start + visibleCount + overscan * 2)\r\n\r\n const topSpacerHeight = resolveListSpacerHeight(start, rowHeight, rowSpacing)\r\n const bottomSpacerHeight = resolveListSpacerHeight(totalItems - end - 1, rowHeight, rowSpacing)\r\n\r\n return { start, end, topSpacerHeight, bottomSpacerHeight }\r\n }, [props.value.length, headerHeight, overscan, mergedConfig, scrollTopState, containerHeight])\r\n\r\n const rowsToRender = windowed.end >= windowed.start ? props.value.slice(windowed.start, windowed.end + 1) : []\r\n const rootClasses = [classes.root, classes.virtualized].filter(Boolean).join(' ')\r\n return (\r\n <ViewListStyled className={rootClasses} style={mergedConfig.rootStyle}>\r\n <TableContainer ref={wrapRef} className={classes.scrollContainer} onScroll={handleScroll}>\r\n <Table size='small' className={classes.table}>\r\n <TableHead className={classes.tableHeader}>\r\n <TableRow ref={headerRowRef}>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableHeaderCell} sx={{ width: 48 }}>\r\n <Checkbox checked={isAllSelected} indeterminate={isSomeSelected} onChange={handleToggleAll} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell key={String(col.field)} className={classes.tableHeaderCell} align={col.align} sx={mapSxTableCell(col, totalFlex)}>\r\n {col.label ?? String(col.field)}\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n </TableHead>\r\n <TableBody>\r\n {windowed.topSpacerHeight > 0 ? (\r\n <TableRow className={classes.tableSpacerRow}>\r\n <TableCell\r\n colSpan={mergedConfig.columns.length + (mergedConfig.selectable ? 1 : 0)}\r\n className={classes.tableSpacerCell}\r\n sx={{ height: windowed.topSpacerHeight, padding: 0, border: 0 }}\r\n />\r\n </TableRow>\r\n ) : null}\r\n\r\n {rowsToRender.map((row, offset) => {\r\n const index = windowed.start + offset\r\n const rowKey = config.getterId(row, index) ?? index\r\n const isSelected = selectedIds.includes(rowKey)\r\n const { rowHeight, cellPadding } = mergedConfig\r\n return (\r\n <TableRow key={rowKey} hover sx={{ height: rowHeight }} selected={isSelected}>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableBodyCell} sx={{ height: rowHeight, padding: cellPadding }}>\r\n <Checkbox checked={isSelected} onChange={() => handleToggleRow(rowKey)} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell\r\n key={`${String(rowKey)}-${String(col.field)}`}\r\n className={classes.tableBodyCell}\r\n align={col.align}\r\n sx={mapSxTableCell(col, totalFlex, { height: rowHeight, padding: cellPadding })}\r\n >\r\n <Box className={classes.tableCellContent}>{renderCellValue(col, row, index)}</Box>\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n )\r\n })}\r\n\r\n {windowed.bottomSpacerHeight > 0 ? (\r\n <TableRow className={classes.tableSpacerRow}>\r\n <TableCell\r\n colSpan={mergedConfig.columns.length + (mergedConfig.selectable ? 1 : 0)}\r\n className={classes.tableSpacerCell}\r\n sx={{ height: windowed.bottomSpacerHeight, padding: 0, border: 0 }}\r\n />\r\n </TableRow>\r\n ) : null}\r\n </TableBody>\r\n </Table>\r\n </TableContainer>\r\n </ViewListStyled>\r\n )\r\n }\r\n return ViewListVirtualized\r\n}\r\n//#endregion\r\n//#region Main\r\nexport function createViewList<T>(config: IViewListConfig<T>) {\r\n const ViewListNormal = createViewListNormal<T>(config)\r\n const ViewListVirtualized = createViewListVirtualized<T>(config)\r\n\r\n const ViewList: FC<IViewListProps<T>> = (props) => {\r\n const renderStrategy = props.renderStrategy ?? config.renderStrategy ?? 'normal'\r\n if (renderStrategy === 'virtualized') {\r\n return <ViewListVirtualized {...props} />\r\n }\r\n return <ViewListNormal {...props} />\r\n }\r\n return ViewList\r\n}\r\n\r\nexport interface IViewListLoadingProps<T> extends IViewListProps<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\nexport function createViewListLoading<T>(ListComponent: ComponentType<IViewListProps<T>>) {\r\n const ViewListLoading: FC<IViewListLoadingProps<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 <ListComponent\r\n value={props.value}\r\n columns={props.columns}\r\n density={props.density}\r\n spacing={props.spacing}\r\n renderStrategy={props.renderStrategy}\r\n normalOptions={props.normalOptions}\r\n virtualizedOptions={props.virtualizedOptions}\r\n onNearEnd={props.loadMode === 'infiniteScroll' ? handleNearEnd : undefined}\r\n selectable={props.selectable}\r\n selectedIds={props.selectedIds}\r\n onSelectionChange={props.onSelectionChange}\r\n scrollResetToken={props.scrollResetToken}\r\n />\r\n )\r\n }\r\n\r\n return ViewListLoading\r\n}\r\n\r\nexport default createViewList\r\n//#endregion\r\n"],"names":["renderCellValue","column","row","index","currentValue","field","value","valueGetter","params","renderCell","valueLabel","String","_jsx","Typography","variant","noWrap","title","createViewList","config","ViewListNormal","props","mergedConfig","useMergedConfig","isAutoHeight","normalOptions","autoHeight","totalFlex","columns","reduce","sum","col","flex","onSelectionChange","scrollContainerRef","useRef","useEffect","featureMode","undefined","scrollResetToken","current","scrollTop","selection","useListSelection","getterId","selectable","selectedIds","isAllSelected","isSomeSelected","handleToggleAll","handleToggleRow","rootClasses","useMemo","l","classes","root","normal","push","join","ViewListStyled","className","style","rootStyle","children","TableContainer","ref","scrollContainer","onScroll","e","_props$onNearEnd","t","currentTarget","scrollHeight","clientHeight","onNearEnd","call","_jsxs","Table","size","table","TableHead","tableHeader","TableRow","TableCell","padding","tableHeaderCell","sx","width","Checkbox","checked","indeterminate","onChange","map","_col$label","align","mapSxTableCell","label","TableBody","_config$getterId","rowKey","isSelected","includes","rowHeight","cellPadding","hover","height","selected","tableBodyCell","Box","tableCellContent","concat","createViewListNormal","ViewListVirtualized","wrapRef","headerRowRef","_useState","useState","_useState2","_slicedToArray","containerHeight","setContainerHeight","_useState3","_useState4","scrollTopState","setScrollTopState","_useState5","LIST_HEADER_HEIGHT","_useState6","headerHeight","setHeaderHeight","overscan","Math","max","virtualizedOptions","useLayoutEffect","updateSize","_wrapRef$current$clie","_wrapRef$current","nextHeight","prev","observer","ResizeObserver","observe","disconnect","_headerRowRef$current","_headerRowRef$current2","measured","offsetHeight","length","windowed","totalItems","start","end","topSpacerHeight","bottomSpacerHeight","rowSpacing","rowStride","effectiveScrollTop","safeViewportHeight","adjustedScrollTop","floor","visibleCount","ceil","min","resolveListSpacerHeight","rowsToRender","slice","virtualized","filter","Boolean","_props$onNearEnd2","_col$label2","tableSpacerRow","colSpan","tableSpacerCell","border","offset","_config$getterId2","createViewListVirtualized","_ref","_props$renderStrategy","renderStrategy","_objectSpread","createViewListLoading","ListComponent","_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","density","spacing"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/data-surface/view-list/index.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'\r\nimport { Box, Checkbox, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Typography } from '@mui/material'\r\nimport { useListSelection, useMergedConfig } from './hooks'\r\nimport { ViewListStyled, viewListClasses as classes } from './styled'\r\nimport { LIST_HEADER_HEIGHT, mapSxTableCell, resolveListSpacerHeight } from './helpers'\r\n// types\r\nimport type { TableContainerProps } from '@mui/material'\r\nimport type { ComponentType, FC, ReactNode } from 'react'\r\nimport type { LoadingModeRule, TPagination } from '../types'\r\nimport type { IListCellParams, IViewListConfig, IViewListProps, TListColumn } from './types'\r\n\r\nexport * from './types'\r\n\r\n//#region Helpers\r\nfunction renderCellValue<T>(column: TListColumn<T>, row: T, index: number): ReactNode {\r\n const currentValue = (row as any)[column.field]\r\n const value = column.valueGetter ? column.valueGetter(currentValue, row, index) : currentValue\r\n const params: IListCellParams<T> = { value, row, index, field: column.field }\r\n if (column.renderCell) return column.renderCell(params)\r\n const valueLabel = String(value ?? '')\r\n return (\r\n <Typography variant='body2' noWrap title={valueLabel}>\r\n {valueLabel}\r\n </Typography>\r\n )\r\n}\r\n\r\n//#endregion\r\n//#region Normal List\r\nfunction createViewListNormal<T>(config: IViewListConfig<T>) {\r\n const ViewListNormal: FC<IViewListProps<T>> = (props) => {\r\n const mergedConfig = useMergedConfig(config, props)\r\n const { normalOptions } = mergedConfig\r\n const isAutoHeight = normalOptions.autoHeight == true\r\n const totalFlex = mergedConfig.columns.reduce((sum, col) => sum + (col.flex && col.flex > 0 ? col.flex : 0), 0)\r\n\r\n const onSelectionChange = props.onSelectionChange\r\n const scrollContainerRef = useRef<HTMLDivElement | null>(null)\r\n\r\n // Reset scroll to top when token changes (client-side filter reset)\r\n useEffect(() => {\r\n const isClient = props.featureMode === 'client'\r\n if (!isClient || isAutoHeight || props.scrollResetToken === undefined) return\r\n if (scrollContainerRef.current) scrollContainerRef.current.scrollTop = 0\r\n }, [props.featureMode, props.scrollResetToken])\r\n\r\n const handleScroll: TableContainerProps['onScroll'] = (e) => {\r\n if (isAutoHeight) return\r\n const t = e.currentTarget\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= mergedConfig.nearEndThreshold) {\r\n props.onNearEnd?.()\r\n }\r\n }\r\n\r\n // Use selection hook to manage checkbox state and handlers\r\n const selection = useListSelection(props.value, config.getterId, mergedConfig.selectable, props.selectedIds, onSelectionChange)\r\n const { selectedIds, isAllSelected, isSomeSelected, handleToggleAll, handleToggleRow } = selection\r\n\r\n const rootClasses = useMemo(() => {\r\n const l = [classes.root, classes.normal]\r\n if (isAutoHeight) l.push(classes.autoHeight)\r\n return l.join(' ')\r\n }, [isAutoHeight])\r\n\r\n return (\r\n <ViewListStyled className={rootClasses} style={mergedConfig.rootStyle}>\r\n <TableContainer ref={scrollContainerRef} className={classes.scrollContainer} onScroll={handleScroll}>\r\n <Table size='small' className={classes.table}>\r\n <TableHead className={classes.tableHeader}>\r\n <TableRow>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableHeaderCell} sx={{ width: 48 }}>\r\n <Checkbox checked={isAllSelected} indeterminate={isSomeSelected} onChange={handleToggleAll} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell key={String(col.field)} className={classes.tableHeaderCell} align={col.align} sx={mapSxTableCell(col, totalFlex)}>\r\n {col.label ?? String(col.field)}\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n </TableHead>\r\n <TableBody>\r\n {props.value.map((row, index) => {\r\n const rowKey = config.getterId(row, index) ?? index\r\n const isSelected = selectedIds.includes(rowKey)\r\n const { rowHeight, cellPadding } = mergedConfig\r\n return (\r\n <TableRow key={rowKey} hover sx={{ height: rowHeight }} selected={isSelected}>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableBodyCell} sx={{ height: rowHeight, padding: cellPadding }}>\r\n <Checkbox checked={isSelected} onChange={() => handleToggleRow(rowKey)} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell\r\n key={`${String(rowKey)}-${String(col.field)}`}\r\n className={classes.tableBodyCell}\r\n align={col.align}\r\n sx={mapSxTableCell(col, totalFlex, { height: rowHeight, padding: cellPadding })}\r\n >\r\n <Box className={classes.tableCellContent}>{renderCellValue(col, row, index)}</Box>\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n )\r\n })}\r\n </TableBody>\r\n </Table>\r\n </TableContainer>\r\n </ViewListStyled>\r\n )\r\n }\r\n return ViewListNormal\r\n}\r\n//#endregion\r\n//#region Virtualized List\r\nfunction createViewListVirtualized<T>(config: IViewListConfig<T>) {\r\n const ViewListVirtualized: FC<IViewListProps<T>> = (props) => {\r\n const mergedConfig = useMergedConfig(config, props)\r\n const totalFlex = mergedConfig.columns.reduce((sum, col) => sum + (col.flex && col.flex > 0 ? col.flex : 0), 0)\r\n\r\n const onSelectionChange = props.onSelectionChange\r\n\r\n // Use selection hook to manage checkbox state and handlers\r\n const selection = useListSelection(props.value, config.getterId, mergedConfig.selectable, props.selectedIds, onSelectionChange)\r\n const { selectedIds, isAllSelected, isSomeSelected, handleToggleAll, handleToggleRow } = selection\r\n\r\n const wrapRef = useRef<HTMLDivElement | null>(null)\r\n const headerRowRef = useRef<HTMLTableRowElement | null>(null)\r\n const [containerHeight, setContainerHeight] = useState(0)\r\n const [scrollTopState, setScrollTopState] = useState(0)\r\n const [headerHeight, setHeaderHeight] = useState(LIST_HEADER_HEIGHT)\r\n\r\n const overscan = Math.max(1, mergedConfig.virtualizedOptions.overscan)\r\n\r\n // Reset scroll to top when token changes (client-side filter reset)\r\n useEffect(() => {\r\n if (props.featureMode !== 'client' || props.scrollResetToken === undefined) return\r\n if (wrapRef.current) wrapRef.current.scrollTop = 0\r\n setScrollTopState(0)\r\n }, [props.featureMode, props.scrollResetToken])\r\n\r\n const handleScroll: TableContainerProps['onScroll'] = (e) => {\r\n const t = e.currentTarget\r\n setScrollTopState(t.scrollTop)\r\n if (t.scrollHeight - t.scrollTop - t.clientHeight <= mergedConfig.nearEndThreshold) {\r\n props.onNearEnd?.()\r\n }\r\n }\r\n\r\n useLayoutEffect(() => {\r\n if (!wrapRef.current) return\r\n\r\n const updateSize = () => {\r\n const nextHeight = wrapRef.current?.clientHeight ?? 0\r\n setContainerHeight((prev) => (prev === nextHeight ? prev : nextHeight))\r\n }\r\n\r\n updateSize()\r\n\r\n const observer = new ResizeObserver(() => updateSize())\r\n observer.observe(wrapRef.current)\r\n return () => observer.disconnect()\r\n }, [])\r\n\r\n useLayoutEffect(() => {\r\n const measured = headerRowRef.current?.offsetHeight ?? 0\r\n if (measured > 0 && measured !== headerHeight) {\r\n setHeaderHeight(measured)\r\n }\r\n }, [mergedConfig.columns.length, headerHeight])\r\n\r\n const windowed = useMemo(() => {\r\n const totalItems = props.value.length\r\n if (totalItems === 0) {\r\n return { start: 0, end: -1, topSpacerHeight: 0, bottomSpacerHeight: 0 }\r\n }\r\n const { rowHeight, rowSpacing } = mergedConfig\r\n const rowStride = rowHeight + rowSpacing\r\n const effectiveScrollTop = scrollTopState\r\n const safeViewportHeight = Math.max(1, containerHeight - headerHeight)\r\n const adjustedScrollTop = Math.max(0, effectiveScrollTop - headerHeight)\r\n const start = Math.max(0, Math.floor(adjustedScrollTop / rowStride) - overscan)\r\n const visibleCount = Math.ceil(safeViewportHeight / rowStride)\r\n const end = Math.min(totalItems - 1, start + visibleCount + overscan * 2)\r\n\r\n const topSpacerHeight = resolveListSpacerHeight(start, rowHeight, rowSpacing)\r\n const bottomSpacerHeight = resolveListSpacerHeight(totalItems - end - 1, rowHeight, rowSpacing)\r\n\r\n return { start, end, topSpacerHeight, bottomSpacerHeight }\r\n }, [props.value.length, headerHeight, overscan, mergedConfig, scrollTopState, containerHeight])\r\n\r\n const rowsToRender = windowed.end >= windowed.start ? props.value.slice(windowed.start, windowed.end + 1) : []\r\n const rootClasses = [classes.root, classes.virtualized].filter(Boolean).join(' ')\r\n return (\r\n <ViewListStyled className={rootClasses} style={mergedConfig.rootStyle}>\r\n <TableContainer ref={wrapRef} className={classes.scrollContainer} onScroll={handleScroll}>\r\n <Table size='small' className={classes.table}>\r\n <TableHead className={classes.tableHeader}>\r\n <TableRow ref={headerRowRef}>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableHeaderCell} sx={{ width: 48 }}>\r\n <Checkbox checked={isAllSelected} indeterminate={isSomeSelected} onChange={handleToggleAll} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell key={String(col.field)} className={classes.tableHeaderCell} align={col.align} sx={mapSxTableCell(col, totalFlex)}>\r\n {col.label ?? String(col.field)}\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n </TableHead>\r\n <TableBody>\r\n {windowed.topSpacerHeight > 0 ? (\r\n <TableRow className={classes.tableSpacerRow}>\r\n <TableCell\r\n colSpan={mergedConfig.columns.length + (mergedConfig.selectable ? 1 : 0)}\r\n className={classes.tableSpacerCell}\r\n sx={{ height: windowed.topSpacerHeight, padding: 0, border: 0 }}\r\n />\r\n </TableRow>\r\n ) : null}\r\n\r\n {rowsToRender.map((row, offset) => {\r\n const index = windowed.start + offset\r\n const rowKey = config.getterId(row, index) ?? index\r\n const isSelected = selectedIds.includes(rowKey)\r\n const { rowHeight, cellPadding } = mergedConfig\r\n return (\r\n <TableRow key={rowKey} hover sx={{ height: rowHeight }} selected={isSelected}>\r\n {mergedConfig.selectable && (\r\n <TableCell padding='checkbox' className={classes.tableBodyCell} sx={{ height: rowHeight, padding: cellPadding }}>\r\n <Checkbox checked={isSelected} onChange={() => handleToggleRow(rowKey)} />\r\n </TableCell>\r\n )}\r\n {mergedConfig.columns.map((col) => (\r\n <TableCell\r\n key={`${String(rowKey)}-${String(col.field)}`}\r\n className={classes.tableBodyCell}\r\n align={col.align}\r\n sx={mapSxTableCell(col, totalFlex, { height: rowHeight, padding: cellPadding })}\r\n >\r\n <Box className={classes.tableCellContent}>{renderCellValue(col, row, index)}</Box>\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n )\r\n })}\r\n\r\n {windowed.bottomSpacerHeight > 0 ? (\r\n <TableRow className={classes.tableSpacerRow}>\r\n <TableCell\r\n colSpan={mergedConfig.columns.length + (mergedConfig.selectable ? 1 : 0)}\r\n className={classes.tableSpacerCell}\r\n sx={{ height: windowed.bottomSpacerHeight, padding: 0, border: 0 }}\r\n />\r\n </TableRow>\r\n ) : null}\r\n </TableBody>\r\n </Table>\r\n </TableContainer>\r\n </ViewListStyled>\r\n )\r\n }\r\n return ViewListVirtualized\r\n}\r\n//#endregion\r\n//#region Main\r\nexport function createViewList<T>(config: IViewListConfig<T>) {\r\n const ViewListNormal = createViewListNormal<T>(config)\r\n const ViewListVirtualized = createViewListVirtualized<T>(config)\r\n\r\n const ViewList: FC<IViewListProps<T>> = (props) => {\r\n const renderStrategy = props.renderStrategy ?? config.renderStrategy ?? 'normal'\r\n if (renderStrategy === 'virtualized') {\r\n return <ViewListVirtualized {...props} />\r\n }\r\n return <ViewListNormal {...props} />\r\n }\r\n return ViewList\r\n}\r\n\r\nexport interface IViewListLoadingProps<T> extends IViewListProps<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\nexport function createViewListLoading<T>(ListComponent: ComponentType<IViewListProps<T>>) {\r\n const ViewListLoading: FC<IViewListLoadingProps<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 <ListComponent\r\n value={props.value}\r\n columns={props.columns}\r\n density={props.density}\r\n spacing={props.spacing}\r\n renderStrategy={props.renderStrategy}\r\n normalOptions={props.normalOptions}\r\n virtualizedOptions={props.virtualizedOptions}\r\n onNearEnd={props.loadMode === 'infiniteScroll' ? handleNearEnd : undefined}\r\n selectable={props.selectable}\r\n selectedIds={props.selectedIds}\r\n onSelectionChange={props.onSelectionChange}\r\n scrollResetToken={props.scrollResetToken}\r\n />\r\n )\r\n }\r\n\r\n return ViewListLoading\r\n}\r\n\r\nexport default createViewList\r\n//#endregion\r\n"],"names":["renderCellValue","column","row","index","currentValue","field","value","valueGetter","params","renderCell","valueLabel","String","_jsx","Typography","variant","noWrap","title","createViewList","config","ViewListNormal","props","mergedConfig","useMergedConfig","isAutoHeight","normalOptions","autoHeight","totalFlex","columns","reduce","sum","col","flex","onSelectionChange","scrollContainerRef","useRef","useEffect","featureMode","undefined","scrollResetToken","current","scrollTop","selection","useListSelection","getterId","selectable","selectedIds","isAllSelected","isSomeSelected","handleToggleAll","handleToggleRow","rootClasses","useMemo","l","classes","root","normal","push","join","ViewListStyled","className","style","rootStyle","children","TableContainer","ref","scrollContainer","onScroll","e","_props$onNearEnd","t","currentTarget","scrollHeight","clientHeight","nearEndThreshold","onNearEnd","call","_jsxs","Table","size","table","TableHead","tableHeader","TableRow","TableCell","padding","tableHeaderCell","sx","width","Checkbox","checked","indeterminate","onChange","map","_col$label","align","mapSxTableCell","label","TableBody","_config$getterId","rowKey","isSelected","includes","rowHeight","cellPadding","hover","height","selected","tableBodyCell","Box","tableCellContent","concat","createViewListNormal","ViewListVirtualized","wrapRef","headerRowRef","_useState","useState","_useState2","_slicedToArray","containerHeight","setContainerHeight","_useState3","_useState4","scrollTopState","setScrollTopState","_useState5","LIST_HEADER_HEIGHT","_useState6","headerHeight","setHeaderHeight","overscan","Math","max","virtualizedOptions","useLayoutEffect","updateSize","_wrapRef$current$clie","_wrapRef$current","nextHeight","prev","observer","ResizeObserver","observe","disconnect","_headerRowRef$current","_headerRowRef$current2","measured","offsetHeight","length","windowed","totalItems","start","end","topSpacerHeight","bottomSpacerHeight","rowSpacing","rowStride","effectiveScrollTop","safeViewportHeight","adjustedScrollTop","floor","visibleCount","ceil","min","resolveListSpacerHeight","rowsToRender","slice","virtualized","filter","Boolean","_props$onNearEnd2","_col$label2","tableSpacerRow","colSpan","tableSpacerCell","border","offset","_config$getterId2","createViewListVirtualized","_ref","_props$renderStrategy","renderStrategy","_objectSpread","createViewListLoading","ListComponent","_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","density","spacing"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../../../../src/data-surface/view-list/types.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport type { ReactNode } from 'react'\r\nimport { DataSurfaceFeatureMode, RenderStrategyRule, TGetterId } from '../types'\r\n\r\n/**\r\n * Props received by the custom render function for each row in List view.\r\n * @template T - The shape of a single data row object.\r\n */\r\nexport interface IViewListItemProps<T> {\r\n /** The data object for this list row. */\r\n value: T\r\n /** Zero-based position of this item in the data array. */\r\n index: number\r\n /** Whether this row is currently selected. */\r\n selected?: boolean\r\n}\r\n\r\n/** Horizontal alignment for list cell content. */\r\nexport type TListAlign = 'left' | 'right' | 'center'\r\n\r\n/**\r\n * Context passed to a column's render callback.\r\n * @template T - The shape of a single data row object.\r\n */\r\nexport interface IListCellParams<T> {\r\n /** Resolved cell value (after valueGetter if provided). */\r\n value: any\r\n /** The full row object. */\r\n row: T\r\n /** Zero-based row index. */\r\n index: number\r\n /** The column field key this cell belongs to. */\r\n field: keyof T\r\n}\r\n\r\n/**\r\n * Definition of a single column in List view.\r\n * @template T - The shape of a single data row object.\r\n */\r\nexport interface TListColumn<T> {\r\n /** Key of the row object this column maps to. */\r\n field: keyof T\r\n /** Column header label shown in the header. */\r\n label?: string\r\n /** Explicit column width. Accepts px number or CSS string (e.g. '120px', '20%'). */\r\n width?: number | string\r\n /** Minimum column width in pixels. */\r\n minWidth?: number\r\n /** Maximum column width in pixels. */\r\n maxWidth?: number\r\n /** Flex grow ratio used when no explicit width is set. */\r\n flex?: number\r\n /** Horizontal alignment of the cell content. */\r\n align?: TListAlign\r\n /** Custom cell render function - receives CellParams, returns ReactNode. */\r\n renderCell?: (params: IListCellParams<T>) => ReactNode\r\n /** Derives a value from the row before it is passed to the render step. */\r\n valueGetter?: (value: string, row: T, index: number) => any\r\n}\r\n/** Columns configuration for List view. */\r\nexport type TListColumns<T> = Partial<Record<keyof T, Omit<TListColumn<T>, 'field'>>>\r\n\r\n/**\r\n * Row density preset for List view.\r\n * Controls the row height and cell padding.\r\n */\r\nexport const ListDensity = {\r\n compact: 'compact',\r\n standard: 'standard',\r\n comfortable: 'comfortable'\r\n} as const\r\nexport type ListDensity = keyof typeof ListDensity\r\n\r\nexport interface IViewListNormalOptions {\r\n /** When true, the list will automatically adjust its height to fit all items. @default false */\r\n autoHeight?: boolean\r\n}\r\n\r\nexport interface IViewListVirtualizedOptions {\r\n /** Number of extra rows rendered outside the viewport as a buffer when using virtualized rendering. @default 6 */\r\n overscan?: number\r\n}\r\n\r\n/** Base configuration for List view. */\r\nexport interface IViewListBase<T> {\r\n /** Custom render function for list rows. If not provided, a default row layout will be used. */\r\n columns?: TListColumns<T>\r\n /** Row height preset or an explicit row height in pixels. @default 'standard' */\r\n density?: number | ListDensity\r\n /** Spacing between rows in pixels. @default 4 */\r\n spacing?: 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 /** Enable row selection with checkboxes. */\r\n selectable?: boolean\r\n /** Options specific to normal rendering strategy. */\r\n normalOptions?: IViewListNormalOptions\r\n /** Options specific to virtualized rendering strategy. */\r\n virtualizedOptions?: IViewListVirtualizedOptions\r\n}\r\n\r\n/** Configuration for List view. */\r\nexport interface IViewListConfig<T> extends IViewListBase<T> {\r\n /** Function to extract unique row ID from a data item. Required for selection and virtualization. */\r\n getterId: TGetterId<T>\r\n}\r\n\r\n/** Props for List view component. */\r\nexport interface IViewListProps<T> extends IViewListBase<T> {\r\n /** The array of data items to display in the list. */\r\n value: T[]\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 /** 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 /** Feature mode for the data surface. */\r\n featureMode?: DataSurfaceFeatureMode\r\n /** When this value changes, the scroll position resets to top (virtualized mode only). */\r\n scrollResetToken?: unknown\r\n}\r\n"],"names":["ListDensity","compact","standard","comfortable"],"mappings":"AAmEO,IAAMA,EAAc,CACzBC,QAAS,UACTC,SAAU,WACVC,YAAa"}
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../../../../src/data-surface/view-list/types.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\nimport type { ReactNode } from 'react'\r\nimport { DataSurfaceFeatureMode, RenderStrategyRule, TGetterId } from '../types'\r\n\r\n/**\r\n * Props received by the custom render function for each row in List view.\r\n * @template T - The shape of a single data row object.\r\n */\r\nexport interface IViewListItemProps<T> {\r\n /** The data object for this list row. */\r\n value: T\r\n /** Zero-based position of this item in the data array. */\r\n index: number\r\n /** Whether this row is currently selected. */\r\n selected?: boolean\r\n}\r\n\r\n/** Horizontal alignment for list cell content. */\r\nexport type TListAlign = 'left' | 'right' | 'center'\r\n\r\n/**\r\n * Context passed to a column's render callback.\r\n * @template T - The shape of a single data row object.\r\n */\r\nexport interface IListCellParams<T> {\r\n /** Resolved cell value (after valueGetter if provided). */\r\n value: any\r\n /** The full row object. */\r\n row: T\r\n /** Zero-based row index. */\r\n index: number\r\n /** The column field key this cell belongs to. */\r\n field: keyof T\r\n}\r\n\r\n/**\r\n * Definition of a single column in List view.\r\n * @template T - The shape of a single data row object.\r\n */\r\nexport interface TListColumn<T> {\r\n /** Key of the row object this column maps to. */\r\n field: keyof T\r\n /** Column header label shown in the header. */\r\n label?: string\r\n /** Explicit column width. Accepts px number or CSS string (e.g. '120px', '20%'). */\r\n width?: number | string\r\n /** Minimum column width in pixels. */\r\n minWidth?: number\r\n /** Maximum column width in pixels. */\r\n maxWidth?: number\r\n /** Flex grow ratio used when no explicit width is set. */\r\n flex?: number\r\n /** Horizontal alignment of the cell content. */\r\n align?: TListAlign\r\n /** Custom cell render function - receives CellParams, returns ReactNode. */\r\n renderCell?: (params: IListCellParams<T>) => ReactNode\r\n /** Derives a value from the row before it is passed to the render step. */\r\n valueGetter?: (value: string, row: T, index: number) => any\r\n}\r\n/** Columns configuration for List view. */\r\nexport type TListColumns<T> = Partial<Record<keyof T, Omit<TListColumn<T>, 'field'>>>\r\n\r\n/**\r\n * Row density preset for List view.\r\n * Controls the row height and cell padding.\r\n */\r\nexport const ListDensity = {\r\n compact: 'compact',\r\n standard: 'standard',\r\n comfortable: 'comfortable'\r\n} as const\r\nexport type ListDensity = keyof typeof ListDensity\r\n\r\nexport interface IViewListNormalOptions {\r\n /** When true, the list will automatically adjust its height to fit all items. @default false */\r\n autoHeight?: boolean\r\n}\r\n\r\nexport interface IViewListVirtualizedOptions {\r\n /** Number of extra rows rendered outside the viewport as a buffer when using virtualized rendering. @default 6 */\r\n overscan?: number\r\n}\r\n\r\n/** Base configuration for List view. */\r\nexport interface IViewListBase<T> {\r\n /** Custom render function for list rows. If not provided, a default row layout will be used. */\r\n columns?: TListColumns<T>\r\n /** Row height preset or an explicit row height in pixels. @default 'standard' */\r\n density?: number | ListDensity\r\n /** Spacing between rows in pixels. @default 4 */\r\n spacing?: 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 /** Enable row selection with checkboxes. */\r\n selectable?: boolean\r\n /** Options specific to normal rendering strategy. */\r\n normalOptions?: IViewListNormalOptions\r\n /** Distance in pixels from the bottom of the scroll container at which `onNearEnd` is triggered. @default 80 */\r\n nearEndThreshold?: number\r\n /** Options specific to virtualized rendering strategy. */\r\n virtualizedOptions?: IViewListVirtualizedOptions\r\n}\r\n\r\n/** Configuration for List view. */\r\nexport interface IViewListConfig<T> extends IViewListBase<T> {\r\n /** Function to extract unique row ID from a data item. Required for selection and virtualization. */\r\n getterId: TGetterId<T>\r\n}\r\n\r\n/** Props for List view component. */\r\nexport interface IViewListProps<T> extends IViewListBase<T> {\r\n /** The array of data items to display in the list. */\r\n value: T[]\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 /** 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 /** Feature mode for the data surface. */\r\n featureMode?: DataSurfaceFeatureMode\r\n /** When this value changes, the scroll position resets to top (virtualized mode only). */\r\n scrollResetToken?: unknown\r\n}\r\n"],"names":["ListDensity","compact","standard","comfortable"],"mappings":"AAmEO,IAAMA,EAAc,CACzBC,QAAS,UACTC,SAAU,WACVC,YAAa"}
|
|
@@ -27,6 +27,7 @@ export interface IViewGridBase<T> {
|
|
|
27
27
|
scrollingThreshold?: number;
|
|
28
28
|
/** Distance in pixels from the bottom of the scroll container at which `onNearEnd` is triggered. @default 80 */
|
|
29
29
|
nearEndThreshold?: number;
|
|
30
|
+
/** Defines the number of columns for different screen sizes. */
|
|
30
31
|
sizes?: TGridSizes;
|
|
31
32
|
/**
|
|
32
33
|
* Controls how the list is rendered into the DOM.
|
|
@@ -11,5 +11,9 @@ export declare const columnsRecordToArray: <T>(value: T[], columnsRecord?: Parti
|
|
|
11
11
|
export declare function resolveListRowHeight(density?: number | ListDensity): number;
|
|
12
12
|
export declare function resolveListCellPadding(density?: number | ListDensity): string;
|
|
13
13
|
export declare function resolveListRowSpacing(spacing?: number): number;
|
|
14
|
+
/** Default near-end threshold in pixels for triggering near-end events. */
|
|
15
|
+
export declare const LIST_DEFAULT_NEAR_END_THRESHOLD = 80;
|
|
16
|
+
/** Resolves the final near-end threshold from multiple optional values. */
|
|
17
|
+
export declare function resolveListNearEndThreshold(...threshold: (number | undefined)[]): number;
|
|
14
18
|
export declare function resolveListSpacerHeight(count: number, rowHeight: number, rowSpacing: number): number;
|
|
15
19
|
export declare const mapSxTableCell: <T>(col: TListColumn<T>, totalFlex: number, sx?: TableCellProps['sx']) => TableCellProps['sx'];
|
|
@@ -7,6 +7,7 @@ export declare function useMergedConfig<T>(config: IViewListConfig<T>, props: IV
|
|
|
7
7
|
rowHeight: number;
|
|
8
8
|
cellPadding: string;
|
|
9
9
|
rowSpacing: number;
|
|
10
|
+
nearEndThreshold: number;
|
|
10
11
|
normalOptions: {
|
|
11
12
|
autoHeight: boolean;
|
|
12
13
|
} & import("./types").IViewListNormalOptions;
|
|
@@ -91,6 +91,8 @@ export interface IViewListBase<T> {
|
|
|
91
91
|
selectable?: boolean;
|
|
92
92
|
/** Options specific to normal rendering strategy. */
|
|
93
93
|
normalOptions?: IViewListNormalOptions;
|
|
94
|
+
/** Distance in pixels from the bottom of the scroll container at which `onNearEnd` is triggered. @default 80 */
|
|
95
|
+
nearEndThreshold?: number;
|
|
94
96
|
/** Options specific to virtualized rendering strategy. */
|
|
95
97
|
virtualizedOptions?: IViewListVirtualizedOptions;
|
|
96
98
|
}
|