npm - dinocollab-core - Versions diffs - 2.2.17 → 2.2.19 - Mend

dinocollab-core 2.2.17 → 2.2.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (36) hide show

package/dist/src/api-context/alert-global.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e,toConsumableArray as t,objectSpread2 as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import a,{useState as o,useCallback as l,useEffect as u}from"react";import{styled as s,Box as d,Stack as c,Dialog as f,DialogTitle as p,DialogContent as h,DialogContentText as m,DialogActions as g,Button as x}from"@mui/material";import v from"@mui/material/Alert";var y=a.forwardRef(function(e,t){return n(v,i(i({elevation:6,ref:t,variant:"standard"},e),{},{style:{minWidth:"300px"}}))}),C={};function A(){var r,a,s=o([]),d=e(s,2),f=d[0],p=d[1],h=l(function(e){p(function(i){return[].concat(t(i),[e])})},[]),m=l(function(e){var i=f.findIndex(function(t){return t.id===e.id});f.splice(i,1),p(t(f))},[f]);return u(function(){C.ApiAlert=i(i({},C.ApiAlert?C.ApiAlert:{}),{},{PushMessage:h,PushError:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"error",duration:(null==t?void 0:t.duration)||15e3})},PushInfo:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"info",duration:(null==t?void 0:t.duration)||6e3})},PushWarning:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"warning",duration:(null==t?void 0:t.duration)||6e3})},PushSuccess:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"success",duration:(null==t?void 0:t.duration)||3e3})}})},[h]),n(S,{children:n(c,{spacing:2,sx:{maxWidth:"300px"},children:(r=f,a=m,r.map(function(e,t){return n(P,{data:e,IsOpen:!0,handleClose:a,autoDurationHide:e.duration},e.id+t)}))})})}var P=function(e){var t=l(function(){return e.handleClose(e.data)},[e]);return u(function(){var t=null;return e.autoDurationHide&&(t=setTimeout(function(){e.handleClose(e.data)},e.autoDurationHide)),function(){clearTimeout(t)}},[e]),n(y,{sx:{whiteSpace:"pre-line"},onClose:t,severity:e.data.type,children:e.data.text})},S=s(d)({position:"fixed",top:"calc(var(--height-header) + 20px)",right:"50px",zIndex:2e3,display:"flex",justifyContent:"flex-start",alignItems:"center"}),b=function(t){var i=a.useState(t.IsOpen),o=e(i,2),l=o[0],u=o[1];a.useEffect(function(){u(t.IsOpen)},[t.IsOpen]);var s=a.useCallback(function(){u(!1),t.onClose&&t.onClose()},[t]);return n("div",{children:r(f,{open:l,onClose:s,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",children:[n(p,{id:"alert-dialog-title",children:t.Title}),n(h,{children:n(m,{id:"alert-dialog-description",sx:{whiteSpace:"pre-line"},children:t.Message})}),r(g,{children:[n(x,{onClick:t.onAccept,autoFocus:!0,color:"info",children:"Ok"}),n(x,{onClick:s,color:"error",children:"Cancel"})]})]})})};export{b as AlertDialog,C as ApiAlertContext,A as default};
+import{slicedToArray as e,toConsumableArray as t,objectSpread2 as i}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import a,{useState as o,useCallback as l,useEffect as u}from"react";import{styled as s,Box as d,Stack as c,Dialog as p,DialogTitle as f,DialogContent as h,DialogContentText as g,DialogActions as m,Button as x}from"@mui/material";import v from"@mui/material/Alert";var C=a.forwardRef(function(e,t){return n(v,i(i({elevation:6,ref:t,variant:"standard"},e),{},{style:{minWidth:"300px"}}))}),y={};function A(){var r,a,s=o([]),d=e(s,2),p=d[0],f=d[1],h=l(function(e){f(function(i){return[].concat(t(i),[e])})},[]),g=l(function(e){var i=p.findIndex(function(t){return t.id===e.id});p.splice(i,1),f(t(p))},[p]);return u(function(){y.ApiAlert=i(i({},y.ApiAlert?y.ApiAlert:{}),{},{PushMessage:h,PushError:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"error",duration:(null==t?void 0:t.duration)||15e3})},PushInfo:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"info",duration:(null==t?void 0:t.duration)||6e3})},PushWarning:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"warning",duration:(null==t?void 0:t.duration)||6e3})},PushSuccess:function(e,t){this.PushMessage({id:(new Date).getTime().toString(),text:e,type:"success",duration:(null==t?void 0:t.duration)||3e3})}})},[h]),n(b,{children:n(c,{spacing:2,sx:{maxWidth:"300px"},children:(r=p,a=g,r.map(function(e,t){return n(P,{data:e,IsOpen:!0,handleClose:a,autoDurationHide:e.duration},e.id+t)}))})})}var P=function(e){var t=l(function(){return e.handleClose(e.data)},[e]);return u(function(){var t=null;return e.autoDurationHide&&(t=setTimeout(function(){e.handleClose(e.data)},e.autoDurationHide)),function(){clearTimeout(t)}},[e]),n(C,{sx:{whiteSpace:"pre-line"},onClose:t,severity:e.data.type,children:e.data.text})},b=s(d)({position:"fixed",top:"calc(var(--height-header) + 20px)",right:"50px",zIndex:2e3,display:"flex",justifyContent:"flex-start",alignItems:"center"}),S=function(t){var i=a.useState(t.IsOpen),o=e(i,2),l=o[0],u=o[1];a.useEffect(function(){u(t.IsOpen)},[t.IsOpen]);var s=a.useCallback(function(){u(!1),t.onClose&&t.onClose()},[t]);return n("div",{children:r(p,{open:l,onClose:s,"aria-labelledby":"alert-dialog-title","aria-describedby":"alert-dialog-description",children:[n(f,{id:"alert-dialog-title",children:t.Title}),n(h,{children:n(g,{id:"alert-dialog-description",sx:{whiteSpace:"pre-line"},children:t.Message})}),r(m,{children:[n(x,{onClick:t.onAccept,autoFocus:!0,color:"info",children:"Ok"}),n(x,{onClick:s,color:"error",children:"Cancel"})]})]})})};globalThis.ApiAlertContext=y;export{S as AlertDialog,y as ApiAlertContext,A as default};
 //# sourceMappingURL=alert-global.js.map

package/dist/src/api-context/alert-global.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"alert-global.js","sources":["../../../src/api-context/alert-global.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Box, Stack, styled, Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@mui/material'\r\nimport MuiAlert, { AlertProps, AlertColor } from '@mui/material/Alert'\r\n\r\nconst Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(props, ref) {\r\n return <MuiAlert elevation={6} ref={ref} variant='standard' {...props} style={{ minWidth: '300px' }} />\r\n})\r\n\r\ninterface MessageData {\r\n id: string\r\n text: string\r\n type: AlertColor\r\n duration?: number\r\n}\r\n\r\ninterface IOptions {\r\n duration?: number\r\n}\r\n\r\ninterface IApiAlert {\r\n PushMessage: (data: MessageData) => void\r\n PushInfo: (data: string) => void\r\n PushError: (data: string) => void\r\n PushWarning: (data: string) => void\r\n PushSuccess: (data: string) => void\r\n}\r\n\r\nexport interface IApiContext {\r\n ApiAlert?: IApiAlert\r\n}\r\n\r\nexport const ApiAlertContext: IApiContext = {}\r\n\r\nconst RenderArea = (messages: MessageData[], onClose: (data: MessageData) => void) => {\r\n return messages.map((x, i) => {\r\n return <Message key={x.id + i} data={x} IsOpen={true} handleClose={onClose} autoDurationHide={x.duration} />\r\n })\r\n}\r\n\r\nfunction AlertGlobal() {\r\n const [Messages, setMessages] = useState<MessageData[]>([])\r\n const _PushMessage = useCallback((data: MessageData) => {\r\n setMessages((st) => [...st, data])\r\n }, [])\r\n const _HandleClose = useCallback(\r\n (data: MessageData) => {\r\n const index = Messages.findIndex((x) => x.id === data.id)\r\n Messages.splice(index, 1)\r\n setMessages([...Messages])\r\n },\r\n [Messages]\r\n )\r\n\r\n useEffect(() => {\r\n ApiAlertContext.ApiAlert = {\r\n ...(ApiAlertContext.ApiAlert ? ApiAlertContext.ApiAlert : {}),\r\n PushMessage: _PushMessage,\r\n PushError: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'error',\r\n duration: options?.duration \|\| 15000\r\n })\r\n },\r\n PushInfo: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'info',\r\n duration: options?.duration \|\| 6000\r\n })\r\n },\r\n PushWarning: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'warning',\r\n duration: options?.duration \|\| 6000\r\n })\r\n },\r\n PushSuccess: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'success',\r\n duration: options?.duration \|\| 3000\r\n })\r\n }\r\n }\r\n }, [_PushMessage])\r\n\r\n return (\r\n <Wrap>\r\n <Stack spacing={2} sx={{ maxWidth: '300px' }}>\r\n {RenderArea(Messages, _HandleClose)}\r\n </Stack>\r\n </Wrap>\r\n )\r\n}\r\nexport default AlertGlobal\r\n\r\ninterface MessageProps {\r\n IsOpen: boolean\r\n handleClose: (data: MessageData) => void\r\n data: MessageData\r\n autoDurationHide?: number\r\n}\r\nconst Message: FC<MessageProps> = (props) => {\r\n const _handleClose = useCallback(() => props.handleClose(props.data), [props])\r\n\r\n useEffect(() => {\r\n let Timer: any = null\r\n if (props.autoDurationHide) {\r\n Timer = setTimeout(() => {\r\n props.handleClose(props.data)\r\n }, props.autoDurationHide)\r\n }\r\n return () => {\r\n clearTimeout(Timer as any)\r\n }\r\n }, [props])\r\n return (\r\n <Alert sx={{ whiteSpace: 'pre-line' }} onClose={_handleClose} severity={props.data.type}>\r\n {props.data.text}\r\n </Alert>\r\n )\r\n}\r\n\r\nconst Wrap = styled(Box)({\r\n position: 'fixed',\r\n top: 'calc(var(--height-header) + 20px)',\r\n right: '50px',\r\n zIndex: 2000,\r\n display: 'flex',\r\n justifyContent: 'flex-start',\r\n alignItems: 'center'\r\n})\r\n\r\ninterface AlertDialogProps {\r\n IsOpen: boolean\r\n onClose?: () => void\r\n onAccept?: () => void\r\n Title: string\r\n Message: string\r\n}\r\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\r\n const [Open, setOpen] = React.useState(props.IsOpen)\r\n React.useEffect(() => {\r\n setOpen(props.IsOpen)\r\n }, [props.IsOpen])\r\n const _handleClose = React.useCallback(() => {\r\n setOpen(false)\r\n props.onClose && props.onClose()\r\n }, [props])\r\n return (\r\n <div>\r\n <Dialog open={Open} onClose={_handleClose} aria-labelledby='alert-dialog-title' aria-describedby='alert-dialog-description'>\r\n <DialogTitle id='alert-dialog-title'>{props.Title}</DialogTitle>\r\n <DialogContent>\r\n <DialogContentText id='alert-dialog-description' sx={{ whiteSpace: 'pre-line' }}>\r\n {props.Message}\r\n </DialogContentText>\r\n </DialogContent>\r\n <DialogActions>\r\n <Button onClick={props.onAccept} autoFocus color='info'>\r\n Ok\r\n </Button>\r\n <Button onClick={_handleClose} color='error'>\r\n Cancel\r\n </Button>\r\n </DialogActions>\r\n </Dialog>\r\n </div>\r\n )\r\n}\r\n"],"names":["Alert","React","forwardRef","props","ref","_jsx","MuiAlert","_objectSpread","elevation","variant","style","minWidth","ApiAlertContext","AlertGlobal","messages","onClose","_useState","useState","_useState2","_slicedToArray","Messages","setMessages","_PushMessage","useCallback","data","st","concat","_toConsumableArray","_HandleClose","index","findIndex","x","id","splice","useEffect","ApiAlert","PushMessage","PushError","options","this","Date","getTime","toString","text","type","duration","PushInfo","PushWarning","PushSuccess","Wrap","children","Stack","spacing","sx","maxWidth","map","i","Message","IsOpen","handleClose","autoDurationHide","_handleClose","Timer","setTimeout","clearTimeout","whiteSpace","severity","styled","Box","position","top","right","zIndex","display","justifyContent","alignItems","AlertDialog","_React$useState","_React$useState2","Open","setOpen","_jsxs","Dialog","open","DialogTitle","Title","DialogContent","DialogContentText","DialogActions","Button","onClick","onAccept","autoFocus","color"],"mappings":"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"}
1	+ {"version":3,"file":"alert-global.js","sources":["../../../src/api-context/alert-global.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Box, Stack, styled, Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@mui/material'\r\nimport MuiAlert, { AlertProps, AlertColor } from '@mui/material/Alert'\r\n\r\nconst Alert = React.forwardRef<HTMLDivElement, AlertProps>(function Alert(props, ref) {\r\n return <MuiAlert elevation={6} ref={ref} variant='standard' {...props} style={{ minWidth: '300px' }} />\r\n})\r\n\r\ninterface MessageData {\r\n id: string\r\n text: string\r\n type: AlertColor\r\n duration?: number\r\n}\r\n\r\ninterface IOptions {\r\n duration?: number\r\n}\r\n\r\ninterface IApiAlert {\r\n PushMessage: (data: MessageData) => void\r\n PushInfo: (data: string) => void\r\n PushError: (data: string) => void\r\n PushWarning: (data: string) => void\r\n PushSuccess: (data: string) => void\r\n}\r\n\r\nexport interface IApiContext {\r\n ApiAlert?: IApiAlert\r\n}\r\n\r\nexport const ApiAlertContext: IApiContext = {}\r\n\r\nconst RenderArea = (messages: MessageData[], onClose: (data: MessageData) => void) => {\r\n return messages.map((x, i) => {\r\n return <Message key={x.id + i} data={x} IsOpen={true} handleClose={onClose} autoDurationHide={x.duration} />\r\n })\r\n}\r\n\r\nfunction AlertGlobal() {\r\n const [Messages, setMessages] = useState<MessageData[]>([])\r\n const _PushMessage = useCallback((data: MessageData) => {\r\n setMessages((st) => [...st, data])\r\n }, [])\r\n const _HandleClose = useCallback(\r\n (data: MessageData) => {\r\n const index = Messages.findIndex((x) => x.id === data.id)\r\n Messages.splice(index, 1)\r\n setMessages([...Messages])\r\n },\r\n [Messages]\r\n )\r\n\r\n useEffect(() => {\r\n ApiAlertContext.ApiAlert = {\r\n ...(ApiAlertContext.ApiAlert ? ApiAlertContext.ApiAlert : {}),\r\n PushMessage: _PushMessage,\r\n PushError: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'error',\r\n duration: options?.duration \|\| 15000\r\n })\r\n },\r\n PushInfo: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'info',\r\n duration: options?.duration \|\| 6000\r\n })\r\n },\r\n PushWarning: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'warning',\r\n duration: options?.duration \|\| 6000\r\n })\r\n },\r\n PushSuccess: function (data: string, options?: IOptions) {\r\n this.PushMessage({\r\n id: new Date().getTime().toString(),\r\n text: data,\r\n type: 'success',\r\n duration: options?.duration \|\| 3000\r\n })\r\n }\r\n }\r\n }, [_PushMessage])\r\n\r\n return (\r\n <Wrap>\r\n <Stack spacing={2} sx={{ maxWidth: '300px' }}>\r\n {RenderArea(Messages, _HandleClose)}\r\n </Stack>\r\n </Wrap>\r\n )\r\n}\r\nexport default AlertGlobal\r\n\r\ninterface MessageProps {\r\n IsOpen: boolean\r\n handleClose: (data: MessageData) => void\r\n data: MessageData\r\n autoDurationHide?: number\r\n}\r\nconst Message: FC<MessageProps> = (props) => {\r\n const _handleClose = useCallback(() => props.handleClose(props.data), [props])\r\n\r\n useEffect(() => {\r\n let Timer: any = null\r\n if (props.autoDurationHide) {\r\n Timer = setTimeout(() => {\r\n props.handleClose(props.data)\r\n }, props.autoDurationHide)\r\n }\r\n return () => {\r\n clearTimeout(Timer as any)\r\n }\r\n }, [props])\r\n return (\r\n <Alert sx={{ whiteSpace: 'pre-line' }} onClose={_handleClose} severity={props.data.type}>\r\n {props.data.text}\r\n </Alert>\r\n )\r\n}\r\n\r\nconst Wrap = styled(Box)({\r\n position: 'fixed',\r\n top: 'calc(var(--height-header) + 20px)',\r\n right: '50px',\r\n zIndex: 2000,\r\n display: 'flex',\r\n justifyContent: 'flex-start',\r\n alignItems: 'center'\r\n})\r\n\r\ninterface AlertDialogProps {\r\n IsOpen: boolean\r\n onClose?: () => void\r\n onAccept?: () => void\r\n Title: string\r\n Message: string\r\n}\r\nexport const AlertDialog: React.FC<AlertDialogProps> = (props) => {\r\n const [Open, setOpen] = React.useState(props.IsOpen)\r\n React.useEffect(() => {\r\n setOpen(props.IsOpen)\r\n }, [props.IsOpen])\r\n const _handleClose = React.useCallback(() => {\r\n setOpen(false)\r\n props.onClose && props.onClose()\r\n }, [props])\r\n return (\r\n <div>\r\n <Dialog open={Open} onClose={_handleClose} aria-labelledby='alert-dialog-title' aria-describedby='alert-dialog-description'>\r\n <DialogTitle id='alert-dialog-title'>{props.Title}</DialogTitle>\r\n <DialogContent>\r\n <DialogContentText id='alert-dialog-description' sx={{ whiteSpace: 'pre-line' }}>\r\n {props.Message}\r\n </DialogContentText>\r\n </DialogContent>\r\n <DialogActions>\r\n <Button onClick={props.onAccept} autoFocus color='info'>\r\n Ok\r\n </Button>\r\n <Button onClick={_handleClose} color='error'>\r\n Cancel\r\n </Button>\r\n </DialogActions>\r\n </Dialog>\r\n </div>\r\n )\r\n}\r\n\r\n(globalThis as any).ApiAlertContext = ApiAlertContext"],"names":["Alert","React","forwardRef","props","ref","_jsx","MuiAlert","_objectSpread","elevation","variant","style","minWidth","ApiAlertContext","AlertGlobal","messages","onClose","_useState","useState","_useState2","_slicedToArray","Messages","setMessages","_PushMessage","useCallback","data","st","concat","_toConsumableArray","_HandleClose","index","findIndex","x","id","splice","useEffect","ApiAlert","PushMessage","PushError","options","this","Date","getTime","toString","text","type","duration","PushInfo","PushWarning","PushSuccess","Wrap","children","Stack","spacing","sx","maxWidth","map","i","Message","IsOpen","handleClose","autoDurationHide","_handleClose","Timer","setTimeout","clearTimeout","whiteSpace","severity","styled","Box","position","top","right","zIndex","display","justifyContent","alignItems","AlertDialog","_React$useState","_React$useState2","Open","setOpen","_jsxs","Dialog","open","DialogTitle","Title","DialogContent","DialogContentText","DialogActions","Button","onClick","onAccept","autoFocus","color","globalThis"],"mappings":"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"}

package/dist/src/filter-bar/components/filter-input.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as o,objectSpread2 as e,slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useContext as i,useState as l,useMemo as a,createRef as u}from"react";import{styled as c,Box as s,alpha as p,InputBase as d,MenuList as f,MenuItem as m,Typography as v}from"@mui/material";import h from"@mui/material/ClickAwayListener";import{KeySpecial as b}from"../types.js";import{useFilterActions as g}from"../hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as I}from"../index.context.js";import{PopperCustom as S,PopperContent as y}from"./popper-custom.js";import{InputAdornmentRight as F,InputAdornmentLeft as j,getFieldsByMatches as k}from"./filter-input.units.js";import{MobileSearchButton as C}from"./filter-input.mobile.js";function D(o){var c=w,p=function(o){var r=o.fields,t=o.enableQuickSearch,n=void 0===t||t,i=b.quickSearch,l=e({},r);if(n){var a=l[i],u=null!=a&&a.label?a.label:x[i],c=Object.assign({},l[i],{field:i,label:u});l[i]=c}else delete l[i];return e(e({},o),{},{fields:l})}(o);return function(b){var x,D,w,B,N,q=u(),A=u(),O=i(I),R=g(O),W=R.addFilter,z=R.replaceFilter,K=l(null),T=r(K,2),_=T[0],E=T[1],G=Boolean(_),H=l(""),L=r(H,2),M=L[0],Q=L[1],V=l("normal"),J=r(V,2),U=J[0],X=J[1],Y=a(function(){var e,r=o.beforeInput,t=o.afterInput,n=Object.assign({},b.sx,null===(e=b.slots)||void 0===e||null===(e=e.rootProps)||void 0===e?void 0:e.sx);return{slots:Object.assign({},{beforeInput:r,afterInput:t},b.slots),rootSx:n}},[]),Z=o.minimalInput||(null===(x=b.slots)||void 0===x?void 0:x.minimalInput)||!1,$=function(o){E(null),X("normal"),o&&Q("")},oo=function(){var o;if(M){var e=null===(o=O.filterState.storeFilter)||void 0===o?void 0:o.quickSearch,r=(null==e?void 0:e.logic)||"or";z("quickSearch",{values:[M],logic:r}),$(!0)}};if(Z)return t(C,{placeholder:"Search...",onSearching:function(o){var e;if(o){var r=null===(e=O.filterState.storeFilter)||void 0===e?void 0:e.quickSearch,t=(null==r?void 0:r.logic)||"or";z("quickSearch",{values:[o],logic:t})}}});var eo,ro=[c.root];return("focus"===U||Boolean(M))&&ro.push(c.focus),t(h,{onClickAway:function(o){$()},children:n(P,e(e({className:ro.join(" ")},null===(D=b.slots)||void 0===D?void 0:D.rootProps),{},{sx:Y.rootSx,children:[n("div",{className:c.rootInner,children:[(null===(w=Y.slots)||void 0===w?void 0:w.beforeInput)||null,t(s,{className:c.beforeInput,ref:A}),t(d,{fullWidth:!0,className:c.input,autoComplete:"off",size:"small",inputRef:q,value:M,placeholder:"Search...",onKeyDown:function(o){var e=o.keyCode;if(13===e)o.stopPropagation(),o.preventDefault(),oo();else if(27===e){var r;o.stopPropagation(),o.preventDefault(),null==q||null===(r=q.current)||void 0===r||r.blur(),$(!0)}},onChange:function(o){var e=o.target.value||"";Q(e);var r=Boolean(null==A?void 0:A.current)&&Boolean(e);e!==M&&E(r&&(null==A?void 0:A.current)||null)},onFocus:function(o){X("focus"),Boolean(M)&&E((null==A?void 0:A.current)||o.currentTarget)},startAdornment:t(j,{onSearch:function(){var o;null===(o=q.current)||void 0===o||o.focus()}}),endAdornment:t(F,{hasKeyword:Boolean(M),onSubmit:oo,onClear:function(){return $(!0)}})}),(null===(B=Y.slots)||void 0===B?void 0:B.afterInput)||null]}),t(S,e(e({anchorEl:_,open:G,placement:"bottom",transition:!0,disablePortal:!0},null===(N=Y.slots)||void 0===N?void 0:N.popperProps),{},{children:(eo=k(p,M),t(y,{title:"Filter Options",disableGutter:!0,onClose:function(){return E(null)},children:t(f,{className:c.menu,children:eo.map(function(e,r){var t,i=e.field;if(!e)return null;var l=null!==(t=e.label)&&void 0!==t?t:i.toString(),a="".concat(l,': "').concat(M,'"');return n(m,{title:a,onClick:function(){return function(e){var r;if(M){var t=o.fields[e],n=null===(r=O.filterState.storeFilter)||void 0===r?void 0:r[e],i=(null==n?void 0:n.logic)||"or";null!=t&&t.singleValue?z(e,{values:[M],logic:i}):W(e,{values:[M],logic:i}),$(!0)}}(i)},className:c.menuItem,children:[n(v,{variant:"body2",sx:{fontWeight:500,flex:"0 0 auto"},children:[l,":"]}),n(v,{variant:"body2",color:"text.secondary",sx:{ml:1,flex:"1 1 auto"},noWrap:!0,children:['"',M,'"']})]},i.toString()+r)})})}))}))]}))})}}var w={root:"DinoFilterInput-root",rootInner:"DinoFilterInput-rootInner",button:"DinoFilterInput-button",input:"DinoFilterInput-input",focus:"DinoFilterInput-focus",beforeInput:"DinoFilterInput-beforeInput",menu:"DinoFilterInput-menu",menuItem:"DinoFilterInput-menuItem"},P=c(s)(function(e){var r=e.theme;return o(o(o(o(o(o(o(o({},"&.".concat(w.root),{height:"var(--dino-h-filter-input, 38px)",flex:1,border:"1px solid",borderColor:p(r.palette.divider,.12),borderRadius:r.shape.borderRadius,backgroundColor:r.palette.background.paper,transition:r.transitions.create(["border-color","box-shadow"])}),"&:hover",{borderColor:r.palette.text.primary}),"&.Mui-focused",{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),"&.".concat(w.focus),{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),".".concat(w.rootInner),{height:"100%",display:"flex",alignItems:"stretch"}),".".concat(w.beforeInput),{width:"1px",height:"100%",alignSelf:"stretch"}),".".concat(w.input),{padding:r.spacing(.5,1),input:{fontSize:"14px",padding:"4px 0 5px"}}),".".concat(w.button),{flex:"0 0 auto"})});export{D as createFilterInput,w as filterInputClasses};
+import{defineProperty as o,objectSpread2 as e,slicedToArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{useContext as i,useState as l,useMemo as a,createRef as u}from"react";import{styled as c,Box as s,alpha as p,InputBase as d,MenuList as f,MenuItem as m,Typography as v}from"@mui/material";import h from"@mui/material/ClickAwayListener";import{KeySpecial as b}from"../types.js";import{useFilterActions as g}from"../hooks.js";import{mapSpecialLabel as x}from"../helpers.js";import{FilterBarContext as I}from"../index.context.js";import{PopperCustom as S,PopperContent as y,PopperBody as F}from"./popper-custom.js";import{InputAdornmentRight as j,InputAdornmentLeft as k,getFieldsByMatches as C}from"./filter-input.units.js";import{MobileSearchButton as D}from"./filter-input.mobile.js";function w(o){var c=P,p=function(o){var r=o.fields,t=o.enableQuickSearch,n=void 0===t||t,i=b.quickSearch,l=e({},r);if(n){var a=l[i],u=null!=a&&a.label?a.label:x[i],c=Object.assign({},l[i],{field:i,label:u});l[i]=c}else delete l[i];return e(e({},o),{},{fields:l})}(o);return function(b){var x,w,P,N,q,A=u(),O=u(),R=i(I),W=g(R),z=W.addFilter,G=W.replaceFilter,K=l(null),T=r(K,2),_=T[0],E=T[1],H=Boolean(_),L=l(""),M=r(L,2),Q=M[0],V=M[1],J=l("normal"),U=r(J,2),X=U[0],Y=U[1],Z=a(function(){var e,r=o.beforeInput,t=o.afterInput,n=Object.assign({},b.sx,null===(e=b.slots)||void 0===e||null===(e=e.rootProps)||void 0===e?void 0:e.sx);return{slots:Object.assign({},{beforeInput:r,afterInput:t},b.slots),rootSx:n}},[]),$=o.minimalInput||(null===(x=b.slots)||void 0===x?void 0:x.minimalInput)||!1,oo=function(o){E(null),Y("normal"),o&&V("")},eo=function(){var o;if(Q){var e=null===(o=R.filterState.storeFilter)||void 0===o?void 0:o.quickSearch,r=(null==e?void 0:e.logic)||"or";G("quickSearch",{values:[Q],logic:r}),oo(!0)}};if($)return t(D,{placeholder:"Search...",onSearching:function(o){var e;if(o){var r=null===(e=R.filterState.storeFilter)||void 0===e?void 0:e.quickSearch,t=(null==r?void 0:r.logic)||"or";G("quickSearch",{values:[o],logic:t})}}});var ro,to=[c.root];return("focus"===X||Boolean(Q))&&to.push(c.focus),t(h,{onClickAway:function(o){oo()},children:n(B,e(e({className:to.join(" ")},null===(w=b.slots)||void 0===w?void 0:w.rootProps),{},{sx:Z.rootSx,children:[n("div",{className:c.rootInner,children:[(null===(P=Z.slots)||void 0===P?void 0:P.beforeInput)||null,t(s,{className:c.beforeInput,ref:O}),t(d,{fullWidth:!0,className:c.input,autoComplete:"off",size:"small",inputRef:A,value:Q,placeholder:"Search...",onKeyDown:function(o){var e=o.keyCode;if(13===e)o.stopPropagation(),o.preventDefault(),eo();else if(27===e){var r;o.stopPropagation(),o.preventDefault(),null==A||null===(r=A.current)||void 0===r||r.blur(),oo(!0)}},onChange:function(o){var e=o.target.value||"";V(e);var r=Boolean(null==O?void 0:O.current)&&Boolean(e);e!==Q&&E(r&&(null==O?void 0:O.current)||null)},onFocus:function(o){Y("focus"),Boolean(Q)&&E((null==O?void 0:O.current)||o.currentTarget)},startAdornment:t(k,{onSearch:function(){var o;null===(o=A.current)||void 0===o||o.focus()}}),endAdornment:t(j,{hasKeyword:Boolean(Q),onSubmit:eo,onClear:function(){return oo(!0)}})}),(null===(N=Z.slots)||void 0===N?void 0:N.afterInput)||null]}),t(S,e(e({anchorEl:_,open:H,placement:"bottom",transition:!0,disablePortal:!0},null===(q=Z.slots)||void 0===q?void 0:q.popperProps),{},{children:(ro=C(p,Q),t(y,{title:"Filter Options",disableGutter:!0,onClose:function(){return E(null)},children:t(F,{disableGutter:!0,children:t(f,{className:c.menu,children:ro.map(function(e,r){var t,i=e.field;if(!e)return null;var l=null!==(t=e.label)&&void 0!==t?t:i.toString(),a="".concat(l,': "').concat(Q,'"');return n(m,{title:a,onClick:function(){return function(e){var r;if(Q){var t=o.fields[e],n=null===(r=R.filterState.storeFilter)||void 0===r?void 0:r[e],i=(null==n?void 0:n.logic)||"or";null!=t&&t.singleValue?G(e,{values:[Q],logic:i}):z(e,{values:[Q],logic:i}),oo(!0)}}(i)},className:c.menuItem,children:[n(v,{variant:"body2",sx:{fontWeight:500,flex:"0 0 auto"},children:[l,":"]}),n(v,{variant:"body2",color:"text.secondary",sx:{ml:1,flex:"1 1 auto"},noWrap:!0,children:['"',Q,'"']})]},i.toString()+r)})})})}))}))]}))})}}var P={root:"DinoFilterInput-root",rootInner:"DinoFilterInput-rootInner",button:"DinoFilterInput-button",input:"DinoFilterInput-input",focus:"DinoFilterInput-focus",beforeInput:"DinoFilterInput-beforeInput",menu:"DinoFilterInput-menu",menuItem:"DinoFilterInput-menuItem"},B=c(s)(function(e){var r=e.theme;return o(o(o(o(o(o(o(o({},"&.".concat(P.root),{height:"var(--dino-h-filter-input, 38px)",flex:1,border:"1px solid",borderColor:p(r.palette.divider,.12),borderRadius:r.shape.borderRadius,backgroundColor:r.palette.background.paper,transition:r.transitions.create(["border-color","box-shadow"])}),"&:hover",{borderColor:r.palette.text.primary}),"&.Mui-focused",{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),"&.".concat(P.focus),{borderColor:r.palette.primary.main,boxShadow:"0 0 0 2px ".concat(r.palette.primary.main,"33")}),".".concat(P.rootInner),{height:"100%",display:"flex",alignItems:"stretch"}),".".concat(P.beforeInput),{width:"1px",height:"100%",alignSelf:"stretch"}),".".concat(P.input),{padding:r.spacing(.5,1),input:{fontSize:"14px",padding:"4px 0 5px"}}),".".concat(P.button),{flex:"0 0 auto"})});export{w as createFilterInput,P as filterInputClasses};
 //# sourceMappingURL=filter-input.js.map

package/dist/src/filter-bar/components/filter-input.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-input.js","sources":["../../../../src/filter-bar/components/filter-input.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 { Box, InputBase, MenuItem, MenuList, styled, Typography, alpha } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { PopperContent, PopperCustom } from './popper-custom'\r\nimport { getFieldsByMatches, InputAdornmentLeft, InputAdornmentRight } from './filter-input.units'\r\nimport MobileSearchButton from './filter-input.mobile'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { InputBaseProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFilterInputConfig, IFilterInputProps, IFilterInputSlots, TFieldInputConfigs } from './filter-input.types'\r\n\r\nconst initializeConfig = <T,>(config: IFilterInputConfig<T>): IFilterInputConfig<T> => {\r\n const { fields, enableQuickSearch = true } = config\r\n const qsKey = KeySpecial.quickSearch\r\n const mergedFields: TFieldInputConfigs<T> = { ...fields }\r\n\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n return { ...config, fields: mergedFields }\r\n}\r\n\r\nexport function createFilterInput<T>(config: IFilterInputConfig<T>) {\r\n const classes = filterInputClasses\r\n const initialConfig = initializeConfig(config)\r\n\r\n const FilterInput: FC<IFilterInputProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const refBeforeInput = createRef<HTMLElement>()\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { addFilter, replaceFilter } = useFilterActions<T>(context)\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement \| null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const [keywords, setKeywords] = useState<string>('')\r\n const [status, setStatus] = useState<'focus' \| 'normal'>('normal')\r\n\r\n const mergedConfig = useMemo(() => {\r\n const { beforeInput, afterInput } = config\r\n const mergedRootSx = Object.assign({}, props.sx, props.slots?.rootProps?.sx)\r\n const mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots, rootSx: mergedRootSx }\r\n }, [])\r\n\r\n const isMinimal = config.minimalInput \|\| props.slots?.minimalInput \|\| false\r\n\r\n const handleClose = (isClear?: boolean) => {\r\n setAnchorEl(null)\r\n setStatus('normal')\r\n if (isClear) setKeywords('')\r\n }\r\n\r\n const handleSubmitSearch = () => {\r\n if (!keywords) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keywords], logic })\r\n handleClose(true)\r\n }\r\n\r\n const handleSubmitMobileSearch = (keyword: string) => {\r\n if (!keyword) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keyword], logic })\r\n }\r\n\r\n const handleKeyDown: InputBaseProps['onKeyDown'] = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n handleSubmitSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n refInput?.current?.blur()\r\n handleClose(true)\r\n }\r\n }\r\n\r\n const handleKeywordChange: InputBaseProps['onChange'] = (event) => {\r\n const finalValue = event.target.value \|\| ''\r\n setKeywords(finalValue)\r\n\r\n const isOpenPopper = Boolean(refBeforeInput?.current) && Boolean(finalValue)\r\n if (finalValue !== keywords) setAnchorEl(isOpenPopper ? refBeforeInput?.current \|\| null : null)\r\n }\r\n\r\n const handleFocus = (event: React.FocusEvent<HTMLElement>) => {\r\n setStatus('focus')\r\n if (!Boolean(keywords)) return\r\n setAnchorEl(refBeforeInput?.current \|\| event.currentTarget)\r\n }\r\n\r\n const handleClickMenuItem = (field: TFieldType<T>) => {\r\n if (!keywords) return\r\n const fieldConfig = config.fields[field]\r\n const fieldValue = context.filterState.storeFilter?.[field]\r\n const logic = fieldValue?.logic \|\| 'or'\r\n if (fieldConfig?.singleValue) {\r\n replaceFilter(field, { values: [keywords], logic })\r\n } else {\r\n addFilter(field, { values: [keywords], logic })\r\n }\r\n handleClose(true)\r\n }\r\n\r\n const handleClickSearch = () => {\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClickAway = (event: MouseEvent \| TouchEvent) => {\r\n handleClose()\r\n }\r\n\r\n const renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n if (isMinimal) return <MobileSearchButton placeholder='Search...' onSearching={handleSubmitMobileSearch} />\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' \|\| Boolean(keywords)) rootClass.push(classes.focus)\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClickAway}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps} sx={mergedConfig.rootSx}>\r\n <div className={classes.rootInner}>\r\n {mergedConfig.slots?.beforeInput \|\| null}\r\n <Box className={classes.beforeInput} ref={refBeforeInput} />\r\n <InputBase\r\n fullWidth\r\n className={classes.input}\r\n autoComplete='off'\r\n size='small'\r\n inputRef={refInput}\r\n value={keywords}\r\n placeholder='Search...'\r\n onKeyDown={handleKeyDown}\r\n onChange={handleKeywordChange}\r\n onFocus={handleFocus}\r\n startAdornment={<InputAdornmentLeft onSearch={handleClickSearch} />}\r\n endAdornment={<InputAdornmentRight hasKeyword={Boolean(keywords)} onSubmit={handleSubmitSearch} onClear={() => handleClose(true)} />}\r\n />\r\n {mergedConfig.slots?.afterInput \|\| null}\r\n </div>\r\n <PopperCustom anchorEl={anchorEl} open={isOpen} placement='bottom' transition disablePortal {...mergedConfig.slots?.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterInput\r\n}\r\n\r\nexport const filterInputClasses = {\r\n root: 'DinoFilterInput-root',\r\n rootInner: 'DinoFilterInput-rootInner',\r\n button: 'DinoFilterInput-button',\r\n input: 'DinoFilterInput-input',\r\n focus: 'DinoFilterInput-focus',\r\n beforeInput: 'DinoFilterInput-beforeInput',\r\n menu: 'DinoFilterInput-menu',\r\n menuItem: 'DinoFilterInput-menuItem',\r\n menuItemKey: 'DinoFilterInput-menuItemKey'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)(({ theme }) => ({\r\n // Note: we use CSS variable\r\n // '--dino-h-filter-input': '38px',\r\n [`&.${filterInputClasses.root}`]: {\r\n height: 'var(--dino-h-filter-input, 38px)',\r\n flex: 1,\r\n border: '1px solid',\r\n borderColor: alpha(theme.palette.divider, 0.12),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: theme.palette.background.paper,\r\n transition: theme.transitions.create(['border-color', 'box-shadow'])\r\n },\r\n '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`.${filterInputClasses.rootInner}`]: { height: '100%', display: 'flex', alignItems: 'stretch' },\r\n [`.${filterInputClasses.beforeInput}`]: { width: '1px', height: '100%', alignSelf: 'stretch' },\r\n [`.${filterInputClasses.input}`]: {\r\n padding: theme.spacing(0.5, 1),\r\n input: { fontSize: '14px', padding: '4px 0 5px' }\r\n },\r\n [`.${filterInputClasses.button}`]: { flex: '0 0 auto' }\r\n}))\r\n"],"names":["createFilterInput","config","classes","filterInputClasses","initialConfig","fields","_config$enableQuickSe","enableQuickSearch","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","initializeConfig","props","_props$slots2","_props$slots3","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","refInput","createRef","refBeforeInput","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","addFilter","replaceFilter","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","_useState3","_useState4","keywords","setKeywords","_useState5","_useState6","status","setStatus","mergedConfig","useMemo","_props$slots","beforeInput","afterInput","mergedRootSx","sx","slots","rootProps","rootSx","isMinimal","minimalInput","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","_jsx","MobileSearchButton","placeholder","onSearching","keyword","_context$filterState$2","fieldsList","rootClass","root","push","focus","ClickAwayListener","onClickAway","event","children","_jsxs","FilterInputStyled","className","join","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","size","inputRef","value","onKeyDown","keyCode","stopPropagation","preventDefault","_refInput$current","current","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","startAdornment","InputAdornmentLeft","onSearch","_refInput$current2","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","onClick","_context$filterState$3","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","fontWeight","flex","color","ml","noWrap","button","styled","_ref","theme","_defineProperty","height","border","borderColor","alpha","palette","divider","borderRadius","shape","backgroundColor","background","paper","transitions","create","text","primary","main","boxShadow","display","alignItems","width","alignSelf","padding","spacing","fontSize"],"mappings":"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"}
1	+ {"version":3,"file":"filter-input.js","sources":["../../../../src/filter-bar/components/filter-input.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 { Box, InputBase, MenuItem, MenuList, styled, Typography, alpha } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from '../hooks'\r\nimport { mapSpecialLabel } from '../helpers'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { PopperBody, PopperContent, PopperCustom } from './popper-custom'\r\nimport { getFieldsByMatches, InputAdornmentLeft, InputAdornmentRight } from './filter-input.units'\r\nimport MobileSearchButton from './filter-input.mobile'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { InputBaseProps } from '@mui/material'\r\nimport type { TFieldType } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { IFilterInputConfig, IFilterInputProps, IFilterInputSlots, TFieldInputConfigs } from './filter-input.types'\r\n\r\nconst initializeConfig = <T,>(config: IFilterInputConfig<T>): IFilterInputConfig<T> => {\r\n const { fields, enableQuickSearch = true } = config\r\n const qsKey = KeySpecial.quickSearch\r\n const mergedFields: TFieldInputConfigs<T> = { ...fields }\r\n\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n return { ...config, fields: mergedFields }\r\n}\r\n\r\nexport function createFilterInput<T>(config: IFilterInputConfig<T>) {\r\n const classes = filterInputClasses\r\n const initialConfig = initializeConfig(config)\r\n\r\n const FilterInput: FC<IFilterInputProps<T>> = (props) => {\r\n const refInput = createRef<HTMLInputElement>()\r\n const refBeforeInput = createRef<HTMLElement>()\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const { addFilter, replaceFilter } = useFilterActions<T>(context)\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement \| null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const [keywords, setKeywords] = useState<string>('')\r\n const [status, setStatus] = useState<'focus' \| 'normal'>('normal')\r\n\r\n const mergedConfig = useMemo(() => {\r\n const { beforeInput, afterInput } = config\r\n const mergedRootSx = Object.assign({}, props.sx, props.slots?.rootProps?.sx)\r\n const mergedSlots: IFilterInputSlots = Object.assign({}, { beforeInput, afterInput }, props.slots)\r\n return { slots: mergedSlots, rootSx: mergedRootSx }\r\n }, [])\r\n\r\n const isMinimal = config.minimalInput \|\| props.slots?.minimalInput \|\| false\r\n\r\n const handleClose = (isClear?: boolean) => {\r\n setAnchorEl(null)\r\n setStatus('normal')\r\n if (isClear) setKeywords('')\r\n }\r\n\r\n const handleSubmitSearch = () => {\r\n if (!keywords) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keywords], logic })\r\n handleClose(true)\r\n }\r\n\r\n const handleSubmitMobileSearch = (keyword: string) => {\r\n if (!keyword) return\r\n const qsField = context.filterState.storeFilter?.quickSearch\r\n const logic = qsField?.logic \|\| 'or'\r\n replaceFilter('quickSearch', { values: [keyword], logic })\r\n }\r\n\r\n const handleKeyDown: InputBaseProps['onKeyDown'] = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n handleSubmitSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n refInput?.current?.blur()\r\n handleClose(true)\r\n }\r\n }\r\n\r\n const handleKeywordChange: InputBaseProps['onChange'] = (event) => {\r\n const finalValue = event.target.value \|\| ''\r\n setKeywords(finalValue)\r\n\r\n const isOpenPopper = Boolean(refBeforeInput?.current) && Boolean(finalValue)\r\n if (finalValue !== keywords) setAnchorEl(isOpenPopper ? refBeforeInput?.current \|\| null : null)\r\n }\r\n\r\n const handleFocus = (event: React.FocusEvent<HTMLElement>) => {\r\n setStatus('focus')\r\n if (!Boolean(keywords)) return\r\n setAnchorEl(refBeforeInput?.current \|\| event.currentTarget)\r\n }\r\n\r\n const handleClickMenuItem = (field: TFieldType<T>) => {\r\n if (!keywords) return\r\n const fieldConfig = config.fields[field]\r\n const fieldValue = context.filterState.storeFilter?.[field]\r\n const logic = fieldValue?.logic \|\| 'or'\r\n if (fieldConfig?.singleValue) {\r\n replaceFilter(field, { values: [keywords], logic })\r\n } else {\r\n addFilter(field, { values: [keywords], logic })\r\n }\r\n handleClose(true)\r\n }\r\n\r\n const handleClickSearch = () => {\r\n refInput.current?.focus()\r\n }\r\n\r\n const handleClickAway = (event: MouseEvent \| TouchEvent) => {\r\n handleClose()\r\n }\r\n\r\n const renderContent = () => {\r\n const fieldsList = getFieldsByMatches(initialConfig, keywords)\r\n return (\r\n <PopperContent title='Filter Options' disableGutter onClose={() => setAnchorEl(null)}>\r\n <PopperBody disableGutter>\r\n <MenuList className={classes.menu}>\r\n {fieldsList.map((x, i) => {\r\n const field = x.field\r\n if (!x) return null\r\n const label = x.label ?? field.toString()\r\n const title = `${label}: \"${keywords}\"`\r\n return (\r\n <MenuItem title={title} key={field.toString() + i} onClick={() => handleClickMenuItem(field)} className={classes.menuItem}>\r\n <Typography variant='body2' sx={{ fontWeight: 500, flex: '0 0 auto' }}>\r\n {label}:\r\n </Typography>\r\n <Typography variant='body2' color='text.secondary' sx={{ ml: 1, flex: '1 1 auto' }} noWrap>\r\n \"{keywords}\"\r\n </Typography>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuList>\r\n </PopperBody>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n if (isMinimal) return <MobileSearchButton placeholder='Search...' onSearching={handleSubmitMobileSearch} />\r\n\r\n const rootClass = [classes.root]\r\n if (status === 'focus' \|\| Boolean(keywords)) rootClass.push(classes.focus)\r\n\r\n return (\r\n <ClickAwayListener onClickAway={handleClickAway}>\r\n <FilterInputStyled className={rootClass.join(' ')} {...props.slots?.rootProps} sx={mergedConfig.rootSx}>\r\n <div className={classes.rootInner}>\r\n {mergedConfig.slots?.beforeInput \|\| null}\r\n <Box className={classes.beforeInput} ref={refBeforeInput} />\r\n <InputBase\r\n fullWidth\r\n className={classes.input}\r\n autoComplete='off'\r\n size='small'\r\n inputRef={refInput}\r\n value={keywords}\r\n placeholder='Search...'\r\n onKeyDown={handleKeyDown}\r\n onChange={handleKeywordChange}\r\n onFocus={handleFocus}\r\n startAdornment={<InputAdornmentLeft onSearch={handleClickSearch} />}\r\n endAdornment={<InputAdornmentRight hasKeyword={Boolean(keywords)} onSubmit={handleSubmitSearch} onClear={() => handleClose(true)} />}\r\n />\r\n {mergedConfig.slots?.afterInput \|\| null}\r\n </div>\r\n <PopperCustom anchorEl={anchorEl} open={isOpen} placement='bottom' transition disablePortal {...mergedConfig.slots?.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterInput\r\n}\r\n\r\nexport const filterInputClasses = {\r\n root: 'DinoFilterInput-root',\r\n rootInner: 'DinoFilterInput-rootInner',\r\n button: 'DinoFilterInput-button',\r\n input: 'DinoFilterInput-input',\r\n focus: 'DinoFilterInput-focus',\r\n beforeInput: 'DinoFilterInput-beforeInput',\r\n menu: 'DinoFilterInput-menu',\r\n menuItem: 'DinoFilterInput-menuItem',\r\n menuItemKey: 'DinoFilterInput-menuItemKey'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)(({ theme }) => ({\r\n // Note: we use CSS variable\r\n // '--dino-h-filter-input': '38px',\r\n [`&.${filterInputClasses.root}`]: {\r\n height: 'var(--dino-h-filter-input, 38px)',\r\n flex: 1,\r\n border: '1px solid',\r\n borderColor: alpha(theme.palette.divider, 0.12),\r\n borderRadius: theme.shape.borderRadius,\r\n backgroundColor: theme.palette.background.paper,\r\n transition: theme.transitions.create(['border-color', 'box-shadow'])\r\n },\r\n '&:hover': { borderColor: theme.palette.text.primary },\r\n '&.Mui-focused': {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`&.${filterInputClasses.focus}`]: {\r\n borderColor: theme.palette.primary.main,\r\n boxShadow: `0 0 0 2px ${theme.palette.primary.main}33`\r\n },\r\n [`.${filterInputClasses.rootInner}`]: { height: '100%', display: 'flex', alignItems: 'stretch' },\r\n [`.${filterInputClasses.beforeInput}`]: { width: '1px', height: '100%', alignSelf: 'stretch' },\r\n [`.${filterInputClasses.input}`]: {\r\n padding: theme.spacing(0.5, 1),\r\n input: { fontSize: '14px', padding: '4px 0 5px' }\r\n },\r\n [`.${filterInputClasses.button}`]: { flex: '0 0 auto' }\r\n}))\r\n"],"names":["createFilterInput","config","classes","filterInputClasses","initialConfig","fields","_config$enableQuickSe","enableQuickSearch","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","initializeConfig","props","_props$slots2","_props$slots3","_mergedConfig$slots","_mergedConfig$slots2","_mergedConfig$slots3","refInput","createRef","refBeforeInput","context","useContext","FilterBarContext","_useFilterActions","useFilterActions","addFilter","replaceFilter","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","_useState3","_useState4","keywords","setKeywords","_useState5","_useState6","status","setStatus","mergedConfig","useMemo","_props$slots","beforeInput","afterInput","mergedRootSx","sx","slots","rootProps","rootSx","isMinimal","minimalInput","handleClose","isClear","handleSubmitSearch","_context$filterState$","qsField","filterState","storeFilter","logic","values","_jsx","MobileSearchButton","placeholder","onSearching","keyword","_context$filterState$2","fieldsList","rootClass","root","push","focus","ClickAwayListener","onClickAway","event","children","_jsxs","FilterInputStyled","className","join","rootInner","Box","ref","InputBase","fullWidth","input","autoComplete","size","inputRef","value","onKeyDown","keyCode","stopPropagation","preventDefault","_refInput$current","current","blur","onChange","finalValue","target","isOpenPopper","onFocus","currentTarget","startAdornment","InputAdornmentLeft","onSearch","_refInput$current2","endAdornment","InputAdornmentRight","hasKeyword","onSubmit","onClear","PopperCustom","open","placement","transition","disablePortal","popperProps","getFieldsByMatches","PopperContent","title","disableGutter","onClose","PopperBody","MenuList","menu","map","x","i","_x$label","toString","concat","MenuItem","onClick","_context$filterState$3","fieldConfig","fieldValue","singleValue","handleClickMenuItem","menuItem","Typography","variant","fontWeight","flex","color","ml","noWrap","button","styled","_ref","theme","_defineProperty","height","border","borderColor","alpha","palette","divider","borderRadius","shape","backgroundColor","background","paper","transitions","create","text","primary","main","boxShadow","display","alignItems","width","alignSelf","padding","spacing","fontSize"],"mappings":"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"}

package/dist/src/filter-bar/components/popper-custom.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,objectSpread2 as t,defineProperty as o,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{useMemo as a,useRef as l,useState as d,useLayoutEffect as c}from"react";import{styled as s,Popper as p,Fade as u,Box as m,alpha as h,Typography as f,Tooltip as g,IconButton as b}from"@mui/material";import x from"@mui/icons-material/Close";var v=["children"],C=["title","children","onClose","disableGutter","disableMinMaxWidth","slots","anchorEl"],w=["children"],M=["children"],y=s(function(o){var i=o.children,a=e(o,v);return n(p,t(t({},a),{},{children:function(e){var o=e.TransitionProps;return n(u,t(t({},o),{},{timeout:350,children:r("div",{children:[" ",i]})}))}}))})(function(e){return{zIndex:e.theme.zIndex.modal+1,maxWidth:"100%"}}),W=function(o){var s=a(function(){return j},[]),p=o.title,u=o.children,m=o.onClose,h=o.disableGutter,v=o.disableMinMaxWidth,w=o.slots;o.anchorEl;var M=e(o,C),y=l(null),W=d(void 0),P=i(W,2),D=P[0],G=P[1];c(function(){var e=y.current;if(e){var t=function(){var t=e.getBoundingClientRect().top;G("".concat(Math.max(window.innerHeight-t-24,160),"px"))};return t(),window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}},[]);var T=[s.root];return h&&T.push(s.disableGutter),v&&T.push(s.disableMinMaxWidth),r(z,t(t({ref:y,className:T.join(" "),style:D?{maxHeight:D}:void 0},M),{},{children:[r("div",{className:s.header,children:[null==w?void 0:w.beforeTitle,n(f,{variant:"subtitle1",className:s.title,children:p||"Menu Title"}),null==w?void 0:w.afterTitle,n(g,{title:"Close",placement:"top",arrow:!0,children:n(b,{size:"small",className:s.buttonClose,onClick:m,children:n(x,{fontSize:"small"})})})]}),u]}))},P=function(o){var i=o.children,r=e(o,w);return n(m,t(t({className:j.footer},r),{},{children:i}))},D=function(o){var i=o.children,r=e(o,M);return n(m,t(t({className:j.body},r),{},{children:i}))},j={root:"DinoPopperCustom-root",body:"DinoPopperCustom-body",header:"DinoPopperCustom-header",footer:"DinoPopperCustom-footer",title:"DinoPopperCustom-title",buttonClose:"DinoPopperCustom-buttonClose",disableGutter:"DinoPopperCustom-disableGutter",disableMinMaxWidth:"DinoPopperCustom-disableMinMaxWidth"},z=s(m)(function(e){var t=e.theme;return o(o(o(o(o(o(o({},"&.".concat(j.root),o({borderRadius:t.shape.borderRadius,boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:t.palette.background.paper,overflow:"hidden",display:"flex",flexDirection:"column"},"&:not(.".concat(j.disableMinMaxWidth,")"),o({minWidth:"350px",maxWidth:"550px"},t.breakpoints.down("sm"),{minWidth:"240px",maxWidth:"90vw"}))),".".concat(j.body),{padding:t.spacing(1),flex:1,minHeight:0,overflow:"auto"}),".".concat(j.header),{display:"flex",alignItems:"center",justifyContent:"space-between",gap:t.spacing(.5),backgroundColor:t.palette.grey[900],padding:t.spacing(.5,1),color:t.palette.common.white}),".".concat(j.title),{fontSize:"0.875rem",fontWeight:600,lineHeight:1,flexGrow:1}),".".concat(j.buttonClose),{color:t.palette.common.white,transition:t.transitions.create("color"),".MuiSvgIcon-root":{transition:t.transitions.create("transform")},"&:hover":{color:t.palette.error.light,backgroundColor:h(t.palette.common.white,.1),".MuiSvgIcon-root":{transform:"rotate(90deg)"}}}),".".concat(j.footer),o({display:"flex",justifyContent:"flex-end",gap:t.spacing(1),borderTop:"1px solid ".concat(t.palette.grey[100]),padding:t.spacing(.5,1)},".MuiButtonBase-root",{textTransform:"none",fontWeight:500,lineHeight:1,padding:t.spacing(1,1.5)})),"&.".concat(j.disableGutter),o(o(o({},".".concat(j.body),{padding:0}),".".concat(j.header),{padding:t.spacing(.5,1)}),".".concat(j.footer),{padding:t.spacing(.5,1.5),margin:t.spacing(1,1,0)}))});export{D as PopperBody,W as PopperContent,y as PopperCustom,P as PopperFooter};
+import{objectWithoutProperties as e,objectSpread2 as t,defineProperty as o,slicedToArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{useMemo as a,useRef as l,useState as c,useLayoutEffect as d}from"react";import{styled as s,Popper as p,Fade as u,Box as m,alpha as h,Typography as f,Tooltip as b,IconButton as g}from"@mui/material";import x from"@mui/icons-material/Close";var v=["children"],C=["title","children","onClose","disableGutter","disableMinMaxWidth","slots","anchorEl"],w=["children"],M=["children","disableGutter"],y=s(function(o){var i=o.children,a=e(o,v);return n(p,t(t({},a),{},{children:function(e){var o=e.TransitionProps;return n(u,t(t({},o),{},{timeout:350,children:r("div",{children:[" ",i]})}))}}))})(function(e){return{zIndex:e.theme.zIndex.modal+1,maxWidth:"100%"}}),W=function(o){var s=a(function(){return D},[]),p=o.title,u=o.children,m=o.onClose,h=o.disableGutter,v=o.disableMinMaxWidth,w=o.slots;o.anchorEl;var M=e(o,C),y=l(null),W=c(void 0),P=i(W,2),G=P[0],z=P[1];d(function(){var e=y.current;if(e){var t=function(){var t=e.getBoundingClientRect().top;z("".concat(Math.max(window.innerHeight-t-24,160),"px"))};return t(),window.addEventListener("resize",t),function(){return window.removeEventListener("resize",t)}}},[]);var T=[s.root];return h&&T.push(s.disableGutter),v&&T.push(s.disableMinMaxWidth),r(j,t(t({ref:y,className:T.join(" "),style:G?{maxHeight:G}:void 0},M),{},{children:[r("div",{className:s.header,children:[null==w?void 0:w.beforeTitle,n(f,{variant:"subtitle1",className:s.title,children:p||"Menu Title"}),null==w?void 0:w.afterTitle,n(b,{title:"Close",placement:"top",arrow:!0,children:n(g,{size:"small",className:s.buttonClose,onClick:m,children:n(x,{fontSize:"small"})})})]}),u]}))},P=function(o){var i=o.children,r=e(o,w);return n(m,t(t({className:D.footer},r),{},{children:i}))},G=function(o){var i=o.children,r=o.disableGutter,a=e(o,M);return n(m,t(t({className:"".concat(D.body," ").concat(r?D.disableGutter:"")},a),{},{children:i}))},D={root:"DinoPopperCustom-root",body:"DinoPopperCustom-body",header:"DinoPopperCustom-header",footer:"DinoPopperCustom-footer",title:"DinoPopperCustom-title",buttonClose:"DinoPopperCustom-buttonClose",disableGutter:"DinoPopperCustom-disableGutter",disableMinMaxWidth:"DinoPopperCustom-disableMinMaxWidth"},j=s(m)(function(e){var t=e.theme;return o(o(o(o(o(o(o({},"&.".concat(D.root),o({borderRadius:t.shape.borderRadius,boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:t.palette.background.paper,overflow:"hidden",display:"flex",flexDirection:"column"},"&:not(.".concat(D.disableMinMaxWidth,")"),o({minWidth:"350px",maxWidth:"550px"},t.breakpoints.down("sm"),{minWidth:"240px",maxWidth:"90vw"}))),".".concat(D.body),o({flex:1,minHeight:0,overflow:"auto"},"&:not(.".concat(D.disableGutter,")"),{padding:t.spacing(1)})),".".concat(D.header),{display:"flex",alignItems:"center",justifyContent:"space-between",gap:t.spacing(.5),backgroundColor:t.palette.grey[900],padding:t.spacing(.5,1),color:t.palette.common.white}),".".concat(D.title),{fontSize:"0.875rem",fontWeight:600,lineHeight:1,flexGrow:1}),".".concat(D.buttonClose),{color:t.palette.common.white,transition:t.transitions.create("color"),".MuiSvgIcon-root":{transition:t.transitions.create("transform")},"&:hover":{color:t.palette.error.light,backgroundColor:h(t.palette.common.white,.1),".MuiSvgIcon-root":{transform:"rotate(90deg)"}}}),".".concat(D.footer),o({display:"flex",justifyContent:"flex-end",gap:t.spacing(1),borderTop:"1px solid ".concat(t.palette.grey[100]),padding:t.spacing(.5,1)},".MuiButtonBase-root",{textTransform:"none",fontWeight:500,lineHeight:1,padding:t.spacing(1,1.5)})),"&.".concat(D.disableGutter),o(o(o({},".".concat(D.body),{padding:0}),".".concat(D.header),{padding:t.spacing(.5,1)}),".".concat(D.footer),{padding:t.spacing(.5,1.5),margin:t.spacing(1,1,0)}))});export{G as PopperBody,W as PopperContent,y as PopperCustom,P as PopperFooter};
 //# sourceMappingURL=popper-custom.js.map

package/dist/src/filter-bar/components/popper-custom.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"popper-custom.js","sources":["../../../../src/filter-bar/components/popper-custom.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useLayoutEffect, useMemo, useRef, useState } from 'react'\r\nimport { alpha, Box, Fade, IconButton, Popper, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\n// types\r\nimport type { FC, PropsWithChildren } from 'react'\r\nimport type { BoxProps, ButtonProps, PopperProps } from '@mui/material'\r\n\r\nexport const usePopperState = () => {\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement \| null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const handleToggle: React.MouseEventHandler<HTMLElement> = (event) => {\r\n setAnchorEl((prev) => (prev ? null : event.currentTarget))\r\n }\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n }\r\n\r\n return { anchorEl, isOpen, handleToggle, handleClose }\r\n}\r\n\r\ninterface IPopperProps extends Omit<PopperProps, 'children'>, PropsWithChildren {}\r\n\r\nexport const PopperCustom = styled(({ children, ...props }: IPopperProps) => (\r\n <Popper {...props}>\r\n {({ TransitionProps }) => (\r\n <Fade {...TransitionProps} timeout={350}>\r\n <div> {children}</div>\r\n </Fade>\r\n )}\r\n </Popper>\r\n))(({ theme }) => ({\r\n zIndex: theme.zIndex.modal + 1,\r\n maxWidth: '100%'\r\n}))\r\n\r\nexport interface PopperContentProps extends BoxProps {\r\n sx?: BoxProps['sx']\r\n title?: string\r\n children: React.ReactNode\r\n onClose?: ButtonProps['onClick']\r\n disableGutter?: boolean\r\n disableMinMaxWidth?: boolean\r\n anchorEl?: HTMLElement \| null\r\n slots?: {\r\n afterTitle?: React.ReactNode\r\n beforeTitle?: React.ReactNode\r\n }\r\n}\r\n\r\nexport const PopperContent: FC<PopperContentProps> = (props) => {\r\n const classes = useMemo(() => popperCustomClasses, [])\r\n const { title, children, onClose, disableGutter, disableMinMaxWidth, slots, anchorEl, ...rest } = props\r\n const containerRef = useRef<HTMLDivElement>(null)\r\n const [maxHeight, setMaxHeight] = useState<string \| undefined>(undefined)\r\n\r\n useLayoutEffect(() => {\r\n const el = containerRef.current\r\n if (!el) return\r\n const calculate = () => {\r\n const { top } = el.getBoundingClientRect()\r\n setMaxHeight(`${Math.max(window.innerHeight - top - 24, 160)}px`)\r\n }\r\n calculate()\r\n window.addEventListener('resize', calculate)\r\n return () => window.removeEventListener('resize', calculate)\r\n }, [])\r\n\r\n const rootClasses = [classes.root]\r\n if (disableGutter) rootClasses.push(classes.disableGutter)\r\n if (disableMinMaxWidth) rootClasses.push(classes.disableMinMaxWidth)\r\n\r\n return (\r\n <PopperContentStyled ref={containerRef} className={rootClasses.join(' ')} style={maxHeight ? { maxHeight } : undefined} {...rest}>\r\n <div className={classes.header}>\r\n {slots?.beforeTitle}\r\n <Typography variant='subtitle1' className={classes.title}>\r\n {title \|\| 'Menu Title'}\r\n </Typography>\r\n {slots?.afterTitle}\r\n <Tooltip title='Close' placement='top' arrow>\r\n <IconButton size='small' className={classes.buttonClose} onClick={onClose}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </div>\r\n {children}\r\n </PopperContentStyled>\r\n )\r\n}\r\n\r\nexport const PopperFooter: FC<BoxProps & Required<PropsWithChildren>> = ({ children, ...rest }) => (\r\n <Box className={popperCustomClasses.footer} {...rest}>\r\n {children}\r\n </Box>\r\n)\r\n\r\nexport const PopperBody: FC<BoxProps & Required<PropsWithChildren>> = ({ children, ...rest }) => (\r\n <Box className={popperCustomClasses.body} {...rest}>\r\n {children}\r\n </Box>\r\n)\r\n\r\nconst popperCustomClasses = {\r\n root: 'DinoPopperCustom-root',\r\n body: 'DinoPopperCustom-body',\r\n header: 'DinoPopperCustom-header',\r\n footer: 'DinoPopperCustom-footer',\r\n title: 'DinoPopperCustom-title',\r\n buttonClose: 'DinoPopperCustom-buttonClose',\r\n disableGutter: 'DinoPopperCustom-disableGutter',\r\n disableMinMaxWidth: 'DinoPopperCustom-disableMinMaxWidth'\r\n}\r\n\r\nconst PopperContentStyled = styled(Box)(({ theme }) => ({\r\n [`&.${popperCustomClasses.root}`]: {\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n backgroundColor: theme.palette.background.paper,\r\n overflow: 'hidden',\r\n display: 'flex',\r\n flexDirection: 'column',\r\n [`&:not(.${popperCustomClasses.disableMinMaxWidth})`]: {\r\n minWidth: '350px',\r\n maxWidth: '550px',\r\n [theme.breakpoints.down('sm')]: {\r\n minWidth: '240px',\r\n maxWidth: '90vw'\r\n }\r\n }\r\n },\r\n [`.${popperCustomClasses.body}`]: {\r\n padding: theme.spacing(1),\r\n flex: 1,\r\n minHeight: 0,\r\n overflow: 'auto'\r\n },\r\n [`.${popperCustomClasses.header}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n gap: theme.spacing(0.5),\r\n backgroundColor: theme.palette.grey[900],\r\n padding: theme.spacing(0.5, 1),\r\n color: theme.palette.common.white\r\n },\r\n [`.${popperCustomClasses.title}`]: {\r\n fontSize: '0.875rem',\r\n fontWeight: 600,\r\n lineHeight: 1,\r\n flexGrow: 1\r\n },\r\n [`.${popperCustomClasses.buttonClose}`]: {\r\n color: theme.palette.common.white,\r\n transition: theme.transitions.create('color'),\r\n '.MuiSvgIcon-root': { transition: theme.transitions.create('transform') },\r\n '&:hover': {\r\n color: theme.palette.error.light,\r\n backgroundColor: alpha(theme.palette.common.white, 0.1),\r\n '.MuiSvgIcon-root': { transform: 'rotate(90deg)' }\r\n }\r\n },\r\n [`.${popperCustomClasses.footer}`]: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n gap: theme.spacing(1),\r\n borderTop: `1px solid ${theme.palette.grey[100]}`,\r\n padding: theme.spacing(0.5, 1),\r\n [`.MuiButtonBase-root`]: {\r\n textTransform: 'none',\r\n fontWeight: 500,\r\n lineHeight: 1,\r\n padding: theme.spacing(1, 1.5)\r\n }\r\n },\r\n [`&.${popperCustomClasses.disableGutter}`]: {\r\n [`.${popperCustomClasses.body}`]: { padding: 0 },\r\n [`.${popperCustomClasses.header}`]: { padding: theme.spacing(0.5, 1) },\r\n [`.${popperCustomClasses.footer}`]: { padding: theme.spacing(0.5, 1.5), margin: theme.spacing(1, 1, 0) }\r\n }\r\n}))\r\n"],"names":["PopperCustom","styled","_ref","children","props","_objectWithoutProperties","_excluded","_jsx","Popper","_objectSpread","_ref2","TransitionProps","Fade","timeout","_jsxs","_ref3","zIndex","theme","modal","maxWidth","PopperContent","classes","useMemo","popperCustomClasses","title","onClose","disableGutter","disableMinMaxWidth","slots","anchorEl","rest","_excluded2","containerRef","useRef","_useState3","useState","undefined","_useState4","_slicedToArray","maxHeight","setMaxHeight","useLayoutEffect","el","current","calculate","top","getBoundingClientRect","concat","Math","max","window","innerHeight","addEventListener","removeEventListener","rootClasses","root","push","PopperContentStyled","ref","className","join","style","header","beforeTitle","Typography","variant","afterTitle","Tooltip","placement","arrow","IconButton","size","buttonClose","onClick","CloseIcon","fontSize","PopperFooter","_ref4","_excluded3","Box","footer","PopperBody","_ref5","_excluded4","body","_ref6","_defineProperty","borderRadius","shape","boxShadow","backgroundColor","palette","background","paper","overflow","display","flexDirection","minWidth","breakpoints","down","padding","spacing","flex","minHeight","alignItems","justifyContent","gap","grey","color","common","white","fontWeight","lineHeight","flexGrow","transition","transitions","create","error","light","alpha","transform","borderTop","textTransform","margin"],"mappings":"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"}
1	+ {"version":3,"file":"popper-custom.js","sources":["../../../../src/filter-bar/components/popper-custom.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { useLayoutEffect, useMemo, useRef, useState } from 'react'\r\nimport { alpha, Box, Fade, IconButton, Popper, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\n// types\r\nimport type { FC, PropsWithChildren } from 'react'\r\nimport type { BoxProps, ButtonProps, PopperProps } from '@mui/material'\r\n\r\nexport const usePopperState = () => {\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement \| null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const handleToggle: React.MouseEventHandler<HTMLElement> = (event) => {\r\n setAnchorEl((prev) => (prev ? null : event.currentTarget))\r\n }\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n }\r\n\r\n return { anchorEl, isOpen, handleToggle, handleClose }\r\n}\r\n\r\ninterface IPopperProps extends Omit<PopperProps, 'children'>, PropsWithChildren {}\r\n\r\nexport const PopperCustom = styled(({ children, ...props }: IPopperProps) => (\r\n <Popper {...props}>\r\n {({ TransitionProps }) => (\r\n <Fade {...TransitionProps} timeout={350}>\r\n <div> {children}</div>\r\n </Fade>\r\n )}\r\n </Popper>\r\n))(({ theme }) => ({\r\n zIndex: theme.zIndex.modal + 1,\r\n maxWidth: '100%'\r\n}))\r\n\r\nexport interface PopperContentProps extends BoxProps {\r\n sx?: BoxProps['sx']\r\n title?: string\r\n children: React.ReactNode\r\n onClose?: ButtonProps['onClick']\r\n disableGutter?: boolean\r\n disableMinMaxWidth?: boolean\r\n anchorEl?: HTMLElement \| null\r\n slots?: {\r\n afterTitle?: React.ReactNode\r\n beforeTitle?: React.ReactNode\r\n }\r\n}\r\n\r\nexport const PopperContent: FC<PopperContentProps> = (props) => {\r\n const classes = useMemo(() => popperCustomClasses, [])\r\n const { title, children, onClose, disableGutter, disableMinMaxWidth, slots, anchorEl, ...rest } = props\r\n const containerRef = useRef<HTMLDivElement>(null)\r\n const [maxHeight, setMaxHeight] = useState<string \| undefined>(undefined)\r\n\r\n useLayoutEffect(() => {\r\n const el = containerRef.current\r\n if (!el) return\r\n const calculate = () => {\r\n const { top } = el.getBoundingClientRect()\r\n setMaxHeight(`${Math.max(window.innerHeight - top - 24, 160)}px`)\r\n }\r\n calculate()\r\n window.addEventListener('resize', calculate)\r\n return () => window.removeEventListener('resize', calculate)\r\n }, [])\r\n\r\n const rootClasses = [classes.root]\r\n if (disableGutter) rootClasses.push(classes.disableGutter)\r\n if (disableMinMaxWidth) rootClasses.push(classes.disableMinMaxWidth)\r\n\r\n return (\r\n <PopperContentStyled ref={containerRef} className={rootClasses.join(' ')} style={maxHeight ? { maxHeight } : undefined} {...rest}>\r\n <div className={classes.header}>\r\n {slots?.beforeTitle}\r\n <Typography variant='subtitle1' className={classes.title}>\r\n {title \|\| 'Menu Title'}\r\n </Typography>\r\n {slots?.afterTitle}\r\n <Tooltip title='Close' placement='top' arrow>\r\n <IconButton size='small' className={classes.buttonClose} onClick={onClose}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </div>\r\n {children}\r\n </PopperContentStyled>\r\n )\r\n}\r\n\r\nexport const PopperFooter: FC<BoxProps & Required<PropsWithChildren>> = ({ children, ...rest }) => (\r\n <Box className={popperCustomClasses.footer} {...rest}>\r\n {children}\r\n </Box>\r\n)\r\n\r\ninterface IPopperBodyProps extends BoxProps, PropsWithChildren {\r\n disableGutter?: boolean\r\n}\r\n\r\nexport const PopperBody: FC<IPopperBodyProps> = ({ children, disableGutter, ...rest }) => (\r\n <Box className={`${popperCustomClasses.body} ${disableGutter ? popperCustomClasses.disableGutter : ''}`} {...rest}>\r\n {children}\r\n </Box>\r\n)\r\n\r\nconst popperCustomClasses = {\r\n root: 'DinoPopperCustom-root',\r\n body: 'DinoPopperCustom-body',\r\n header: 'DinoPopperCustom-header',\r\n footer: 'DinoPopperCustom-footer',\r\n title: 'DinoPopperCustom-title',\r\n buttonClose: 'DinoPopperCustom-buttonClose',\r\n disableGutter: 'DinoPopperCustom-disableGutter',\r\n disableMinMaxWidth: 'DinoPopperCustom-disableMinMaxWidth'\r\n}\r\n\r\nconst PopperContentStyled = styled(Box)(({ theme }) => ({\r\n [`&.${popperCustomClasses.root}`]: {\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n backgroundColor: theme.palette.background.paper,\r\n overflow: 'hidden',\r\n display: 'flex',\r\n flexDirection: 'column',\r\n [`&:not(.${popperCustomClasses.disableMinMaxWidth})`]: {\r\n minWidth: '350px',\r\n maxWidth: '550px',\r\n [theme.breakpoints.down('sm')]: {\r\n minWidth: '240px',\r\n maxWidth: '90vw'\r\n }\r\n }\r\n },\r\n [`.${popperCustomClasses.body}`]: {\r\n flex: 1,\r\n minHeight: 0,\r\n overflow: 'auto',\r\n [`&:not(.${popperCustomClasses.disableGutter})`]: {\r\n padding: theme.spacing(1)\r\n }\r\n },\r\n [`.${popperCustomClasses.header}`]: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'space-between',\r\n gap: theme.spacing(0.5),\r\n backgroundColor: theme.palette.grey[900],\r\n padding: theme.spacing(0.5, 1),\r\n color: theme.palette.common.white\r\n },\r\n [`.${popperCustomClasses.title}`]: {\r\n fontSize: '0.875rem',\r\n fontWeight: 600,\r\n lineHeight: 1,\r\n flexGrow: 1\r\n },\r\n [`.${popperCustomClasses.buttonClose}`]: {\r\n color: theme.palette.common.white,\r\n transition: theme.transitions.create('color'),\r\n '.MuiSvgIcon-root': { transition: theme.transitions.create('transform') },\r\n '&:hover': {\r\n color: theme.palette.error.light,\r\n backgroundColor: alpha(theme.palette.common.white, 0.1),\r\n '.MuiSvgIcon-root': { transform: 'rotate(90deg)' }\r\n }\r\n },\r\n [`.${popperCustomClasses.footer}`]: {\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n gap: theme.spacing(1),\r\n borderTop: `1px solid ${theme.palette.grey[100]}`,\r\n padding: theme.spacing(0.5, 1),\r\n [`.MuiButtonBase-root`]: {\r\n textTransform: 'none',\r\n fontWeight: 500,\r\n lineHeight: 1,\r\n padding: theme.spacing(1, 1.5)\r\n }\r\n },\r\n [`&.${popperCustomClasses.disableGutter}`]: {\r\n [`.${popperCustomClasses.body}`]: { padding: 0 },\r\n [`.${popperCustomClasses.header}`]: { padding: theme.spacing(0.5, 1) },\r\n [`.${popperCustomClasses.footer}`]: { padding: theme.spacing(0.5, 1.5), margin: theme.spacing(1, 1, 0) }\r\n }\r\n}))\r\n"],"names":["PopperCustom","styled","_ref","children","props","_objectWithoutProperties","_excluded","_jsx","Popper","_objectSpread","_ref2","TransitionProps","Fade","timeout","_jsxs","_ref3","zIndex","theme","modal","maxWidth","PopperContent","classes","useMemo","popperCustomClasses","title","onClose","disableGutter","disableMinMaxWidth","slots","anchorEl","rest","_excluded2","containerRef","useRef","_useState3","useState","undefined","_useState4","_slicedToArray","maxHeight","setMaxHeight","useLayoutEffect","el","current","calculate","top","getBoundingClientRect","concat","Math","max","window","innerHeight","addEventListener","removeEventListener","rootClasses","root","push","PopperContentStyled","ref","className","join","style","header","beforeTitle","Typography","variant","afterTitle","Tooltip","placement","arrow","IconButton","size","buttonClose","onClick","CloseIcon","fontSize","PopperFooter","_ref4","_excluded3","Box","footer","PopperBody","_ref5","_excluded4","body","_ref6","_defineProperty","borderRadius","shape","boxShadow","backgroundColor","palette","background","paper","overflow","display","flexDirection","minWidth","breakpoints","down","flex","minHeight","padding","spacing","alignItems","justifyContent","gap","grey","color","common","white","fontWeight","lineHeight","flexGrow","transition","transitions","create","error","light","alpha","transform","borderTop","textTransform","margin"],"mappings":"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"}

package/dist/src/filter-bar/menu/create-form-field-select-multiple.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as l,toConsumableArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as o}from"react/jsx-runtime";import{useMemo as r,useState as t}from"react";import{styled as a,FormGroup as u,FormControlLabel as s,Checkbox as c,Button as v,Box as d}from"@mui/material";import{createChipViewers as f}from"../components/chip-viewer.js";import{PopperContent as m,PopperBody as p,PopperFooter as b}from"../components/popper-custom.js";import{ButtonBack as g,ChipDark as h,FilterLogicToggle as y}from"../components/ui.units.js";import{getErrorMessage as C}from"../../form/helpers.js";function x(a){var x=f(),j=(a||{}).options,k=void 0===j?[]:j;return function(f){var j,z,S=r(function(){return Object.assign({},f.currentConfig,null==a?void 0:a.config)},[null==a?void 0:a.config,f.currentConfig]),B=f.value,L=void 0===B?{values:[],logic:null!==(j=null==S?void 0:S.defaultLogic)&&void 0!==j?j:"or"}:B,R=t(L.logic),T=e(R,2),V=T[0],w=T[1],F=null!==(z=null==S?void 0:S.label)&&void 0!==z?z:S.field.toString(),I=r(function(){var e=Array.isArray(L.values)?L.values:[L.values];return k.filter(function(l){return e.includes(l.value)}).map(function(e){return e.value})},[]),N=t(I),O=e(N,2),P=O[0],_=O[1],D=t({}),E=e(D,2),H=E[0],M=E[1],q=function(e){f.onSubmit(S.field,e,S)},G=C(H,S.field),J=r(function(){var e=Array.isArray(L.values)?L.values:[L.values];return{field:S.field,items:e.map(function(e){var l;return{value:e,label:null===(l=k.find(function(l){return l.value===e}))||void 0===l?void 0:l.label}})}},[S.field,L]),K=[];return f.isLoading&&K.push("disabled"),n(A,{className:K.join(" "),noValidate:!0,onSubmit:function(e){var i;e.preventDefault();var n=l({},S.field,P),o=null===(i=f.validator)||void 0===i?void 0:i.run(n);(M(o||{}),o&&0!==Object.keys(o).length)||q({values:P,logic:V})},children:o(m,{title:"Filter by ".concat(F),onClose:f.onClose,slots:{beforeTitle:n(g,{size:"small",onClick:f.onBack}),afterTitle:S.singleValue?n(h,{sx:{ml:1.5},size:"small",label:"Last value only"}):!L.values||L.values.length<2?null:n(y,{sx:{ml:1},value:V,onChange:function(e,l){return function(e){w(e);var l={values:L.values,logic:e};q(l)}(l)}})},children:[o(p,{children:[n(x,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:J,onRemove:f.onRemove}),n(u,{className:G.error?"error":"",children:k.map(function(e,l){var o,r=P.includes(e.value),t=J.items.length>0&&J.items.some(function(l){return l.value===e.value});return n(s,{value:e.value,disabled:t&&!0===(null==a?void 0:a.disabledAfterSubmit),label:null!==(o=e.label)&&void 0!==o?o:e.value,control:n(c,{name:S.field.toString(),checked:r,onChange:function(l){return n=e.value,o=l.target.checked,void _(function(e){return o?[].concat(i(e),[n]):e.filter(function(e){return e!==n})});var n,o}})},e.value.toString()+l)})})]}),o(b,{children:[n(v,{size:"small",color:"error",variant:"text",disabled:!L.values||0===L.values.length,onClick:function(){var e,l;null===(e=f.onRemoveField)||void 0===e||e.call(f,S.field),!1!==(null==a||null===(l=a.config)||void 0===l?void 0:l.closeAfterClear)&&f.onClose()},children:"Clear All"}),n(d,{sx:{flex:1}}),n(v,{size:"small",color:"inherit",variant:"text",onClick:f.onClose,children:"Cancel"}),n(v,{size:"small",type:"submit",color:"primary",variant:"contained",children:"Apply"})]})]})})}}var A=a("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{x as default};
+import{slicedToArray as e,defineProperty as l,toConsumableArray as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as o}from"react/jsx-runtime";import{useMemo as r,useState as t}from"react";import{styled as a,FormGroup as u,FormControlLabel as s,Checkbox as c,Button as v,Box as d}from"@mui/material";import{createChipViewers as f}from"../components/chip-viewer.js";import{PopperContent as m,PopperBody as p,PopperFooter as b}from"../components/popper-custom.js";import{ButtonBack as g,ChipDark as h,FilterLogicToggle as y}from"../components/ui.units.js";import{getErrorMessage as C}from"../../form/helpers.js";function x(a){var x=f(),j=(a||{}).options,k=void 0===j?[]:j;return function(f){var j,z,S=r(function(){return Object.assign({},f.currentConfig,null==a?void 0:a.config)},[null==a?void 0:a.config,f.currentConfig]),B=f.value,L=void 0===B?{values:[],logic:null!==(j=null==S?void 0:S.defaultLogic)&&void 0!==j?j:"and"}:B,R=t(L.logic),T=e(R,2),V=T[0],w=T[1],F=null!==(z=null==S?void 0:S.label)&&void 0!==z?z:S.field.toString(),I=r(function(){var e=Array.isArray(L.values)?L.values:[L.values];return k.filter(function(l){return e.includes(l.value)}).map(function(e){return e.value})},[]),N=t(I),O=e(N,2),P=O[0],_=O[1],D=t({}),E=e(D,2),H=E[0],M=E[1],q=function(e){f.onSubmit(S.field,e,S)},G=C(H,S.field),J=r(function(){var e=Array.isArray(L.values)?L.values:[L.values];return{field:S.field,items:e.map(function(e){var l;return{value:e,label:null===(l=k.find(function(l){return l.value===e}))||void 0===l?void 0:l.label}})}},[S.field,L]),K=[];return f.isLoading&&K.push("disabled"),n(A,{className:K.join(" "),noValidate:!0,onSubmit:function(e){var i;e.preventDefault();var n=l({},S.field,P),o=null===(i=f.validator)||void 0===i?void 0:i.run(n);(M(o||{}),o&&0!==Object.keys(o).length)||q({values:P,logic:V})},children:o(m,{title:"Filter by ".concat(F),onClose:f.onClose,slots:{beforeTitle:n(g,{size:"small",onClick:f.onBack}),afterTitle:S.singleValue?n(h,{sx:{ml:1.5},size:"small",label:"Last value only"}):!L.values||L.values.length<2?null:n(y,{sx:{ml:1},value:V,onChange:function(e,l){return function(e){w(e);var l={values:L.values,logic:e};q(l)}(l)}})},children:[o(p,{children:[n(x,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:J,onRemove:f.onRemove}),n(u,{className:G.error?"error":"",children:k.map(function(e,l){var o,r=P.includes(e.value),t=J.items.length>0&&J.items.some(function(l){return l.value===e.value});return n(s,{value:e.value,disabled:t&&!0===(null==a?void 0:a.disabledAfterSubmit),label:null!==(o=e.label)&&void 0!==o?o:e.value,control:n(c,{name:S.field.toString(),checked:r,onChange:function(l){return n=e.value,o=l.target.checked,void _(function(e){return o?[].concat(i(e),[n]):e.filter(function(e){return e!==n})});var n,o}})},e.value.toString()+l)})})]}),o(b,{children:[n(v,{size:"small",color:"error",variant:"text",disabled:!L.values||0===L.values.length,onClick:function(){var e,l;null===(e=f.onRemoveField)||void 0===e||e.call(f,S.field),!1!==(null==a||null===(l=a.config)||void 0===l?void 0:l.closeAfterClear)&&f.onClose()},children:"Clear All"}),n(d,{sx:{flex:1}}),n(v,{size:"small",color:"inherit",variant:"text",onClick:f.onClose,children:"Cancel"}),n(v,{size:"small",type:"submit",color:"primary",variant:"contained",children:"Apply"})]})]})})}}var A=a("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{x as default};
 //# sourceMappingURL=create-form-field-select-multiple.js.map

package/dist/src/filter-bar/menu/create-form-field-select-multiple.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create-form-field-select-multiple.js","sources":["../../../../src/filter-bar/menu/create-form-field-select-multiple.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, Checkbox, FormControlLabel, FormGroup, formGroupClasses, styled } from '@mui/material'\r\nimport { getErrorMessage } from '../../form'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldSelectOption } from './create-form-field-select'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './types'\r\n\r\n/** Props for the `FormFieldSelectMultiple` component returned by `createFormFieldSelectMultiple`. Extends the base filter-menu form props. /\r\nexport interface IFormFieldSelectMultipleProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\n/* Parameters passed to `createFormFieldSelectMultiple` to configure the generated component. /\r\nexport interface IFormFieldSelectMultipleParam<T> {\r\n /* Optional configuration for the form field /\r\n config?: IFieldMenuConfig<T>\r\n /* List of options for the select field /\r\n options: IFieldSelectOption[]\r\n /* If true, disables the field after submission. @default false /\r\n disabledAfterSubmit?: boolean\r\n}\r\n\r\n/\r\n Factory function that creates a `FormFieldSelectMultiple` filter-menu component.\r\n \r\n The generated component renders a checkbox list of options inside a\r\n * popper/menu panel, allowing the user to select multiple values at once.\r\n * It supports:\r\n * - Controlled checkbox state to prevent uncontrolled→controlled React warnings\r\n * - OR / AND logic toggle when more than one value is applied\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n \r\n @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a multi-select filter-menu field component\r\n /\r\nfunction createFormFieldSelectMultiple<T>(params?: IFormFieldSelectMultipleParam<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n const { options = [] } = params \|\| {}\r\n\r\n const FormFieldSelectMultiple: FC<IFormFieldSelectMultipleProps<T>> = (props) => {\r\n /* Merge `props.currentConfig` with `params.config` (if provided).\r\n * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n */\r\n const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n // Track checked values as controlled state to avoid the uncontrolled→controlled MUI warning\r\n const initialChecked = useMemo<TFieldValid[]>(() => {\r\n const values = Array.isArray(value.values) ? value.values : [value.values]\r\n return options.filter((opt) => values.includes(opt.value)).map((opt) => opt.value)\r\n }, [])\r\n const [checkedValues, setCheckedValues] = useState<TFieldValid[]>(initialChecked)\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n const handleCheckboxChange = (optionValue: TFieldValid, checked: boolean) => {\r\n setCheckedValues((prev) => (checked ? [...prev, optionValue] : prev.filter((v) => v !== optionValue)))\r\n }\r\n\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault()\r\n const obj = { [mergedConfig.field]: checkedValues } as Partial<TFieldModelValid<T>>\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData \|\| {})\r\n\r\n if (!errorData \|\| Object.keys(errorData).length === 0) {\r\n const newValue: TFieldValue = { values: checkedValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n }\r\n }\r\n\r\n const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return {\r\n field: mergedConfig.field,\r\n items: items.map((v) => ({ value: v, label: options.find((o) => o.value === v)?.label }))\r\n }\r\n }, [mergedConfig.field, value])\r\n\r\n const handleChangeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(mergedConfig.field)\r\n if (params?.config?.closeAfterClear !== false) props.onClose()\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values \|\| value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n }\r\n\r\n const rootClasses: string[] = []\r\n if (props.isLoading) rootClasses.push('disabled')\r\n\r\n return (\r\n <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <FormGroup className={errorResult.error ? 'error' : ''}>\r\n {options.map((x, i) => {\r\n const isChecked = checkedValues.includes(x.value as TFieldValid)\r\n const disabled = filterViewerValue.items.length > 0 && filterViewerValue.items.some((item) => item.value === x.value)\r\n return (\r\n <FormControlLabel\r\n key={x.value.toString() + i}\r\n value={x.value}\r\n disabled={disabled && params?.disabledAfterSubmit === true}\r\n label={x.label ?? x.value}\r\n control={\r\n <Checkbox\r\n name={mergedConfig.field.toString()}\r\n checked={isChecked}\r\n onChange={(e) => handleCheckboxChange(x.value as TFieldValid, e.target.checked)}\r\n />\r\n }\r\n />\r\n )\r\n })}\r\n </FormGroup>\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='error' variant='text' disabled={!value.values \|\| value.values.length === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </RootStyled>\r\n )\r\n }\r\n\r\n return FormFieldSelectMultiple\r\n}\r\n\r\nexport default createFormFieldSelectMultiple\r\n\r\nconst RootStyled = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n }\r\n // [`.${formGroupClasses.root}`]: {}\r\n})\r\n"],"names":["createFormFieldSelectMultiple","params","ChipViewers","createChipViewers","_ref$options","options","props","_mergedConfig$default","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","initialChecked","Array","isArray","filter","opt","includes","map","_useState3","_useState4","checkedValues","setCheckedValues","_useState5","_useState6","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","v","_options$find","find","o","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","obj","_defineProperty","validator","run","keys","length","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","newLogic","handleChangeLogic","PopperBody","mb","borderBottom","placement","enableMinimalesticView","onRemove","FormGroup","error","x","i","_x$label","isChecked","disabled","some","item","FormControlLabel","disabledAfterSubmit","control","Checkbox","name","checked","e","optionValue","target","prev","_toConsumableArray","PopperFooter","Button","color","variant","_props$onRemoveField","_params$config","onRemoveField","call","closeAfterClear","Box","flex","type","styled","position","content","display","inset","backgroundColor","zIndex","opacity","transition","visibility","pointerEvents"],"mappings":"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"}
1	+ {"version":3,"file":"create-form-field-select-multiple.js","sources":["../../../../src/filter-bar/menu/create-form-field-select-multiple.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, Checkbox, FormControlLabel, FormGroup, formGroupClasses, styled } from '@mui/material'\r\nimport { getErrorMessage } from '../../form'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldSelectOption } from './create-form-field-select'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './types'\r\n\r\n/** Props for the `FormFieldSelectMultiple` component returned by `createFormFieldSelectMultiple`. Extends the base filter-menu form props. /\r\nexport interface IFormFieldSelectMultipleProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\n/* Parameters passed to `createFormFieldSelectMultiple` to configure the generated component. /\r\nexport interface IFormFieldSelectMultipleParam<T> {\r\n /* Optional configuration for the form field /\r\n config?: IFieldMenuConfig<T>\r\n /* List of options for the select field /\r\n options: IFieldSelectOption[]\r\n /* If true, disables the field after submission. @default false /\r\n disabledAfterSubmit?: boolean\r\n}\r\n\r\n/\r\n Factory function that creates a `FormFieldSelectMultiple` filter-menu component.\r\n \r\n The generated component renders a checkbox list of options inside a\r\n * popper/menu panel, allowing the user to select multiple values at once.\r\n * It supports:\r\n * - Controlled checkbox state to prevent uncontrolled→controlled React warnings\r\n * - OR / AND logic toggle when more than one value is applied\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n \r\n @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a multi-select filter-menu field component\r\n /\r\nfunction createFormFieldSelectMultiple<T>(params?: IFormFieldSelectMultipleParam<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n const { options = [] } = params \|\| {}\r\n\r\n const FormFieldSelectMultiple: FC<IFormFieldSelectMultipleProps<T>> = (props) => {\r\n /* Merge `props.currentConfig` with `params.config` (if provided).\r\n * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n */\r\n const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'and' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n // Track checked values as controlled state to avoid the uncontrolled→controlled MUI warning\r\n const initialChecked = useMemo<TFieldValid[]>(() => {\r\n const values = Array.isArray(value.values) ? value.values : [value.values]\r\n return options.filter((opt) => values.includes(opt.value)).map((opt) => opt.value)\r\n }, [])\r\n const [checkedValues, setCheckedValues] = useState<TFieldValid[]>(initialChecked)\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n const handleCheckboxChange = (optionValue: TFieldValid, checked: boolean) => {\r\n setCheckedValues((prev) => (checked ? [...prev, optionValue] : prev.filter((v) => v !== optionValue)))\r\n }\r\n\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault()\r\n const obj = { [mergedConfig.field]: checkedValues } as Partial<TFieldModelValid<T>>\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData \|\| {})\r\n\r\n if (!errorData \|\| Object.keys(errorData).length === 0) {\r\n const newValue: TFieldValue = { values: checkedValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n }\r\n }\r\n\r\n const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return {\r\n field: mergedConfig.field,\r\n items: items.map((v) => ({ value: v, label: options.find((o) => o.value === v)?.label }))\r\n }\r\n }, [mergedConfig.field, value])\r\n\r\n const handleChangeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(mergedConfig.field)\r\n if (params?.config?.closeAfterClear !== false) props.onClose()\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values \|\| value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n }\r\n\r\n const rootClasses: string[] = []\r\n if (props.isLoading) rootClasses.push('disabled')\r\n\r\n return (\r\n <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <FormGroup className={errorResult.error ? 'error' : ''}>\r\n {options.map((x, i) => {\r\n const isChecked = checkedValues.includes(x.value as TFieldValid)\r\n const disabled = filterViewerValue.items.length > 0 && filterViewerValue.items.some((item) => item.value === x.value)\r\n return (\r\n <FormControlLabel\r\n key={x.value.toString() + i}\r\n value={x.value}\r\n disabled={disabled && params?.disabledAfterSubmit === true}\r\n label={x.label ?? x.value}\r\n control={\r\n <Checkbox\r\n name={mergedConfig.field.toString()}\r\n checked={isChecked}\r\n onChange={(e) => handleCheckboxChange(x.value as TFieldValid, e.target.checked)}\r\n />\r\n }\r\n />\r\n )\r\n })}\r\n </FormGroup>\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='error' variant='text' disabled={!value.values \|\| value.values.length === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </RootStyled>\r\n )\r\n }\r\n\r\n return FormFieldSelectMultiple\r\n}\r\n\r\nexport default createFormFieldSelectMultiple\r\n\r\nconst RootStyled = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n }\r\n // [`.${formGroupClasses.root}`]: {}\r\n})\r\n"],"names":["createFormFieldSelectMultiple","params","ChipViewers","createChipViewers","_ref$options","options","props","_mergedConfig$default","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","initialChecked","Array","isArray","filter","opt","includes","map","_useState3","_useState4","checkedValues","setCheckedValues","_useState5","_useState6","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","v","_options$find","find","o","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","obj","_defineProperty","validator","run","keys","length","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","newLogic","handleChangeLogic","PopperBody","mb","borderBottom","placement","enableMinimalesticView","onRemove","FormGroup","error","x","i","_x$label","isChecked","disabled","some","item","FormControlLabel","disabledAfterSubmit","control","Checkbox","name","checked","e","optionValue","target","prev","_toConsumableArray","PopperFooter","Button","color","variant","_props$onRemoveField","_params$config","onRemoveField","call","closeAfterClear","Box","flex","type","styled","position","content","display","inset","backgroundColor","zIndex","opacity","transition","visibility","pointerEvents"],"mappings":"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"}

package/dist/src/filter-bar/menu/create-form-field-select.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e,slicedToArray as l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useMemo as r,useState as n}from"react";import{styled as a,radioGroupClasses as t,RadioGroup as s,FormControlLabel as u,Typography as c,Radio as v,Button as d,Box as m}from"@mui/material";import{getErrorMessage as f,convertFormDataToJson as p}from"../../form/helpers.js";import{createChipViewers as b}from"../components/chip-viewer.js";import{ButtonBack as g,ChipDark as h,FilterLogicToggle as y}from"../components/ui.units.js";import{PopperContent as C,PopperBody as x,PopperFooter as j}from"../components/popper-custom.js";function z(e){var a=b(),t=e.options;return function(b){var z,k,F=r(function(){return Object.assign({},b.currentConfig,null==e?void 0:e.config)},[null==e?void 0:e.config,b.currentConfig]),L=b.value,S=void 0===L?{values:[],logic:null!==(z=null==F?void 0:F.defaultLogic)&&void 0!==z?z:"or"}:L,M=n(S.logic),R=l(M,2),T=R[0],w=R[1],B=null!==(k=null==F?void 0:F.label)&&void 0!==k?k:F.field.toString(),V=n({}),D=l(V,2),I=D[0],N=D[1],O=function(e){b.onSubmit(F.field,e,F)},P=f(I,F.field),_=r(function(){var e=Array.isArray(S.values)?S.values:[S.values];return{field:F.field,items:e.map(function(e){var l;return{value:e,label:null===(l=t.find(function(l){return l.value===e}))||void 0===l?void 0:l.label}})}},[F.field,S]),E=[];return b.isLoading&&E.push("disabled"),o(A,{className:E.join(" "),noValidate:!0,onSubmit:function(e){var l;e.preventDefault();var o=new FormData(e.currentTarget),i=p(o),r=null===(l=b.validator)||void 0===l?void 0:l.run(i);if(N(r||{}),!r||0===Object.keys(r).length){var n=F.field,a=Array.isArray(i[n])?i[n]:[i[n]];O({values:a,logic:T})}},children:i(C,{title:"Filter by ".concat(B),onClose:b.onClose,slots:{beforeTitle:o(g,{size:"small",onClick:b.onBack}),afterTitle:F.singleValue?o(h,{sx:{ml:1.5},size:"small",label:"Last value only"}):!S.values||S.values.length<2?null:o(y,{sx:{ml:1},value:T,onChange:function(e,l){return function(e){w(e);var l={values:S.values,logic:e};O(l)}(l)}})},children:[i(x,{children:[o(a,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:_,onRemove:b.onRemove}),o(s,{sx:{mx:-1},name:F.field.toString(),className:P.error?"error":"",children:t.map(function(e,l){var i,r=_.items.length>0&&_.items.some(function(l){return l.value===e.value});return o(u,{disabled:r,value:e.value,control:o(v,{size:"small"}),label:o(c,{variant:"body2",children:null!==(i=e.label)&&void 0!==i?i:e.value})},e.value.toString()+l)})}),P.error&&o(c,{variant:"caption",color:"error",sx:{mt:.5},children:P.message})]}),i(j,{children:[o(d,{size:"small",color:"error",variant:"text",disabled:!S.values||0===S.values.length,onClick:function(){var l,o;null===(l=b.onRemoveField)||void 0===l||l.call(b,F.field),!1!==(null==e||null===(o=e.config)||void 0===o?void 0:o.closeAfterClear)&&b.onClose()},children:"Clear All"}),o(m,{sx:{flex:1}}),o(d,{size:"small",color:"inherit",variant:"text",onClick:b.onClose,children:"Cancel"}),o(d,{size:"small",type:"submit",color:"primary",variant:"contained",children:"Apply"})]})]})})}}var A=a("form")(e({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}},".".concat(t.root),{"&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}));export{z as default};
+import{defineProperty as e,slicedToArray as l}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o,jsxs as i}from"react/jsx-runtime";import{useMemo as r,useState as n}from"react";import{styled as a,radioGroupClasses as t,RadioGroup as s,FormControlLabel as u,Typography as c,Radio as v,Button as d,Box as m}from"@mui/material";import{getErrorMessage as f,convertFormDataToJson as p}from"../../form/helpers.js";import{createChipViewers as b}from"../components/chip-viewer.js";import{ButtonBack as g,ChipDark as h,FilterLogicToggle as y}from"../components/ui.units.js";import{PopperContent as C,PopperBody as x,PopperFooter as j}from"../components/popper-custom.js";function z(e){var a=b(),t=e.options;return function(b){var z,k,F=r(function(){return Object.assign({},b.currentConfig,null==e?void 0:e.config)},[null==e?void 0:e.config,b.currentConfig]),L=b.value,S=void 0===L?{values:[],logic:null!==(z=null==F?void 0:F.defaultLogic)&&void 0!==z?z:"and"}:L,M=n(S.logic),R=l(M,2),T=R[0],w=R[1],B=null!==(k=null==F?void 0:F.label)&&void 0!==k?k:F.field.toString(),V=n({}),D=l(V,2),I=D[0],N=D[1],O=function(e){b.onSubmit(F.field,e,F)},P=f(I,F.field),_=r(function(){var e=Array.isArray(S.values)?S.values:[S.values];return{field:F.field,items:e.map(function(e){var l;return{value:e,label:null===(l=t.find(function(l){return l.value===e}))||void 0===l?void 0:l.label}})}},[F.field,S]),E=[];return b.isLoading&&E.push("disabled"),o(A,{className:E.join(" "),noValidate:!0,onSubmit:function(e){var l;e.preventDefault();var o=new FormData(e.currentTarget),i=p(o),r=null===(l=b.validator)||void 0===l?void 0:l.run(i);if(N(r||{}),!r||0===Object.keys(r).length){var n=F.field,a=Array.isArray(i[n])?i[n]:[i[n]];O({values:a,logic:T})}},children:i(C,{title:"Filter by ".concat(B),onClose:b.onClose,slots:{beforeTitle:o(g,{size:"small",onClick:b.onBack}),afterTitle:F.singleValue?o(h,{sx:{ml:1.5},size:"small",label:"Last value only"}):!S.values||S.values.length<2?null:o(y,{sx:{ml:1},value:T,onChange:function(e,l){return function(e){w(e);var l={values:S.values,logic:e};O(l)}(l)}})},children:[i(x,{children:[o(a,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:_,onRemove:b.onRemove}),o(s,{sx:{mx:-1},name:F.field.toString(),className:P.error?"error":"",children:t.map(function(e,l){var i,r=_.items.length>0&&_.items.some(function(l){return l.value===e.value});return o(u,{disabled:r,value:e.value,control:o(v,{size:"small"}),label:o(c,{variant:"body2",children:null!==(i=e.label)&&void 0!==i?i:e.value})},e.value.toString()+l)})}),P.error&&o(c,{variant:"caption",color:"error",sx:{mt:.5},children:P.message})]}),i(j,{children:[o(d,{size:"small",color:"error",variant:"text",disabled:!S.values||0===S.values.length,onClick:function(){var l,o;null===(l=b.onRemoveField)||void 0===l||l.call(b,F.field),!1!==(null==e||null===(o=e.config)||void 0===o?void 0:o.closeAfterClear)&&b.onClose()},children:"Clear All"}),o(m,{sx:{flex:1}}),o(d,{size:"small",color:"inherit",variant:"text",onClick:b.onClose,children:"Cancel"}),o(d,{size:"small",type:"submit",color:"primary",variant:"contained",children:"Apply"})]})]})})}}var A=a("form")(e({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}},".".concat(t.root),{"&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}));export{z as default};
 //# sourceMappingURL=create-form-field-select.js.map

package/dist/src/filter-bar/menu/create-form-field-select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create-form-field-select.js","sources":["../../../../src/filter-bar/menu/create-form-field-select.tsx"],"sourcesContent":["import { FC, useMemo, useState } from 'react'\r\nimport { Box, Button, FormControlLabel, Radio, RadioGroup, radioGroupClasses, styled, Typography } from '@mui/material'\r\nimport { convertFormDataToJson, getErrorMessage } from '../../form/helpers'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './types'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\n/** Props for the `FormFieldSelect` component returned by `createFormFieldSelect`. Extends the base filter-menu form props. /\r\nexport interface IFormFieldSelectProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\n/* A single option item rendered as a radio button inside the select filter menu. /\r\nexport interface IFieldSelectOption {\r\n value: TFieldValid\r\n label?: string\r\n}\r\n\r\n/* Parameters passed to `createFormFieldSelect` to configure the generated component. /\r\nexport interface IFormFieldSelectParams<T> {\r\n /* Optional configuration for the form field /\r\n config?: IFieldMenuConfig<T>\r\n /* List of options for the select field /\r\n options: IFieldSelectOption[]\r\n}\r\n\r\n/\r\n Factory function that creates a `FormFieldSelect` filter-menu component.\r\n \r\n The generated component renders a radio-button list of options inside a\r\n * popper/menu panel. It supports:\r\n * - Single or multi-value selection (controlled by `config.singleValue`)\r\n * - OR / AND logic toggle when more than one value is selected\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n \r\n @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a filter-menu field component\r\n /\r\nfunction createFormFieldSelect<T>(params: IFormFieldSelectParams<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n const { options } = params\r\n\r\n const FormFieldSelect: FC<IFormFieldSelectProps<T>> = (props) => {\r\n /* Merge `props.currentConfig` with `params.config` (if provided).\r\n * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n */\r\n const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault()\r\n const formData = new FormData(event.currentTarget)\r\n const obj = convertFormDataToJson<TFieldModelValid<T>>(formData)\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData \|\| {})\r\n\r\n if (!errorData \|\| Object.keys(errorData).length === 0) {\r\n const { field } = mergedConfig\r\n const newValues = (Array.isArray(obj[field]) ? obj[field] : [obj[field]]) as TFieldValid[]\r\n const newValue: TFieldValue = { values: newValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n }\r\n }\r\n\r\n const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return {\r\n field: mergedConfig.field,\r\n items: items.map((v) => ({ value: v, label: options.find((o) => o.value === v)?.label }))\r\n }\r\n }, [mergedConfig.field, value])\r\n\r\n const handleChangeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(mergedConfig.field)\r\n if (params?.config?.closeAfterClear !== false) props.onClose()\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values \|\| value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n }\r\n\r\n const rootClasses: string[] = []\r\n if (props.isLoading) rootClasses.push('disabled')\r\n\r\n return (\r\n <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <RadioGroup sx={{ mx: -1 }} name={mergedConfig.field.toString()} className={errorResult.error ? 'error' : ''}>\r\n {options.map((x, i) => {\r\n const disabled = filterViewerValue.items.length > 0 && filterViewerValue.items.some((item) => item.value === x.value)\r\n return (\r\n <FormControlLabel\r\n disabled={disabled}\r\n key={x.value.toString() + i}\r\n value={x.value}\r\n control={<Radio size='small' />}\r\n label={<Typography variant='body2'>{x.label ?? x.value}</Typography>}\r\n />\r\n )\r\n })}\r\n </RadioGroup>\r\n {errorResult.error && (\r\n <Typography variant='caption' color='error' sx={{ mt: 0.5 }}>\r\n {errorResult.message}\r\n </Typography>\r\n )}\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='error' variant='text' disabled={!value.values \|\| value.values.length === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </RootStyled>\r\n )\r\n }\r\n\r\n return FormFieldSelect\r\n}\r\n\r\nexport default createFormFieldSelect\r\n\r\nconst RootStyled = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n },\r\n [`.${radioGroupClasses.root}`]: {\r\n '&.error .MuiRadio-root': { color: '#d32f2f' },\r\n '.MuiFormControlLabel-root': { margin: 0 },\r\n '.MuiFormControlLabel-root:hover': { backgroundColor: 'rgba(25, 118, 210, 0.04)' }\r\n }\r\n})\r\n"],"names":["createFormFieldSelect","params","ChipViewers","createChipViewers","options","props","_mergedConfig$default","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","_useState3","_useState4","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","Array","isArray","map","v","_options$find","find","o","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","formData","FormData","currentTarget","obj","convertFormDataToJson","validator","run","keys","length","newValues","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","newLogic","handleChangeLogic","PopperBody","mb","borderBottom","placement","enableMinimalesticView","onRemove","RadioGroup","mx","name","error","x","i","_x$label","disabled","some","item","FormControlLabel","control","Radio","Typography","variant","color","mt","message","PopperFooter","Button","_props$onRemoveField","_params$config","onRemoveField","call","closeAfterClear","Box","flex","type","styled","_defineProperty","position","content","display","inset","backgroundColor","filter","zIndex","opacity","transition","visibility","pointerEvents","radioGroupClasses","root","margin"],"mappings":"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"}
1	+ {"version":3,"file":"create-form-field-select.js","sources":["../../../../src/filter-bar/menu/create-form-field-select.tsx"],"sourcesContent":["import { FC, useMemo, useState } from 'react'\r\nimport { Box, Button, FormControlLabel, Radio, RadioGroup, radioGroupClasses, styled, Typography } from '@mui/material'\r\nimport { convertFormDataToJson, getErrorMessage } from '../../form/helpers'\r\nimport { createChipViewers, TChipViewerGroup } from '../components/chip-viewer'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './types'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\n/** Props for the `FormFieldSelect` component returned by `createFormFieldSelect`. Extends the base filter-menu form props. /\r\nexport interface IFormFieldSelectProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\n/* A single option item rendered as a radio button inside the select filter menu. /\r\nexport interface IFieldSelectOption {\r\n value: TFieldValid\r\n label?: string\r\n}\r\n\r\n/* Parameters passed to `createFormFieldSelect` to configure the generated component. /\r\nexport interface IFormFieldSelectParams<T> {\r\n /* Optional configuration for the form field /\r\n config?: IFieldMenuConfig<T>\r\n /* List of options for the select field /\r\n options: IFieldSelectOption[]\r\n}\r\n\r\n/\r\n Factory function that creates a `FormFieldSelect` filter-menu component.\r\n \r\n The generated component renders a radio-button list of options inside a\r\n * popper/menu panel. It supports:\r\n * - Single or multi-value selection (controlled by `config.singleValue`)\r\n * - OR / AND logic toggle when more than one value is selected\r\n * - Chip viewers showing the currently applied values\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n \r\n @param params - Static configuration (option list, optional field config override)\r\n * @returns A React FC ready to be used as a filter-menu field component\r\n /\r\nfunction createFormFieldSelect<T>(params: IFormFieldSelectParams<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n const { options } = params\r\n\r\n const FormFieldSelect: FC<IFormFieldSelectProps<T>> = (props) => {\r\n /* Merge `props.currentConfig` with `params.config` (if provided).\r\n * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n */\r\n const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'and' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault()\r\n const formData = new FormData(event.currentTarget)\r\n const obj = convertFormDataToJson<TFieldModelValid<T>>(formData)\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData \|\| {})\r\n\r\n if (!errorData \|\| Object.keys(errorData).length === 0) {\r\n const { field } = mergedConfig\r\n const newValues = (Array.isArray(obj[field]) ? obj[field] : [obj[field]]) as TFieldValid[]\r\n const newValue: TFieldValue = { values: newValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n }\r\n }\r\n\r\n const errorResult = getErrorMessage(errorData, mergedConfig.field)\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return {\r\n field: mergedConfig.field,\r\n items: items.map((v) => ({ value: v, label: options.find((o) => o.value === v)?.label }))\r\n }\r\n }, [mergedConfig.field, value])\r\n\r\n const handleChangeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(mergedConfig.field)\r\n if (params?.config?.closeAfterClear !== false) props.onClose()\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values \|\| value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n }\r\n\r\n const rootClasses: string[] = []\r\n if (props.isLoading) rootClasses.push('disabled')\r\n\r\n return (\r\n <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <RadioGroup sx={{ mx: -1 }} name={mergedConfig.field.toString()} className={errorResult.error ? 'error' : ''}>\r\n {options.map((x, i) => {\r\n const disabled = filterViewerValue.items.length > 0 && filterViewerValue.items.some((item) => item.value === x.value)\r\n return (\r\n <FormControlLabel\r\n disabled={disabled}\r\n key={x.value.toString() + i}\r\n value={x.value}\r\n control={<Radio size='small' />}\r\n label={<Typography variant='body2'>{x.label ?? x.value}</Typography>}\r\n />\r\n )\r\n })}\r\n </RadioGroup>\r\n {errorResult.error && (\r\n <Typography variant='caption' color='error' sx={{ mt: 0.5 }}>\r\n {errorResult.message}\r\n </Typography>\r\n )}\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='error' variant='text' disabled={!value.values \|\| value.values.length === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </RootStyled>\r\n )\r\n }\r\n\r\n return FormFieldSelect\r\n}\r\n\r\nexport default createFormFieldSelect\r\n\r\nconst RootStyled = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n },\r\n [`.${radioGroupClasses.root}`]: {\r\n '&.error .MuiRadio-root': { color: '#d32f2f' },\r\n '.MuiFormControlLabel-root': { margin: 0 },\r\n '.MuiFormControlLabel-root:hover': { backgroundColor: 'rgba(25, 118, 210, 0.04)' }\r\n }\r\n})\r\n"],"names":["createFormFieldSelect","params","ChipViewers","createChipViewers","options","props","_mergedConfig$default","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","_useState3","_useState4","errorData","setErrorData","handleSubmit","newValue","onSubmit","errorResult","getErrorMessage","filterViewerValue","items","Array","isArray","map","v","_options$find","find","o","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","formData","FormData","currentTarget","obj","convertFormDataToJson","validator","run","keys","length","newValues","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","newLogic","handleChangeLogic","PopperBody","mb","borderBottom","placement","enableMinimalesticView","onRemove","RadioGroup","mx","name","error","x","i","_x$label","disabled","some","item","FormControlLabel","control","Radio","Typography","variant","color","mt","message","PopperFooter","Button","_props$onRemoveField","_params$config","onRemoveField","call","closeAfterClear","Box","flex","type","styled","_defineProperty","position","content","display","inset","backgroundColor","filter","zIndex","opacity","transition","visibility","pointerEvents","radioGroupClasses","root","margin"],"mappings":"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"}

package/dist/src/filter-bar/menu/create-form-field-string.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as i}from"react/jsx-runtime";import{useMemo as o,useState as r,createRef as n}from"react";import{styled as t,TextField as a,Button as s,Box as u}from"@mui/material";import{createChipViewers as c}from"../components/chip-viewer.js";import{getErrorMessage as v,convertFormDataToJson as d}from"../../form/helpers.js";import{ButtonBack as m,ChipDark as f,FilterLogicToggle as p}from"../components/ui.units.js";import{PopperContent as b,PopperBody as g,PopperFooter as h}from"../components/popper-custom.js";function y(t){var y=c();return function(c){var C,j,z=o(function(){return Object.assign({},c.currentConfig,null==t?void 0:t.config)},[null==t?void 0:t.config,c.currentConfig]),A=n(),k=c.value,T=void 0===k?{values:[],logic:null!==(C=null==z?void 0:z.defaultLogic)&&void 0!==C?C:"or"}:k,B=r(T.logic),F=e(B,2),R=F[0],S=F[1],w=null!==(j=null==z?void 0:z.label)&&void 0!==j?j:z.field.toString(),I=r({}),L=e(I,2),V=L[0],D=L[1],E=function(e){c.onSubmit(z.field,e,z)},H=v(V,z.field),M=o(function(){var e=Array.isArray(T.values)?T.values:[T.values];return{field:z.field,items:e.map(function(e){return{value:e}})}},[z.field,T]),O=[];return c.isLoading&&O.push("disabled"),l(x,{className:O.join(" "),noValidate:!0,onSubmit:function(e){var l;e.preventDefault(),e.stopPropagation();var i=new FormData(e.currentTarget),o=d(i),r=null===(l=c.validator)||void 0===l?void 0:l.run(o);if(D(r||{}),!r||0===Object.keys(r).length){var n=z.field,t=Array.isArray(o[n])?o[n]:[o[n]];E({values:t,logic:R}),A.current&&(A.current.blur(),A.current.value="")}},children:i(b,{title:"Filter by ".concat(w),onClose:c.onClose,slots:{beforeTitle:l(m,{size:"small",onClick:c.onBack}),afterTitle:z.singleValue?l(f,{sx:{ml:1.5},size:"small",label:"Last value only"}):!T.values||T.values.length<2?null:l(p,{sx:{ml:1},value:R,onChange:function(e,l){return function(e){S(e);var l={values:T.values,logic:e};E(l)}(l)}})},children:[i(g,{children:[l(y,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:M,onRemove:c.onRemove}),l(a,{inputRef:A,autoFocus:!0,name:z.field.toString(),size:"small",fullWidth:!0,placeholder:"Enter value",error:H.error,helperText:H.message,sx:{".MuiInputBase-root":{minHeight:"42px"}}})]}),i(h,{children:[l(s,{size:"small",color:"error",variant:"text",disabled:!T.values||0===T.values.length,onClick:function(){var e,l;null===(e=c.onRemoveField)||void 0===e||e.call(c,z.field),!1!==(null==t||null===(l=t.config)||void 0===l?void 0:l.closeAfterClear)&&c.onClose()},children:"Clear All"}),l(u,{sx:{flex:1}}),l(s,{size:"small",color:"inherit",variant:"text",onClick:c.onClose,children:"Cancel"}),l(s,{size:"small",type:"submit",color:"primary",variant:"contained",children:"Apply"})]})]})})}}var x=t("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{y as default};
+import{slicedToArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as i}from"react/jsx-runtime";import{useMemo as o,useState as n,createRef as r}from"react";import{styled as t,TextField as a,Button as s,Box as u}from"@mui/material";import{createChipViewers as c}from"../components/chip-viewer.js";import{getErrorMessage as v,convertFormDataToJson as d}from"../../form/helpers.js";import{ButtonBack as m,ChipDark as f,FilterLogicToggle as p}from"../components/ui.units.js";import{PopperContent as b,PopperBody as g,PopperFooter as h}from"../components/popper-custom.js";function y(t){var y=c();return function(c){var C,j,z=o(function(){return Object.assign({},c.currentConfig,null==t?void 0:t.config)},[null==t?void 0:t.config,c.currentConfig]),A=r(),k=c.value,T=void 0===k?{values:[],logic:null!==(C=null==z?void 0:z.defaultLogic)&&void 0!==C?C:"and"}:k,B=n(T.logic),F=e(B,2),R=F[0],S=F[1],w=null!==(j=null==z?void 0:z.label)&&void 0!==j?j:z.field.toString(),I=n({}),L=e(I,2),V=L[0],D=L[1],E=function(e){c.onSubmit(z.field,e,z)},H=v(V,z.field),M=o(function(){var e=Array.isArray(T.values)?T.values:[T.values];return{field:z.field,items:e.map(function(e){return{value:e}})}},[z.field,T]),O=[];return c.isLoading&&O.push("disabled"),l(x,{className:O.join(" "),noValidate:!0,onSubmit:function(e){var l;e.preventDefault(),e.stopPropagation();var i=new FormData(e.currentTarget),o=d(i),n=null===(l=c.validator)||void 0===l?void 0:l.run(o);if(D(n||{}),!n||0===Object.keys(n).length){var r=z.field,t=Array.isArray(o[r])?o[r]:[o[r]];E({values:t,logic:R}),A.current&&(A.current.blur(),A.current.value="")}},children:i(b,{title:"Filter by ".concat(w),onClose:c.onClose,slots:{beforeTitle:l(m,{size:"small",onClick:c.onBack}),afterTitle:z.singleValue?l(f,{sx:{ml:1.5},size:"small",label:"Last value only"}):!T.values||T.values.length<2?null:l(p,{sx:{ml:1},value:R,onChange:function(e,l){return function(e){S(e);var l={values:T.values,logic:e};E(l)}(l)}})},children:[i(g,{children:[l(y,{sx:{mb:1,borderBottom:"none!important"},label:"Applied",placement:"horizontal",enableMinimalesticView:!0,value:M,onRemove:c.onRemove}),l(a,{inputRef:A,autoFocus:!0,name:z.field.toString(),size:"small",fullWidth:!0,placeholder:"Enter value",error:H.error,helperText:H.message,sx:{".MuiInputBase-root":{minHeight:"42px"}}})]}),i(h,{children:[l(s,{size:"small",color:"error",variant:"text",disabled:!T.values||0===T.values.length,onClick:function(){var e,l;null===(e=c.onRemoveField)||void 0===e||e.call(c,z.field),!1!==(null==t||null===(l=t.config)||void 0===l?void 0:l.closeAfterClear)&&c.onClose()},children:"Clear All"}),l(u,{sx:{flex:1}}),l(s,{size:"small",color:"inherit",variant:"text",onClick:c.onClose,children:"Cancel"}),l(s,{size:"small",type:"submit",color:"primary",variant:"contained",children:"Apply"})]})]})})}}var x=t("form")({position:"relative","&::after":{content:'""',display:"block",position:"absolute",inset:0,backgroundColor:"rgba(0, 0, 0, 0.2)",filter:"blur(2px)",zIndex:-1,opacity:0,transition:"opacity 0.3s",visibility:"hidden"},"&.disabled":{pointerEvents:"none","&::after":{zIndex:1,opacity:1,visibility:"visible"}}});export{y as default};
 //# sourceMappingURL=create-form-field-string.js.map