dinocollab-core 2.2.10 → 2.2.13

package/dist/src/data-surface/view-list/index.js

@@ -1,2 +1,2 @@
-import{objectSpread2 as e,asyncToGenerator as l,regenerator as n,slicedToArray as a}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as r}from"react/jsx-runtime";import{useCallback as i,useRef as o,useState as c,useLayoutEffect as d,useMemo as s}from"react";import{TableContainer as u,Table as g,TableHead as h,TableRow as v,TableCell as m,Checkbox as f,TableBody as p,Box as b,Typography as S}from"@mui/material";import{useMergedConfig as x,useListSelection as C}from"./hooks.js";import{ViewListStyled as N,viewListClasses as H}from"./styled.js";import{LIST_HEADER_HEIGHT as y,resolveListSpacerHeight as w,mapSxTableCell as k}from"./helpers.js";function T(e,l,n){var a=l[e.field],r=e.valueGetter?e.valueGetter(a,l,n):a,i={value:r,row:l,index:n,field:e.field};if(e.renderCell)return e.renderCell(i);var o=String(null!=r?r:"");return t(S,{variant:"body2",noWrap:!0,title:o,children:o})}function I(l){var n=function(e){return function(l){var n=x(e,l),a=n.columns.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),i=l.onSelectionChange,o=C(l.value,e.getterId,n.selectable,l.selectedIds,i),c=o.selectedIds,d=o.isAllSelected,s=o.isSomeSelected,S=o.handleToggleAll,y=o.handleToggleRow;return t(N,{className:H.root,style:n.rootStyle,children:t(u,{className:H.scrollContainer,onScroll:function(e){var n,a=e.currentTarget;a.scrollHeight-a.scrollTop-a.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:r(g,{size:"small",className:H.table,children:[t(h,{className:H.tableHeader,children:r(v,{children:[n.selectable&&t(m,{padding:"checkbox",className:H.tableHeaderCell,sx:{width:48},children:t(f,{checked:d,indeterminate:s,onChange:S})}),n.columns.map(function(e){var l;return t(m,{className:H.tableHeaderCell,align:e.align,sx:k(e,a),children:null!==(l=e.label)&&void 0!==l?l:String(e.field)},String(e.field))})]})}),t(p,{children:l.value.map(function(l,i){var o,d=null!==(o=e.getterId(l,i))&&void 0!==o?o:i,s=c.includes(d),u=n.rowHeight,g=n.cellPadding;return r(v,{hover:!0,sx:{height:u},selected:s,children:[n.selectable&&t(m,{padding:"checkbox",className:H.tableBodyCell,sx:{height:u,padding:g},children:t(f,{checked:s,onChange:function(){return y(d)}})}),n.columns.map(function(e){return t(m,{className:H.tableBodyCell,align:e.align,sx:k(e,a,{height:u,padding:g}),children:t(b,{className:H.tableCellContent,children:T(e,l,i)})},"".concat(String(d),"-").concat(String(e.field)))})]},d)})})]})})})}}(l),i=function(e){return function(l){var n,i,S=x(e,l),I=S.columns.reduce(function(e,l){return e+(l.flex&&l.flex>0?l.flex:0)},0),M=l.onSelectionChange,j=C(l.value,e.getterId,S.selectable,l.selectedIds,M),z=j.selectedIds,B=j.isAllSelected,A=j.isSomeSelected,P=j.handleToggleAll,R=j.handleToggleRow,E=o(null),G=o(null),_=c(0),O=a(_,2),W=O[0],q=O[1],D=c(0),F=a(D,2),J=F[0],K=F[1],L=c(y),Q=a(L,2),U=Q[0],V=Q[1],X=Math.max(1,null!==(n=null!==(i=l.overscan)&&void 0!==i?i:e.overscan)&&void 0!==n?n:6);d(function(){if(E.current){var e=function(){var e,l,n=null!==(e=null===(l=E.current)||void 0===l?void 0:l.clientHeight)&&void 0!==e?e:0;q(function(e){return e===n?e:n})};e();var l=new ResizeObserver(function(){return e()});return l.observe(E.current),function(){return l.disconnect()}}},[]),d(function(){var e,l,n=null!==(e=null===(l=G.current)||void 0===l?void 0:l.offsetHeight)&&void 0!==e?e:0;n>0&&n!==U&&V(n)},[S.columns.length,U]);var Y=s(function(){var e=l.value.length;if(0===e)return{start:0,end:-1,topSpacerHeight:0,bottomSpacerHeight:0};var n=S.rowHeight,a=S.rowSpacing,t=n+a,r=J,i=Math.max(1,W-U),o=Math.max(0,r-U),c=Math.max(0,Math.floor(o/t)-X),d=Math.ceil(i/t),s=Math.min(e-1,c+d+2*X);return{start:c,end:s,topSpacerHeight:w(c,n,a),bottomSpacerHeight:w(e-s-1,n,a)}},[l.value.length,U,X,S,J,W]),Z=Y.end>=Y.start?l.value.slice(Y.start,Y.end+1):[],$=[H.root,H.virtualized].filter(Boolean).join(" ");return t(N,{className:$,style:S.rootStyle,children:t(u,{ref:E,className:H.scrollContainer,onScroll:function(e){var n,a=e.currentTarget;K(a.scrollTop),a.scrollHeight-a.scrollTop-a.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:r(g,{size:"small",className:H.table,children:[t(h,{className:H.tableHeader,children:r(v,{ref:G,children:[S.selectable&&t(m,{padding:"checkbox",className:H.tableHeaderCell,sx:{width:48},children:t(f,{checked:B,indeterminate:A,onChange:P})}),S.columns.map(function(e){var l;return t(m,{className:H.tableHeaderCell,align:e.align,sx:k(e,I),children:null!==(l=e.label)&&void 0!==l?l:String(e.field)},String(e.field))})]})}),r(p,{children:[Y.topSpacerHeight>0?t(v,{className:H.tableSpacerRow,children:t(m,{colSpan:S.columns.length+(S.selectable?1:0),className:H.tableSpacerCell,sx:{height:Y.topSpacerHeight,padding:0,border:0}})}):null,Z.map(function(l,n){var a,i=Y.start+n,o=null!==(a=e.getterId(l,i))&&void 0!==a?a:i,c=z.includes(o),d=S.rowHeight,s=S.cellPadding;return r(v,{hover:!0,sx:{height:d},selected:c,children:[S.selectable&&t(m,{padding:"checkbox",className:H.tableBodyCell,sx:{height:d,padding:s},children:t(f,{checked:c,onChange:function(){return R(o)}})}),S.columns.map(function(e){return t(m,{className:H.tableBodyCell,align:e.align,sx:k(e,I,{height:d,padding:s}),children:t(b,{className:H.tableCellContent,children:T(e,l,i)})},"".concat(String(o),"-").concat(String(e.field)))})]},o)}),Y.bottomSpacerHeight>0?t(v,{className:H.tableSpacerRow,children:t(m,{colSpan:S.columns.length+(S.selectable?1:0),className:H.tableSpacerCell,sx:{height:Y.bottomSpacerHeight,padding:0,border:0}})}):null]})]})})})}}(l);return function(a){var r,o,c=null!==(r=null!==(o=a.renderStrategy)&&void 0!==o?o:l.renderStrategy)&&void 0!==r?r:"normal";return t("virtualized"===c?i:n,e({},a))}}function M(e){return function(a){var r,o,c,d=i(l(n().m(function e(){var l,t,r,i,o,c,d,s,u;return n().w(function(e){for(;;)switch(e.n){case 0:if("infiniteScroll"===a.loadMode){e.n=1;break}return e.a(2);case 1:if(null!==(l=a.pagination)&&void 0!==l&&l.hasNext){e.n=2;break}return e.a(2);case 2:if(!a.loading){e.n=3;break}return e.a(2);case 3:return d=null!==(t=null===(r=a.pagination)||void 0===r?void 0:r.page)&&void 0!==t?t:0,s=null!==(i=null===(o=a.pagination)||void 0===o?void 0:o.pageSize)&&void 0!==i?i:20,u=d+1,e.n=4,null===(c=a.onPageChange)||void 0===c?void 0:c.call(a,u,s);case 4:return e.a(2)}},e)})),[a.loadMode,null===(r=a.pagination)||void 0===r?void 0:r.hasNext,null===(o=a.pagination)||void 0===o?void 0:o.page,null===(c=a.pagination)||void 0===c?void 0:c.pageSize,a.loading,a.onPageChange]);return t(e,{value:a.value,columns:a.columns,density:a.density,spacing:a.spacing,renderStrategy:a.renderStrategy,overscan:a.overscan,onNearEnd:"infiniteScroll"===a.loadMode?d:void 0,selectable:a.selectable,selectedIds:a.selectedIds,onSelectionChange:a.onSelectionChange})}}export{I as createViewList,M as createViewListLoading,I as default};
+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 g,Table as h,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(g,{ref:s,className:T.scrollContainer,onScroll:function(e){if(!t){var n,r=e.currentTarget;r.scrollHeight-r.scrollTop-r.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))}},children:a(h,{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),P=o(null),E=c(0),G=t(E,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=P.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(g,{ref:A,className:T.scrollContainer,onScroll:function(e){var n,t=e.currentTarget;J(t.scrollTop),t.scrollHeight-t.scrollTop-t.clientHeight<=80&&(null===(n=l.onNearEnd)||void 0===n||n.call(l))},children:a(h,{size:"small",className:T.table,children:[r(v,{className:T.tableHeader,children:a(f,{ref:P,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,g=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:g},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:g}),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};
 //# sourceMappingURL=index.js.map

package/dist/src/data-surface/view-list/index.js.map

@@ -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, 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 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    const handleScroll: TableContainerProps['onScroll'] = (e) => {\r\n      const t = e.currentTarget\r\n      if (t.scrollHeight - t.scrollTop - t.clientHeight <= 80) {\r\n        props.onNearEnd?.()\r\n      }\r\n    }\r\n\r\n    // 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    return (\r\n      <ViewListStyled className={classes.root} style={mergedConfig.rootStyle}>\r\n        <TableContainer 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, props.overscan ?? config.overscan ?? 6)\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        overscan={props.overscan}\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      />\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","totalFlex","columns","reduce","sum","col","flex","onSelectionChange","selection","useListSelection","getterId","selectable","selectedIds","isAllSelected","isSomeSelected","handleToggleAll","handleToggleRow","ViewListStyled","className","classes","root","style","rootStyle","children","TableContainer","scrollContainer","onScroll","e","_props$onNearEnd","t","currentTarget","scrollHeight","scrollTop","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","_ref","_props$overscan","wrapRef","useRef","headerRowRef","_useState","useState","_useState2","_slicedToArray","containerHeight","setContainerHeight","_useState3","_useState4","scrollTopState","setScrollTopState","_useState5","LIST_HEADER_HEIGHT","_useState6","headerHeight","setHeaderHeight","overscan","Math","max","useLayoutEffect","current","updateSize","_wrapRef$current$clie","_wrapRef$current","nextHeight","prev","observer","ResizeObserver","observe","disconnect","_headerRowRef$current","_headerRowRef$current2","measured","offsetHeight","length","windowed","useMemo","totalItems","start","end","topSpacerHeight","bottomSpacerHeight","rowSpacing","rowStride","effectiveScrollTop","safeViewportHeight","adjustedScrollTop","floor","visibleCount","ceil","min","resolveListSpacerHeight","rowsToRender","slice","rootClasses","virtualized","filter","Boolean","join","ref","_props$onNearEnd2","_col$label2","tableSpacerRow","colSpan","tableSpacerCell","border","offset","_config$getterId2","createViewListVirtualized","_ref2","_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","undefined"],"mappings":"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"}
+{"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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"}

package/dist/src/data-surface/view-list/styled.js

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{styled as t,Box as o,alpha as a}from"@mui/material";var i="--DinoViewList-rowSpacing",r={root:"DinoViewList-root",virtualized:"DinoViewList-virtualized",scrollContainer:"DinoViewList-scrollContainer",table:"DinoViewList-table",tableHeader:"DinoViewList-tableHeader",tableHeaderCell:"DinoViewList-tableHeaderCell",tableBodyCell:"DinoViewList-tableBodyCell",tableSpacerRow:"DinoViewList-tableSpacerRow",tableSpacerCell:"DinoViewList-tableSpacerCell",tableCellContent:"DinoViewList-tableCellContent"},l=r,n=t(o)(function(t){var o=t.theme,r=o.palette.mode,n=a(o.palette.common.black,"dark"===r?.24:.08),c="dark"===r?o.palette.grey[800]:o.palette.grey[50];return e(e(e(e(e(e(e(e({},"&.".concat(l.root),{position:"relative",width:"100%",height:"100%",overflow:"hidden"}),".".concat(l.scrollContainer),{position:"absolute",inset:0,overflowY:"auto",padding:o.spacing(0,.5),margin:o.spacing(0,-.5),"&::-webkit-scrollbar":{width:8,height:8},"&::-webkit-scrollbar-thumb":{backgroundColor:o.palette.grey[300],borderRadius:4},"&::-webkit-scrollbar-thumb:hover":{backgroundColor:o.palette.grey[500]}}),".".concat(l.table),{tableLayout:"auto",width:"100%",borderCollapse:"separate",borderSpacing:"0 var(".concat(i,", ").concat(o.spacing(.5),")"),marginTop:"calc(var(".concat(i,", ").concat(o.spacing(.5),") * -1)")}),".".concat(l.tableHeader),{position:"sticky",top:0,zIndex:2,backgroundColor:c}),".".concat(l.tableHeaderCell),{fontWeight:500,paddingTop:o.spacing(1.5),paddingBottom:o.spacing(1.5),overflow:"hidden",borderBottom:"unset"}),".".concat(l.tableBodyCell),{overflow:"hidden",borderTop:"0.5px dashed ".concat(n),borderBottom:"0.5px dashed ".concat(n),"&:first-of-type":{borderLeft:"0.5px dashed ".concat(n),borderRadius:o.spacing(.5,0,0,.5)},"&:last-of-type":{borderRight:"0.5px dashed ".concat(n),borderRadius:o.spacing(0,.5,.5,0)}}),".".concat(l.tableCellContent),{minWidth:0,width:"100%"}),"&.".concat(l.virtualized),{boxSizing:"border-box"})});export{i as VIEW_LIST_ROW_SPACING_VAR,n as ViewListStyled,r as viewListClasses};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{styled as t,Box as o,alpha as a}from"@mui/material";var i="--DinoViewList-rowSpacing",r={root:"DinoViewList-root",normal:"DinoViewList-normal",virtualized:"DinoViewList-virtualized",autoHeight:"DinoViewList-autoHeight",scrollContainer:"DinoViewList-scrollContainer",table:"DinoViewList-table",tableHeader:"DinoViewList-tableHeader",tableHeaderCell:"DinoViewList-tableHeaderCell",tableBodyCell:"DinoViewList-tableBodyCell",tableSpacerRow:"DinoViewList-tableSpacerRow",tableSpacerCell:"DinoViewList-tableSpacerCell",tableCellContent:"DinoViewList-tableCellContent"},l=r,n=t(o)(function(t){var o=t.theme,r=o.palette.mode,n=a(o.palette.common.black,"dark"===r?.24:.08),c="dark"===r?o.palette.grey[800]:o.palette.grey[50];return e(e(e(e(e(e(e(e(e({},"&.".concat(l.root),{position:"relative",width:"100%",height:"100%",overflow:"hidden"}),".".concat(l.scrollContainer),{position:"absolute",inset:0,overflowY:"auto",padding:o.spacing(0,.5),margin:o.spacing(0,-.5),"&::-webkit-scrollbar":{width:8,height:8},"&::-webkit-scrollbar-thumb":{backgroundColor:o.palette.grey[300],borderRadius:4},"&::-webkit-scrollbar-thumb:hover":{backgroundColor:o.palette.grey[500]}}),".".concat(l.table),{tableLayout:"auto",width:"100%",borderCollapse:"separate",borderSpacing:"0 var(".concat(i,", ").concat(o.spacing(.5),")"),marginTop:"calc(var(".concat(i,", ").concat(o.spacing(.5),") * -1)")}),".".concat(l.tableHeader),{position:"sticky",top:0,zIndex:2,backgroundColor:c}),".".concat(l.tableHeaderCell),{fontWeight:500,paddingTop:o.spacing(1.5),paddingBottom:o.spacing(1.5),overflow:"hidden",borderBottom:"unset"}),".".concat(l.tableBodyCell),{overflow:"hidden",borderTop:"0.5px dashed ".concat(n),borderBottom:"0.5px dashed ".concat(n),"&:first-of-type":{borderLeft:"0.5px dashed ".concat(n),borderRadius:o.spacing(.5,0,0,.5)},"&:last-of-type":{borderRight:"0.5px dashed ".concat(n),borderRadius:o.spacing(0,.5,.5,0)}}),".".concat(l.tableCellContent),{minWidth:0,width:"100%"}),"&.".concat(l.virtualized),{boxSizing:"border-box"}),"&.".concat(l.normal,".").concat(l.autoHeight),e({height:"auto",overflow:"visible"},".".concat(l.scrollContainer),{position:"static",inset:"auto",overflowY:"visible"}))});export{i as VIEW_LIST_ROW_SPACING_VAR,n as ViewListStyled,r as viewListClasses};
 //# sourceMappingURL=styled.js.map

package/dist/src/data-surface/view-list/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../src/data-surface/view-list/styled.tsx"],"sourcesContent":["import { alpha, Box, styled } from '@mui/material'\r\n\r\nexport const VIEW_LIST_ROW_SPACING_VAR = '--DinoViewList-rowSpacing'\r\n\r\nexport const viewListClasses = {\r\n  root: 'DinoViewList-root',\r\n  virtualized: 'DinoViewList-virtualized',\r\n  scrollContainer: 'DinoViewList-scrollContainer',\r\n  table: 'DinoViewList-table',\r\n  tableHeader: 'DinoViewList-tableHeader',\r\n  tableHeaderCell: 'DinoViewList-tableHeaderCell',\r\n  tableBodyCell: 'DinoViewList-tableBodyCell',\r\n  tableSpacerRow: 'DinoViewList-tableSpacerRow',\r\n  tableSpacerCell: 'DinoViewList-tableSpacerCell',\r\n  tableCellContent: 'DinoViewList-tableCellContent'\r\n}\r\nconst classes = viewListClasses\r\n\r\nexport const ViewListStyled = styled(Box)(({ theme }) => {\r\n  const mode = theme.palette.mode\r\n  const borderColor = alpha(theme.palette.common.black, mode === 'dark' ? 0.24 : 0.08)\r\n  const bgHeader = mode === 'dark' ? theme.palette.grey[800] : theme.palette.grey[50]\r\n\r\n  return {\r\n    [`&.${classes.root}`]: {\r\n      position: 'relative',\r\n      width: '100%',\r\n      height: '100%',\r\n      overflow: 'hidden'\r\n    },\r\n    [`.${classes.scrollContainer}`]: {\r\n      position: 'absolute',\r\n      inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n      overflowY: 'auto',\r\n      padding: theme.spacing(0, 0.5),\r\n      margin: theme.spacing(0, -0.5),\r\n      // Scrollbar styling\r\n      '&::-webkit-scrollbar': { width: 8, height: 8 },\r\n      '&::-webkit-scrollbar-thumb': { backgroundColor: theme.palette.grey[300], borderRadius: 4 },\r\n      '&::-webkit-scrollbar-thumb:hover': { backgroundColor: theme.palette.grey[500] }\r\n    },\r\n    [`.${classes.table}`]: {\r\n      tableLayout: 'auto',\r\n      width: '100%',\r\n      borderCollapse: 'separate',\r\n      borderSpacing: `0 var(${VIEW_LIST_ROW_SPACING_VAR}, ${theme.spacing(0.5)})`,\r\n      marginTop: `calc(var(${VIEW_LIST_ROW_SPACING_VAR}, ${theme.spacing(0.5)}) * -1)`\r\n    },\r\n    [`.${classes.tableHeader}`]: {\r\n      position: 'sticky',\r\n      top: 0,\r\n      zIndex: 2,\r\n      backgroundColor: bgHeader\r\n    },\r\n    [`.${classes.tableHeaderCell}`]: {\r\n      fontWeight: 500,\r\n      paddingTop: theme.spacing(1.5),\r\n      paddingBottom: theme.spacing(1.5),\r\n      overflow: 'hidden',\r\n      borderBottom: 'unset'\r\n      // borderTop: `1px dashed ${borderColor}`,\r\n      // borderBottom: `1px dashed ${borderColor}`,\r\n      // '&:first-of-type': { borderLeft: `1px dashed ${borderColor}` },\r\n      // '&:last-of-type': { borderRight: `1px dashed ${borderColor}` }\r\n    },\r\n    [`.${classes.tableBodyCell}`]: {\r\n      overflow: 'hidden',\r\n      borderTop: `0.5px dashed ${borderColor}`,\r\n      borderBottom: `0.5px dashed ${borderColor}`,\r\n      '&:first-of-type': {\r\n        borderLeft: `0.5px dashed ${borderColor}`,\r\n        borderRadius: theme.spacing(0.5, 0, 0, 0.5)\r\n      },\r\n      '&:last-of-type': {\r\n        borderRight: `0.5px dashed ${borderColor}`,\r\n        borderRadius: theme.spacing(0, 0.5, 0.5, 0)\r\n      }\r\n    },\r\n    [`.${classes.tableCellContent}`]: {\r\n      minWidth: 0, // Allow shrinking below content size\r\n      width: '100%' // Fill parent TableCell\r\n    },\r\n    // Virtualized styles\r\n    [`&.${classes.virtualized}`]: {\r\n      boxSizing: 'border-box'\r\n    }\r\n  }\r\n})\r\n"],"names":["VIEW_LIST_ROW_SPACING_VAR","viewListClasses","root","virtualized","scrollContainer","table","tableHeader","tableHeaderCell","tableBodyCell","tableSpacerRow","tableSpacerCell","tableCellContent","classes","ViewListStyled","styled","Box","_ref","theme","mode","palette","borderColor","alpha","common","black","bgHeader","grey","_defineProperty","concat","position","width","height","overflow","inset","overflowY","padding","spacing","margin","backgroundColor","borderRadius","tableLayout","borderCollapse","borderSpacing","marginTop","top","zIndex","fontWeight","paddingTop","paddingBottom","borderBottom","borderTop","borderLeft","borderRight","minWidth","boxSizing"],"mappings":"2IAEO,IAAMA,EAA4B,4BAE5BC,EAAkB,CAC7BC,KAAM,oBACNC,YAAa,2BACbC,gBAAiB,+BACjBC,MAAO,qBACPC,YAAa,2BACbC,gBAAiB,+BACjBC,cAAe,6BACfC,eAAgB,8BAChBC,gBAAiB,+BACjBC,iBAAkB,iCAEdC,EAAUX,EAEHY,EAAiBC,EAAOC,EAAPD,CAAY,SAAAE,GAAc,IAAXC,EAAKD,EAALC,MACrCC,EAAOD,EAAME,QAAQD,KACrBE,EAAcC,EAAMJ,EAAME,QAAQG,OAAOC,MAAgB,SAATL,EAAkB,IAAO,KACzEM,EAAoB,SAATN,EAAkBD,EAAME,QAAQM,KAAK,KAAOR,EAAME,QAAQM,KAAK,IAEhF,OAAAC,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EAAA,KAAAC,OACQf,EAAQV,MAAS,CACrB0B,SAAU,WACVC,MAAO,OACPC,OAAQ,OACRC,SAAU,eACXJ,OACIf,EAAQR,iBAAoB,CAC/BwB,SAAU,WACVI,MAAO,EACPC,UAAW,OACXC,QAASjB,EAAMkB,QAAQ,EAAG,IAC1BC,OAAQnB,EAAMkB,QAAQ,GAAG,IAEzB,uBAAwB,CAAEN,MAAO,EAAGC,OAAQ,GAC5C,6BAA8B,CAAEO,gBAAiBpB,EAAME,QAAQM,KAAK,KAAMa,aAAc,GACxF,mCAAoC,CAAED,gBAAiBpB,EAAME,QAAQM,KAAK,YAC3EE,OACIf,EAAQP,OAAU,CACrBkC,YAAa,OACbV,MAAO,OACPW,eAAgB,WAChBC,cAAad,SAAAA,OAAW3B,EAAyB2B,MAAAA,OAAKV,EAAMkB,QAAQ,IAAO,KAC3EO,UAASf,YAAAA,OAAc3B,EAAyB2B,MAAAA,OAAKV,EAAMkB,QAAQ,IAAI,iBACxER,OACIf,EAAQN,aAAgB,CAC3BsB,SAAU,SACVe,IAAK,EACLC,OAAQ,EACRP,gBAAiBb,QAClBG,OACIf,EAAQL,iBAAoB,CAC/BsC,WAAY,IACZC,WAAY7B,EAAMkB,QAAQ,KAC1BY,cAAe9B,EAAMkB,QAAQ,KAC7BJ,SAAU,SACViB,aAAc,cAKfrB,OACIf,EAAQJ,eAAkB,CAC7BuB,SAAU,SACVkB,UAAStB,gBAAAA,OAAkBP,GAC3B4B,aAAYrB,gBAAAA,OAAkBP,GAC9B,kBAAmB,CACjB8B,WAAUvB,gBAAAA,OAAkBP,GAC5BkB,aAAcrB,EAAMkB,QAAQ,GAAK,EAAG,EAAG,KAEzC,iBAAkB,CAChBgB,YAAWxB,gBAAAA,OAAkBP,GAC7BkB,aAAcrB,EAAMkB,QAAQ,EAAG,GAAK,GAAK,UAE5CR,OACIf,EAAQD,kBAAqB,CAChCyC,SAAU,EACVvB,MAAO,cACRF,OAEKf,EAAQT,aAAgB,CAC5BkD,UAAW,cAGjB"}
+{"version":3,"file":"styled.js","sources":["../../../../src/data-surface/view-list/styled.tsx"],"sourcesContent":["import { alpha, Box, styled } from '@mui/material'\r\n\r\nexport const VIEW_LIST_ROW_SPACING_VAR = '--DinoViewList-rowSpacing'\r\n\r\nexport const viewListClasses = {\r\n  root: 'DinoViewList-root',\r\n  normal: 'DinoViewList-normal',\r\n  virtualized: 'DinoViewList-virtualized',\r\n  autoHeight: 'DinoViewList-autoHeight',\r\n  scrollContainer: 'DinoViewList-scrollContainer',\r\n  table: 'DinoViewList-table',\r\n  tableHeader: 'DinoViewList-tableHeader',\r\n  tableHeaderCell: 'DinoViewList-tableHeaderCell',\r\n  tableBodyCell: 'DinoViewList-tableBodyCell',\r\n  tableSpacerRow: 'DinoViewList-tableSpacerRow',\r\n  tableSpacerCell: 'DinoViewList-tableSpacerCell',\r\n  tableCellContent: 'DinoViewList-tableCellContent'\r\n}\r\nconst classes = viewListClasses\r\n\r\nexport const ViewListStyled = styled(Box)(({ theme }) => {\r\n  const mode = theme.palette.mode\r\n  const borderColor = alpha(theme.palette.common.black, mode === 'dark' ? 0.24 : 0.08)\r\n  const bgHeader = mode === 'dark' ? theme.palette.grey[800] : theme.palette.grey[50]\r\n\r\n  return {\r\n    [`&.${classes.root}`]: {\r\n      position: 'relative',\r\n      width: '100%',\r\n      height: '100%',\r\n      overflow: 'hidden'\r\n    },\r\n    [`.${classes.scrollContainer}`]: {\r\n      position: 'absolute',\r\n      inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n      overflowY: 'auto',\r\n      padding: theme.spacing(0, 0.5),\r\n      margin: theme.spacing(0, -0.5),\r\n      // Scrollbar styling\r\n      '&::-webkit-scrollbar': { width: 8, height: 8 },\r\n      '&::-webkit-scrollbar-thumb': { backgroundColor: theme.palette.grey[300], borderRadius: 4 },\r\n      '&::-webkit-scrollbar-thumb:hover': { backgroundColor: theme.palette.grey[500] }\r\n    },\r\n    [`.${classes.table}`]: {\r\n      tableLayout: 'auto',\r\n      width: '100%',\r\n      borderCollapse: 'separate',\r\n      borderSpacing: `0 var(${VIEW_LIST_ROW_SPACING_VAR}, ${theme.spacing(0.5)})`,\r\n      marginTop: `calc(var(${VIEW_LIST_ROW_SPACING_VAR}, ${theme.spacing(0.5)}) * -1)`\r\n    },\r\n    [`.${classes.tableHeader}`]: {\r\n      position: 'sticky',\r\n      top: 0,\r\n      zIndex: 2,\r\n      backgroundColor: bgHeader\r\n    },\r\n    [`.${classes.tableHeaderCell}`]: {\r\n      fontWeight: 500,\r\n      paddingTop: theme.spacing(1.5),\r\n      paddingBottom: theme.spacing(1.5),\r\n      overflow: 'hidden',\r\n      borderBottom: 'unset'\r\n      // borderTop: `1px dashed ${borderColor}`,\r\n      // borderBottom: `1px dashed ${borderColor}`,\r\n      // '&:first-of-type': { borderLeft: `1px dashed ${borderColor}` },\r\n      // '&:last-of-type': { borderRight: `1px dashed ${borderColor}` }\r\n    },\r\n    [`.${classes.tableBodyCell}`]: {\r\n      overflow: 'hidden',\r\n      borderTop: `0.5px dashed ${borderColor}`,\r\n      borderBottom: `0.5px dashed ${borderColor}`,\r\n      '&:first-of-type': {\r\n        borderLeft: `0.5px dashed ${borderColor}`,\r\n        borderRadius: theme.spacing(0.5, 0, 0, 0.5)\r\n      },\r\n      '&:last-of-type': {\r\n        borderRight: `0.5px dashed ${borderColor}`,\r\n        borderRadius: theme.spacing(0, 0.5, 0.5, 0)\r\n      }\r\n    },\r\n    [`.${classes.tableCellContent}`]: {\r\n      minWidth: 0, // Allow shrinking below content size\r\n      width: '100%' // Fill parent TableCell\r\n    },\r\n    // Virtualized styles\r\n    [`&.${classes.virtualized}`]: {\r\n      boxSizing: 'border-box'\r\n    },\r\n    // Auto-height variant: disable the internal scroll container and let the\r\n    // component size expand with content. This makes the table render all\r\n    // rows and removes the internal scrollbar used in 'normal' modes.\r\n    [`&.${classes.normal}.${classes.autoHeight}`]: {\r\n      height: 'auto',\r\n      overflow: 'visible',\r\n      [`.${classes.scrollContainer}`]: {\r\n        position: 'static',\r\n        inset: 'auto',\r\n        overflowY: 'visible'\r\n      }\r\n    }\r\n  }\r\n})\r\n"],"names":["VIEW_LIST_ROW_SPACING_VAR","viewListClasses","root","normal","virtualized","autoHeight","scrollContainer","table","tableHeader","tableHeaderCell","tableBodyCell","tableSpacerRow","tableSpacerCell","tableCellContent","classes","ViewListStyled","styled","Box","_ref","theme","mode","palette","borderColor","alpha","common","black","bgHeader","grey","_defineProperty","concat","position","width","height","overflow","inset","overflowY","padding","spacing","margin","backgroundColor","borderRadius","tableLayout","borderCollapse","borderSpacing","marginTop","top","zIndex","fontWeight","paddingTop","paddingBottom","borderBottom","borderTop","borderLeft","borderRight","minWidth","boxSizing"],"mappings":"2IAEO,IAAMA,EAA4B,4BAE5BC,EAAkB,CAC7BC,KAAM,oBACNC,OAAQ,sBACRC,YAAa,2BACbC,WAAY,0BACZC,gBAAiB,+BACjBC,MAAO,qBACPC,YAAa,2BACbC,gBAAiB,+BACjBC,cAAe,6BACfC,eAAgB,8BAChBC,gBAAiB,+BACjBC,iBAAkB,iCAEdC,EAAUb,EAEHc,EAAiBC,EAAOC,EAAPD,CAAY,SAAAE,GAAc,IAAXC,EAAKD,EAALC,MACrCC,EAAOD,EAAME,QAAQD,KACrBE,EAAcC,EAAMJ,EAAME,QAAQG,OAAOC,MAAgB,SAATL,EAAkB,IAAO,KACzEM,EAAoB,SAATN,EAAkBD,EAAME,QAAQM,KAAK,KAAOR,EAAME,QAAQM,KAAK,IAEhF,OAAAC,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EAAA,KAAAC,OACQf,EAAQZ,MAAS,CACrB4B,SAAU,WACVC,MAAO,OACPC,OAAQ,OACRC,SAAU,eACXJ,OACIf,EAAQR,iBAAoB,CAC/BwB,SAAU,WACVI,MAAO,EACPC,UAAW,OACXC,QAASjB,EAAMkB,QAAQ,EAAG,IAC1BC,OAAQnB,EAAMkB,QAAQ,GAAG,IAEzB,uBAAwB,CAAEN,MAAO,EAAGC,OAAQ,GAC5C,6BAA8B,CAAEO,gBAAiBpB,EAAME,QAAQM,KAAK,KAAMa,aAAc,GACxF,mCAAoC,CAAED,gBAAiBpB,EAAME,QAAQM,KAAK,YAC3EE,OACIf,EAAQP,OAAU,CACrBkC,YAAa,OACbV,MAAO,OACPW,eAAgB,WAChBC,cAAad,SAAAA,OAAW7B,EAAyB6B,MAAAA,OAAKV,EAAMkB,QAAQ,IAAO,KAC3EO,UAASf,YAAAA,OAAc7B,EAAyB6B,MAAAA,OAAKV,EAAMkB,QAAQ,IAAI,iBACxER,OACIf,EAAQN,aAAgB,CAC3BsB,SAAU,SACVe,IAAK,EACLC,OAAQ,EACRP,gBAAiBb,QAClBG,OACIf,EAAQL,iBAAoB,CAC/BsC,WAAY,IACZC,WAAY7B,EAAMkB,QAAQ,KAC1BY,cAAe9B,EAAMkB,QAAQ,KAC7BJ,SAAU,SACViB,aAAc,cAKfrB,OACIf,EAAQJ,eAAkB,CAC7BuB,SAAU,SACVkB,UAAStB,gBAAAA,OAAkBP,GAC3B4B,aAAYrB,gBAAAA,OAAkBP,GAC9B,kBAAmB,CACjB8B,WAAUvB,gBAAAA,OAAkBP,GAC5BkB,aAAcrB,EAAMkB,QAAQ,GAAK,EAAG,EAAG,KAEzC,iBAAkB,CAChBgB,YAAWxB,gBAAAA,OAAkBP,GAC7BkB,aAAcrB,EAAMkB,QAAQ,EAAG,GAAK,GAAK,UAE5CR,OACIf,EAAQD,kBAAqB,CAChCyC,SAAU,EACVvB,MAAO,cACRF,OAEKf,EAAQV,aAAgB,CAC5BmD,UAAW,eACZ1B,KAAAA,OAIKf,EAAQX,OAAM0B,KAAAA,OAAIf,EAAQT,YAAUuB,EAAA,CACxCI,OAAQ,OACRC,SAAU,WAAS,IAAAJ,OACdf,EAAQR,iBAAoB,CAC/BwB,SAAU,SACVI,MAAO,OACPC,UAAW,YAInB"}

package/dist/src/data-surface/view-list/types.js.map

@@ -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 { 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\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  /** 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/** 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}\r\n"],"names":["ListDensity","compact","standard","comfortable"],"mappings":"AAmEO,IAAMA,EAAc,CACzBC,QAAS,UACTC,SAAU,WACVC,YAAa"}
+{"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"}

package/dist/src/data-surface/view-switch-transition.js.map

@@ -1 +1 @@
-{"version":3,"file":"view-switch-transition.js","sources":["../../../src/data-surface/view-switch-transition.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useEffect, useMemo, useRef, useState } from 'react'\r\nimport { CombinedTransition, DEFAULT_ANIMATION, ViewDefault } from './view-switch-transition.units'\r\nimport { viewSwitchTransitionClasses, ViewSwitchTransitionStyled } from './view-switch-transition.units'\r\n// types\r\nimport type { FC, ReactNode, ComponentType } from 'react'\r\nimport { TAnimationConfig } from './view-switch-transition.units'\r\n\r\ntype TViewSwitchTransitionConfig<T extends string = string> = {\r\n  value: T\r\n  label?: string\r\n  Content: ComponentType<{ value: T }>\r\n  icon?: ReactNode\r\n}\r\n\r\ntype TViewSwitchTransitionParam<T extends string = string> = {\r\n  viewA?: TViewSwitchTransitionConfig<T>\r\n  viewB?: TViewSwitchTransitionConfig<T>\r\n  transitionConfig?: TAnimationConfig\r\n}\r\n\r\ninterface IViewSwitchTransitionProps<T extends string = string> {\r\n  value?: T\r\n  viewA?: TViewSwitchTransitionConfig<T>\r\n  viewB?: TViewSwitchTransitionConfig<T>\r\n  transitionConfig?: TAnimationConfig\r\n}\r\n\r\nexport function createViewSwitchTransition<T extends string = string>(config?: TViewSwitchTransitionParam<T>) {\r\n  const classes = viewSwitchTransitionClasses\r\n  const viewAClass = `${classes.view} ${classes.viewA}`\r\n  const viewBClass = `${classes.view} ${classes.viewB}`\r\n\r\n  const ViewSwitchTransition: FC<IViewSwitchTransitionProps<T>> = (props) => {\r\n    const wrapperRef = useRef<HTMLDivElement | null>(null)\r\n    const viewARef = useRef<HTMLDivElement | null>(null)\r\n    const viewBRef = useRef<HTMLDivElement | null>(null)\r\n\r\n    const [mountedMode, setMountedMode] = useState<T | undefined>(props.value ?? config?.viewA?.value)\r\n    const [mountedOpen, setMountedOpen] = useState<boolean>(true)\r\n\r\n    const pendingModeRef = useRef<T | null>(null)\r\n    const exitTimerRef = useRef<number | null>(null)\r\n\r\n    const finalConfig = useMemo(() => {\r\n      return {\r\n        viewA: props.viewA ?? config?.viewA,\r\n        viewB: props.viewB ?? config?.viewB\r\n      }\r\n    }, [props.viewA, props.viewB, config?.viewA, config?.viewB])\r\n\r\n    const animations = useMemo(() => {\r\n      return Object.assign({}, DEFAULT_ANIMATION, config?.transitionConfig, props.transitionConfig ?? {})\r\n    }, [config?.transitionConfig, props.transitionConfig])\r\n\r\n    useEffect(() => {\r\n      if (props.value === mountedMode) return\r\n\r\n      if (exitTimerRef.current) {\r\n        window.clearTimeout(exitTimerRef.current)\r\n        exitTimerRef.current = null\r\n      }\r\n\r\n      pendingModeRef.current = props.value ?? null\r\n\r\n      const currentHeight = wrapperRef.current?.offsetHeight\r\n      if (wrapperRef.current && typeof currentHeight === 'number') {\r\n        wrapperRef.current.style.height = `${currentHeight}px`\r\n        wrapperRef.current.style.transition = `height ${animations.enter}ms ${animations.ease}`\r\n      }\r\n\r\n      setMountedOpen(false)\r\n\r\n      exitTimerRef.current = window.setTimeout(() => {\r\n        const nextMode = pendingModeRef.current\r\n        pendingModeRef.current = null\r\n\r\n        if (nextMode) {\r\n          setMountedMode(nextMode)\r\n          requestAnimationFrame(() => {\r\n            const targetRef = nextMode === finalConfig.viewA?.value ? viewARef : viewBRef\r\n            const nextHeight = targetRef.current?.offsetHeight ?? wrapperRef.current?.offsetHeight ?? 0\r\n            setMountedOpen(true)\r\n\r\n            if (wrapperRef.current) {\r\n              wrapperRef.current.style.height = `${nextHeight}px`\r\n              window.setTimeout(() => {\r\n                if (wrapperRef.current) wrapperRef.current.style.height = ''\r\n              }, animations.enter)\r\n            }\r\n          })\r\n        }\r\n\r\n        exitTimerRef.current = null\r\n      }, animations.exit + animations.hold)\r\n\r\n      return () => {\r\n        if (exitTimerRef.current) {\r\n          window.clearTimeout(exitTimerRef.current)\r\n          exitTimerRef.current = null\r\n        }\r\n      }\r\n    }, [animations, props.value, mountedMode])\r\n\r\n    const ViewAContent = useMemo(() => {\r\n      return finalConfig.viewA?.Content ?? ViewDefault\r\n    }, [finalConfig.viewA?.Content])\r\n\r\n    const ViewBContent = useMemo(() => {\r\n      return finalConfig.viewB?.Content ?? ViewDefault\r\n    }, [finalConfig.viewB?.Content])\r\n\r\n    return (\r\n      <ViewSwitchTransitionStyled className={classes.root}>\r\n        <div ref={wrapperRef} className={classes.viewWrapper}>\r\n          {mountedMode === finalConfig.viewA?.value && (\r\n            <CombinedTransition\r\n              open={mountedOpen}\r\n              timeout={{ enter: animations.enter, exit: animations.exit }}\r\n              mountDelay={animations.mountDelay}\r\n              animationConfig={animations}\r\n              style={{ transformOrigin: animations.transformOriginGrid }}\r\n            >\r\n              <div ref={viewARef} className={viewAClass}>\r\n                <ViewAContent value={finalConfig.viewA?.value!} />\r\n              </div>\r\n            </CombinedTransition>\r\n          )}\r\n\r\n          {mountedMode === finalConfig.viewB?.value && (\r\n            <CombinedTransition\r\n              open={mountedOpen}\r\n              timeout={{ enter: animations.enter, exit: animations.exit }}\r\n              mountDelay={animations.mountDelay}\r\n              animationConfig={animations}\r\n              style={{ transformOrigin: animations.transformOriginTable }}\r\n            >\r\n              <div ref={viewBRef} className={viewBClass}>\r\n                <ViewBContent value={finalConfig.viewB?.value!} />\r\n              </div>\r\n            </CombinedTransition>\r\n          )}\r\n        </div>\r\n      </ViewSwitchTransitionStyled>\r\n    )\r\n  }\r\n\r\n  return ViewSwitchTransition\r\n}\r\n\r\nexport const ViewSwitchTransition = createViewSwitchTransition({})\r\n\r\nexport default ViewSwitchTransition\r\n"],"names":["createViewSwitchTransition","config","classes","viewSwitchTransitionClasses","viewAClass","concat","view","viewA","viewBClass","viewB","props","_props$value","_config$viewA","_finalConfig$viewA3","_finalConfig$viewB2","_finalConfig$viewA4","_finalConfig$viewA5","_finalConfig$viewB3","_finalConfig$viewB4","wrapperRef","useRef","viewARef","viewBRef","_useState","useState","value","_useState2","_slicedToArray","mountedMode","setMountedMode","_useState3","_useState4","mountedOpen","setMountedOpen","pendingModeRef","exitTimerRef","finalConfig","useMemo","_props$viewA","_props$viewB","animations","_props$transitionConf","Object","assign","DEFAULT_ANIMATION","transitionConfig","useEffect","_props$value2","_wrapperRef$current","current","window","clearTimeout","currentHeight","offsetHeight","style","height","transition","enter","ease","setTimeout","nextMode","requestAnimationFrame","_finalConfig$viewA","_ref","_targetRef$current$of","_targetRef$current","_wrapperRef$current2","nextHeight","exit","hold","ViewAContent","_finalConfig$viewA$Co","_finalConfig$viewA2","Content","ViewDefault","ViewBContent","_finalConfig$viewB$Co","_finalConfig$viewB","_jsx","ViewSwitchTransitionStyled","className","root","children","_jsxs","ref","viewWrapper","CombinedTransition","open","timeout","mountDelay","animationConfig","transformOrigin","transformOriginGrid","transformOriginTable"],"mappings":"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"}
+{"version":3,"file":"view-switch-transition.js","sources":["../../../src/data-surface/view-switch-transition.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useEffect, useMemo, useRef, useState } from 'react'\r\nimport { CombinedTransition, DEFAULT_ANIMATION, ViewDefault } from './view-switch-transition.units'\r\nimport { viewSwitchTransitionClasses, ViewSwitchTransitionStyled } from './view-switch-transition.units'\r\n// types\r\nimport type { FC, ReactNode, ComponentType } from 'react'\r\nimport type { TAnimationConfig } from './view-switch-transition.units'\r\n\r\ntype TViewSwitchTransitionConfig<T extends string = string> = {\r\n  value: T\r\n  label?: string\r\n  Content: ComponentType<{ value: T }>\r\n  icon?: ReactNode\r\n}\r\n\r\ntype TViewSwitchTransitionParam<T extends string = string> = {\r\n  viewA?: TViewSwitchTransitionConfig<T>\r\n  viewB?: TViewSwitchTransitionConfig<T>\r\n  transitionConfig?: TAnimationConfig\r\n}\r\n\r\ninterface IViewSwitchTransitionProps<T extends string = string> {\r\n  value?: T\r\n  viewA?: TViewSwitchTransitionConfig<T>\r\n  viewB?: TViewSwitchTransitionConfig<T>\r\n  transitionConfig?: TAnimationConfig\r\n}\r\n\r\nexport function createViewSwitchTransition<T extends string = string>(config?: TViewSwitchTransitionParam<T>) {\r\n  const classes = viewSwitchTransitionClasses\r\n  const viewAClass = `${classes.view} ${classes.viewA}`\r\n  const viewBClass = `${classes.view} ${classes.viewB}`\r\n\r\n  const ViewSwitchTransition: FC<IViewSwitchTransitionProps<T>> = (props) => {\r\n    const wrapperRef = useRef<HTMLDivElement | null>(null)\r\n    const viewARef = useRef<HTMLDivElement | null>(null)\r\n    const viewBRef = useRef<HTMLDivElement | null>(null)\r\n\r\n    const [mountedMode, setMountedMode] = useState<T | undefined>(props.value ?? config?.viewA?.value)\r\n    const [mountedOpen, setMountedOpen] = useState<boolean>(true)\r\n\r\n    const pendingModeRef = useRef<T | null>(null)\r\n    const exitTimerRef = useRef<number | null>(null)\r\n\r\n    const finalConfig = useMemo(() => {\r\n      return {\r\n        viewA: props.viewA ?? config?.viewA,\r\n        viewB: props.viewB ?? config?.viewB\r\n      }\r\n    }, [props.viewA, props.viewB, config?.viewA, config?.viewB])\r\n\r\n    const animations = useMemo(() => {\r\n      return Object.assign({}, DEFAULT_ANIMATION, config?.transitionConfig, props.transitionConfig ?? {})\r\n    }, [config?.transitionConfig, props.transitionConfig])\r\n\r\n    useEffect(() => {\r\n      if (props.value === mountedMode) return\r\n\r\n      if (exitTimerRef.current) {\r\n        window.clearTimeout(exitTimerRef.current)\r\n        exitTimerRef.current = null\r\n      }\r\n\r\n      pendingModeRef.current = props.value ?? null\r\n\r\n      const currentHeight = wrapperRef.current?.offsetHeight\r\n      if (wrapperRef.current && typeof currentHeight === 'number') {\r\n        wrapperRef.current.style.height = `${currentHeight}px`\r\n        wrapperRef.current.style.transition = `height ${animations.enter}ms ${animations.ease}`\r\n      }\r\n\r\n      setMountedOpen(false)\r\n\r\n      exitTimerRef.current = window.setTimeout(() => {\r\n        const nextMode = pendingModeRef.current\r\n        pendingModeRef.current = null\r\n\r\n        if (nextMode) {\r\n          setMountedMode(nextMode)\r\n          requestAnimationFrame(() => {\r\n            const targetRef = nextMode === finalConfig.viewA?.value ? viewARef : viewBRef\r\n            const nextHeight = targetRef.current?.offsetHeight ?? wrapperRef.current?.offsetHeight ?? 0\r\n            setMountedOpen(true)\r\n\r\n            if (wrapperRef.current) {\r\n              wrapperRef.current.style.height = `${nextHeight}px`\r\n              window.setTimeout(() => {\r\n                if (wrapperRef.current) wrapperRef.current.style.height = ''\r\n              }, animations.enter)\r\n            }\r\n          })\r\n        }\r\n\r\n        exitTimerRef.current = null\r\n      }, animations.exit + animations.hold)\r\n\r\n      return () => {\r\n        if (exitTimerRef.current) {\r\n          window.clearTimeout(exitTimerRef.current)\r\n          exitTimerRef.current = null\r\n        }\r\n      }\r\n    }, [animations, props.value, mountedMode])\r\n\r\n    const ViewAContent = useMemo(() => {\r\n      return finalConfig.viewA?.Content ?? ViewDefault\r\n    }, [finalConfig.viewA?.Content])\r\n\r\n    const ViewBContent = useMemo(() => {\r\n      return finalConfig.viewB?.Content ?? ViewDefault\r\n    }, [finalConfig.viewB?.Content])\r\n\r\n    return (\r\n      <ViewSwitchTransitionStyled className={classes.root}>\r\n        <div ref={wrapperRef} className={classes.viewWrapper}>\r\n          {mountedMode === finalConfig.viewA?.value && (\r\n            <CombinedTransition\r\n              open={mountedOpen}\r\n              timeout={{ enter: animations.enter, exit: animations.exit }}\r\n              mountDelay={animations.mountDelay}\r\n              animationConfig={animations}\r\n              style={{ transformOrigin: animations.transformOriginGrid }}\r\n            >\r\n              <div ref={viewARef} className={viewAClass}>\r\n                <ViewAContent value={finalConfig.viewA?.value!} />\r\n              </div>\r\n            </CombinedTransition>\r\n          )}\r\n\r\n          {mountedMode === finalConfig.viewB?.value && (\r\n            <CombinedTransition\r\n              open={mountedOpen}\r\n              timeout={{ enter: animations.enter, exit: animations.exit }}\r\n              mountDelay={animations.mountDelay}\r\n              animationConfig={animations}\r\n              style={{ transformOrigin: animations.transformOriginTable }}\r\n            >\r\n              <div ref={viewBRef} className={viewBClass}>\r\n                <ViewBContent value={finalConfig.viewB?.value!} />\r\n              </div>\r\n            </CombinedTransition>\r\n          )}\r\n        </div>\r\n      </ViewSwitchTransitionStyled>\r\n    )\r\n  }\r\n\r\n  return ViewSwitchTransition\r\n}\r\n\r\nexport const ViewSwitchTransition = createViewSwitchTransition({})\r\n\r\nexport default ViewSwitchTransition\r\n"],"names":["createViewSwitchTransition","config","classes","viewSwitchTransitionClasses","viewAClass","concat","view","viewA","viewBClass","viewB","props","_props$value","_config$viewA","_finalConfig$viewA3","_finalConfig$viewB2","_finalConfig$viewA4","_finalConfig$viewA5","_finalConfig$viewB3","_finalConfig$viewB4","wrapperRef","useRef","viewARef","viewBRef","_useState","useState","value","_useState2","_slicedToArray","mountedMode","setMountedMode","_useState3","_useState4","mountedOpen","setMountedOpen","pendingModeRef","exitTimerRef","finalConfig","useMemo","_props$viewA","_props$viewB","animations","_props$transitionConf","Object","assign","DEFAULT_ANIMATION","transitionConfig","useEffect","_props$value2","_wrapperRef$current","current","window","clearTimeout","currentHeight","offsetHeight","style","height","transition","enter","ease","setTimeout","nextMode","requestAnimationFrame","_finalConfig$viewA","_ref","_targetRef$current$of","_targetRef$current","_wrapperRef$current2","nextHeight","exit","hold","ViewAContent","_finalConfig$viewA$Co","_finalConfig$viewA2","Content","ViewDefault","ViewBContent","_finalConfig$viewB$Co","_finalConfig$viewB","_jsx","ViewSwitchTransitionStyled","className","root","children","_jsxs","ref","viewWrapper","CombinedTransition","open","timeout","mountDelay","animationConfig","transformOrigin","transformOriginGrid","transformOriginTable"],"mappings":"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"}

package/dist/src/filter-bar/components/chip-viewer.js

@@ -1,2 +1,2 @@
-import{defineProperty as e,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as n,Fragment as a}from"react/jsx-runtime";import{useMemo as r,useState as o}from"react";import{styled as l,Box as c,Typography as m,Tooltip as p,Chip as s}from"@mui/material";import u from"@mui/icons-material/MoreHoriz";var h=function(e){var i=e.item,t=e.group,a=e.onRemove,r=t.field,o=t.label,l=i.label||i.value.toString();return n(s,{size:"small",title:l,label:l,className:v.itemChip,onDelete:a?function(){return a(r,i.value)}:void 0},"".concat(o,"-").concat(i.value))},d=function(e){var r=o(!1),l=i(r,2),c=l[0],m=l[1],d=e.group,f=e.onRemove,g=e.enableMinimalesticView,b=d.items;if(g&&b.length>1&&!c)return t(a,{children:[n(p,{title:"".concat(b.length-1," more, click to expand"),placement:"top",arrow:!0,children:n(s,{icon:n(u,{fontSize:"small"}),label:"".concat(b.length-1,"+"),size:"small",className:v.itemChip,style:{opacity:.7},onClick:function(){return m(!0)}})}),n(h,{item:b[b.length-1],group:d,onRemove:f})]});var C=c&&b.length>1;return t(a,{children:[C&&n(p,{title:"Show less",placement:"top",arrow:!0,children:n(s,{icon:n(u,{fontSize:"small"}),size:"small",className:v.itemChip,sx:{opacity:.7,".MuiChip-label":{pl:0}},onClick:function(){return m(!1)}})}),b.map(function(e){return n(h,{item:e,group:d,onRemove:f},e.value.toString())})]})},f=function(e){var i=e.value,a=void 0===i?[]:i,o=e.onRemove,l=e.placement,c=e.label,p=e.enableMinimalesticView,s=[v.item];"vertical"===l?s.push(v.itemVertical):"horizontal"===l&&s.push(v.itemHorizontal);var u=r(function(){return a?(Array.isArray(a)?a:[a]).filter(function(e){return e.items&&e.items.length>0}):[]},[a]);return 0===u.length?null:t(b,{sx:e.sx,className:s.filter(Boolean).join(" "),children:[Boolean(c)&&t(m,{variant:"caption",className:v.itemLabel,children:[c||"ChipViewer",":"]}),n("div",{className:v.itemContent,children:u.map(function(e){var i=e.field,a=e.label;return t("div",{className:v.itemGroup,children:[a&&t(m,{variant:"caption",className:v.itemLabel,children:[a,":"]}),n(d,{group:e,onRemove:o,enableMinimalesticView:p})]},i.toString())})})]})};function g(){return{Group:f}}var v={item:"DinoChipViewer-item",itemLabel:"DinoChipViewer-itemLabel",itemChip:"DinoChipViewer-itemChip",itemGroup:"DinoChipViewer-itemGroup",itemContent:"DinoChipViewer-itemContent",sort:"DinoChipViewer-sort",itemVertical:"DinoChipViewer-itemVertical",itemHorizontal:"DinoChipViewer-itemHorizontal"},b=l(c)(function(i){var t=i.theme;return e(e(e(e(e({},".".concat(v.itemLabel),{fontWeight:700,marginLeft:t.spacing(.5),lineHeight:1}),".".concat(v.itemChip),{borderRadius:"4px",maxWidth:"100px","& .MuiChip-label":{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}}),".".concat(v.itemGroup),{display:"flex",flexWrap:"wrap",border:"dashed 1px ".concat(t.palette.divider),borderRadius:t.shape.borderRadius,alignItems:"center",padding:t.spacing(.25),gap:t.spacing(1)}),".".concat(v.itemContent),e({display:"flex",flexWrap:"wrap",gap:t.spacing(.5)},".".concat(v.itemLabel),{fontWeight:500,color:t.palette.text.secondary})),"&.".concat(v.item),e(e({display:"flex",flexDirection:"row",alignItems:"center",gap:t.spacing(1),padding:t.spacing(.25,.5),"&:last-child":{marginBottom:0,borderBottom:"none",paddingBottom:0}},"&.".concat(v.sort),{".MuiChip-label > div":{display:"flex",alignItems:"center",gap:4},".MuiSvgIcon-root":{fontSize:12}}),"&.".concat(v.itemVertical),{flexDirection:"column",alignItems:"flex-start"}))});export{g as createChipViewers};
+import{defineProperty as e,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as n,Fragment as a}from"react/jsx-runtime";import{useMemo as r,useState as o}from"react";import{styled as l,Box as c,Typography as m,Tooltip as p,Chip as s}from"@mui/material";import u from"@mui/icons-material/MoreHoriz";function h(){var e=function(e){var i=e.item,t=e.group,a=e.onRemove,r=t.field,o=t.label,l=i.label||i.value.toString();return n(s,{size:"small",title:l,label:l,className:d.itemChip,onDelete:a?function(){return a(r,i.value)}:void 0},"".concat(o,"-").concat(i.value))},l=function(r){var l=o(!1),c=i(l,2),m=c[0],h=c[1],f=r.group,g=r.onRemove,v=r.enableMinimalesticView,b=f.items;if(v&&b.length>1&&!m)return t(a,{children:[n(p,{title:"".concat(b.length-1," more, click to expand"),placement:"top",arrow:!0,children:n(s,{icon:n(u,{fontSize:"small"}),label:"".concat(b.length-1,"+"),size:"small",className:d.itemChip,style:{opacity:.7},onClick:function(){return h(!0)}})}),n(e,{item:b[b.length-1],group:f,onRemove:g})]});var C=m&&b.length>1;return t(a,{children:[C&&n(p,{title:"Show less",placement:"top",arrow:!0,children:n(s,{icon:n(u,{fontSize:"small"}),size:"small",className:d.itemChip,sx:{opacity:.7,".MuiChip-label":{pl:0}},onClick:function(){return h(!1)}})}),b.map(function(i){return n(e,{item:i,group:f,onRemove:g},i.value.toString())})]})};return function(e){var i=e.value,a=void 0===i?[]:i,o=e.onRemove,c=e.placement,p=e.label,s=e.enableMinimalesticView,u=[d.item];"vertical"===c?u.push(d.itemVertical):"horizontal"===c&&u.push(d.itemHorizontal);var h=r(function(){return a?(Array.isArray(a)?a:[a]).filter(function(e){return e.items&&e.items.length>0}):[]},[a]);return 0===h.length?null:t(f,{sx:e.sx,className:u.filter(Boolean).join(" "),children:[Boolean(p)&&t(m,{variant:"caption",className:d.itemLabel,children:[p||"ChipViewer",":"]}),n("div",{className:d.itemContent,children:h.map(function(e){var i=e.field,a=e.label;return t("div",{className:d.itemGroup,children:[a&&t(m,{variant:"caption",className:d.itemLabel,children:[a,":"]}),n(l,{group:e,onRemove:o,enableMinimalesticView:s})]},i.toString())})})]})}}var d={item:"DinoChipViewer-item",itemLabel:"DinoChipViewer-itemLabel",itemChip:"DinoChipViewer-itemChip",itemGroup:"DinoChipViewer-itemGroup",itemContent:"DinoChipViewer-itemContent",sort:"DinoChipViewer-sort",itemVertical:"DinoChipViewer-itemVertical",itemHorizontal:"DinoChipViewer-itemHorizontal"},f=l(c)(function(i){var t=i.theme;return e(e(e(e(e({},".".concat(d.itemLabel),{fontWeight:700,marginLeft:t.spacing(.5),lineHeight:1}),".".concat(d.itemChip),{borderRadius:"4px",maxWidth:"100px","& .MuiChip-label":{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}}),".".concat(d.itemGroup),{display:"flex",flexWrap:"wrap",border:"dashed 1px ".concat(t.palette.divider),borderRadius:t.shape.borderRadius,alignItems:"center",padding:t.spacing(.25),gap:t.spacing(1)}),".".concat(d.itemContent),e({display:"flex",flexWrap:"wrap",gap:t.spacing(.5)},".".concat(d.itemLabel),{fontWeight:500,color:t.palette.text.secondary})),"&.".concat(d.item),e(e({display:"flex",flexDirection:"row",alignItems:"center",gap:t.spacing(1),padding:t.spacing(.25,.5),"&:last-child":{marginBottom:0,borderBottom:"none",paddingBottom:0}},"&.".concat(d.sort),{".MuiChip-label > div":{display:"flex",alignItems:"center",gap:4},".MuiSvgIcon-root":{fontSize:12}}),"&.".concat(d.itemVertical),{flexDirection:"column",alignItems:"flex-start"}))});export{h as createChipViewers};
 //# sourceMappingURL=chip-viewer.js.map

package/dist/src/filter-bar/components/chip-viewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"chip-viewer.js","sources":["../../../../src/filter-bar/components/chip-viewer.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useMemo, useState } from 'react'\r\nimport { Box, Button, Chip, IconButton, styled, Tooltip, Typography } from '@mui/material'\r\nimport MoreHorizIcon from '@mui/icons-material/MoreHoriz'\r\n// types\r\nimport type { FC, PropsWithChildren } from 'react'\r\nimport type { SxProps, Theme } from '@mui/material'\r\nimport type { TFieldType, TFieldValid } from '../types'\r\n\r\nexport interface IChipViewerItem<O = any> {\r\n  value: TFieldValid\r\n  label?: string\r\n  other?: O\r\n}\r\n\r\nexport interface TChipViewerGroup<T, O = any> {\r\n  field: TFieldType<T>\r\n  label?: string\r\n  items: IChipViewerItem<O>[]\r\n}\r\n\r\nexport type TOnRemoveFilterFunc<T> = (field: TFieldType<T>, value: TFieldValid) => void\r\n\r\ninterface IChipViewerProps<T> {\r\n  value?: TChipViewerGroup<T> | TChipViewerGroup<T>[]\r\n  onRemove?: TOnRemoveFilterFunc<T>\r\n  placement?: 'vertical' | 'horizontal'\r\n  /** Option to set a custom label for the group. */\r\n  label?: string | boolean\r\n  /** Enable minimalistic view: only show the last item, hide the rest as an icon at the start */\r\n  enableMinimalesticView?: boolean\r\n  sx?: SxProps<Theme>\r\n}\r\n\r\ninterface IChipItemProps<T> extends Pick<IChipViewerProps<T>, 'onRemove'> {\r\n  item: IChipViewerItem\r\n  group: TChipViewerGroup<T>\r\n}\r\n\r\nconst ChipItem: FC<IChipItemProps<any>> = (props) => {\r\n  const { item, group, onRemove } = props\r\n  const { field, label } = group\r\n  const itemLabel = item.label || item.value.toString()\r\n  return (\r\n    <Chip\r\n      key={`${label}-${item.value}`}\r\n      size='small'\r\n      title={itemLabel}\r\n      label={itemLabel}\r\n      className={classes.itemChip}\r\n      onDelete={onRemove ? () => onRemove(field, item.value) : undefined}\r\n    />\r\n  )\r\n}\r\n\r\ninterface IChipListProps<T> extends Pick<IChipViewerProps<T>, 'onRemove' | 'enableMinimalesticView'> {\r\n  group: TChipViewerGroup<T>\r\n}\r\n\r\nconst ChipList: FC<IChipListProps<any>> = (props) => {\r\n  const [expanded, setExpanded] = useState<boolean>(false)\r\n  const { group, onRemove, enableMinimalesticView } = props\r\n  const { items } = group\r\n  const isMinimalistic = enableMinimalesticView && items.length > 1 && !expanded\r\n  if (isMinimalistic) {\r\n    return (\r\n      <>\r\n        <Tooltip title={`${items.length - 1} more, click to expand`} placement='top' arrow>\r\n          <Chip\r\n            icon={<MoreHorizIcon fontSize='small' />}\r\n            label={`${items.length - 1}+`}\r\n            size='small'\r\n            className={classes.itemChip}\r\n            style={{ opacity: 0.7 }}\r\n            onClick={() => setExpanded(true)}\r\n          />\r\n        </Tooltip>\r\n        <ChipItem item={items[items.length - 1]} group={group} onRemove={onRemove} />\r\n      </>\r\n    )\r\n  }\r\n  const isBtnShowLess = expanded && items.length > 1\r\n  return (\r\n    <>\r\n      {isBtnShowLess && (\r\n        <Tooltip title='Show less' placement='top' arrow>\r\n          <Chip\r\n            icon={<MoreHorizIcon fontSize='small' />}\r\n            // label={false}\r\n            size='small'\r\n            className={classes.itemChip}\r\n            sx={{ opacity: 0.7, '.MuiChip-label': { pl: 0 } }}\r\n            onClick={() => setExpanded(false)}\r\n          />\r\n        </Tooltip>\r\n      )}\r\n      {items.map((item) => (\r\n        <ChipItem key={item.value.toString()} item={item} group={group} onRemove={onRemove} />\r\n      ))}\r\n    </>\r\n  )\r\n}\r\n\r\nconst ChipViewer: FC<IChipViewerProps<any>> = (props) => {\r\n  const { value = [], onRemove, placement, label, enableMinimalesticView } = props\r\n\r\n  const rootClasses = [classes.item]\r\n  if (placement === 'vertical') rootClasses.push(classes.itemVertical)\r\n  else if (placement === 'horizontal') rootClasses.push(classes.itemHorizontal)\r\n\r\n  const data = useMemo(() => {\r\n    if (!value) return []\r\n    const valueArray = Array.isArray(value) ? value : [value]\r\n    return valueArray.filter((group) => group.items && group.items.length > 0)\r\n  }, [value])\r\n\r\n  if (data.length === 0) return null\r\n\r\n  return (\r\n    <ItemStyled sx={props.sx} className={rootClasses.filter(Boolean).join(' ')}>\r\n      {Boolean(label) && (\r\n        <Typography variant='caption' className={classes.itemLabel}>\r\n          {label || 'ChipViewer'}:\r\n        </Typography>\r\n      )}\r\n      <div className={classes.itemContent}>\r\n        {data.map((group) => {\r\n          const { field, label } = group\r\n          return (\r\n            <div key={field.toString()} className={classes.itemGroup}>\r\n              {label && (\r\n                <Typography variant='caption' className={classes.itemLabel}>\r\n                  {label}:\r\n                </Typography>\r\n              )}\r\n              <ChipList group={group} onRemove={onRemove} enableMinimalesticView={enableMinimalesticView} />\r\n            </div>\r\n          )\r\n        })}\r\n      </div>\r\n    </ItemStyled>\r\n  )\r\n}\r\n\r\nexport function createChipViewers<T>() {\r\n  return {\r\n    Group: ChipViewer as FC<IChipViewerProps<T>>\r\n  }\r\n}\r\n\r\n//#region styles\r\nconst chipViewerClasses = {\r\n  root: 'DinoChipViewer-root',\r\n  item: 'DinoChipViewer-item',\r\n  itemLabel: 'DinoChipViewer-itemLabel',\r\n  itemChip: 'DinoChipViewer-itemChip',\r\n  itemGroup: 'DinoChipViewer-itemGroup',\r\n  itemContent: 'DinoChipViewer-itemContent',\r\n  sort: 'DinoChipViewer-sort',\r\n  itemVertical: 'DinoChipViewer-itemVertical',\r\n  itemHorizontal: 'DinoChipViewer-itemHorizontal'\r\n}\r\n\r\nconst classes = chipViewerClasses\r\n\r\nconst ItemStyled = styled(Box)(({ theme }) => ({\r\n  [`.${classes.itemLabel}`]: {\r\n    fontWeight: 700,\r\n    marginLeft: theme.spacing(0.5),\r\n    lineHeight: 1\r\n  },\r\n  [`.${classes.itemChip}`]: {\r\n    borderRadius: '4px',\r\n    maxWidth: '100px',\r\n    '& .MuiChip-label': { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }\r\n  },\r\n  [`.${classes.itemGroup}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    border: `dashed 1px ${theme.palette.divider}`,\r\n    borderRadius: theme.shape.borderRadius,\r\n    alignItems: 'center',\r\n    padding: theme.spacing(0.25),\r\n    gap: theme.spacing(1)\r\n  },\r\n  [`.${classes.itemContent}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    gap: theme.spacing(0.5),\r\n    [`.${classes.itemLabel}`]: {\r\n      fontWeight: 500,\r\n      color: theme.palette.text.secondary\r\n    }\r\n  },\r\n  [`&.${classes.item}`]: {\r\n    display: 'flex',\r\n    flexDirection: 'row',\r\n    alignItems: 'center',\r\n    gap: theme.spacing(1),\r\n    padding: theme.spacing(0.25, 0.5),\r\n    // borderBottom: `1px solid ${theme.palette.grey[100]}`,\r\n    '&:last-child': { marginBottom: 0, borderBottom: 'none', paddingBottom: 0 },\r\n    [`&.${classes.sort}`]: {\r\n      '.MuiChip-label > div': { display: 'flex', alignItems: 'center', gap: 4 },\r\n      '.MuiSvgIcon-root': { fontSize: 12 }\r\n    },\r\n    [`&.${classes.itemVertical}`]: { flexDirection: 'column', alignItems: 'flex-start' }\r\n    // [`&.${classes.itemHorizontal}`]: { flexDirection: 'row', alignItems: 'center' }\r\n  }\r\n}))\r\n//#endregion\r\n"],"names":["ChipItem","props","item","group","onRemove","field","label","itemLabel","value","toString","_jsx","Chip","size","title","className","classes","itemChip","onDelete","undefined","concat","ChipList","_useState","useState","_useState2","_slicedToArray","expanded","setExpanded","enableMinimalesticView","items","length","_jsxs","Tooltip","placement","arrow","children","icon","MoreHorizIcon","fontSize","style","opacity","onClick","isBtnShowLess","_Fragment","sx","pl","map","ChipViewer","_props$value","rootClasses","push","itemVertical","itemHorizontal","data","useMemo","Array","isArray","filter","ItemStyled","Boolean","join","Typography","variant","itemContent","itemGroup","createChipViewers","Group","sort","styled","Box","_ref","theme","_defineProperty","fontWeight","marginLeft","spacing","lineHeight","borderRadius","maxWidth","whiteSpace","overflow","textOverflow","display","flexWrap","border","palette","divider","shape","alignItems","padding","gap","color","text","secondary","flexDirection","marginBottom","borderBottom","paddingBottom"],"mappings":"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"}
+{"version":3,"file":"chip-viewer.js","sources":["../../../../src/filter-bar/components/chip-viewer.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useMemo, useState } from 'react'\r\nimport { Box, Chip, styled, Tooltip, Typography } from '@mui/material'\r\nimport MoreHorizIcon from '@mui/icons-material/MoreHoriz'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { SxProps, Theme } from '@mui/material'\r\nimport type { TFieldType, TFieldValid } from '../types'\r\n\r\nexport interface IChipViewerItem<O = any> {\r\n  value: TFieldValid\r\n  label?: string\r\n  other?: O\r\n}\r\n\r\nexport interface TChipViewerGroup<T, O = any> {\r\n  field: TFieldType<T>\r\n  label?: string\r\n  items: IChipViewerItem<O>[]\r\n}\r\n\r\nexport type TOnRemoveFilterFunc<T> = (field: TFieldType<T>, value: TFieldValid) => void\r\n\r\ninterface IChipViewerProps<T> {\r\n  value?: TChipViewerGroup<T> | TChipViewerGroup<T>[]\r\n  onRemove?: TOnRemoveFilterFunc<T>\r\n  placement?: 'vertical' | 'horizontal'\r\n  /** Option to set a custom label for the group. */\r\n  label?: string | boolean\r\n  /** Enable minimalistic view: only show the last item, hide the rest as an icon at the start */\r\n  enableMinimalesticView?: boolean\r\n  sx?: SxProps<Theme>\r\n}\r\n\r\ninterface IChipItemProps<T> extends Pick<IChipViewerProps<T>, 'onRemove'> {\r\n  item: IChipViewerItem\r\n  group: TChipViewerGroup<T>\r\n}\r\n\r\ninterface IChipListProps<T> extends Pick<IChipViewerProps<T>, 'onRemove' | 'enableMinimalesticView'> {\r\n  group: TChipViewerGroup<T>\r\n}\r\n\r\nexport function createChipViewers<T>() {\r\n  const ChipItem: FC<IChipItemProps<T>> = (props) => {\r\n    const { item, group, onRemove } = props\r\n    const { field, label } = group\r\n    const itemLabel = item.label || item.value.toString()\r\n    return (\r\n      <Chip\r\n        key={`${label}-${item.value}`}\r\n        size='small'\r\n        title={itemLabel}\r\n        label={itemLabel}\r\n        className={classes.itemChip}\r\n        onDelete={onRemove ? () => onRemove(field, item.value) : undefined}\r\n      />\r\n    )\r\n  }\r\n\r\n  const ChipList: FC<IChipListProps<T>> = (props) => {\r\n    const [expanded, setExpanded] = useState<boolean>(false)\r\n    const { group, onRemove, enableMinimalesticView } = props\r\n    const { items } = group\r\n    const isMinimalistic = enableMinimalesticView && items.length > 1 && !expanded\r\n    if (isMinimalistic) {\r\n      return (\r\n        <>\r\n          <Tooltip title={`${items.length - 1} more, click to expand`} placement='top' arrow>\r\n            <Chip\r\n              icon={<MoreHorizIcon fontSize='small' />}\r\n              label={`${items.length - 1}+`}\r\n              size='small'\r\n              className={classes.itemChip}\r\n              style={{ opacity: 0.7 }}\r\n              onClick={() => setExpanded(true)}\r\n            />\r\n          </Tooltip>\r\n          <ChipItem item={items[items.length - 1]} group={group} onRemove={onRemove} />\r\n        </>\r\n      )\r\n    }\r\n    const isBtnShowLess = expanded && items.length > 1\r\n    return (\r\n      <>\r\n        {isBtnShowLess && (\r\n          <Tooltip title='Show less' placement='top' arrow>\r\n            <Chip\r\n              icon={<MoreHorizIcon fontSize='small' />}\r\n              // label={false}\r\n              size='small'\r\n              className={classes.itemChip}\r\n              sx={{ opacity: 0.7, '.MuiChip-label': { pl: 0 } }}\r\n              onClick={() => setExpanded(false)}\r\n            />\r\n          </Tooltip>\r\n        )}\r\n        {items.map((item) => (\r\n          <ChipItem key={item.value.toString()} item={item} group={group} onRemove={onRemove} />\r\n        ))}\r\n      </>\r\n    )\r\n  }\r\n\r\n  const ChipViewer: FC<IChipViewerProps<T>> = (props) => {\r\n    const { value = [], onRemove, placement, label, enableMinimalesticView } = props\r\n\r\n    const rootClasses = [classes.item]\r\n    if (placement === 'vertical') rootClasses.push(classes.itemVertical)\r\n    else if (placement === 'horizontal') rootClasses.push(classes.itemHorizontal)\r\n\r\n    const data = useMemo(() => {\r\n      if (!value) return []\r\n      const valueArray = Array.isArray(value) ? value : [value]\r\n      return valueArray.filter((group) => group.items && group.items.length > 0)\r\n    }, [value])\r\n\r\n    if (data.length === 0) return null\r\n\r\n    return (\r\n      <ItemStyled sx={props.sx} className={rootClasses.filter(Boolean).join(' ')}>\r\n        {Boolean(label) && (\r\n          <Typography variant='caption' className={classes.itemLabel}>\r\n            {label || 'ChipViewer'}:\r\n          </Typography>\r\n        )}\r\n        <div className={classes.itemContent}>\r\n          {data.map((group) => {\r\n            const { field, label } = group\r\n            return (\r\n              <div key={field.toString()} className={classes.itemGroup}>\r\n                {label && (\r\n                  <Typography variant='caption' className={classes.itemLabel}>\r\n                    {label}:\r\n                  </Typography>\r\n                )}\r\n                <ChipList group={group} onRemove={onRemove} enableMinimalesticView={enableMinimalesticView} />\r\n              </div>\r\n            )\r\n          })}\r\n        </div>\r\n      </ItemStyled>\r\n    )\r\n  }\r\n\r\n  return ChipViewer\r\n}\r\n\r\n//#region styles\r\nconst chipViewerClasses = {\r\n  root: 'DinoChipViewer-root',\r\n  item: 'DinoChipViewer-item',\r\n  itemLabel: 'DinoChipViewer-itemLabel',\r\n  itemChip: 'DinoChipViewer-itemChip',\r\n  itemGroup: 'DinoChipViewer-itemGroup',\r\n  itemContent: 'DinoChipViewer-itemContent',\r\n  sort: 'DinoChipViewer-sort',\r\n  itemVertical: 'DinoChipViewer-itemVertical',\r\n  itemHorizontal: 'DinoChipViewer-itemHorizontal'\r\n}\r\n\r\nconst classes = chipViewerClasses\r\n\r\nconst ItemStyled = styled(Box)(({ theme }) => ({\r\n  [`.${classes.itemLabel}`]: {\r\n    fontWeight: 700,\r\n    marginLeft: theme.spacing(0.5),\r\n    lineHeight: 1\r\n  },\r\n  [`.${classes.itemChip}`]: {\r\n    borderRadius: '4px',\r\n    maxWidth: '100px',\r\n    '& .MuiChip-label': { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }\r\n  },\r\n  [`.${classes.itemGroup}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    border: `dashed 1px ${theme.palette.divider}`,\r\n    borderRadius: theme.shape.borderRadius,\r\n    alignItems: 'center',\r\n    padding: theme.spacing(0.25),\r\n    gap: theme.spacing(1)\r\n  },\r\n  [`.${classes.itemContent}`]: {\r\n    display: 'flex',\r\n    flexWrap: 'wrap',\r\n    gap: theme.spacing(0.5),\r\n    [`.${classes.itemLabel}`]: {\r\n      fontWeight: 500,\r\n      color: theme.palette.text.secondary\r\n    }\r\n  },\r\n  [`&.${classes.item}`]: {\r\n    display: 'flex',\r\n    flexDirection: 'row',\r\n    alignItems: 'center',\r\n    gap: theme.spacing(1),\r\n    padding: theme.spacing(0.25, 0.5),\r\n    // borderBottom: `1px solid ${theme.palette.grey[100]}`,\r\n    '&:last-child': { marginBottom: 0, borderBottom: 'none', paddingBottom: 0 },\r\n    [`&.${classes.sort}`]: {\r\n      '.MuiChip-label > div': { display: 'flex', alignItems: 'center', gap: 4 },\r\n      '.MuiSvgIcon-root': { fontSize: 12 }\r\n    },\r\n    [`&.${classes.itemVertical}`]: { flexDirection: 'column', alignItems: 'flex-start' }\r\n    // [`&.${classes.itemHorizontal}`]: { flexDirection: 'row', alignItems: 'center' }\r\n  }\r\n}))\r\n//#endregion\r\n"],"names":["createChipViewers","ChipItem","props","item","group","onRemove","field","label","itemLabel","value","toString","_jsx","Chip","size","title","className","classes","itemChip","onDelete","undefined","concat","ChipList","_useState","useState","_useState2","_slicedToArray","expanded","setExpanded","enableMinimalesticView","items","length","_jsxs","Tooltip","placement","arrow","children","icon","MoreHorizIcon","fontSize","style","opacity","onClick","isBtnShowLess","_Fragment","sx","pl","map","_props$value","rootClasses","push","itemVertical","itemHorizontal","data","useMemo","Array","isArray","filter","ItemStyled","Boolean","join","Typography","variant","itemContent","itemGroup","sort","styled","Box","_ref","theme","_defineProperty","fontWeight","marginLeft","spacing","lineHeight","borderRadius","maxWidth","whiteSpace","overflow","textOverflow","display","flexWrap","border","palette","divider","shape","alignItems","padding","gap","color","text","secondary","flexDirection","marginBottom","borderBottom","paddingBottom"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-sort.js

@@ -1,2 +1,2 @@
-import{defineProperty as o,objectSpread2 as r,slicedToArray as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as e,Fragment as i}from"react/jsx-runtime";import{useState as l,useContext as a,useMemo as c,createRef as s}from"react";import{styled as u,Box as d,Tooltip as m,IconButton as f,Badge as p,MenuList as h,MenuItem as v,Typography as S,Button as g}from"@mui/material";import b from"@mui/icons-material/SwapVert";import y from"@mui/icons-material/ArrowUpward";import w from"@mui/material/ClickAwayListener";import I from"@mui/icons-material/ArrowDownward";import{KeySpecial as j}from"../types.js";import{ShufffleIcon as P}from"./units.js";import{useFilterActions as x}from"../hooks.js";import{mapSpecialLabel as C}from"../helpers.js";import{FilterBarContext as k}from"../index.context.js";import{PopperCustom as z,PopperContent as D,PopperFooter as A}from"./popper-custom.js";var B={asc:"Ascending",desc:"Descending"},F=function(o){return o?B[o]:""},N={asc:t(y,{fontSize:"small"}),desc:t(I,{fontSize:"small"})},T=function(o){return o?N[o]:null};function O(o){var u=o.enableShuffle,d=o.shufflePosition,y=void 0===d?"right":d,I=E,B=function(o){var t=o.fields,e=r({},t),i=[];return Object.entries(e).forEach(function(o){var r=n(o,2),t=r[0],e=r[1];i.push({field:t,label:null==e?void 0:e.label})}),i}(o);return function(d){var N=s(),O=l(null),E=n(O,2),H=E[0],L=E[1],M=Boolean(H),U=a(k),V=x(U),W=V.getSort,q=V.changeSort,G=V.removeSort,J=c(function(){var r,n=W(),t=(null==n?void 0:n.field)===j.sortShuffle,e=Boolean(null==n?void 0:n.field)&&!t,i=o.fields[null==n?void 0:n.field],l=null!==(r=null==i?void 0:i.label)&&void 0!==r?r:null==n?void 0:n.field.toString(),a=e?"Sorted by ".concat(l," ").concat(null==n?void 0:n.direction):"Sort";return{field:null==n?void 0:n.field,direction:null==n?void 0:n.direction,hasSort:e,hasShuffleSort:t,title:a}},[W]),K=c(function(){var n,t,e=r(r({},d.slots),{},{rootProps:r(r({},null===(n=d.slots)||void 0===n?void 0:n.rootProps),{},{sx:r(r({},d.sx),null===(t=d.slots)||void 0===t||null===(t=t.rootProps)||void 0===t?void 0:t.sx)})});return Object.assign({popperProps:{},rootProps:{}},o,e)},[d.slots,d.sx]),Q=function(){L(null)},R=function(){Q(),setTimeout(function(){G()},100)},X=function(){if(!u)return null;var o=C[j.sortShuffle],n=null!=J&&J.hasShuffleSort?"ON":"OFF",e=null!=J&&J.hasShuffleSort?"primary":"default";return t(m,{title:"".concat(o," - ").concat(n),arrow:!0,placement:"top",children:t(f,r(r({color:e,size:"small",onClick:function(){return q(j.sortShuffle)}},K.buttonShuffleProps),{},{children:t(p,{variant:"dot",color:"primary",invisible:!(null!=J&&J.hasShuffleSort),children:t(P,{fontSize:"small"})})}))})};return e(i,{children:["left"===y&&X(),t(w,{onClickAway:Q,children:e(_,r(r({className:I.root},K.rootProps),{},{children:[t(m,{title:null==J?void 0:J.title,arrow:!0,placement:"top",children:t(f,r(r({size:"small",ref:N,onClick:function(){L(N.current)}},K.buttonSortProps),{},{children:t(p,{variant:"dot",color:"primary",invisible:!(null!=J&&J.hasSort),children:t(b,{fontSize:"small"})})}))}),t(z,r(r({open:M,anchorEl:H,placement:"bottom",transition:!0,disablePortal:!0},K.popperProps),{},{children:e(D,{title:"Sort by",onClose:Q,children:[t(h,{className:I.menu,children:B.map(function(o){var r,n=o.field.toString();if(!n)return null;var i=null!==(r=o.label)&&void 0!==r?r:n.toString(),l=(null==J?void 0:J.field)===o.field,a=l?J.direction:void 0;return t(v,{className:I.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return r=o.field,Q(),void setTimeout(function(){q(r)},100);var r},selected:l,children:t(m,{title:F(a),placement:"right",arrow:!0,children:e("div",{className:I.menuItemInner,children:[t(S,{variant:"body2",children:i}),T(a)]})})},n)})}),e(A,{children:[t(g,{color:"inherit",onClick:R,children:"Clear"}),t(g,{color:"primary",onClick:Q,children:"Done"})]})]})}))]}))}),"right"===y&&X()]})}}var E={root:"DinoFilterSort-root",menu:"DinoFilterSort-menu",menuItem:"DinoFilterSort-menuItem",menuItemInner:"DinoFilterSort-menuItemInner"},_=u(d)(function(r){var n=r.theme;return o(o(o({},"&.".concat(E.menu),{minWidth:"200px",padding:0}),".".concat(E.menuItem),o({paddingTop:0,paddingBottom:0,"&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}},".MuiSvgIcon-root",{fontSize:16})),".".concat(E.menuItemInner),{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",gap:n.spacing(1),paddingTop:n.spacing(.75),paddingBottom:n.spacing(.75)})});export{_ as FilterSortStyled,O as createFilterSort,E as filterSortClasses,T as getSortDirectionIcon,F as getSortDirectionLabel,N as mapSortDirectionIcon,B as mapSortDirectionLabel};
+import{defineProperty as o,objectSpread2 as r,slicedToArray as n}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useState as l,useContext as a,useMemo as c,createRef as s}from"react";import{styled as u,Box as d,Tooltip as m,IconButton as f,Badge as p,MenuList as h,MenuItem as v,Typography as S,Button as g}from"@mui/material";import b from"@mui/icons-material/SwapVert";import y from"@mui/icons-material/ArrowUpward";import w from"@mui/material/ClickAwayListener";import I from"@mui/icons-material/ArrowDownward";import{KeySpecial as j}from"../types.js";import{ShufffleIcon as P}from"./icons.js";import{useFilterActions as x}from"../hooks.js";import{mapSpecialLabel as C}from"../helpers.js";import{FilterBarContext as k}from"../index.context.js";import{PopperCustom as z,PopperContent as D,PopperFooter as A}from"./popper-custom.js";var B={asc:"Ascending",desc:"Descending"},F=function(o){return o?B[o]:""},N={asc:e(y,{fontSize:"small"}),desc:e(I,{fontSize:"small"})},T=function(o){return o?N[o]:null};function O(o){var u=o.enableShuffle,d=o.shufflePosition,y=void 0===d?"right":d,I=E,B=function(o){var e=o.fields,t=r({},e),i=[];return Object.entries(t).forEach(function(o){var r=n(o,2),e=r[0],t=r[1];i.push({field:e,label:null==t?void 0:t.label})}),i}(o);return function(d){var N=s(),O=l(null),E=n(O,2),H=E[0],L=E[1],M=Boolean(H),U=a(k),V=x(U),W=V.getSort,q=V.changeSort,G=V.removeSort,J=c(function(){var r,n=W(),e=(null==n?void 0:n.field)===j.sortShuffle,t=Boolean(null==n?void 0:n.field)&&!e,i=o.fields[null==n?void 0:n.field],l=null!==(r=null==i?void 0:i.label)&&void 0!==r?r:null==n?void 0:n.field.toString(),a=t?"Sorted by ".concat(l," ").concat(null==n?void 0:n.direction):"Sort";return{field:null==n?void 0:n.field,direction:null==n?void 0:n.direction,hasSort:t,hasShuffleSort:e,title:a}},[W]),K=c(function(){var n,e,t=r(r({},d.slots),{},{rootProps:r(r({},null===(n=d.slots)||void 0===n?void 0:n.rootProps),{},{sx:r(r({},d.sx),null===(e=d.slots)||void 0===e||null===(e=e.rootProps)||void 0===e?void 0:e.sx)})});return Object.assign({popperProps:{},rootProps:{}},o,t)},[d.slots,d.sx]),Q=function(){L(null)},R=function(){Q(),setTimeout(function(){G()},100)},X=function(){if(!u)return null;var o=C[j.sortShuffle],n=null!=J&&J.hasShuffleSort?"ON":"OFF",t=null!=J&&J.hasShuffleSort?"primary":"default";return e(m,{title:"".concat(o," - ").concat(n),arrow:!0,placement:"top",children:e(f,r(r({color:t,size:"small",onClick:function(){return q(j.sortShuffle)}},K.buttonShuffleProps),{},{children:e(p,{variant:"dot",color:"primary",invisible:!(null!=J&&J.hasShuffleSort),children:e(P,{fontSize:"small"})})}))})};return t(i,{children:["left"===y&&X(),e(w,{onClickAway:Q,children:t(_,r(r({className:I.root},K.rootProps),{},{children:[e(m,{title:null==J?void 0:J.title,arrow:!0,placement:"top",children:e(f,r(r({size:"small",ref:N,onClick:function(){L(N.current)}},K.buttonSortProps),{},{children:e(p,{variant:"dot",color:"primary",invisible:!(null!=J&&J.hasSort),children:e(b,{fontSize:"small"})})}))}),e(z,r(r({open:M,anchorEl:H,placement:"bottom",transition:!0,disablePortal:!0},K.popperProps),{},{children:t(D,{title:"Sort by",onClose:Q,children:[e(h,{className:I.menu,children:B.map(function(o){var r,n=o.field.toString();if(!n)return null;var i=null!==(r=o.label)&&void 0!==r?r:n.toString(),l=(null==J?void 0:J.field)===o.field,a=l?J.direction:void 0;return e(v,{className:I.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return r=o.field,Q(),void setTimeout(function(){q(r)},100);var r},selected:l,children:e(m,{title:F(a),placement:"right",arrow:!0,children:t("div",{className:I.menuItemInner,children:[e(S,{variant:"body2",children:i}),T(a)]})})},n)})}),t(A,{children:[e(g,{color:"inherit",onClick:R,children:"Clear"}),e(g,{color:"primary",onClick:Q,children:"Done"})]})]})}))]}))}),"right"===y&&X()]})}}var E={root:"DinoFilterSort-root",menu:"DinoFilterSort-menu",menuItem:"DinoFilterSort-menuItem",menuItemInner:"DinoFilterSort-menuItemInner"},_=u(d)(function(r){var n=r.theme;return o(o(o({},"&.".concat(E.menu),{minWidth:"200px",padding:0}),".".concat(E.menuItem),o({paddingTop:0,paddingBottom:0,"&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}},".MuiSvgIcon-root",{fontSize:16})),".".concat(E.menuItemInner),{width:"100%",display:"flex",alignItems:"center",justifyContent:"space-between",gap:n.spacing(1),paddingTop:n.spacing(.75),paddingBottom:n.spacing(.75)})});export{_ as FilterSortStyled,O as createFilterSort,E as filterSortClasses,T as getSortDirectionIcon,F as getSortDirectionLabel,N as mapSortDirectionIcon,B as mapSortDirectionLabel};
 //# sourceMappingURL=filter-sort.js.map

package/dist/src/filter-bar/components/filter-sort.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-sort.js","sources":["../../../../src/filter-bar/components/filter-sort.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { KeySpecial } from '../types'\r\nimport { ShufffleIcon } from './units'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FieldSortDirection } from './filter-sort.types'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldSort, IFilterSortConfig, IFilterSortProps } from './filter-sort.types'\r\n\r\nexport const mapSortDirectionLabel: { [key in FieldSortDirection]: string } = {\r\n  asc: 'Ascending',\r\n  desc: 'Descending'\r\n}\r\n\r\nexport const getSortDirectionLabel = (direction?: FieldSortDirection): string => {\r\n  if (!direction) return ''\r\n  return mapSortDirectionLabel[direction]\r\n}\r\n\r\nexport const mapSortDirectionIcon: { [key in FieldSortDirection]: ReactNode } = {\r\n  asc: <ArrowUpwardIcon fontSize='small' />,\r\n  desc: <ArrowDownwardIcon fontSize='small' />\r\n}\r\n\r\nexport const getSortDirectionIcon = (direction?: FieldSortDirection): ReactNode => {\r\n  if (!direction) return null\r\n  return mapSortDirectionIcon[direction]\r\n}\r\n\r\nfunction generateSortOptions<T>(config: IFilterSortConfig<T>): TFieldSort<T>[] {\r\n  const { fields } = config\r\n  const obj = { ...fields }\r\n  const options: TFieldSort<T>[] = []\r\n  Object.entries(obj).forEach(([key, value]) => {\r\n    options.push({ field: key as TFieldType<T>, label: value?.label })\r\n  })\r\n  return options\r\n}\r\n\r\nexport function createFilterSort<T>(config: IFilterSortConfig<T>) {\r\n  const { enableShuffle, shufflePosition = 'right' } = config\r\n  const classes = filterSortClasses\r\n  const options = generateSortOptions(config)\r\n\r\n  const FilterSort: FC<IFilterSortProps<T>> = (props) => {\r\n    const refButton = createRef<HTMLButtonElement>()\r\n\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const isOpen = Boolean(anchorEl)\r\n\r\n    const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n    const { getSort, changeSort, removeSort } = useFilterActions<T>(context)\r\n\r\n    const sortInfo = useMemo(() => {\r\n      const obj = getSort()\r\n      const hasShuffleSort = obj?.field === KeySpecial.sortShuffle\r\n      const hasSort = Boolean(obj?.field) && !hasShuffleSort\r\n      const item = config.fields[obj?.field as TFieldType<T>]\r\n      const label = item?.label ?? obj?.field.toString()\r\n      const title = hasSort ? `Sorted by ${label} ${obj?.direction}` : 'Sort'\r\n      return { field: obj?.field, direction: obj?.direction, hasSort, hasShuffleSort, title }\r\n    }, [getSort])\r\n\r\n    const mergedSlots = useMemo(() => {\r\n      const slotsProps = { ...props.slots, rootProps: { ...props.slots?.rootProps, sx: { ...props.sx, ...props.slots?.rootProps?.sx } } }\r\n      return Object.assign({ popperProps: {}, rootProps: {} }, config, slotsProps)\r\n    }, [props.slots, props.sx])\r\n\r\n    const handleClose = () => {\r\n      setAnchorEl(null)\r\n    }\r\n\r\n    const handleOpen = () => {\r\n      setAnchorEl(refButton.current)\r\n    }\r\n\r\n    const handleMenuItemClick = (field: TFieldType<T>) => {\r\n      handleClose()\r\n      setTimeout(() => {\r\n        changeSort(field)\r\n      }, 100)\r\n    }\r\n\r\n    const handleRemoveSort = () => {\r\n      handleClose()\r\n      setTimeout(() => {\r\n        removeSort()\r\n      }, 100)\r\n    }\r\n\r\n    const renderContent = () => (\r\n      <PopperContent title='Sort by' onClose={handleClose}>\r\n        <MenuList className={classes.menu}>\r\n          {options.map((item) => {\r\n            const key = item.field.toString()\r\n            if (!key) return null\r\n            const label = item.label ?? key.toString()\r\n            const isActive = sortInfo?.field === item.field\r\n            const direction = isActive ? sortInfo.direction : undefined\r\n            return (\r\n              <MenuItem\r\n                key={key}\r\n                className={classes.menuItem}\r\n                sx={{ justifyContent: 'space-between' }}\r\n                onClick={() => handleMenuItemClick(item.field)}\r\n                selected={isActive}\r\n              >\r\n                <Tooltip title={getSortDirectionLabel(direction)} placement='right' arrow>\r\n                  <div className={classes.menuItemInner}>\r\n                    <Typography variant='body2'>{label}</Typography>\r\n                    {getSortDirectionIcon(direction)}\r\n                  </div>\r\n                </Tooltip>\r\n              </MenuItem>\r\n            )\r\n          })}\r\n        </MenuList>\r\n        <PopperFooter>\r\n          <Button color='inherit' onClick={handleRemoveSort}>\r\n            Clear\r\n          </Button>\r\n          <Button color='primary' onClick={handleClose}>\r\n            Done\r\n          </Button>\r\n        </PopperFooter>\r\n      </PopperContent>\r\n    )\r\n\r\n    const renderShuffleIcon = () => {\r\n      if (!enableShuffle) return null\r\n      const title = mapSpecialLabel[KeySpecial.sortShuffle]\r\n      const suffix = sortInfo?.hasShuffleSort ? 'ON' : 'OFF'\r\n      const color = sortInfo?.hasShuffleSort ? 'primary' : 'default'\r\n      return (\r\n        <Tooltip title={`${title} - ${suffix}`} arrow placement='top'>\r\n          <IconButton color={color} size='small' onClick={() => changeSort(KeySpecial.sortShuffle)} {...mergedSlots.buttonShuffleProps}>\r\n            <Badge variant='dot' color='primary' invisible={!sortInfo?.hasShuffleSort}>\r\n              <ShufffleIcon fontSize='small' />\r\n            </Badge>\r\n          </IconButton>\r\n        </Tooltip>\r\n      )\r\n    }\r\n\r\n    return (\r\n      <>\r\n        {shufflePosition === 'left' && renderShuffleIcon()}\r\n        <ClickAwayListener onClickAway={handleClose}>\r\n          <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n            <Tooltip title={sortInfo?.title} arrow placement='top'>\r\n              <IconButton size='small' ref={refButton} onClick={handleOpen} {...mergedSlots.buttonSortProps}>\r\n                <Badge variant='dot' color='primary' invisible={!sortInfo?.hasSort}>\r\n                  <SwapVertIcon fontSize='small' />\r\n                </Badge>\r\n              </IconButton>\r\n            </Tooltip>\r\n            <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n              {renderContent()}\r\n            </PopperCustom>\r\n          </FilterSortStyled>\r\n        </ClickAwayListener>\r\n        {shufflePosition === 'right' && renderShuffleIcon()}\r\n      </>\r\n    )\r\n  }\r\n\r\n  return FilterSort\r\n}\r\n\r\n//#region Styles\r\nexport const filterSortClasses = {\r\n  root: 'DinoFilterSort-root',\r\n  menu: 'DinoFilterSort-menu',\r\n  menuItem: 'DinoFilterSort-menuItem',\r\n  menuItemInner: 'DinoFilterSort-menuItemInner'\r\n}\r\n\r\nexport const FilterSortStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterSortClasses.menu}`]: { minWidth: '200px', padding: 0 },\r\n  [`.${filterSortClasses.menuItem}`]: {\r\n    paddingTop: 0,\r\n    paddingBottom: 0,\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    },\r\n    [`.MuiSvgIcon-root`]: { fontSize: 16 }\r\n  },\r\n  [`.${filterSortClasses.menuItemInner}`]: {\r\n    width: '100%',\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'space-between',\r\n    gap: theme.spacing(1),\r\n    paddingTop: theme.spacing(0.75),\r\n    paddingBottom: theme.spacing(0.75)\r\n  }\r\n}))\r\n//#endregion\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","enableShuffle","_config$shufflePositi","shufflePosition","classes","filterSortClasses","options","fields","obj","_objectSpread","Object","entries","forEach","_ref","_ref2","_slicedToArray","key","value","push","field","label","generateSortOptions","props","refButton","createRef","_useState","useState","_useState2","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","getSort","changeSort","removeSort","sortInfo","useMemo","_item$label","hasShuffleSort","KeySpecial","sortShuffle","hasSort","item","toString","title","concat","mergedSlots","_props$slots","_props$slots2","slotsProps","slots","rootProps","sx","assign","popperProps","handleClose","handleRemoveSort","setTimeout","renderShuffleIcon","mapSpecialLabel","suffix","color","Tooltip","arrow","placement","children","IconButton","size","onClick","buttonShuffleProps","Badge","variant","invisible","ShufffleIcon","_jsxs","_Fragment","ClickAwayListener","onClickAway","FilterSortStyled","className","root","ref","current","buttonSortProps","SwapVertIcon","PopperCustom","open","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","justifyContent","selected","menuItemInner","Typography","PopperFooter","Button","styled","Box","_ref3","theme","_defineProperty","minWidth","padding","paddingTop","paddingBottom","borderBottom","width","display","alignItems","gap","spacing"],"mappings":"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"}
+{"version":3,"file":"filter-sort.js","sources":["../../../../src/filter-bar/components/filter-sort.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport SwapVertIcon from '@mui/icons-material/SwapVert'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport { KeySpecial } from '../types'\r\nimport { ShufffleIcon } from './icons'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FieldSortDirection } from './filter-sort.types'\r\nimport { PopperContent, PopperCustom, PopperFooter } from './popper-custom'\r\n// types\r\nimport type { FC, ReactNode } from 'react'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldSort, IFilterSortConfig, IFilterSortProps } from './filter-sort.types'\r\n\r\nexport const mapSortDirectionLabel: { [key in FieldSortDirection]: string } = {\r\n  asc: 'Ascending',\r\n  desc: 'Descending'\r\n}\r\n\r\nexport const getSortDirectionLabel = (direction?: FieldSortDirection): string => {\r\n  if (!direction) return ''\r\n  return mapSortDirectionLabel[direction]\r\n}\r\n\r\nexport const mapSortDirectionIcon: { [key in FieldSortDirection]: ReactNode } = {\r\n  asc: <ArrowUpwardIcon fontSize='small' />,\r\n  desc: <ArrowDownwardIcon fontSize='small' />\r\n}\r\n\r\nexport const getSortDirectionIcon = (direction?: FieldSortDirection): ReactNode => {\r\n  if (!direction) return null\r\n  return mapSortDirectionIcon[direction]\r\n}\r\n\r\nfunction generateSortOptions<T>(config: IFilterSortConfig<T>): TFieldSort<T>[] {\r\n  const { fields } = config\r\n  const obj = { ...fields }\r\n  const options: TFieldSort<T>[] = []\r\n  Object.entries(obj).forEach(([key, value]) => {\r\n    options.push({ field: key as TFieldType<T>, label: value?.label })\r\n  })\r\n  return options\r\n}\r\n\r\nexport function createFilterSort<T>(config: IFilterSortConfig<T>) {\r\n  const { enableShuffle, shufflePosition = 'right' } = config\r\n  const classes = filterSortClasses\r\n  const options = generateSortOptions(config)\r\n\r\n  const FilterSort: FC<IFilterSortProps<T>> = (props) => {\r\n    const refButton = createRef<HTMLButtonElement>()\r\n\r\n    const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n    const isOpen = Boolean(anchorEl)\r\n\r\n    const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n    const { getSort, changeSort, removeSort } = useFilterActions<T>(context)\r\n\r\n    const sortInfo = useMemo(() => {\r\n      const obj = getSort()\r\n      const hasShuffleSort = obj?.field === KeySpecial.sortShuffle\r\n      const hasSort = Boolean(obj?.field) && !hasShuffleSort\r\n      const item = config.fields[obj?.field as TFieldType<T>]\r\n      const label = item?.label ?? obj?.field.toString()\r\n      const title = hasSort ? `Sorted by ${label} ${obj?.direction}` : 'Sort'\r\n      return { field: obj?.field, direction: obj?.direction, hasSort, hasShuffleSort, title }\r\n    }, [getSort])\r\n\r\n    const mergedSlots = useMemo(() => {\r\n      const slotsProps = { ...props.slots, rootProps: { ...props.slots?.rootProps, sx: { ...props.sx, ...props.slots?.rootProps?.sx } } }\r\n      return Object.assign({ popperProps: {}, rootProps: {} }, config, slotsProps)\r\n    }, [props.slots, props.sx])\r\n\r\n    const handleClose = () => {\r\n      setAnchorEl(null)\r\n    }\r\n\r\n    const handleOpen = () => {\r\n      setAnchorEl(refButton.current)\r\n    }\r\n\r\n    const handleMenuItemClick = (field: TFieldType<T>) => {\r\n      handleClose()\r\n      setTimeout(() => {\r\n        changeSort(field)\r\n      }, 100)\r\n    }\r\n\r\n    const handleRemoveSort = () => {\r\n      handleClose()\r\n      setTimeout(() => {\r\n        removeSort()\r\n      }, 100)\r\n    }\r\n\r\n    const renderContent = () => (\r\n      <PopperContent title='Sort by' onClose={handleClose}>\r\n        <MenuList className={classes.menu}>\r\n          {options.map((item) => {\r\n            const key = item.field.toString()\r\n            if (!key) return null\r\n            const label = item.label ?? key.toString()\r\n            const isActive = sortInfo?.field === item.field\r\n            const direction = isActive ? sortInfo.direction : undefined\r\n            return (\r\n              <MenuItem\r\n                key={key}\r\n                className={classes.menuItem}\r\n                sx={{ justifyContent: 'space-between' }}\r\n                onClick={() => handleMenuItemClick(item.field)}\r\n                selected={isActive}\r\n              >\r\n                <Tooltip title={getSortDirectionLabel(direction)} placement='right' arrow>\r\n                  <div className={classes.menuItemInner}>\r\n                    <Typography variant='body2'>{label}</Typography>\r\n                    {getSortDirectionIcon(direction)}\r\n                  </div>\r\n                </Tooltip>\r\n              </MenuItem>\r\n            )\r\n          })}\r\n        </MenuList>\r\n        <PopperFooter>\r\n          <Button color='inherit' onClick={handleRemoveSort}>\r\n            Clear\r\n          </Button>\r\n          <Button color='primary' onClick={handleClose}>\r\n            Done\r\n          </Button>\r\n        </PopperFooter>\r\n      </PopperContent>\r\n    )\r\n\r\n    const renderShuffleIcon = () => {\r\n      if (!enableShuffle) return null\r\n      const title = mapSpecialLabel[KeySpecial.sortShuffle]\r\n      const suffix = sortInfo?.hasShuffleSort ? 'ON' : 'OFF'\r\n      const color = sortInfo?.hasShuffleSort ? 'primary' : 'default'\r\n      return (\r\n        <Tooltip title={`${title} - ${suffix}`} arrow placement='top'>\r\n          <IconButton color={color} size='small' onClick={() => changeSort(KeySpecial.sortShuffle)} {...mergedSlots.buttonShuffleProps}>\r\n            <Badge variant='dot' color='primary' invisible={!sortInfo?.hasShuffleSort}>\r\n              <ShufffleIcon fontSize='small' />\r\n            </Badge>\r\n          </IconButton>\r\n        </Tooltip>\r\n      )\r\n    }\r\n\r\n    return (\r\n      <>\r\n        {shufflePosition === 'left' && renderShuffleIcon()}\r\n        <ClickAwayListener onClickAway={handleClose}>\r\n          <FilterSortStyled className={classes.root} {...mergedSlots.rootProps}>\r\n            <Tooltip title={sortInfo?.title} arrow placement='top'>\r\n              <IconButton size='small' ref={refButton} onClick={handleOpen} {...mergedSlots.buttonSortProps}>\r\n                <Badge variant='dot' color='primary' invisible={!sortInfo?.hasSort}>\r\n                  <SwapVertIcon fontSize='small' />\r\n                </Badge>\r\n              </IconButton>\r\n            </Tooltip>\r\n            <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n              {renderContent()}\r\n            </PopperCustom>\r\n          </FilterSortStyled>\r\n        </ClickAwayListener>\r\n        {shufflePosition === 'right' && renderShuffleIcon()}\r\n      </>\r\n    )\r\n  }\r\n\r\n  return FilterSort\r\n}\r\n\r\n//#region Styles\r\nexport const filterSortClasses = {\r\n  root: 'DinoFilterSort-root',\r\n  menu: 'DinoFilterSort-menu',\r\n  menuItem: 'DinoFilterSort-menuItem',\r\n  menuItemInner: 'DinoFilterSort-menuItemInner'\r\n}\r\n\r\nexport const FilterSortStyled = styled(Box)(({ theme }) => ({\r\n  [`&.${filterSortClasses.menu}`]: { minWidth: '200px', padding: 0 },\r\n  [`.${filterSortClasses.menuItem}`]: {\r\n    paddingTop: 0,\r\n    paddingBottom: 0,\r\n    '&:not(:last-child)': {\r\n      borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n    },\r\n    [`.MuiSvgIcon-root`]: { fontSize: 16 }\r\n  },\r\n  [`.${filterSortClasses.menuItemInner}`]: {\r\n    width: '100%',\r\n    display: 'flex',\r\n    alignItems: 'center',\r\n    justifyContent: 'space-between',\r\n    gap: theme.spacing(1),\r\n    paddingTop: theme.spacing(0.75),\r\n    paddingBottom: theme.spacing(0.75)\r\n  }\r\n}))\r\n//#endregion\r\n"],"names":["mapSortDirectionLabel","asc","desc","getSortDirectionLabel","direction","mapSortDirectionIcon","_jsx","ArrowUpwardIcon","fontSize","ArrowDownwardIcon","getSortDirectionIcon","createFilterSort","config","enableShuffle","_config$shufflePositi","shufflePosition","classes","filterSortClasses","options","fields","obj","_objectSpread","Object","entries","forEach","_ref","_ref2","_slicedToArray","key","value","push","field","label","generateSortOptions","props","refButton","createRef","_useState","useState","_useState2","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","getSort","changeSort","removeSort","sortInfo","useMemo","_item$label","hasShuffleSort","KeySpecial","sortShuffle","hasSort","item","toString","title","concat","mergedSlots","_props$slots","_props$slots2","slotsProps","slots","rootProps","sx","assign","popperProps","handleClose","handleRemoveSort","setTimeout","renderShuffleIcon","mapSpecialLabel","suffix","color","Tooltip","arrow","placement","children","IconButton","size","onClick","buttonShuffleProps","Badge","variant","invisible","ShufffleIcon","_jsxs","_Fragment","ClickAwayListener","onClickAway","FilterSortStyled","className","root","ref","current","buttonSortProps","SwapVertIcon","PopperCustom","open","transition","disablePortal","PopperContent","onClose","MenuList","menu","map","_item$label2","isActive","undefined","MenuItem","menuItem","justifyContent","selected","menuItemInner","Typography","PopperFooter","Button","styled","Box","_ref3","theme","_defineProperty","minWidth","padding","paddingTop","paddingBottom","borderBottom","width","display","alignItems","gap","spacing"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-summary.js

@@ -1,2 +1,2 @@
-import{defineProperty as r,objectSpread2 as l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as o,useMemo as a}from"react";import{styled as i,iconButtonClasses as n,buttonClasses as c,Collapse as s,Box as u,Button as m,IconButton as d}from"@mui/material";import p from"@mui/icons-material/ClearAll";import{KeySpecial as f}from"../types.js";import{useFilterActions as b}from"../hooks.js";import{mapSpecialLabel as h}from"../helpers.js";import{createChipViewers as g}from"./chip-viewer.js";import{FilterBarContext as v}from"../index.context.js";function x(r){var i=k,n=g();return function(c){var g=o(v),x=g.filterState,k=b(g),C=a(function(){return function(r,e){var t,o=r.fields,a=r.enableQuickSearch,i=void 0===a||a,n=l({},o),c=f.quickSearch;return i?n[c]?null!==(t=n[c])&&void 0!==t&&t.label||(n[c]=l(l({},n[c]),{},{label:h[c]})):n[c]={label:h[c]}:delete n[c],Object.keys(e||{}).reduce(function(r,l){var t,o=null==n?void 0:n[l],a=(null==o?void 0:o.label)||l.toString(),i=null==e||null===(t=e[l])||void 0===t?void 0:t.values,c=(Array.isArray(i)?i:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:l,label:a,items:c}),r},[]).sort(function(r,l){return r.field===c?-1:l.field===c?1:0})}(r,x.storeFilter)},[x,r]);return e(s,{in:C.length>0,timeout:"auto",unmountOnExit:!0,children:t(y,{className:i.root,sx:c.sx,children:[e("div",{className:i.scrollHorizontal,children:e(n.Group,{label:"Filters",value:C,placement:"horizontal",onRemove:k.removeFilterByFieldValue})}),t(u,{children:[e(m,{size:"small",color:"error",variant:"text",onClick:k.clearAllFilters,className:i.buttonClearAll,startIcon:e(p,{}),"aria-label":"Clear all filters",children:"Clear All"}),e(d,{size:"small",color:"error",onClick:k.clearAllFilters,className:i.buttonClearAll,"aria-label":"Clear all filters",children:e(p,{})})]})]})})}}var k={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},y=i("div")(function(l){var e=l.theme;return r(r(r({},"&.".concat(k.root),{display:"flex",alignItems:"center",paddingLeft:e.spacing(1),paddingRight:e.spacing(.5)}),".".concat(k.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:e.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:e.palette.primary.light},"&::-webkit-scrollbar-track":{background:e.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(e.palette.grey[300]," ").concat(e.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(k.buttonClearAll),r(r(r({marginLeft:e.spacing(1)},"&:not(.".concat(n.root,")"),{textTransform:"none",fontWeight:500,lineHeight:2,padding:e.spacing(0,1)}),"&.".concat(n.root),{display:"none"}),e.breakpoints.down("md"),r(r({},"&.".concat(c.root),{display:"none"}),"&.".concat(n.root),{display:"flex"})))});export{x as createFilterSummary};
+import{defineProperty as r,objectSpread2 as l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useContext as o,useMemo as a}from"react";import{styled as i,iconButtonClasses as n,buttonClasses as c,Collapse as s,Box as u,Button as m,IconButton as d}from"@mui/material";import p from"@mui/icons-material/ClearAll";import{KeySpecial as b}from"../types.js";import{useFilterActions as f}from"../hooks.js";import{mapSpecialLabel as h}from"../helpers.js";import{createChipViewers as g}from"./chip-viewer.js";import{FilterBarContext as v}from"../index.context.js";function x(r){var i=k,n=g();return function(c){var g=o(v),x=g.filterState,k=f(g),C=a(function(){return function(r,e){var t,o=r.fields,a=r.enableQuickSearch,i=void 0===a||a,n=l({},o),c=b.quickSearch;return i?n[c]?null!==(t=n[c])&&void 0!==t&&t.label||(n[c]=l(l({},n[c]),{},{label:h[c]})):n[c]={label:h[c]}:delete n[c],Object.keys(e||{}).reduce(function(r,l){var t,o=null==n?void 0:n[l],a=(null==o?void 0:o.label)||l.toString(),i=null==e||null===(t=e[l])||void 0===t?void 0:t.values,c=(Array.isArray(i)?i:[]).filter(Boolean).map(function(r){return{value:r.toString()}});return c.length>0&&r.push({field:l,label:a,items:c}),r},[]).sort(function(r,l){return r.field===c?-1:l.field===c?1:0})}(r,x.storeFilter)},[x,r]);return e(s,{in:C.length>0,timeout:"auto",unmountOnExit:!0,children:t(y,{className:i.root,sx:c.sx,children:[e("div",{className:i.scrollHorizontal,children:e(n,{label:"Filters",value:C,placement:"horizontal",onRemove:k.removeFilterByFieldValue})}),t(u,{children:[e(m,{size:"small",color:"error",variant:"text",onClick:k.clearAllFilters,className:i.buttonClearAll,startIcon:e(p,{}),"aria-label":"Clear all filters",children:"Clear All"}),e(d,{size:"small",color:"error",onClick:k.clearAllFilters,className:i.buttonClearAll,"aria-label":"Clear all filters",children:e(p,{})})]})]})})}}var k={root:"DinoFilterSummary-root",scrollHorizontal:"DinoFilterSummary-scrollHorizontal",buttonClearAll:"DinoFilterSummary-buttonClearAll"},y=i("div")(function(l){var e=l.theme;return r(r(r({},"&.".concat(k.root),{display:"flex",alignItems:"center",padding:e.spacing(0,1.5)}),".".concat(k.scrollHorizontal),{overflowX:"auto",overflowY:"hidden",WebkitOverflowScrolling:"touch",scrollbarHeight:"thin",display:"flex",flexWrap:"nowrap",minWidth:0,flex:1,"& > *":{minWidth:"max-content",flexShrink:0},"&::-webkit-scrollbar":{height:"8px",background:"transparent"},"&::-webkit-scrollbar-thumb":{background:e.palette.grey[300],borderRadius:"8px",minHeight:"8px",transition:"background 0.2s"},"&::-webkit-scrollbar-thumb:hover":{background:e.palette.primary.light},"&::-webkit-scrollbar-track":{background:e.palette.grey[100],borderRadius:"8px"},scrollbarColor:"".concat(e.palette.grey[300]," ").concat(e.palette.grey[100]),scrollbarWidth:"thin"}),".".concat(k.buttonClearAll),r(r(r({marginLeft:e.spacing(1)},"&:not(.".concat(n.root,")"),{textTransform:"none",fontWeight:500,lineHeight:2,padding:e.spacing(0,1)}),"&.".concat(n.root),{display:"none"}),e.breakpoints.down("md"),r(r({},"&.".concat(c.root),{display:"none"}),"&.".concat(n.root),{display:"flex"})))});export{x as createFilterSummary};
 //# sourceMappingURL=filter-summary.js.map