dinocollab-core 2.1.4 → 2.1.6

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 (31) hide show
  1. package/dist/components/breadcrumbs.js.map +1 -1
  2. package/dist/components/create.multi-select-dropdown.js +1 -1
  3. package/dist/components/create.multi-select-dropdown.js.map +1 -1
  4. package/dist/components/help-tooltip.js +1 -1
  5. package/dist/components/help-tooltip.js.map +1 -1
  6. package/dist/components/image-with-fallback.js +1 -1
  7. package/dist/components/image-with-fallback.js.map +1 -1
  8. package/dist/components/index.js +1 -1
  9. package/dist/components/rich-tooltip.js +2 -0
  10. package/dist/components/rich-tooltip.js.map +1 -0
  11. package/dist/data-view/ui.units.js +1 -1
  12. package/dist/data-view/ui.units.js.map +1 -1
  13. package/dist/form/create.input.js +1 -1
  14. package/dist/form/create.input.js.map +1 -1
  15. package/dist/form/create.select-simple.js +1 -1
  16. package/dist/form/create.select-simple.js.map +1 -1
  17. package/dist/form/create.select-with-api.js +1 -1
  18. package/dist/form/create.select-with-api.js.map +1 -1
  19. package/dist/redux/types.js.map +1 -1
  20. package/dist/table/toolbar-pannel.js +1 -1
  21. package/dist/table/toolbar-pannel.js.map +1 -1
  22. package/dist/table-grid/filter-bar/ui.units.js +1 -1
  23. package/dist/table-grid/filter-bar/ui.units.js.map +1 -1
  24. package/dist/types/components/help-tooltip.d.ts +3 -3
  25. package/dist/types/components/image-with-fallback.d.ts +3 -3
  26. package/dist/types/components/index.d.ts +1 -2
  27. package/dist/types/components/rich-tooltip.d.ts +25 -0
  28. package/dist/types/form/create.select-simple.d.ts +5 -2
  29. package/dist/types/form/create.select-with-api.d.ts +6 -3
  30. package/dist/types/redux/types.d.ts +1 -0
  31. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"breadcrumbs.js","sources":["../../src/components/breadcrumbs.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\nimport { Box, Breadcrumbs as MUIBreadcrumbs, styled, Typography, TypographyProps } from '@mui/material'\r\nimport ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'\r\nimport { fontSize } from '@mui/system'\r\n\r\nexport interface IBreadcrumbConfig {\r\n label: string\r\n url?: string\r\n props?: TypographyProps & { [key: string]: any }\r\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\r\n}\r\n\r\nexport interface IBreadcrumbsProps {\r\n value?: IBreadcrumbConfig[]\r\n}\r\n\r\nexport const Breadcrumbs: FC<IBreadcrumbsProps> = (props) => {\r\n const list = props.value ?? []\r\n\r\n const handleClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>, x: IBreadcrumbConfig) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n x.onClick && x.onClick(e)\r\n }\r\n\r\n const getItemProps = (item: IBreadcrumbConfig): TypographyProps => {\r\n return item.props ?? (item.url ? ({ component: 'a', href: item.url } as TypographyProps) : {})\r\n }\r\n\r\n return (\r\n <MUIBreadcrumbs>\r\n {list.map((x, i) => {\r\n const isClick = !!x.onClick || !!x.url\r\n return (\r\n <WrapTypography\r\n key={'key' + i}\r\n {...getItemProps(x)}\r\n onClick={x.onClick ? (e: any) => handleClick(e, x) : undefined}\r\n className={isClick ? 'clickable' : ''}\r\n >\r\n {i < 1 && <ArrowBackIosIcon fontSize='small' />}\r\n <Typography variant='subtitle1' noWrap>\r\n <span>{x.label}</span>\r\n </Typography>\r\n </WrapTypography>\r\n )\r\n })}\r\n </MUIBreadcrumbs>\r\n )\r\n}\r\nexport default Breadcrumbs\r\n\r\nconst WrapTypography = styled(Box)(({ theme }) => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n color: `var(--color-title, ${theme.palette.text.primary})`,\r\n '.MuiTypography-root': {\r\n color: 'currentColor',\r\n fontWeight: 600\r\n },\r\n '.MuiSvgIcon-root': {\r\n color: 'currentColor',\r\n fontSize: theme.typography.pxToRem(16),\r\n marginRight: theme.spacing(0.5)\r\n },\r\n '&[href]': {\r\n textDecoration: 'none',\r\n cursor: 'pointer',\r\n '&:hover': {\r\n textDecoration: 'underline',\r\n color: `var(--color-title-hover, ${theme.palette.primary.main})`\r\n }\r\n }\r\n}))\r\n"],"names":["Breadcrumbs","props","_props$value","list","value","_jsx","MUIBreadcrumbs","children","map","x","i","item","_item$props","isClick","onClick","url","_jsxs","WrapTypography","_objectSpread","getItemProps","component","href","e","preventDefault","stopPropagation","handleClick","undefined","className","ArrowBackIosIcon","fontSize","Typography","variant","noWrap","label","styled","Box","_ref","theme","display","alignItems","color","concat","palette","text","primary","fontWeight","typography","pxToRem","marginRight","spacing","textDecoration","cursor","main"],"mappings":"gQAgBaA,EAAqC,SAACC,GAAS,IAAAC,EACpDC,EAAkB,QAAdD,EAAGD,EAAMG,aAAK,IAAAF,EAAAA,EAAI,GAY5B,OACEG,EAACC,EAAc,CAAAC,SACZJ,EAAKK,KAAI,SAACC,EAAGC,GACZ,IAPgBC,EAA4CC,EAOtDC,IAAYJ,EAAEK,WAAaL,EAAEM,IACnC,OACEC,EAACC,EAAcC,EAAAA,EAETC,CAAAA,EAVK,QAAjBP,GADoBD,EAWKF,GAVbR,aAAK,IAAAW,EAAAA,EAAKD,EAAKI,IAAO,CAAEK,UAAW,IAAKC,KAAMV,EAAKI,KAA4B,CAAE,GAUlE,GAAA,CACnBD,QAASL,EAAEK,QAAU,SAACQ,GAAM,OAlBlB,SAACA,EAAiDb,GACpEa,EAAEC,iBACFD,EAAEE,kBACFf,EAAEK,SAAWL,EAAEK,QAAQQ,EACxB,CAc0CG,CAAYH,EAAGb,EAAE,OAAGiB,EACrDC,UAAWd,EAAU,YAAc,GAElCN,SAAA,CAAAG,EAAI,GAAKL,EAACuB,GAAiBC,SAAS,UACrCxB,EAACyB,EAAW,CAAAC,QAAQ,YAAYC,QAAM,EAAAzB,SACpCF,mBAAOI,EAAEwB,aAPN,MAAQvB,EAWlB,KAGP,EAGMO,EAAiBiB,EAAOC,EAAPD,EAAY,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CACjDC,QAAS,OACTC,WAAY,SACZC,MAAK,sBAAAC,OAAwBJ,EAAMK,QAAQC,KAAKC,QAAU,KAC1D,sBAAuB,CACrBJ,MAAO,eACPK,WAAY,KAEd,mBAAoB,CAClBL,MAAO,eACPX,SAAUQ,EAAMS,WAAWC,QAAQ,IACnCC,YAAaX,EAAMY,QAAQ,KAE7B,UAAW,CACTC,eAAgB,OAChBC,OAAQ,UACR,UAAW,CACTD,eAAgB,YAChBV,MAAK,4BAAAC,OAA8BJ,EAAMK,QAAQE,QAAQQ,KAAI,OAGlE"}
1
+ {"version":3,"file":"breadcrumbs.js","sources":["../../src/components/breadcrumbs.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\nimport { Box, Breadcrumbs as MUIBreadcrumbs, styled, Typography, TypographyProps } from '@mui/material'\r\nimport ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'\r\n\r\nexport interface IBreadcrumbConfig {\r\n label: string\r\n url?: string\r\n props?: TypographyProps & { [key: string]: any }\r\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\r\n}\r\n\r\nexport interface IBreadcrumbsProps {\r\n value?: IBreadcrumbConfig[]\r\n}\r\n\r\nexport const Breadcrumbs: FC<IBreadcrumbsProps> = (props) => {\r\n const list = props.value ?? []\r\n\r\n const handleClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>, x: IBreadcrumbConfig) => {\r\n e.preventDefault()\r\n e.stopPropagation()\r\n x.onClick && x.onClick(e)\r\n }\r\n\r\n const getItemProps = (item: IBreadcrumbConfig): TypographyProps => {\r\n return item.props ?? (item.url ? ({ component: 'a', href: item.url } as TypographyProps) : {})\r\n }\r\n\r\n return (\r\n <MUIBreadcrumbs>\r\n {list.map((x, i) => {\r\n const isClick = !!x.onClick || !!x.url\r\n return (\r\n <WrapTypography\r\n key={'key' + i}\r\n {...getItemProps(x)}\r\n onClick={x.onClick ? (e: any) => handleClick(e, x) : undefined}\r\n className={isClick ? 'clickable' : ''}\r\n >\r\n {i < 1 && <ArrowBackIosIcon fontSize='small' />}\r\n <Typography variant='subtitle1' noWrap>\r\n <span>{x.label}</span>\r\n </Typography>\r\n </WrapTypography>\r\n )\r\n })}\r\n </MUIBreadcrumbs>\r\n )\r\n}\r\nexport default Breadcrumbs\r\n\r\nconst WrapTypography = styled(Box)(({ theme }) => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n color: `var(--color-title, ${theme.palette.text.primary})`,\r\n '.MuiTypography-root': {\r\n color: 'currentColor',\r\n fontWeight: 600\r\n },\r\n '.MuiSvgIcon-root': {\r\n color: 'currentColor',\r\n fontSize: theme.typography.pxToRem(16),\r\n marginRight: theme.spacing(0.5)\r\n },\r\n '&[href]': {\r\n textDecoration: 'none',\r\n cursor: 'pointer',\r\n '&:hover': {\r\n textDecoration: 'underline',\r\n color: `var(--color-title-hover, ${theme.palette.primary.main})`\r\n }\r\n }\r\n}))\r\n"],"names":["Breadcrumbs","props","_props$value","list","value","_jsx","MUIBreadcrumbs","children","map","x","i","item","_item$props","isClick","onClick","url","_jsxs","WrapTypography","_objectSpread","getItemProps","component","href","e","preventDefault","stopPropagation","handleClick","undefined","className","ArrowBackIosIcon","fontSize","Typography","variant","noWrap","label","styled","Box","_ref","theme","display","alignItems","color","concat","palette","text","primary","fontWeight","typography","pxToRem","marginRight","spacing","textDecoration","cursor","main"],"mappings":"gQAeaA,EAAqC,SAACC,GAAS,IAAAC,EACpDC,EAAkB,QAAdD,EAAGD,EAAMG,aAAK,IAAAF,EAAAA,EAAI,GAY5B,OACEG,EAACC,EAAc,CAAAC,SACZJ,EAAKK,KAAI,SAACC,EAAGC,GACZ,IAPgBC,EAA4CC,EAOtDC,IAAYJ,EAAEK,WAAaL,EAAEM,IACnC,OACEC,EAACC,EAAcC,EAAAA,EAETC,CAAAA,EAVK,QAAjBP,GADoBD,EAWKF,GAVbR,aAAK,IAAAW,EAAAA,EAAKD,EAAKI,IAAO,CAAEK,UAAW,IAAKC,KAAMV,EAAKI,KAA4B,CAAE,GAUlE,GAAA,CACnBD,QAASL,EAAEK,QAAU,SAACQ,GAAM,OAlBlB,SAACA,EAAiDb,GACpEa,EAAEC,iBACFD,EAAEE,kBACFf,EAAEK,SAAWL,EAAEK,QAAQQ,EACxB,CAc0CG,CAAYH,EAAGb,EAAE,OAAGiB,EACrDC,UAAWd,EAAU,YAAc,GAElCN,SAAA,CAAAG,EAAI,GAAKL,EAACuB,GAAiBC,SAAS,UACrCxB,EAACyB,EAAW,CAAAC,QAAQ,YAAYC,QAAM,EAAAzB,SACpCF,mBAAOI,EAAEwB,aAPN,MAAQvB,EAWlB,KAGP,EAGMO,EAAiBiB,EAAOC,EAAPD,EAAY,SAAAE,GAAA,IAAGC,EAAKD,EAALC,MAAK,MAAQ,CACjDC,QAAS,OACTC,WAAY,SACZC,MAAK,sBAAAC,OAAwBJ,EAAMK,QAAQC,KAAKC,QAAU,KAC1D,sBAAuB,CACrBJ,MAAO,eACPK,WAAY,KAEd,mBAAoB,CAClBL,MAAO,eACPX,SAAUQ,EAAMS,WAAWC,QAAQ,IACnCC,YAAaX,EAAMY,QAAQ,KAE7B,UAAW,CACTC,eAAgB,OAChBC,OAAQ,UACR,UAAW,CACTD,eAAgB,YAChBV,MAAK,4BAAAC,OAA8BJ,EAAMK,QAAQE,QAAQQ,KAAI,OAGlE"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as n,slicedToArray as o,objectSpread2 as e,toConsumableArray as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,Fragment as i,jsx as r}from"react/jsx-runtime";import{useState as a,useCallback as c,useEffect as u}from"react";import{styled as s,Popover as d,Badge as p,badgeClasses as h,Box as m,Button as v,TextField as f,ToggleButtonGroup as g,ToggleButton as x,Typography as C,List as b,ListItem as y,FormControlLabel as P,Checkbox as w}from"@mui/material";import j from"@mui/icons-material/FilterAltOutlined";import{mergeObjects as z}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import A from"./help-tooltip.js";function k(n){return function(s){var d,p,h,k,S,T,q,B,D,F,H,I,R,Y,_,E,M=a(""),W=o(M,2),X=W[0],G=W[1],J=a(null),K=o(J,2),Q=K[0],U=K[1],V=a(null!==(d=null!==(p=s.options)&&void 0!==p?p:n.options)&&void 0!==d?d:[]),Z=o(V,2),$=Z[0],nn=Z[1],on=a([]),en=o(on,2),ln=en[0],tn=en[1],rn=a(null!==(h=null===(k=s.slots)||void 0===k?void 0:k.defaultLogic)&&void 0!==h?h:"and"),an=o(rn,2),cn=an[0],un=an[1],sn={buttonProps:z(null==n?void 0:n.buttonProps,null===(S=s.slots)||void 0===S?void 0:S.buttonProps),contentProps:null!==(T=null!==(q=null===(B=s.slots)||void 0===B?void 0:B.contentPorps)&&void 0!==q?q:null==n?void 0:n.contentPorps)&&void 0!==T?T:{}},dn=c((function(){var n;s.value&&(un(null!==(n=s.value.logic)&&void 0!==n?n:"and"),tn(s.value.items))}),[s.value]),pn=function(n,o){U(null),setTimeout(dn,300)};return u((function(){s.options&&s.options.length>0&&nn(s.options)}),[s.options]),u((function(){dn()}),[dn]),t(i,{children:[t(v,e(e({color:"inherit",endIcon:r(j,{}),disabled:$.length<1},sn.buttonProps),{},{onClick:function(n){U(n.currentTarget)},children:[n.btnText,r(L,{badgeContent:null===(D=s.value)||void 0===D?void 0:D.items.length,color:"error",overlap:"circular",sx:{transform:"translateY(-50%) translateX(24px)"}})]})),t(O,{open:Boolean(Q),anchorEl:Q,onClose:pn,anchorOrigin:{vertical:"bottom",horizontal:"left"},children:[t(N,{className:"top",children:[r(f,{size:"small",placeholder:null!==(F=n.placeholder)&&void 0!==F?F:"Search",fullWidth:!0,value:X,onChange:function(n){return G(n.target.value)}}),t(g,{size:"small",exclusive:!0,color:"primary",value:cn,onChange:function(n,o){o&&un(o)},children:[r(x,{value:"and",children:"AND"}),r(x,{value:"or",children:"OR"})]}),r(A,{title:"Filter Logic",small:!0,children:t(C,{variant:"body2",color:"text.secondary",children:["Choose how multiple categories are applied.",r("br",{}),r("strong",{children:" AND "})," requires all selected categories, while",r("br",{}),r("strong",{children:" OR "})," matches any."]})})]}),r(m,e(e({className:"menu-content"},sn.contentProps),{},{children:r(b,{children:(R=null!==(H=null===(I=s.value)||void 0===I?void 0:I.items)&&void 0!==H?H:[],Y=$.filter((function(n){return n.toLowerCase().includes(X.toLowerCase())})).sort((function(n,o){return n.localeCompare(o)})),_=Y.filter((function(n){return R.includes(n)})),E=Y.filter((function(n){return!R.includes(n)})),[].concat(l(_),l(E))).map((function(n){return r(y,{sx:{whiteSpace:"nowrap"},children:r(P,{label:n,control:r(w,{checked:ln.includes(n),onChange:function(){return o=n,void tn((function(n){return n.includes(o)?n.filter((function(n){return n!==o})):[].concat(l(n),[o])}));var o}})})},n)}))})})),t(N,{children:[r(v,{size:"small",onClick:function(){tn([]),s.onChange&&s.onChange({items:[],logic:cn})},color:"inherit",children:"Clear"}),r(m,{sx:{flex:1}}),r(v,{size:"small",onClick:function(){tn([]),pn()},color:"inherit",children:"Cancel"}),r(v,{size:"small",variant:"contained",onClick:function(){s.onChange&&s.onChange({items:ln,logic:cn}),pn()},children:"Apply"})]})]})]})}}var O=s(d)({".MuiPaper-root":{overflow:"hidden",position:"relative",width:"360px"},".menu-content":{overflowY:"auto",maxHeight:"".concat(290,"px"),margin:"2px 2px 2px 0"}}),L=s(p)(n({},"& .".concat(h.badge),{top:"-12px",right:"-6px"})),N=s(m)({alignItems:"center",display:"flex",gap:"6px",height:"58px",padding:"8px 10px",boxShadow:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"});export{k as default};
1
+ import{defineProperty as n,slicedToArray as o,objectSpread2 as e,toConsumableArray as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,Fragment as i,jsx as r}from"react/jsx-runtime";import{useState as a,useCallback as c,useEffect as u}from"react";import{styled as s,Popover as d,Badge as p,badgeClasses as h,Box as m,Button as v,TextField as f,ToggleButtonGroup as g,ToggleButton as x,Typography as C,List as b,ListItem as y,FormControlLabel as P,Checkbox as w}from"@mui/material";import j from"@mui/icons-material/FilterAltOutlined";import{mergeObjects as z}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{HelpTooltip as A}from"./help-tooltip.js";function k(n){return function(s){var d,p,h,k,S,T,q,B,D,F,H,I,R,Y,_,E,M=a(""),W=o(M,2),X=W[0],G=W[1],J=a(null),K=o(J,2),Q=K[0],U=K[1],V=a(null!==(d=null!==(p=s.options)&&void 0!==p?p:n.options)&&void 0!==d?d:[]),Z=o(V,2),$=Z[0],nn=Z[1],on=a([]),en=o(on,2),ln=en[0],tn=en[1],rn=a(null!==(h=null===(k=s.slots)||void 0===k?void 0:k.defaultLogic)&&void 0!==h?h:"and"),an=o(rn,2),cn=an[0],un=an[1],sn={buttonProps:z(null==n?void 0:n.buttonProps,null===(S=s.slots)||void 0===S?void 0:S.buttonProps),contentProps:null!==(T=null!==(q=null===(B=s.slots)||void 0===B?void 0:B.contentPorps)&&void 0!==q?q:null==n?void 0:n.contentPorps)&&void 0!==T?T:{}},dn=c((function(){var n;s.value&&(un(null!==(n=s.value.logic)&&void 0!==n?n:"and"),tn(s.value.items))}),[s.value]),pn=function(n,o){U(null),setTimeout(dn,300)};return u((function(){s.options&&s.options.length>0&&nn(s.options)}),[s.options]),u((function(){dn()}),[dn]),t(i,{children:[t(v,e(e({color:"inherit",endIcon:r(j,{}),disabled:$.length<1},sn.buttonProps),{},{onClick:function(n){U(n.currentTarget)},children:[n.btnText,r(L,{badgeContent:null===(D=s.value)||void 0===D?void 0:D.items.length,color:"error",overlap:"circular",sx:{transform:"translateY(-50%) translateX(24px)"}})]})),t(O,{open:Boolean(Q),anchorEl:Q,onClose:pn,anchorOrigin:{vertical:"bottom",horizontal:"left"},children:[t(N,{className:"top",children:[r(f,{size:"small",placeholder:null!==(F=n.placeholder)&&void 0!==F?F:"Search",fullWidth:!0,value:X,onChange:function(n){return G(n.target.value)}}),t(g,{size:"small",exclusive:!0,color:"primary",value:cn,onChange:function(n,o){o&&un(o)},children:[r(x,{value:"and",children:"AND"}),r(x,{value:"or",children:"OR"})]}),r(A,{title:"Filter Logic",small:!0,children:t(C,{variant:"body2",color:"text.secondary",children:["Choose how multiple categories are applied.",r("br",{}),r("strong",{children:" AND "})," requires all selected categories, while",r("br",{}),r("strong",{children:" OR "})," matches any."]})})]}),r(m,e(e({className:"menu-content"},sn.contentProps),{},{children:r(b,{children:(R=null!==(H=null===(I=s.value)||void 0===I?void 0:I.items)&&void 0!==H?H:[],Y=$.filter((function(n){return n.toLowerCase().includes(X.toLowerCase())})).sort((function(n,o){return n.localeCompare(o)})),_=Y.filter((function(n){return R.includes(n)})),E=Y.filter((function(n){return!R.includes(n)})),[].concat(l(_),l(E))).map((function(n){return r(y,{sx:{whiteSpace:"nowrap"},children:r(P,{label:n,control:r(w,{checked:ln.includes(n),onChange:function(){return o=n,void tn((function(n){return n.includes(o)?n.filter((function(n){return n!==o})):[].concat(l(n),[o])}));var o}})})},n)}))})})),t(N,{children:[r(v,{size:"small",onClick:function(){tn([]),s.onChange&&s.onChange({items:[],logic:cn})},color:"inherit",children:"Clear"}),r(m,{sx:{flex:1}}),r(v,{size:"small",onClick:function(){tn([]),pn()},color:"inherit",children:"Cancel"}),r(v,{size:"small",variant:"contained",onClick:function(){s.onChange&&s.onChange({items:ln,logic:cn}),pn()},children:"Apply"})]})]})]})}}var O=s(d)({".MuiPaper-root":{overflow:"hidden",position:"relative",width:"360px"},".menu-content":{overflowY:"auto",maxHeight:"".concat(290,"px"),margin:"2px 2px 2px 0"}}),L=s(p)(n({},"& .".concat(h.badge),{top:"-12px",right:"-6px"})),N=s(m)({alignItems:"center",display:"flex",gap:"6px",height:"58px",padding:"8px 10px",boxShadow:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"});export{k as default};
2
2
  //# sourceMappingURL=create.multi-select-dropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.multi-select-dropdown.js","sources":["../../src/components/create.multi-select-dropdown.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Badge, badgeClasses, Box, BoxProps, Button, ButtonProps, Checkbox } from '@mui/material'\r\nimport { FormControlLabel, List, ListItem, Popover, styled, TextField, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material'\r\nimport FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined'\r\nimport { mergeObjects } from '../utils'\r\nimport HelpTooltip from './help-tooltip'\r\n\r\nexport type IMultiSelectDropdownFilterLogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n items: string[]\r\n logic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport type IMultiSelectDropdownChange = (value: IMultiSelectDropdownFilter) => void\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n buttonProps?: ButtonProps\r\n contentPorps?: BoxProps\r\n defaultLogic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n options?: string[]\r\n value?: IMultiSelectDropdownFilter\r\n onChange?: IMultiSelectDropdownChange\r\n slots?: IMultiSelectDropdownSlots\r\n}\r\n\r\nexport interface IMultiSelectDropdownParams extends IMultiSelectDropdownSlots {\r\n btnText: string\r\n options?: string[]\r\n placeholder?: string\r\n}\r\n\r\nfunction CreateMultiSelectDropdown(params: IMultiSelectDropdownParams) {\r\n const MenuSelectMultiple: FC<IMultiSelectDropdownProps> = (props) => {\r\n const [search, setSearch] = useState<string>('')\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n const [itemSelecteds, setItemSelecteds] = useState<string[]>([])\r\n const [logic, setLogic] = useState(props.slots?.defaultLogic ?? 'and')\r\n\r\n const mergeConfig = {\r\n buttonProps: mergeObjects<ButtonProps>(params?.buttonProps, props.slots?.buttonProps),\r\n contentProps: props.slots?.contentPorps ?? params?.contentPorps ?? {}\r\n }\r\n\r\n const getOptions = () => {\r\n const values = props.value?.items ?? []\r\n const list = options.filter((x) => x.toLowerCase().includes(search.toLowerCase())).sort((a, b) => a.localeCompare(b))\r\n\r\n const prioritized = list.filter((x) => values.includes(x))\r\n const others = list.filter((x) => !values.includes(x))\r\n\r\n return [...prioritized, ...others]\r\n }\r\n\r\n const setValueWithProps = useCallback(() => {\r\n if (props.value) {\r\n setLogic(props.value.logic ?? 'and')\r\n setItemSelecteds(props.value.items)\r\n }\r\n }, [props.value])\r\n\r\n const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n setAnchorEl(event.currentTarget)\r\n }\r\n\r\n const handleClose = (event?: {}, reason?: 'backdropClick' | 'escapeKeyDown') => {\r\n setAnchorEl(null)\r\n setTimeout(setValueWithProps, 300)\r\n }\r\n\r\n const handleToggle = (value: string) => {\r\n setItemSelecteds((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n }\r\n\r\n const handleClear = () => {\r\n setItemSelecteds([])\r\n props.onChange && props.onChange({ items: [], logic })\r\n }\r\n\r\n const handleCancel = () => {\r\n setItemSelecteds([])\r\n handleClose()\r\n }\r\n\r\n const handleApply = () => {\r\n props.onChange && props.onChange({ items: itemSelecteds, logic })\r\n handleClose()\r\n }\r\n\r\n const handleChangeLogic = (_: React.MouseEvent<HTMLElement>, value: any) => {\r\n if (value) setLogic(value)\r\n }\r\n\r\n useEffect(() => {\r\n if (props.options && props.options.length > 0) setOptions(props.options)\r\n }, [props.options])\r\n\r\n useEffect(() => {\r\n setValueWithProps()\r\n }, [setValueWithProps])\r\n\r\n return (\r\n <>\r\n <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} disabled={options.length < 1} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n {params.btnText}\r\n <ButtonBadge\r\n badgeContent={props.value?.items.length}\r\n color='error'\r\n overlap='circular'\r\n sx={{ transform: 'translateY(-50%) translateX(24px)' }}\r\n />\r\n </Button>\r\n <CustomPopover open={Boolean(anchorEl)} anchorEl={anchorEl} onClose={handleClose} anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}>\r\n <WrapActions className='top'>\r\n <TextField\r\n size='small'\r\n placeholder={params.placeholder ?? 'Search'}\r\n fullWidth\r\n value={search}\r\n onChange={(e) => setSearch(e.target.value)}\r\n />\r\n <ToggleButtonGroup size='small' exclusive color='primary' value={logic} onChange={handleChangeLogic}>\r\n <ToggleButton value='and'>AND</ToggleButton>\r\n <ToggleButton value='or'>OR</ToggleButton>\r\n </ToggleButtonGroup>\r\n <HelpTooltip title='Filter Logic' small>\r\n <Typography variant='body2' color='text.secondary'>\r\n Choose how multiple categories are applied.\r\n <br />\r\n <strong> AND </strong> requires all selected categories, while\r\n <br />\r\n <strong> OR </strong> matches any.\r\n </Typography>\r\n </HelpTooltip>\r\n </WrapActions>\r\n <Box className='menu-content' {...mergeConfig.contentProps}>\r\n <List>\r\n {getOptions().map((x) => (\r\n <ListItem key={x} sx={{ whiteSpace: 'nowrap' }}>\r\n <FormControlLabel label={x} control={<Checkbox checked={itemSelecteds.includes(x)} onChange={() => handleToggle(x)} />} />\r\n </ListItem>\r\n ))}\r\n </List>\r\n </Box>\r\n <WrapActions>\r\n <Button size='small' onClick={handleClear} color='inherit'>\r\n Clear\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' onClick={handleCancel} color='inherit'>\r\n Cancel\r\n </Button>\r\n <Button size='small' variant='contained' onClick={handleApply}>\r\n Apply\r\n </Button>\r\n </WrapActions>\r\n </CustomPopover>\r\n </>\r\n )\r\n }\r\n\r\n return MenuSelectMultiple\r\n}\r\n\r\nexport default CreateMultiSelectDropdown\r\n\r\nconst heightItem = 58\r\nconst CustomPopover = styled(Popover)({\r\n '.MuiPaper-root': {\r\n overflow: 'hidden',\r\n position: 'relative',\r\n width: '360px'\r\n },\r\n '.menu-content': {\r\n overflowY: 'auto',\r\n maxHeight: `${heightItem * 5}px`,\r\n margin: '2px 2px 2px 0'\r\n }\r\n})\r\n\r\nconst ButtonBadge = styled(Badge)({\r\n [`& .${badgeClasses.badge}`]: {\r\n top: '-12px',\r\n right: '-6px'\r\n }\r\n})\r\nconst WrapActions = styled(Box)({\r\n alignItems: 'center',\r\n display: 'flex',\r\n gap: '6px',\r\n height: '58px',\r\n padding: '8px 10px',\r\n boxShadow: 'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'\r\n})\r\n"],"names":["CreateMultiSelectDropdown","params","props","_ref","_props$options","_props$slots$defaultL","_props$slots","_props$slots2","_ref2","_props$slots$contentP","_props$slots3","_props$value2","_params$placeholder","_props$value$items","_props$value","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","anchorEl","setAnchorEl","_useState5","options","_useState6","setOptions","_useState7","_useState8","itemSelecteds","setItemSelecteds","_useState9","slots","defaultLogic","_useState0","logic","setLogic","mergeConfig","buttonProps","mergeObjects","contentProps","contentPorps","setValueWithProps","useCallback","_props$value$logic","value","items","handleClose","event","reason","setTimeout","useEffect","length","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","disabled","onClick","currentTarget","btnText","ButtonBadge","badgeContent","overlap","sx","transform","CustomPopover","open","Boolean","onClose","anchorOrigin","vertical","horizontal","WrapActions","className","TextField","size","placeholder","fullWidth","onChange","e","target","ToggleButtonGroup","exclusive","_","ToggleButton","HelpTooltip","title","small","Typography","variant","Box","List","filter","x","toLowerCase","includes","sort","a","b","localeCompare","concat","_toConsumableArray","map","ListItem","whiteSpace","FormControlLabel","label","control","Checkbox","checked","prev","t","flex","styled","Popover","overflow","position","width","overflowY","maxHeight","heightItem","margin","Badge","_defineProperty","badgeClasses","badge","top","right","alignItems","display","gap","height","padding","boxShadow"],"mappings":"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"}
1
+ {"version":3,"file":"create.multi-select-dropdown.js","sources":["../../src/components/create.multi-select-dropdown.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useState } from 'react'\r\nimport { Badge, badgeClasses, Box, BoxProps, Button, ButtonProps, Checkbox } from '@mui/material'\r\nimport { FormControlLabel, List, ListItem, Popover, styled, TextField, ToggleButton, ToggleButtonGroup, Typography } from '@mui/material'\r\nimport FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined'\r\nimport { mergeObjects } from '../utils'\r\nimport HelpTooltip from './help-tooltip'\r\n\r\nexport type IMultiSelectDropdownFilterLogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n items: string[]\r\n logic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport type IMultiSelectDropdownChange = (value: IMultiSelectDropdownFilter) => void\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n buttonProps?: ButtonProps\r\n contentPorps?: BoxProps\r\n defaultLogic?: IMultiSelectDropdownFilterLogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n options?: string[]\r\n value?: IMultiSelectDropdownFilter\r\n onChange?: IMultiSelectDropdownChange\r\n slots?: IMultiSelectDropdownSlots\r\n}\r\n\r\nexport interface IMultiSelectDropdownParams extends IMultiSelectDropdownSlots {\r\n btnText: string\r\n options?: string[]\r\n placeholder?: string\r\n}\r\n\r\nfunction CreateMultiSelectDropdown(params: IMultiSelectDropdownParams) {\r\n const MenuSelectMultiple: FC<IMultiSelectDropdownProps> = (props) => {\r\n const [search, setSearch] = useState<string>('')\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n const [itemSelecteds, setItemSelecteds] = useState<string[]>([])\r\n const [logic, setLogic] = useState(props.slots?.defaultLogic ?? 'and')\r\n\r\n const mergeConfig = {\r\n buttonProps: mergeObjects<ButtonProps>(params?.buttonProps, props.slots?.buttonProps),\r\n contentProps: props.slots?.contentPorps ?? params?.contentPorps ?? {}\r\n }\r\n\r\n const getOptions = () => {\r\n const values = props.value?.items ?? []\r\n const list = options.filter((x) => x.toLowerCase().includes(search.toLowerCase())).sort((a, b) => a.localeCompare(b))\r\n\r\n const prioritized = list.filter((x) => values.includes(x))\r\n const others = list.filter((x) => !values.includes(x))\r\n\r\n return [...prioritized, ...others]\r\n }\r\n\r\n const setValueWithProps = useCallback(() => {\r\n if (props.value) {\r\n setLogic(props.value.logic ?? 'and')\r\n setItemSelecteds(props.value.items)\r\n }\r\n }, [props.value])\r\n\r\n const handleOpen = (event: React.MouseEvent<HTMLButtonElement>) => {\r\n setAnchorEl(event.currentTarget)\r\n }\r\n\r\n const handleClose = (event?: {}, reason?: 'backdropClick' | 'escapeKeyDown') => {\r\n setAnchorEl(null)\r\n setTimeout(setValueWithProps, 300)\r\n }\r\n\r\n const handleToggle = (value: string) => {\r\n setItemSelecteds((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n }\r\n\r\n const handleClear = () => {\r\n setItemSelecteds([])\r\n props.onChange && props.onChange({ items: [], logic })\r\n }\r\n\r\n const handleCancel = () => {\r\n setItemSelecteds([])\r\n handleClose()\r\n }\r\n\r\n const handleApply = () => {\r\n props.onChange && props.onChange({ items: itemSelecteds, logic })\r\n handleClose()\r\n }\r\n\r\n const handleChangeLogic = (_: React.MouseEvent<HTMLElement>, value: any) => {\r\n if (value) setLogic(value)\r\n }\r\n\r\n useEffect(() => {\r\n if (props.options && props.options.length > 0) setOptions(props.options)\r\n }, [props.options])\r\n\r\n useEffect(() => {\r\n setValueWithProps()\r\n }, [setValueWithProps])\r\n\r\n return (\r\n <>\r\n <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} disabled={options.length < 1} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n {params.btnText}\r\n <ButtonBadge\r\n badgeContent={props.value?.items.length}\r\n color='error'\r\n overlap='circular'\r\n sx={{ transform: 'translateY(-50%) translateX(24px)' }}\r\n />\r\n </Button>\r\n <CustomPopover open={Boolean(anchorEl)} anchorEl={anchorEl} onClose={handleClose} anchorOrigin={{ vertical: 'bottom', horizontal: 'left' }}>\r\n <WrapActions className='top'>\r\n <TextField\r\n size='small'\r\n placeholder={params.placeholder ?? 'Search'}\r\n fullWidth\r\n value={search}\r\n onChange={(e) => setSearch(e.target.value)}\r\n />\r\n <ToggleButtonGroup size='small' exclusive color='primary' value={logic} onChange={handleChangeLogic}>\r\n <ToggleButton value='and'>AND</ToggleButton>\r\n <ToggleButton value='or'>OR</ToggleButton>\r\n </ToggleButtonGroup>\r\n <HelpTooltip title='Filter Logic' small>\r\n <Typography variant='body2' color='text.secondary'>\r\n Choose how multiple categories are applied.\r\n <br />\r\n <strong> AND </strong> requires all selected categories, while\r\n <br />\r\n <strong> OR </strong> matches any.\r\n </Typography>\r\n </HelpTooltip>\r\n </WrapActions>\r\n <Box className='menu-content' {...mergeConfig.contentProps}>\r\n <List>\r\n {getOptions().map((x) => (\r\n <ListItem key={x} sx={{ whiteSpace: 'nowrap' }}>\r\n <FormControlLabel label={x} control={<Checkbox checked={itemSelecteds.includes(x)} onChange={() => handleToggle(x)} />} />\r\n </ListItem>\r\n ))}\r\n </List>\r\n </Box>\r\n <WrapActions>\r\n <Button size='small' onClick={handleClear} color='inherit'>\r\n Clear\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' onClick={handleCancel} color='inherit'>\r\n Cancel\r\n </Button>\r\n <Button size='small' variant='contained' onClick={handleApply}>\r\n Apply\r\n </Button>\r\n </WrapActions>\r\n </CustomPopover>\r\n </>\r\n )\r\n }\r\n\r\n return MenuSelectMultiple\r\n}\r\n\r\nexport default CreateMultiSelectDropdown\r\n\r\nconst heightItem = 58\r\nconst CustomPopover = styled(Popover)({\r\n '.MuiPaper-root': {\r\n overflow: 'hidden',\r\n position: 'relative',\r\n width: '360px'\r\n },\r\n '.menu-content': {\r\n overflowY: 'auto',\r\n maxHeight: `${heightItem * 5}px`,\r\n margin: '2px 2px 2px 0'\r\n }\r\n})\r\n\r\nconst ButtonBadge = styled(Badge)({\r\n [`& .${badgeClasses.badge}`]: {\r\n top: '-12px',\r\n right: '-6px'\r\n }\r\n})\r\nconst WrapActions = styled(Box)({\r\n alignItems: 'center',\r\n display: 'flex',\r\n gap: '6px',\r\n height: '58px',\r\n padding: '8px 10px',\r\n boxShadow: 'rgba(99, 99, 99, 0.2) 0px 2px 8px 0px'\r\n})\r\n"],"names":["CreateMultiSelectDropdown","params","props","_ref","_props$options","_props$slots$defaultL","_props$slots","_props$slots2","_ref2","_props$slots$contentP","_props$slots3","_props$value2","_params$placeholder","_props$value$items","_props$value","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","search","setSearch","_useState3","_useState4","anchorEl","setAnchorEl","_useState5","options","_useState6","setOptions","_useState7","_useState8","itemSelecteds","setItemSelecteds","_useState9","slots","defaultLogic","_useState0","logic","setLogic","mergeConfig","buttonProps","mergeObjects","contentProps","contentPorps","setValueWithProps","useCallback","_props$value$logic","value","items","handleClose","event","reason","setTimeout","useEffect","length","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","disabled","onClick","currentTarget","btnText","ButtonBadge","badgeContent","overlap","sx","transform","CustomPopover","open","Boolean","onClose","anchorOrigin","vertical","horizontal","WrapActions","className","TextField","size","placeholder","fullWidth","onChange","e","target","ToggleButtonGroup","exclusive","_","ToggleButton","HelpTooltip","title","small","Typography","variant","Box","List","filter","x","toLowerCase","includes","sort","a","b","localeCompare","concat","_toConsumableArray","map","ListItem","whiteSpace","FormControlLabel","label","control","Checkbox","checked","prev","t","flex","styled","Popover","overflow","position","width","overflowY","maxHeight","heightItem","margin","Badge","_defineProperty","badgeClasses","badge","top","right","alignItems","display","gap","height","padding","boxShadow"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{objectSpread2 as r,objectWithoutProperties as t,defineProperty as e}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as o}from"react/jsx-runtime";import{styled as n,Typography as l,Tooltip as a,tooltipClasses as p,Box as c,IconButton as m,Stack as s,Divider as x}from"@mui/material";import d from"@mui/icons-material/HelpOutline";var u=["className"],f=function(t){return i(g,{arrow:!0,placement:"bottom",title:o(s,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:t.title}),i(x,{}),i(c,{sx:{p:"6px 12px"},children:t.children})]}),children:i(c,{sx:r({cursor:"default"},t.sxIcon),children:i(m,{size:"small",children:i(d,{fontSize:t.small?"small":"medium",sx:{color:"rgb(25,103,210)"}})})})})},h=function(r){return i(g,{arrow:!0,placement:"bottom",title:o(s,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:r.title}),i(x,{}),i(c,{sx:{p:"6px 12px"},children:r.content})]}),children:i(c,{sx:{cursor:"default"},children:r.children})})},b=n((function(t){return i(l,r({variant:"subtitle1"},t))}))({color:"#0095ff",fontWeight:700,padding:"0 10px"}),g=n((function(e){var o=e.className,n=t(e,u);return i(a,r(r({},n),{},{classes:{popper:o}}))}))((function(r){var t=r.theme;return e(e({},"& .".concat(p.tooltip),{backgroundColor:"#fff",color:"#3c3c3c",maxWidth:500,minHeight:120,fontSize:t.typography.pxToRem(12),borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.08) 0px 6px 30px"}),"& .".concat(p.arrow),{color:"#fff"})}));export{h as HelpTooltipWrap,f as default};
1
+ import{objectSpread2 as r,objectWithoutProperties as t,defineProperty as e}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as o}from"react/jsx-runtime";import{styled as n,Typography as l,Tooltip as a,tooltipClasses as p,Box as c,IconButton as m,Stack as s,Divider as x}from"@mui/material";import d from"@mui/icons-material/HelpOutline";var u=["className"],f=function(t){return i(g,{arrow:!0,placement:"bottom",title:o(s,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:t.title}),i(x,{}),i(c,{sx:{p:"6px 12px"},children:t.children})]}),children:i(c,{sx:r({cursor:"default"},t.sxIcon),children:i(m,{size:"small",children:i(d,{fontSize:t.small?"small":"medium",sx:{color:"rgb(25,103,210)"}})})})})},h=function(r){return i(g,{arrow:!0,placement:"bottom",title:o(s,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:r.title}),i(x,{}),i(c,{sx:{p:"6px 12px"},children:r.content})]}),children:i(c,{sx:{cursor:"default"},children:r.children})})},b=n((function(t){return i(l,r({variant:"subtitle1"},t))}))({color:"#0095ff",fontWeight:700,padding:"0 10px"}),g=n((function(e){var o=e.className,n=t(e,u);return i(a,r(r({},n),{},{classes:{popper:o}}))}))((function(r){var t=r.theme;return e(e({},"& .".concat(p.tooltip),{backgroundColor:"#fff",color:"#3c3c3c",maxWidth:500,minHeight:120,fontSize:t.typography.pxToRem(12),borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.08) 0px 6px 30px"}),"& .".concat(p.arrow),{color:"#fff"})}));export{f as HelpTooltip,h as HelpTooltipWrap,f as default};
2
2
  //# sourceMappingURL=help-tooltip.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"help-tooltip.js","sources":["../../src/components/help-tooltip.tsx"],"sourcesContent":["import React, { FC, PropsWithChildren, ReactNode } from 'react'\r\nimport { Box, Divider, IconButton, Stack, Tooltip, Typography } from '@mui/material'\r\nimport { SxProps, Theme, TooltipProps, TypographyProps, styled, tooltipClasses } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IHelpTooltipProps {\r\n title: string\r\n small?: boolean\r\n sxIcon?: SxProps<Theme>\r\n}\r\n\r\nconst HelpTooltip: FC<PropsWithChildren<IHelpTooltipProps>> = (props) => (\r\n <HtmlTooltip\r\n arrow\r\n placement='bottom'\r\n title={\r\n <Stack sx={{ gap: '6px', py: '6px', minWidth: '200px', maxWidth: '400px ' }}>\r\n <TooltipHeaderText>{props.title}</TooltipHeaderText>\r\n <Divider />\r\n <Box sx={{ p: '6px 12px' }}>{props.children}</Box>\r\n </Stack>\r\n }\r\n >\r\n <Box sx={{ cursor: 'default', ...props.sxIcon }}>\r\n <IconButton size='small'>\r\n <HelpOutlineIcon fontSize={props.small ? 'small' : 'medium'} sx={{ color: 'rgb(25,103,210)' }} />\r\n </IconButton>\r\n </Box>\r\n </HtmlTooltip>\r\n)\r\n\r\nexport default HelpTooltip\r\n\r\nexport interface IHelpTooltipWrapProps {\r\n content: ReactNode\r\n title: string\r\n children: React.ReactNode\r\n}\r\n\r\nexport const HelpTooltipWrap: FC<IHelpTooltipWrapProps> = (props) => (\r\n <HtmlTooltip\r\n arrow\r\n placement='bottom'\r\n title={\r\n <Stack sx={{ gap: '6px', py: '6px', minWidth: '200px', maxWidth: '400px ' }}>\r\n <TooltipHeaderText>{props.title}</TooltipHeaderText>\r\n <Divider />\r\n <Box sx={{ p: '6px 12px' }}>{props.content}</Box>\r\n </Stack>\r\n }\r\n >\r\n <Box sx={{ cursor: 'default' }}>{props.children}</Box>\r\n </HtmlTooltip>\r\n)\r\n\r\nconst TooltipHeaderText = styled((props: TypographyProps) => <Typography variant='subtitle1' {...props} />)({\r\n color: '#0095ff',\r\n fontWeight: 700,\r\n padding: '0 10px'\r\n})\r\n\r\nconst HtmlTooltip = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: '#fff',\r\n color: '#3c3c3c',\r\n maxWidth: 500,\r\n minHeight: 120,\r\n fontSize: theme.typography.pxToRem(12),\r\n borderRadius: '8px',\r\n boxShadow: 'rgba(0, 0, 0, 0.08) 0px 6px 30px'\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: '#fff'\r\n }\r\n}))\r\n"],"names":["HelpTooltip","props","_jsx","HtmlTooltip","arrow","placement","title","_jsxs","Stack","sx","gap","py","minWidth","maxWidth","children","TooltipHeaderText","Divider","Box","p","_objectSpread","cursor","sxIcon","IconButton","size","HelpOutlineIcon","fontSize","small","color","HelpTooltipWrap","content","styled","Typography","variant","fontWeight","padding","_ref","className","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref2","theme","_defineProperty","concat","tooltipClasses","tooltip","backgroundColor","minHeight","typography","pxToRem","borderRadius","boxShadow"],"mappings":"wXAWMA,EAAwD,SAACC,GAAK,OAClEC,EAACC,EAAW,CACVC,OAAK,EACLC,UAAU,SACVC,MACEC,EAACC,EAAM,CAAAC,GAAI,CAAEC,IAAK,MAAOC,GAAI,MAAOC,SAAU,QAASC,SAAU,UAC/DC,SAAA,CAAAZ,EAACa,EAAiB,CAAAD,SAAEb,EAAMK,QAC1BJ,EAACc,EAAO,CAAA,GACRd,EAACe,EAAG,CAACR,GAAI,CAAES,EAAG,YAAYJ,SAAGb,EAAMa,cAC7BA,SAGVZ,EAACe,EAAI,CAAAR,GAAEU,EAAA,CAAIC,OAAQ,WAAcnB,EAAMoB,QAAQP,SAC7CZ,EAACoB,EAAW,CAAAC,KAAK,QACfT,SAAAZ,EAACsB,EAAe,CAACC,SAAUxB,EAAMyB,MAAQ,QAAU,SAAUjB,GAAI,CAAEkB,MAAO,0BAGlE,EAWHC,EAA6C,SAAC3B,GAAK,OAC9DC,EAACC,GACCC,OAAK,EACLC,UAAU,SACVC,MACEC,EAACC,EAAK,CAACC,GAAI,CAAEC,IAAK,MAAOC,GAAI,MAAOC,SAAU,QAASC,SAAU,UAC/DC,SAAA,CAAAZ,EAACa,EAAiB,CAAAD,SAAEb,EAAMK,QAC1BJ,EAACc,EAAU,CAAA,GACXd,EAACe,EAAG,CAACR,GAAI,CAAES,EAAG,YAAeJ,SAAAb,EAAM4B,aAIvCf,SAAAZ,EAACe,EAAI,CAAAR,GAAI,CAAEW,OAAQ,oBAAcnB,EAAMa,YAC3B,EAGVC,EAAoBe,GAAO,SAAC7B,GAAsB,OAAKC,EAAC6B,EAAUZ,EAAA,CAACa,QAAQ,aAAgB/B,GAAS,GAAhF6B,CAAkF,CAC1GH,MAAO,UACPM,WAAY,IACZC,QAAS,WAGL/B,EAAc2B,GAAO,SAAAK,GAAA,IAAGC,EAASD,EAATC,UAAcnC,EAAKoC,EAAAF,EAAAG,GAAA,OAAqBpC,EAACqC,EAAOpB,EAAAA,KAAKlB,GAAK,GAAA,CAAEuC,QAAS,CAAEC,OAAQL,KAAe,GAAxGN,EAA0G,SAAAY,GAAA,IAAGC,EAAKD,EAALC,MAAK,OAAAC,EAAAA,EAAA,CAAA,EAAA,MAAAC,OAC7HC,EAAeC,SAAY,CAChCC,gBAAiB,OACjBrB,MAAO,UACPd,SAAU,IACVoC,UAAW,IACXxB,SAAUkB,EAAMO,WAAWC,QAAQ,IACnCC,aAAc,MACdC,UAAW,2CACZR,OACMC,EAAe1C,OAAU,CAC9BuB,MAAO,QACR"}
1
+ {"version":3,"file":"help-tooltip.js","sources":["../../src/components/help-tooltip.tsx"],"sourcesContent":["import { Box, Divider, IconButton, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { FC, PropsWithChildren, ReactNode } from 'react'\r\nimport type { SxProps, Theme, TooltipProps, TypographyProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IHelpTooltipProps {\r\n title: string\r\n small?: boolean\r\n sxIcon?: SxProps<Theme>\r\n}\r\n\r\nexport const HelpTooltip: FC<PropsWithChildren<IHelpTooltipProps>> = (props) => (\r\n <TooltipStyled\r\n arrow\r\n placement='bottom'\r\n title={\r\n <Stack sx={{ gap: '6px', py: '6px', minWidth: '200px', maxWidth: '400px ' }}>\r\n <TooltipHeaderText>{props.title}</TooltipHeaderText>\r\n <Divider />\r\n <Box sx={{ p: '6px 12px' }}>{props.children}</Box>\r\n </Stack>\r\n }\r\n >\r\n <Box sx={{ cursor: 'default', ...props.sxIcon }}>\r\n <IconButton size='small'>\r\n <HelpOutlineIcon fontSize={props.small ? 'small' : 'medium'} sx={{ color: 'rgb(25,103,210)' }} />\r\n </IconButton>\r\n </Box>\r\n </TooltipStyled>\r\n)\r\n\r\nexport default HelpTooltip\r\n\r\nexport interface IHelpTooltipWrapProps {\r\n content: ReactNode\r\n title: string\r\n children: React.ReactNode\r\n}\r\n\r\nexport const HelpTooltipWrap: FC<IHelpTooltipWrapProps> = (props) => (\r\n <TooltipStyled\r\n arrow\r\n placement='bottom'\r\n title={\r\n <Stack sx={{ gap: '6px', py: '6px', minWidth: '200px', maxWidth: '400px ' }}>\r\n <TooltipHeaderText>{props.title}</TooltipHeaderText>\r\n <Divider />\r\n <Box sx={{ p: '6px 12px' }}>{props.content}</Box>\r\n </Stack>\r\n }\r\n >\r\n <Box sx={{ cursor: 'default' }}>{props.children}</Box>\r\n </TooltipStyled>\r\n)\r\n\r\nconst TooltipHeaderText = styled((props: TypographyProps) => <Typography variant='subtitle1' {...props} />)({\r\n color: '#0095ff',\r\n fontWeight: 700,\r\n padding: '0 10px'\r\n})\r\n\r\nconst TooltipStyled = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: '#fff',\r\n color: '#3c3c3c',\r\n maxWidth: 500,\r\n minHeight: 120,\r\n fontSize: theme.typography.pxToRem(12),\r\n borderRadius: '8px',\r\n boxShadow: 'rgba(0, 0, 0, 0.08) 0px 6px 30px'\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: '#fff'\r\n }\r\n}))\r\n"],"names":["HelpTooltip","props","_jsx","TooltipStyled","arrow","placement","title","_jsxs","Stack","sx","gap","py","minWidth","maxWidth","children","TooltipHeaderText","Divider","Box","p","_objectSpread","cursor","sxIcon","IconButton","size","HelpOutlineIcon","fontSize","small","color","HelpTooltipWrap","content","styled","Typography","variant","fontWeight","padding","_ref","className","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref2","theme","_defineProperty","concat","tooltipClasses","tooltip","backgroundColor","minHeight","typography","pxToRem","borderRadius","boxShadow"],"mappings":"wXAWaA,EAAwD,SAACC,GAAK,OACzEC,EAACC,EACC,CAAAC,OACA,EAAAC,UAAU,SACVC,MACEC,EAACC,EAAK,CAACC,GAAI,CAAEC,IAAK,MAAOC,GAAI,MAAOC,SAAU,QAASC,SAAU,UAAUC,SAAA,CACzEZ,EAACa,EAAmB,CAAAD,SAAAb,EAAMK,QAC1BJ,EAACc,EAAU,CAAA,GACXd,EAACe,EAAI,CAAAR,GAAI,CAAES,EAAG,YAAeJ,SAAAb,EAAMa,cAIvCA,SAAAZ,EAACe,EAAG,CAACR,GAAEU,EAAA,CAAIC,OAAQ,WAAcnB,EAAMoB,QACrCP,SAAAZ,EAACoB,EAAU,CAACC,KAAK,QAAOT,SACtBZ,EAACsB,EAAgB,CAAAC,SAAUxB,EAAMyB,MAAQ,QAAU,SAAUjB,GAAI,CAAEkB,MAAO,0BAGhE,EAWLC,EAA6C,SAAC3B,GAAK,OAC9DC,EAACC,GACCC,OAAK,EACLC,UAAU,SACVC,MACEC,EAACC,EAAK,CAACC,GAAI,CAAEC,IAAK,MAAOC,GAAI,MAAOC,SAAU,QAASC,SAAU,UAC/DC,SAAA,CAAAZ,EAACa,EAAiB,CAAAD,SAAEb,EAAMK,QAC1BJ,EAACc,EAAU,CAAA,GACXd,EAACe,EAAG,CAACR,GAAI,CAAES,EAAG,YAAeJ,SAAAb,EAAM4B,aAIvCf,SAAAZ,EAACe,EAAI,CAAAR,GAAI,CAAEW,OAAQ,oBAAcnB,EAAMa,YACzB,EAGZC,EAAoBe,GAAO,SAAC7B,GAAsB,OAAKC,EAAC6B,EAAUZ,EAAA,CAACa,QAAQ,aAAgB/B,GAAS,GAAhF6B,CAAkF,CAC1GH,MAAO,UACPM,WAAY,IACZC,QAAS,WAGL/B,EAAgB2B,GAAO,SAAAK,GAAA,IAAGC,EAASD,EAATC,UAAcnC,EAAKoC,EAAAF,EAAAG,GAAA,OAAqBpC,EAACqC,EAAOpB,EAAAA,KAAKlB,GAAK,GAAA,CAAEuC,QAAS,CAAEC,OAAQL,KAAe,GAAxGN,EAA0G,SAAAY,GAAA,IAAGC,EAAKD,EAALC,MAAK,OAAAC,EAAAA,EAAA,CAAA,EAAA,MAAAC,OAC/HC,EAAeC,SAAY,CAChCC,gBAAiB,OACjBrB,MAAO,UACPd,SAAU,IACVoC,UAAW,IACXxB,SAAUkB,EAAMO,WAAWC,QAAQ,IACnCC,aAAc,MACdC,UAAW,2CACZR,OACMC,EAAe1C,OAAU,CAC9BuB,MAAO,QACR"}
@@ -1,2 +1,2 @@
1
- import{objectWithoutProperties as r,slicedToArray as o,objectSpread2 as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,Fragment as e,jsxs as n}from"react/jsx-runtime";import{useState as l,useEffect as c,Fragment as i}from"react";import{useDebounce as u}from"../hooks/debounce.js";var s=["src","fallbackSrc","alt","loading","debounceDelay"],d=function(d){var f=d.src,m=d.fallbackSrc,p=d.alt,b=d.loading,g=d.debounceDelay,j=void 0===g?0:g,v=r(d,s),S=u(f,j),h=u(m,j),k=j>0?S:f,y=j>0?h:m,x=l(!0),D=o(x,2),L=D[0],P=D[1],_=l(null!=k?k:y),A=o(_,2),B=A[0],E=A[1];c((function(){E(null!=k?k:y),P(!0)}),[k,y]);var F=L&&b?b:t(e,{});return n(i,{children:[F,t("img",a(a({},v),{},{src:B,alt:p,onLoadStart:function(){return P(!0)},onLoad:function(){return P(!1)},onError:function(){E(m),P(!1)}}))]})};export{d as default};
1
+ import{objectWithoutProperties as r,slicedToArray as o,objectSpread2 as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as t,Fragment as e,jsxs as n}from"react/jsx-runtime";import{useState as l,useEffect as c,Fragment as i}from"react";import{useDebounce as u}from"../hooks/debounce.js";var s=["src","fallbackSrc","alt","loading","debounceDelay"],d=function(d){var f=d.src,m=d.fallbackSrc,p=d.alt,b=d.loading,g=d.debounceDelay,j=void 0===g?0:g,v=r(d,s),S=u(f,j),h=u(m,j),k=j>0?S:f,y=j>0?h:m,x=l(!0),D=o(x,2),L=D[0],P=D[1],_=l(null!=k?k:y),A=o(_,2),B=A[0],E=A[1];c((function(){E(null!=k?k:y),P(!0)}),[k,y]);var F=L&&b?b:t(e,{});return n(i,{children:[F,t("img",a(a({},v),{},{src:B,alt:p,onLoadStart:function(){return P(!0)},onLoad:function(){return P(!1)},onError:function(){E(m),P(!1)}}))]})};export{d as ImageWithFallback,d as default};
2
2
  //# sourceMappingURL=image-with-fallback.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"image-with-fallback.js","sources":["../../src/components/image-with-fallback.tsx"],"sourcesContent":["import React, { FC, Fragment, ReactNode, useEffect, useState } from 'react'\r\nimport { useDebounce } from '../hooks'\r\n\r\nexport interface IImageWithFallbackPropsOwner {\r\n src?: string\r\n alt?: string\r\n fallbackSrc: string\r\n loading?: ReactNode\r\n debounceDelay?: number\r\n}\r\n\r\nexport type IImageProps = Omit<React.ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>\r\n\r\nexport interface IImageWithFallbackProps extends IImageProps, IImageWithFallbackPropsOwner {}\r\n\r\nconst ImageWithFallback: FC<IImageWithFallbackProps> = ({ src, fallbackSrc, alt, loading, debounceDelay = 0, ...props }) => {\r\n const debouncedSrc = useDebounce(src, debounceDelay)\r\n const debouncedFallbackSrc = useDebounce(fallbackSrc, debounceDelay)\r\n\r\n const effectiveSrc = debounceDelay > 0 ? debouncedSrc : src\r\n const effectiveFallbackSrc = debounceDelay > 0 ? debouncedFallbackSrc : fallbackSrc\r\n\r\n const [isLoading, setLoading] = useState(true)\r\n const [imgSrc, setImgSrc] = useState(effectiveSrc ?? effectiveFallbackSrc)\r\n\r\n useEffect(() => {\r\n setImgSrc(effectiveSrc ?? effectiveFallbackSrc)\r\n setLoading(true)\r\n }, [effectiveSrc, effectiveFallbackSrc])\r\n\r\n const loadingElement = isLoading && loading ? loading : <></>\r\n\r\n return (\r\n <Fragment>\r\n {loadingElement}\r\n <img\r\n {...props}\r\n src={imgSrc}\r\n alt={alt}\r\n onLoadStart={() => setLoading(true)}\r\n onLoad={() => setLoading(false)}\r\n onError={() => {\r\n setImgSrc(fallbackSrc)\r\n setLoading(false)\r\n }}\r\n />\r\n </Fragment>\r\n )\r\n}\r\n\r\nexport default ImageWithFallback\r\n"],"names":["ImageWithFallback","_ref","src","fallbackSrc","alt","loading","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","_excluded","debouncedSrc","useDebounce","debouncedFallbackSrc","effectiveSrc","effectiveFallbackSrc","_useState","useState","_useState2","_slicedToArray","isLoading","setLoading","_useState3","_useState4","imgSrc","setImgSrc","useEffect","loadingElement","_jsx","_jsxs","Fragment","onLoadStart","onLoad","onError"],"mappings":"sWAeMA,EAAiD,SAAhCC,GAAoG,IAAjEC,EAAGD,EAAHC,IAAKC,EAAWF,EAAXE,YAAaC,EAAGH,EAAHG,IAAKC,EAAOJ,EAAPI,QAAOC,EAAAL,EAAEM,cAAAA,OAAgB,IAAHD,EAAG,EAACA,EAAKE,EAAKC,EAAAR,EAAAS,GAC7GC,EAAeC,EAAYV,EAAKK,GAChCM,EAAuBD,EAAYT,EAAaI,GAEhDO,EAAeP,EAAgB,EAAII,EAAeT,EAClDa,EAAuBR,EAAgB,EAAIM,EAAuBV,EAExEa,EAAgCC,GAAS,GAAKC,EAAAC,EAAAH,EAAA,GAAvCI,EAASF,EAAA,GAAEG,EAAUH,EAAA,GAC5BI,EAA4BL,EAASH,QAAAA,EAAgBC,GAAqBQ,EAAAJ,EAAAG,EAAA,GAAnEE,EAAMD,EAAA,GAAEE,EAASF,EAAA,GAExBG,GAAU,WACRD,EAAUX,QAAAA,EAAgBC,GAC1BM,GAAW,EACb,GAAG,CAACP,EAAcC,IAElB,IAAMY,EAAiBP,GAAaf,EAAUA,EAAUuB,QAExD,OACEC,EAACC,aACEH,EACDC,eACMpB,GAAK,GAAA,CACTN,IAAKsB,EACLpB,IAAKA,EACL2B,YAAa,WAAF,OAAQV,GAAW,EAAK,EACnCW,OAAQ,WAAF,OAAQX,GAAW,EAAM,EAC/BY,QAAS,WACPR,EAAUtB,GACVkB,GAAW,EACb,OAIR"}
1
+ {"version":3,"file":"image-with-fallback.js","sources":["../../src/components/image-with-fallback.tsx"],"sourcesContent":["import { Fragment, useEffect, useState } from 'react'\r\nimport type { FC, ImgHTMLAttributes, ReactNode } from 'react'\r\nimport { useDebounce } from '../hooks'\r\n\r\nexport interface IImageWithFallbackPropsOwner {\r\n src?: string\r\n alt?: string\r\n fallbackSrc: string\r\n loading?: ReactNode\r\n debounceDelay?: number\r\n}\r\n\r\nexport type IImageProps = Omit<ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>\r\n\r\nexport interface IImageWithFallbackProps extends IImageProps, IImageWithFallbackPropsOwner {}\r\n\r\nexport const ImageWithFallback: FC<IImageWithFallbackProps> = ({ src, fallbackSrc, alt, loading, debounceDelay = 0, ...props }) => {\r\n const debouncedSrc = useDebounce(src, debounceDelay)\r\n const debouncedFallbackSrc = useDebounce(fallbackSrc, debounceDelay)\r\n\r\n const effectiveSrc = debounceDelay > 0 ? debouncedSrc : src\r\n const effectiveFallbackSrc = debounceDelay > 0 ? debouncedFallbackSrc : fallbackSrc\r\n\r\n const [isLoading, setLoading] = useState(true)\r\n const [imgSrc, setImgSrc] = useState(effectiveSrc ?? effectiveFallbackSrc)\r\n\r\n useEffect(() => {\r\n setImgSrc(effectiveSrc ?? effectiveFallbackSrc)\r\n setLoading(true)\r\n }, [effectiveSrc, effectiveFallbackSrc])\r\n\r\n const loadingElement = isLoading && loading ? loading : <></>\r\n\r\n return (\r\n <Fragment>\r\n {loadingElement}\r\n <img\r\n {...props}\r\n src={imgSrc}\r\n alt={alt}\r\n onLoadStart={() => setLoading(true)}\r\n onLoad={() => setLoading(false)}\r\n onError={() => {\r\n setImgSrc(fallbackSrc)\r\n setLoading(false)\r\n }}\r\n />\r\n </Fragment>\r\n )\r\n}\r\nexport default ImageWithFallback\r\n"],"names":["ImageWithFallback","_ref","src","fallbackSrc","alt","loading","_ref$debounceDelay","debounceDelay","props","_objectWithoutProperties","_excluded","debouncedSrc","useDebounce","debouncedFallbackSrc","effectiveSrc","effectiveFallbackSrc","_useState","useState","_useState2","_slicedToArray","isLoading","setLoading","_useState3","_useState4","imgSrc","setImgSrc","useEffect","loadingElement","_jsx","_jsxs","Fragment","onLoadStart","onLoad","onError"],"mappings":"sWAgBaA,EAAiD,SAAhCC,GAAoG,IAAjEC,EAAGD,EAAHC,IAAKC,EAAWF,EAAXE,YAAaC,EAAGH,EAAHG,IAAKC,EAAOJ,EAAPI,QAAOC,EAAAL,EAAEM,cAAAA,OAAgB,IAAHD,EAAG,EAACA,EAAKE,EAAKC,EAAAR,EAAAS,GACpHC,EAAeC,EAAYV,EAAKK,GAChCM,EAAuBD,EAAYT,EAAaI,GAEhDO,EAAeP,EAAgB,EAAII,EAAeT,EAClDa,EAAuBR,EAAgB,EAAIM,EAAuBV,EAExEa,EAAgCC,GAAS,GAAKC,EAAAC,EAAAH,EAAA,GAAvCI,EAASF,EAAA,GAAEG,EAAUH,EAAA,GAC5BI,EAA4BL,EAASH,QAAAA,EAAgBC,GAAqBQ,EAAAJ,EAAAG,EAAA,GAAnEE,EAAMD,EAAA,GAAEE,EAASF,EAAA,GAExBG,GAAU,WACRD,EAAUX,QAAAA,EAAgBC,GAC1BM,GAAW,EACb,GAAG,CAACP,EAAcC,IAElB,IAAMY,EAAiBP,GAAaf,EAAUA,EAAUuB,QAExD,OACEC,EAACC,aACEH,EACDC,eACMpB,GAAK,GAAA,CACTN,IAAKsB,EACLpB,IAAKA,EACL2B,YAAa,WAAF,OAAQV,GAAW,EAAK,EACnCW,OAAQ,WAAF,OAAQX,GAAW,EAAM,EAC/BY,QAAS,WACPR,EAAUtB,GACVkB,GAAW,EACb,OAIR"}
@@ -1,2 +1,2 @@
1
- export{Breadcrumbs}from"./breadcrumbs.js";export{LoadingButton}from"./buttons.js";export{CopyToClipboard}from"./copy-to-clipboard.js";export{default as CreateMultiSelectDropdown}from"./create.multi-select-dropdown.js";export{default as ImageWithFallback}from"./image-with-fallback.js";export{default as HelpTooltip,HelpTooltipWrap}from"./help-tooltip.js";export{default as TextEditorPreview}from"./text-editor.preview.js";export{default as TextEditor,textEditorClasses}from"./text-editor.js";
1
+ export{Breadcrumbs}from"./breadcrumbs.js";export{LoadingButton}from"./buttons.js";export{CopyToClipboard}from"./copy-to-clipboard.js";export{default as CreateMultiSelectDropdown}from"./create.multi-select-dropdown.js";export{ImageWithFallback}from"./image-with-fallback.js";export{HelpTooltip,HelpTooltipWrap}from"./help-tooltip.js";export{HelpOutlinePulseIcon,RichTooltip}from"./rich-tooltip.js";export{default as TextEditorPreview}from"./text-editor.preview.js";export{default as TextEditor,textEditorClasses}from"./text-editor.js";
2
2
  //# sourceMappingURL=index.js.map
@@ -0,0 +1,2 @@
1
+ import{defineProperty as e,objectWithoutProperties as t,objectSpread2 as r,inherits as n,createClass as o,classCallCheck as i,callSuper as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as c}from"react/jsx-runtime";import{Component as p}from"react";import{styled as s,Stack as u,Tooltip as d,tooltipClasses as f,Typography as m,Divider as h,Box as v}from"@mui/material";import b from"@mui/icons-material/HelpOutline";var x=["className"],g=function(){function t(){var r;i(this,t);for(var n=arguments.length,o=new Array(n),p=0;p<n;p++)o[p]=arguments[p];return r=a(this,t,[].concat(o)),e(r,"renderTitlePanel",(function(){var e=r.props,t=e.panel,n=e.renderPanel;return n?n():t?c(w,{className:P.titlePanel,children:[r.renderTitle(null==t?void 0:t.title),l(h,{}),l(v,{className:P.content,children:r.renderContent(null==t?void 0:t.content)})]}):l(m,{variant:"body2",children:"Please provide a panel configuration"})})),e(r,"renderTitle",(function(e){return e?"string"!=typeof e?e:l(m,{variant:"subtitle1",className:P.title,children:e}):null})),e(r,"renderContent",(function(e){return e?"string"!=typeof e?e:l(m,{variant:"body2",children:e}):null})),r}return n(t,p),o(t,[{key:"render",value:function(){var e=this.props,t=e.children,n=e.slots;return l(T,r(r({arrow:!0,placement:"bottom",title:this.renderTitlePanel(),className:P.root},null==n?void 0:n.tooltipProps),{},{children:l(u,{children:t})}))}}])}(),P={root:"RichTooltip-root",titlePanel:"RichTooltip-titlePanel",title:"RichTooltip-title",content:"RichTooltip-content"},y=function(e,t){return"".concat((null==t?void 0:t.prefix)||"",".").concat(P[e]).concat((null==t?void 0:t.suffix)||"")},w=s(u)((function(t){var r=t.theme;return e(e(e({},y("titlePanel",{prefix:"&"}),{gap:"6px"}),y("title"),{color:r.palette.primary.main,fontWeight:700,padding:r.spacing(1,1.5,0)}),y("content"),{padding:r.spacing(1,1.5,1.5),color:r.palette.text.primary})})),T=s((function(e){var n=e.className,o=t(e,x);return l(d,r(r({},o),{},{classes:{popper:n}}))}))((function(t){var r=t.theme;return e(e({},"& .".concat(f.tooltip),{backgroundColor:"#fff",color:"#3c3c3c",padding:0,minWidth:"360px",maxWidth:"450px",borderRadius:r.shape.borderRadius,boxShadow:"rgba(0, 0, 0, 0.08) 0px 6px 30px"}),"& .".concat(f.arrow),{color:"#fff"})})),R=s(b)((function(e){return{position:"relative",zIndex:1,color:e.theme.palette.primary.main,animation:"pulseGlow 1.5s infinite",borderRadius:"50%",cursor:"help","@keyframes pulseGlow":{"0%":{boxShadow:"0 0 0 0 rgba(33,150,243, 0.3)"},"70%":{boxShadow:"0 0 0 10px rgba(33,150,243, 0)"},"100%":{boxShadow:"0 0 0 0 rgba(33,150,243, 0)"}}}}));export{R as HelpOutlinePulseIcon,g as RichTooltip,g as default};
2
+ //# sourceMappingURL=rich-tooltip.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rich-tooltip.js","sources":["../../src/components/rich-tooltip.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { Box, Divider, Stack, Tooltip, Typography, styled, tooltipClasses } from '@mui/material'\r\nimport type { ReactNode } from 'react'\r\nimport type { TooltipProps } from '@mui/material'\r\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\r\n\r\nexport interface IRichTooltipPanelConfig {\r\n title: ReactNode\r\n content: ReactNode\r\n}\r\n\r\nexport interface IRichTooltipProps {\r\n panel?: IRichTooltipPanelConfig\r\n renderPanel?: () => ReactNode\r\n children: React.ReactNode\r\n slots?: {\r\n tooltipProps?: Partial<TooltipProps>\r\n }\r\n}\r\n\r\nexport class RichTooltip extends Component<IRichTooltipProps> {\r\n render() {\r\n const { children, slots } = this.props\r\n return (\r\n <TooltipStyled arrow placement='bottom' title={this.renderTitlePanel()} className={richTooltipClasses.root} {...slots?.tooltipProps}>\r\n <Stack>{children}</Stack>\r\n </TooltipStyled>\r\n )\r\n }\r\n\r\n renderTitlePanel = () => {\r\n const { panel: panel, renderPanel } = this.props\r\n if (renderPanel) return renderPanel()\r\n if (!panel) return <Typography variant='body2'>Please provide a panel configuration</Typography>\r\n return (\r\n <TooltipTitlePanelStyled className={richTooltipClasses.titlePanel}>\r\n {this.renderTitle(panel?.title)}\r\n <Divider />\r\n <Box className={richTooltipClasses.content}>{this.renderContent(panel?.content)}</Box>\r\n </TooltipTitlePanelStyled>\r\n )\r\n }\r\n\r\n renderTitle = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return (\r\n <Typography variant='subtitle1' className={richTooltipClasses.title}>\r\n {value}\r\n </Typography>\r\n )\r\n }\r\n\r\n renderContent = (value: ReactNode) => {\r\n if (!value) return null\r\n if (typeof value !== 'string') return value\r\n return <Typography variant='body2'>{value}</Typography>\r\n }\r\n}\r\n\r\nexport default RichTooltip\r\n\r\nconst richTooltipClasses = {\r\n root: 'RichTooltip-root',\r\n titlePanel: 'RichTooltip-titlePanel',\r\n title: 'RichTooltip-title',\r\n content: 'RichTooltip-content'\r\n}\r\n\r\nconst getRichTooltipClass = (key: keyof typeof richTooltipClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${richTooltipClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nconst TooltipTitlePanelStyled = styled(Stack)(({ theme }) => ({\r\n [getRichTooltipClass('titlePanel', { prefix: '&' })]: {\r\n gap: '6px'\r\n },\r\n [getRichTooltipClass('title')]: {\r\n color: theme.palette.primary.main,\r\n fontWeight: 700,\r\n padding: theme.spacing(1, 1.5, 0)\r\n },\r\n [getRichTooltipClass('content')]: {\r\n padding: theme.spacing(1, 1.5, 1.5),\r\n color: theme.palette.text.primary\r\n }\r\n}))\r\n\r\nconst TooltipStyled = styled(({ className, ...props }: TooltipProps) => <Tooltip {...props} classes={{ popper: className }} />)(({ theme }) => ({\r\n [`& .${tooltipClasses.tooltip}`]: {\r\n backgroundColor: '#fff',\r\n color: '#3c3c3c',\r\n padding: 0,\r\n minWidth: '360px',\r\n maxWidth: '450px',\r\n borderRadius: theme.shape.borderRadius,\r\n boxShadow: 'rgba(0, 0, 0, 0.08) 0px 6px 30px'\r\n },\r\n [`& .${tooltipClasses.arrow}`]: {\r\n color: '#fff'\r\n }\r\n}))\r\n\r\nexport const HelpOutlinePulseIcon = styled(HelpOutlineIcon)(({ theme }) => ({\r\n position: 'relative',\r\n zIndex: 1,\r\n color: theme.palette.primary.main,\r\n animation: 'pulseGlow 1.5s infinite',\r\n borderRadius: '50%',\r\n cursor: 'help',\r\n '@keyframes pulseGlow': {\r\n '0%': {\r\n boxShadow: '0 0 0 0 rgba(33,150,243, 0.3)'\r\n },\r\n '70%': {\r\n boxShadow: '0 0 0 10px rgba(33,150,243, 0)'\r\n },\r\n '100%': {\r\n boxShadow: '0 0 0 0 rgba(33,150,243, 0)'\r\n }\r\n }\r\n}))\r\n"],"names":["RichTooltip","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_this$props","props","panel","renderPanel","_jsxs","TooltipTitlePanelStyled","className","richTooltipClasses","titlePanel","renderTitle","title","_jsx","Divider","Box","content","children","renderContent","Typography","variant","value","_inherits","Component","_createClass","key","_this$props2","slots","TooltipStyled","_objectSpread","arrow","placement","renderTitlePanel","root","tooltipProps","Stack","getRichTooltipClass","options","prefix","suffix","styled","_ref","theme","gap","color","palette","primary","main","fontWeight","padding","spacing","text","_ref3","_objectWithoutProperties","_excluded","Tooltip","classes","popper","_ref4","tooltipClasses","tooltip","backgroundColor","minWidth","maxWidth","borderRadius","shape","boxShadow","HelpOutlinePulseIcon","HelpOutlineIcon","_ref6","position","zIndex","animation","cursor"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{objectSpread2 as e,objectWithoutProperties as o,slicedToArray as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,Fragment as l,jsxs as r}from"react/jsx-runtime";import t,{useRef as a,useState as d}from"react";import{styled as u,ToggleButtonGroup as s,Button as c,colors as f,Box as m,RadioGroup as v,FormGroup as p,ButtonGroup as h,IconButton as g,InputBase as b,InputAdornment as x,Typography as C,Tooltip as z,TextField as y,FormControlLabel as w,Checkbox as S,Radio as T,ToggleButton as R}from"@mui/material";import k from"@mui/icons-material/Close";import B from"@mui/icons-material/Shuffle";import P from"@mui/icons-material/ClearAll";import L from"@mui/icons-material/FilterList";import W from"@mui/icons-material/ArrowUpward";import D from"@mui/icons-material/ArrowDownward";import E from"@mui/icons-material/KeyboardReturn";import F from"@mui/icons-material/KeyboardArrowDown";import{mapDataViewContext as M}from"./context.js";import j from"../components/help-tooltip.js";import{createFilterStore as A}from"./filter-store.js";var N=["children"],I={asc:{title:"Ascending",icon:i(W,{fontSize:"small"})},desc:{title:"Descending",icon:i(D,{fontSize:"small"})}},_=function(e){return r(O,{size:"small",value:e.value||"and",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"and","aria-label":"and logic",children:"AND"}),i(R,{size:"small",value:"or","aria-label":"or logic",children:"OR"})]})},H=function(e){return r(O,{size:"small",value:e.value||"before",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"before","aria-label":"before date",children:"before"}),i(R,{size:"small",value:"after","aria-label":"after date",children:"after"})]})},K=function(e){return r(O,{size:"small",value:e.value||"between",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"between","aria-label":"between dates",children:"between"}),i(R,{size:"small",value:"not-between","aria-label":"not between dates",children:"not between"})]})},O=u(s)({"& .MuiToggleButton-root":{color:"#fff",borderColor:"rgba(255, 255, 255, 0.3)",fontSize:"0.65rem",fontWeight:600,lineHeight:1,minWidth:"40px",padding:"6px 8px","&.Mui-selected":{backgroundColor:"#1976d2",color:"#fff","&:hover":{backgroundColor:"#1565c0"}},"&:hover":{backgroundColor:"rgba(255, 255, 255, 0.08)"}}}),U=function(e){return i(fe,{children:e.items.map((function(e,o){return i(C,{component:"li",variant:"body2",children:e},o)}))})},Y=function(e){var o,n;return i(ce,{className:!0===e.disabledSize?"disabled-size":"",children:i(j,{small:!0,title:null!==(o=e.title)&&void 0!==o?o:"The search includes",children:e.renderContent?e.renderContent():i(U,{items:null!==(n=e.items)&&void 0!==n?n:[]})})})},$=t.forwardRef((function(o,n){return i(b,e(e({fullWidth:!0,autoComplete:"off",size:"small"},o),{},{inputRef:n}))})),q=function(o){return r(x,{position:"end",children:[o.keyword&&r(l,{children:[i(G,{size:"small",color:"primary",onClick:o.onEnterSearch,sx:{display:{xs:"none",md:"flex"}},children:r(C,{variant:"caption",children:["Type and hit ",i("b",{children:"Enter ⏎"})," to filter."]})}),i(z,{title:"Press Enter to filter",placement:"bottom",arrow:!0,children:i(g,{size:"small",color:"primary",sx:{display:{xs:"flex",md:"none"}},onClick:o.onEnterSearch,children:i(E,{fontSize:"small"})})})]}),o.keyword&&i(z,{title:"Press Esc to clear",placement:"bottom",arrow:!0,children:i(g,{size:"small",sx:{marginLeft:"8px",color:"text.error","&:hover":{color:"error.main"}},onClick:o.onClear,children:i(k,{fontSize:"small"})})}),o.notes&&i(Y,e({},o.notes))]})},G=u(c)({padding:"4px 6px",textTransform:"none",lineHeight:1,".MuiTypography-root":{fontWeight:600,b:{fontWeight:700,backgroundColor:f.blue[100],borderRadius:"4px",padding:"2px 4px"}}}),J=t.forwardRef((function(n,l){var r=n.children,t=o(n,N);return i(Q,e(e({size:"small",color:"error",startIcon:i(P,{}),ref:l},t),{},{children:r||"Clear all"}))})),Q=u(c)({textTransform:"none",fontWeight:700}),V=t.forwardRef((function(o,n){return i(g,e(e({ref:n,size:"small",sx:{flex:"0 0 auto"}},o),{},{children:i(L,{})}))})),X=function(o){var n=a(null);return i(l,{children:M((function(l){var t,a,d,u,s,c,f,m,v,p=l.filterState,g=l.filterBarConfigs,b=p.sort?I[null===(t=p.sort)||void 0===t?void 0:t.direction]:{},x=null===(a=g.fields)||void 0===a?void 0:a[null===(d=p.sort)||void 0===d?void 0:d.field],C=(null==x?void 0:x.label)||(null===(u=p.sort)||void 0===u||null===(u=u.field)||void 0===u?void 0:u.toString())||(null===(s=g.sortButton)||void 0===s?void 0:s.text);return C?r(h,{"aria-label":"Button Sort",size:"small",children:[i(Z,e(e(e({size:"small",color:"inherit",startIcon:b.icon||i(B,{fontSize:"small"}),onClick:function(e){e.stopPropagation(),n.current&&clearTimeout(n.current),n.current=setTimeout((function(){return function(){var e,o;if(null!==(e=p.sort)&&void 0!==e&&e.field){var n=null===(o=p.sort)||void 0===o?void 0:o.direction,i=n&&"asc"===n?"desc":"asc",r={field:p.sort.field,direction:i},t=A(p).changeSort(r,{area:"sortButton"});l.onFilterStateChange(t.build())}}()}),500)}},null===(v=g.sortButton)||void 0===v?void 0:v.wrapProps),o),{},{children:C})),i(Z,{size:"small",color:"inherit",sx:{p:0},onClick:function(e){return l.onPopperPanelChange(e.currentTarget,"sortButton")},children:i(F,{fontSize:"small"})})]}):i(Z,e(e(e({size:"small",color:"inherit",startIcon:b.icon||i(B,{fontSize:"small"}),endIcon:null!==(c=null===(f=g.sortButton)||void 0===f?void 0:f.icon)&&void 0!==c?c:i(F,{fontSize:"small"}),onClick:function(e){return l.onPopperPanelChange(e.currentTarget,"sortButton")}},null===(m=g.sortButton)||void 0===m?void 0:m.wrapProps),o),{},{children:C||"Sort"}))}))})},Z=u(c)({height:"var(--filter-bar-height, 40px)",padding:"0 16px",backgroundColor:f.grey[50],border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))",textTransform:"none",fontWeight:600,":hover":{backgroundColor:f.grey[100]}}),ee=function(e){var o=e.area;return i(m,{sx:{padding:"8px",textAlign:"center",border:"1px solid #ddd",borderRadius:"4px"},children:r(C,{variant:"body2",sx:{padding:"8px"},children:["No panel available for area: ",o]})})},oe=function(o){var n=o.label,l=o.notes,t=o.children,a=o.afterTopBar;return r(ne,{children:[r(m,{className:"top-bar",children:[i(C,{variant:"subtitle2",children:n}),a&&i(m,{className:"after-top-bar",children:a}),l&&i(Y,e({title:"The ".concat(n," includes"),disabledSize:!0},l))]}),i(m,{className:"content",children:t})]})},ne=u(m)({minWidth:"200px",borderRadius:"4px",overflow:"hidden",".top-bar":{display:"flex",alignItems:"center",background:f.grey[900],padding:"8px",gap:"8px",".MuiTypography-root":{color:f.common.white,flex:1}},".after-top-bar":{marginLeft:"8px"},".content":{padding:"8px"}}),ie=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(oe,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(y,{autoFocus:!0,name:e.name,size:"small",fullWidth:!0,error:!(null===(r=e.validationResult)||void 0===r||!r.hasError),helperText:null===(t=e.validationResult)||void 0===t?void 0:t.message})})},le=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(oe,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(re,{name:e.name,className:null!==(r=e.validationResult)&&void 0!==r&&r.hasError?"error":"",onChange:e.onChange,children:null===(t=e.fieldConfig)||void 0===t?void 0:t.options.map((function(e,o){var n;return i(w,{value:e.value,control:i(T,{}),label:null!==(n=e.label)&&void 0!==n?n:e.value},e.value.toString()+o)}))})})},re=u(v)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}),te=function(e){var o,l,t,a,u,s=d("and"),c=n(s,2),f=c[0],m=c[1],v=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(oe,{label:v,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(_,{value:f,onChange:function(e,o){return m(o)}}),children:[i("input",{type:"hidden",name:"filterLogic",value:f}),i(ae,{className:null!==(a=e.validationResult)&&void 0!==a&&a.hasError?"error":"",children:null===(u=e.fieldConfig)||void 0===u?void 0:u.options.map((function(o,n){var l;return i(w,{value:o.value,control:i(S,{name:e.name}),label:null!==(l=o.label)&&void 0!==l?l:o.value,onChange:e.onChange},o.value.toString()+n)}))})]})},ae=u(p)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiCheckbox-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}});var de=function(e){var o,l,t,a,u,s,c,f,v=d("before"),p=n(v,2),h=p[0],g=p[1],b=d(""),x=n(b,2),C=x[0],z=x[1],w=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return i(oe,{label:w,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(H,{value:h,onChange:function(e,o){return g(o)}}),children:r(m,{className:"content",children:[i("input",{type:"hidden",name:"dateLogic",value:h}),i("input",{hidden:!0,type:"text",name:e.name,readOnly:!0,value:(f=C,f&&/^\d{4}-\d{2}-\d{2}$/.test(f)?"".concat(f,"T00:00:00.0000000"):"")}),i(y,{autoFocus:!0,fullWidth:!0,type:"date",size:"small",value:C,onChange:function(e){return z(e.target.value)},error:!(null===(a=e.validationResult)||void 0===a||!a.hasError),helperText:null===(u=e.validationResult)||void 0===u?void 0:u.message,inputProps:{min:null===(s=e.fieldConfig)||void 0===s?void 0:s.minDate,max:null===(c=e.fieldConfig)||void 0===c?void 0:c.maxDate}})]})})},ue=function(e){var o,l,t,a,u,s,c,f,m,v,p=d("between"),h=n(p,2),g=h[0],b=h[1],x=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(oe,{label:x,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(K,{value:g,onChange:function(e,o){return b(o)}}),children:[i("input",{type:"hidden",name:"dateRangeLogic",value:g}),r(se,{children:[i(y,{autoFocus:!0,fullWidth:!0,name:"".concat(e.name,"_start"),type:"date",size:"small",label:"From",error:!(null===(a=e.validationResult)||void 0===a||!a.hasError),sx:{marginBottom:1},InputLabelProps:{shrink:!0},inputProps:{min:null===(u=e.fieldConfig)||void 0===u?void 0:u.minDate,max:null===(s=e.fieldConfig)||void 0===s?void 0:s.maxDate}}),i(y,{fullWidth:!0,name:"".concat(e.name,"_end"),type:"date",size:"small",label:"To",error:!(null===(c=e.validationResult)||void 0===c||!c.hasError),helperText:null===(f=e.validationResult)||void 0===f?void 0:f.message,InputLabelProps:{shrink:!0},inputProps:{min:null===(m=e.fieldConfig)||void 0===m?void 0:m.minDate,max:null===(v=e.fieldConfig)||void 0===v?void 0:v.maxDate}})]})]})},se=u(m)({display:"flex",flexDirection:"column",gap:"8px"}),ce=u(m)({display:"inline-flex",flex:"0 0 auto",justifyContent:"center",alignItems:"center","&:not(.disabled-size)":{width:"40px",height:"40px"}}),fe=u("ul")({paddingLeft:"1.7rem",marginBottom:0,li:{position:"relative",textAlign:"justify","&::before":{content:'"►"',display:"block",position:"absolute",top:"50%",right:"calc(100% + 6px)",transform:"translateY(-50%)",fontSize:"0.9em"}}});export{J as ClearAllButton,H as DateLogicToggle,K as DateRangeLogicToggle,V as FilterButton,$ as FilterInput,q as FilterInputAdornment,_ as FilterLogicToggle,Y as FilterNotes,de as MenuWithTypeDate,ue as MenuWithTypeDateRange,le as MenuWithTypeSelect,te as MenuWithTypeSelectMulti,ie as MenuWithTypeString,ee as PanelNotFound,X as SortButton,I as mapSortConfigs};
1
+ import{objectSpread2 as e,objectWithoutProperties as o,slicedToArray as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,Fragment as l,jsxs as r}from"react/jsx-runtime";import t,{useRef as a,useState as d}from"react";import{styled as u,ToggleButtonGroup as s,Button as c,colors as f,Box as m,RadioGroup as v,FormGroup as p,ButtonGroup as h,IconButton as g,InputBase as b,InputAdornment as x,Typography as C,Tooltip as z,TextField as y,FormControlLabel as w,Checkbox as S,Radio as T,ToggleButton as R}from"@mui/material";import k from"@mui/icons-material/Close";import B from"@mui/icons-material/Shuffle";import P from"@mui/icons-material/ClearAll";import L from"@mui/icons-material/FilterList";import W from"@mui/icons-material/ArrowUpward";import D from"@mui/icons-material/ArrowDownward";import E from"@mui/icons-material/KeyboardReturn";import F from"@mui/icons-material/KeyboardArrowDown";import{mapDataViewContext as M}from"./context.js";import{HelpTooltip as j}from"../components/help-tooltip.js";import{createFilterStore as A}from"./filter-store.js";var N=["children"],I={asc:{title:"Ascending",icon:i(W,{fontSize:"small"})},desc:{title:"Descending",icon:i(D,{fontSize:"small"})}},_=function(e){return r(O,{size:"small",value:e.value||"and",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"and","aria-label":"and logic",children:"AND"}),i(R,{size:"small",value:"or","aria-label":"or logic",children:"OR"})]})},H=function(e){return r(O,{size:"small",value:e.value||"before",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"before","aria-label":"before date",children:"before"}),i(R,{size:"small",value:"after","aria-label":"after date",children:"after"})]})},K=function(e){return r(O,{size:"small",value:e.value||"between",exclusive:!0,onChange:function(o,n){n&&e.onChange&&e.onChange(o,n)},children:[i(R,{size:"small",value:"between","aria-label":"between dates",children:"between"}),i(R,{size:"small",value:"not-between","aria-label":"not between dates",children:"not between"})]})},O=u(s)({"& .MuiToggleButton-root":{color:"#fff",borderColor:"rgba(255, 255, 255, 0.3)",fontSize:"0.65rem",fontWeight:600,lineHeight:1,minWidth:"40px",padding:"6px 8px","&.Mui-selected":{backgroundColor:"#1976d2",color:"#fff","&:hover":{backgroundColor:"#1565c0"}},"&:hover":{backgroundColor:"rgba(255, 255, 255, 0.08)"}}}),U=function(e){return i(fe,{children:e.items.map((function(e,o){return i(C,{component:"li",variant:"body2",children:e},o)}))})},Y=function(e){var o,n;return i(ce,{className:!0===e.disabledSize?"disabled-size":"",children:i(j,{small:!0,title:null!==(o=e.title)&&void 0!==o?o:"The search includes",children:e.renderContent?e.renderContent():i(U,{items:null!==(n=e.items)&&void 0!==n?n:[]})})})},$=t.forwardRef((function(o,n){return i(b,e(e({fullWidth:!0,autoComplete:"off",size:"small"},o),{},{inputRef:n}))})),q=function(o){return r(x,{position:"end",children:[o.keyword&&r(l,{children:[i(G,{size:"small",color:"primary",onClick:o.onEnterSearch,sx:{display:{xs:"none",md:"flex"}},children:r(C,{variant:"caption",children:["Type and hit ",i("b",{children:"Enter ⏎"})," to filter."]})}),i(z,{title:"Press Enter to filter",placement:"bottom",arrow:!0,children:i(g,{size:"small",color:"primary",sx:{display:{xs:"flex",md:"none"}},onClick:o.onEnterSearch,children:i(E,{fontSize:"small"})})})]}),o.keyword&&i(z,{title:"Press Esc to clear",placement:"bottom",arrow:!0,children:i(g,{size:"small",sx:{marginLeft:"8px",color:"text.error","&:hover":{color:"error.main"}},onClick:o.onClear,children:i(k,{fontSize:"small"})})}),o.notes&&i(Y,e({},o.notes))]})},G=u(c)({padding:"4px 6px",textTransform:"none",lineHeight:1,".MuiTypography-root":{fontWeight:600,b:{fontWeight:700,backgroundColor:f.blue[100],borderRadius:"4px",padding:"2px 4px"}}}),J=t.forwardRef((function(n,l){var r=n.children,t=o(n,N);return i(Q,e(e({size:"small",color:"error",startIcon:i(P,{}),ref:l},t),{},{children:r||"Clear all"}))})),Q=u(c)({textTransform:"none",fontWeight:700}),V=t.forwardRef((function(o,n){return i(g,e(e({ref:n,size:"small",sx:{flex:"0 0 auto"}},o),{},{children:i(L,{})}))})),X=function(o){var n=a(null);return i(l,{children:M((function(l){var t,a,d,u,s,c,f,m,v,p=l.filterState,g=l.filterBarConfigs,b=p.sort?I[null===(t=p.sort)||void 0===t?void 0:t.direction]:{},x=null===(a=g.fields)||void 0===a?void 0:a[null===(d=p.sort)||void 0===d?void 0:d.field],C=(null==x?void 0:x.label)||(null===(u=p.sort)||void 0===u||null===(u=u.field)||void 0===u?void 0:u.toString())||(null===(s=g.sortButton)||void 0===s?void 0:s.text);return C?r(h,{"aria-label":"Button Sort",size:"small",children:[i(Z,e(e(e({size:"small",color:"inherit",startIcon:b.icon||i(B,{fontSize:"small"}),onClick:function(e){e.stopPropagation(),n.current&&clearTimeout(n.current),n.current=setTimeout((function(){return function(){var e,o;if(null!==(e=p.sort)&&void 0!==e&&e.field){var n=null===(o=p.sort)||void 0===o?void 0:o.direction,i=n&&"asc"===n?"desc":"asc",r={field:p.sort.field,direction:i},t=A(p).changeSort(r,{area:"sortButton"});l.onFilterStateChange(t.build())}}()}),500)}},null===(v=g.sortButton)||void 0===v?void 0:v.wrapProps),o),{},{children:C})),i(Z,{size:"small",color:"inherit",sx:{p:0},onClick:function(e){return l.onPopperPanelChange(e.currentTarget,"sortButton")},children:i(F,{fontSize:"small"})})]}):i(Z,e(e(e({size:"small",color:"inherit",startIcon:b.icon||i(B,{fontSize:"small"}),endIcon:null!==(c=null===(f=g.sortButton)||void 0===f?void 0:f.icon)&&void 0!==c?c:i(F,{fontSize:"small"}),onClick:function(e){return l.onPopperPanelChange(e.currentTarget,"sortButton")}},null===(m=g.sortButton)||void 0===m?void 0:m.wrapProps),o),{},{children:C||"Sort"}))}))})},Z=u(c)({height:"var(--filter-bar-height, 40px)",padding:"0 16px",backgroundColor:f.grey[50],border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))",textTransform:"none",fontWeight:600,":hover":{backgroundColor:f.grey[100]}}),ee=function(e){var o=e.area;return i(m,{sx:{padding:"8px",textAlign:"center",border:"1px solid #ddd",borderRadius:"4px"},children:r(C,{variant:"body2",sx:{padding:"8px"},children:["No panel available for area: ",o]})})},oe=function(o){var n=o.label,l=o.notes,t=o.children,a=o.afterTopBar;return r(ne,{children:[r(m,{className:"top-bar",children:[i(C,{variant:"subtitle2",children:n}),a&&i(m,{className:"after-top-bar",children:a}),l&&i(Y,e({title:"The ".concat(n," includes"),disabledSize:!0},l))]}),i(m,{className:"content",children:t})]})},ne=u(m)({minWidth:"200px",borderRadius:"4px",overflow:"hidden",".top-bar":{display:"flex",alignItems:"center",background:f.grey[900],padding:"8px",gap:"8px",".MuiTypography-root":{color:f.common.white,flex:1}},".after-top-bar":{marginLeft:"8px"},".content":{padding:"8px"}}),ie=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(oe,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(y,{autoFocus:!0,name:e.name,size:"small",fullWidth:!0,error:!(null===(r=e.validationResult)||void 0===r||!r.hasError),helperText:null===(t=e.validationResult)||void 0===t?void 0:t.message})})},le=function(e){var o,n,l,r,t,a=null!==(o=null===(n=e.fieldConfig)||void 0===n?void 0:n.label)&&void 0!==o?o:e.name;return i(oe,{label:a,notes:null===(l=e.fieldConfig)||void 0===l?void 0:l.notes,children:i(re,{name:e.name,className:null!==(r=e.validationResult)&&void 0!==r&&r.hasError?"error":"",onChange:e.onChange,children:null===(t=e.fieldConfig)||void 0===t?void 0:t.options.map((function(e,o){var n;return i(w,{value:e.value,control:i(T,{}),label:null!==(n=e.label)&&void 0!==n?n:e.value},e.value.toString()+o)}))})})},re=u(v)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiRadio-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}}),te=function(e){var o,l,t,a,u,s=d("and"),c=n(s,2),f=c[0],m=c[1],v=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(oe,{label:v,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(_,{value:f,onChange:function(e,o){return m(o)}}),children:[i("input",{type:"hidden",name:"filterLogic",value:f}),i(ae,{className:null!==(a=e.validationResult)&&void 0!==a&&a.hasError?"error":"",children:null===(u=e.fieldConfig)||void 0===u?void 0:u.options.map((function(o,n){var l;return i(w,{value:o.value,control:i(S,{name:e.name}),label:null!==(l=o.label)&&void 0!==l?l:o.value,onChange:e.onChange},o.value.toString()+n)}))})]})},ae=u(p)({marginLeft:"-8px",marginRight:"-8px","&.error .MuiCheckbox-root":{color:"#d32f2f"},".MuiFormControlLabel-root":{margin:0},".MuiFormControlLabel-root:hover":{backgroundColor:"rgba(25, 118, 210, 0.04)"}});var de=function(e){var o,l,t,a,u,s,c,f,v=d("before"),p=n(v,2),h=p[0],g=p[1],b=d(""),x=n(b,2),C=x[0],z=x[1],w=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return i(oe,{label:w,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(H,{value:h,onChange:function(e,o){return g(o)}}),children:r(m,{className:"content",children:[i("input",{type:"hidden",name:"dateLogic",value:h}),i("input",{hidden:!0,type:"text",name:e.name,readOnly:!0,value:(f=C,f&&/^\d{4}-\d{2}-\d{2}$/.test(f)?"".concat(f,"T00:00:00.0000000"):"")}),i(y,{autoFocus:!0,fullWidth:!0,type:"date",size:"small",value:C,onChange:function(e){return z(e.target.value)},error:!(null===(a=e.validationResult)||void 0===a||!a.hasError),helperText:null===(u=e.validationResult)||void 0===u?void 0:u.message,inputProps:{min:null===(s=e.fieldConfig)||void 0===s?void 0:s.minDate,max:null===(c=e.fieldConfig)||void 0===c?void 0:c.maxDate}})]})})},ue=function(e){var o,l,t,a,u,s,c,f,m,v,p=d("between"),h=n(p,2),g=h[0],b=h[1],x=null!==(o=null===(l=e.fieldConfig)||void 0===l?void 0:l.label)&&void 0!==o?o:e.name;return r(oe,{label:x,notes:null===(t=e.fieldConfig)||void 0===t?void 0:t.notes,afterTopBar:i(K,{value:g,onChange:function(e,o){return b(o)}}),children:[i("input",{type:"hidden",name:"dateRangeLogic",value:g}),r(se,{children:[i(y,{autoFocus:!0,fullWidth:!0,name:"".concat(e.name,"_start"),type:"date",size:"small",label:"From",error:!(null===(a=e.validationResult)||void 0===a||!a.hasError),sx:{marginBottom:1},InputLabelProps:{shrink:!0},inputProps:{min:null===(u=e.fieldConfig)||void 0===u?void 0:u.minDate,max:null===(s=e.fieldConfig)||void 0===s?void 0:s.maxDate}}),i(y,{fullWidth:!0,name:"".concat(e.name,"_end"),type:"date",size:"small",label:"To",error:!(null===(c=e.validationResult)||void 0===c||!c.hasError),helperText:null===(f=e.validationResult)||void 0===f?void 0:f.message,InputLabelProps:{shrink:!0},inputProps:{min:null===(m=e.fieldConfig)||void 0===m?void 0:m.minDate,max:null===(v=e.fieldConfig)||void 0===v?void 0:v.maxDate}})]})]})},se=u(m)({display:"flex",flexDirection:"column",gap:"8px"}),ce=u(m)({display:"inline-flex",flex:"0 0 auto",justifyContent:"center",alignItems:"center","&:not(.disabled-size)":{width:"40px",height:"40px"}}),fe=u("ul")({paddingLeft:"1.7rem",marginBottom:0,li:{position:"relative",textAlign:"justify","&::before":{content:'"►"',display:"block",position:"absolute",top:"50%",right:"calc(100% + 6px)",transform:"translateY(-50%)",fontSize:"0.9em"}}});export{J as ClearAllButton,H as DateLogicToggle,K as DateRangeLogicToggle,V as FilterButton,$ as FilterInput,q as FilterInputAdornment,_ as FilterLogicToggle,Y as FilterNotes,de as MenuWithTypeDate,ue as MenuWithTypeDateRange,le as MenuWithTypeSelect,te as MenuWithTypeSelectMulti,ie as MenuWithTypeString,ee as PanelNotFound,X as SortButton,I as mapSortConfigs};
2
2
  //# sourceMappingURL=ui.units.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ui.units.js","sources":["../../src/data-view/ui.units.tsx"],"sourcesContent":["import React, { FC, ReactNode, useRef, useState } from 'react'\r\nimport { Box, Button, ButtonGroup, ButtonProps, Fade, IconButton, InputBaseProps, Typography } from '@mui/material'\r\nimport { FormControlLabel, FormGroup, Radio, RadioGroup, TextField, colors, styled } from '@mui/material'\r\nimport { ToggleButton, Tooltip, ToggleButtonGroup, Checkbox, IconButtonProps, InputAdornment, InputBase } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport ShuffleIcon from '@mui/icons-material/Shuffle'\r\nimport ClearAllIcon from '@mui/icons-material/ClearAll'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport KeyboardReturnIcon from '@mui/icons-material/KeyboardReturn'\r\nimport KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'\r\nimport { mapDataViewContext } from './context'\r\nimport { IFilterLogic, IFilterDateLogic, IFilterDateRangeLogic, IFilterSelectDef, IValidationResult, IFilterDateDef, IFilterBasicDef } from './types'\r\nimport HelpTooltip from '../components/help-tooltip'\r\nimport { createFilterStore } from './filter-store'\r\n\r\nexport const mapSortConfigs: Record<'asc' | 'desc', { title: string; icon: ReactNode }> = {\r\n asc: { title: 'Ascending', icon: <ArrowUpwardIcon fontSize='small' /> },\r\n desc: { title: 'Descending', icon: <ArrowDownwardIcon fontSize='small' /> }\r\n}\r\n\r\n//#region Toggle Components\r\nexport interface IFilterLogicToggleProps {\r\n value?: IFilterLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: IFilterLogic) => void\r\n}\r\n\r\nexport const FilterLogicToggle: FC<IFilterLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as IFilterLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'and'} exclusive onChange={handleChange}>\r\n <ToggleButton size='small' value='and' aria-label='and logic'>\r\n AND\r\n </ToggleButton>\r\n <ToggleButton size='small' value='or' aria-label='or logic'>\r\n OR\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nexport interface IDateLogicToggleProps {\r\n value?: IFilterDateLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: IFilterDateLogic) => void\r\n}\r\n\r\nexport const DateLogicToggle: FC<IDateLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as IFilterDateLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'before'} exclusive onChange={handleChange}>\r\n <ToggleButton size='small' value='before' aria-label='before date'>\r\n before\r\n </ToggleButton>\r\n <ToggleButton size='small' value='after' aria-label='after date'>\r\n after\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nexport interface IDateRangeLogicToggleProps {\r\n value?: IFilterDateRangeLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: IFilterDateRangeLogic) => void\r\n}\r\n\r\nexport const DateRangeLogicToggle: FC<IDateRangeLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as IFilterDateRangeLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'between'} exclusive onChange={handleChange}>\r\n <ToggleButton size='small' value='between' aria-label='between dates'>\r\n between\r\n </ToggleButton>\r\n <ToggleButton size='small' value='not-between' aria-label='not between dates'>\r\n not between\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nconst ToggleButtonGroupCustom = styled(ToggleButtonGroup)({\r\n '& .MuiToggleButton-root': {\r\n color: '#fff',\r\n borderColor: 'rgba(255, 255, 255, 0.3)',\r\n fontSize: '0.65rem',\r\n fontWeight: 600,\r\n lineHeight: 1,\r\n minWidth: '40px',\r\n padding: '6px 8px',\r\n '&.Mui-selected': {\r\n backgroundColor: '#1976d2',\r\n color: '#fff',\r\n '&:hover': {\r\n backgroundColor: '#1565c0'\r\n }\r\n },\r\n '&:hover': {\r\n backgroundColor: 'rgba(255, 255, 255, 0.08)'\r\n }\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Notes\r\nexport interface IFilterNotesProps {\r\n title?: string\r\n items?: string[]\r\n disabledSize?: boolean\r\n renderContent?: () => ReactNode\r\n}\r\n\r\nconst HelpTooltipContent: FC<{ items: string[] }> = (props) => (\r\n <WrapList>\r\n {props.items.map((item, index) => (\r\n <Typography key={index} component='li' variant='body2'>\r\n {item}\r\n </Typography>\r\n ))}\r\n </WrapList>\r\n)\r\n\r\nexport const FilterNotes: FC<IFilterNotesProps> = (props) => (\r\n <WrapIcon className={props.disabledSize === true ? 'disabled-size' : ''}>\r\n <HelpTooltip small title={props.title ?? 'The search includes'}>\r\n {props.renderContent ? props.renderContent() : <HelpTooltipContent items={props.items ?? []} />}\r\n </HelpTooltip>\r\n </WrapIcon>\r\n)\r\n//#endregion\r\n\r\n//#region Input\r\nexport const FilterInput = React.forwardRef<HTMLInputElement, InputBaseProps>((props, ref) => {\r\n return <InputBase fullWidth autoComplete='off' size='small' {...props} inputRef={ref} />\r\n})\r\n\r\ninterface IFilterInputAdornmentProps {\r\n notes?: IFilterNotesProps\r\n keyword?: string\r\n onClear: IconButtonProps['onClick']\r\n onEnterSearch: ButtonProps['onClick']\r\n}\r\n\r\nexport const FilterInputAdornment: FC<IFilterInputAdornmentProps> = (props) => (\r\n <InputAdornment position='end'>\r\n {props.keyword && (\r\n <>\r\n <HelpButton size='small' color='primary' onClick={props.onEnterSearch} sx={{ display: { xs: 'none', md: 'flex' } }}>\r\n <Typography variant='caption'>\r\n Type and hit <b>Enter ⏎</b> to filter.\r\n </Typography>\r\n </HelpButton>\r\n <Tooltip title='Press Enter to filter' placement='bottom' arrow>\r\n <IconButton size='small' color='primary' sx={{ display: { xs: 'flex', md: 'none' } }} onClick={props.onEnterSearch}>\r\n <KeyboardReturnIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </>\r\n )}\r\n {props.keyword && (\r\n <Tooltip title='Press Esc to clear' placement='bottom' arrow>\r\n <IconButton size='small' sx={{ marginLeft: '8px', color: 'text.error', '&:hover': { color: 'error.main' } }} onClick={props.onClear}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n {props.notes && <FilterNotes {...props.notes} />}\r\n </InputAdornment>\r\n)\r\n\r\nconst HelpButton = styled(Button)({\r\n padding: '4px 6px',\r\n textTransform: 'none',\r\n lineHeight: 1,\r\n '.MuiTypography-root': {\r\n fontWeight: 600,\r\n b: {\r\n fontWeight: 700,\r\n backgroundColor: colors.blue[100],\r\n borderRadius: '4px',\r\n padding: '2px 4px'\r\n }\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Button\r\nexport interface IButtonClearProps {\r\n visibled?: boolean\r\n onClick: IconButtonProps['onClick']\r\n}\r\n\r\nexport const ButtonClear: FC<IButtonClearProps> = (props) => (\r\n <WrapIcon>\r\n <Tooltip title='Remove filter'>\r\n <Fade in={props.visibled} unmountOnExit>\r\n <IconButton size='small' onClick={props.onClick}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Fade>\r\n </Tooltip>\r\n </WrapIcon>\r\n)\r\n\r\nexport const ClearAllButton = React.forwardRef<HTMLButtonElement, ButtonProps>(({ children, ...props }, ref) => (\r\n <ClearButtonStyled size='small' color='error' startIcon={<ClearAllIcon />} ref={ref} {...props}>\r\n {children || 'Clear all'}\r\n </ClearButtonStyled>\r\n))\r\n\r\nconst ClearButtonStyled = styled(Button)({ textTransform: 'none', fontWeight: 700 })\r\n\r\nexport const FilterButton = React.forwardRef<HTMLButtonElement, IconButtonProps>((props, ref) => (\r\n <IconButton ref={ref} size='small' sx={{ flex: '0 0 auto' }} {...props}>\r\n <FilterListIcon />\r\n </IconButton>\r\n))\r\n\r\nexport const SortIconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>((props, ref) => (\r\n <IconButton ref={ref} size='small' sx={{ flex: '0 0 auto' }} {...props}>\r\n <ShuffleIcon />\r\n </IconButton>\r\n))\r\n\r\n//TODO - Add a button to toggle the visibility of the filter bar\r\nexport const SortButton: FC<ButtonProps> = (props) => {\r\n const timeoutRef = useRef<NodeJS.Timeout | null>(null)\r\n const debounceDelay = 500\r\n return (\r\n <>\r\n {mapDataViewContext((context) => {\r\n const { filterState, filterBarConfigs: configs } = context\r\n const config: Partial<{ title: string; icon: ReactNode }> = filterState.sort ? mapSortConfigs[filterState.sort?.direction] : {}\r\n const fieldConfig = configs.fields?.[filterState.sort?.field as any]\r\n const text = fieldConfig?.label || filterState.sort?.field?.toString() || configs.sortButton?.text\r\n // Debounce logic to prevent rapid/continuous calls\r\n const handleSortButtonClick = () => {\r\n if (!filterState.sort?.field) return\r\n const currentDirection = filterState.sort?.direction\r\n const newDirection: 'asc' | 'desc' = currentDirection ? (currentDirection === 'asc' ? 'desc' : 'asc') : 'asc'\r\n const newSort = { field: filterState.sort.field, direction: newDirection }\r\n const store = createFilterStore(filterState).changeSort(newSort, { area: 'sortButton' })\r\n context.onFilterStateChange(store.build())\r\n }\r\n\r\n const handlePopperPanelChange = (e: React.MouseEvent<HTMLButtonElement>) => {\r\n e.stopPropagation()\r\n timeoutRef.current && clearTimeout(timeoutRef.current)\r\n timeoutRef.current = setTimeout(() => handleSortButtonClick(), debounceDelay)\r\n }\r\n\r\n if (text) {\r\n return (\r\n <ButtonGroup aria-label='Button Sort' size='small'>\r\n <SortButtonStyled\r\n size='small'\r\n color='inherit'\r\n startIcon={config.icon || <ShuffleIcon fontSize='small' />}\r\n onClick={handlePopperPanelChange}\r\n {...configs.sortButton?.wrapProps}\r\n {...props}\r\n >\r\n {text}\r\n </SortButtonStyled>\r\n <SortButtonStyled\r\n size='small'\r\n color='inherit'\r\n sx={{ p: 0 }}\r\n onClick={(e) => context.onPopperPanelChange(e.currentTarget, 'sortButton')}\r\n >\r\n <KeyboardArrowDownIcon fontSize='small' />\r\n </SortButtonStyled>\r\n </ButtonGroup>\r\n )\r\n }\r\n\r\n return (\r\n <SortButtonStyled\r\n size='small'\r\n color='inherit'\r\n startIcon={config.icon || <ShuffleIcon fontSize='small' />}\r\n endIcon={configs.sortButton?.icon ?? <KeyboardArrowDownIcon fontSize='small' />}\r\n onClick={(e) => context.onPopperPanelChange(e.currentTarget, 'sortButton')}\r\n {...configs.sortButton?.wrapProps}\r\n {...props}\r\n >\r\n {text || 'Sort'}\r\n </SortButtonStyled>\r\n )\r\n })}\r\n </>\r\n )\r\n}\r\n\r\nconst SortButtonStyled = styled(Button)({\r\n height: 'var(--filter-bar-height, 40px)',\r\n padding: '0 16px',\r\n backgroundColor: colors.grey[50],\r\n border: '1px solid var(--color-divider, rgba(145 158 171 / 20%))',\r\n textTransform: 'none',\r\n fontWeight: 600,\r\n ':hover': {\r\n backgroundColor: colors.grey[100]\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Panel Not Found\r\nexport const PanelNotFound: FC<{ area?: string }> = ({ area }) => (\r\n <Box sx={{ padding: '8px', textAlign: 'center', border: '1px solid #ddd', borderRadius: '4px' }}>\r\n <Typography variant='body2' sx={{ padding: '8px' }}>\r\n No panel available for area: {area}\r\n </Typography>\r\n </Box>\r\n)\r\n//#endregion\r\n\r\n//#region Form\r\ninterface IFormContentProps {\r\n label: string\r\n notes?: any\r\n children?: React.ReactNode\r\n afterTopBar?: React.ReactNode\r\n}\r\n\r\nconst FormContent: FC<IFormContentProps> = ({ label, notes, children, afterTopBar }) => (\r\n <FormContentWrapper>\r\n <Box className='top-bar'>\r\n <Typography variant='subtitle2'>{label}</Typography>\r\n {afterTopBar && <Box className='after-top-bar'>{afterTopBar}</Box>}\r\n {notes && <FilterNotes title={`The ${label} includes`} disabledSize {...notes} />}\r\n </Box>\r\n <Box className='content'>{children}</Box>\r\n </FormContentWrapper>\r\n)\r\n\r\nconst FormContentWrapper = styled(Box)({\r\n minWidth: '200px',\r\n borderRadius: '4px',\r\n overflow: 'hidden',\r\n '.top-bar': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n background: colors.grey[900],\r\n padding: '8px',\r\n gap: '8px',\r\n '.MuiTypography-root': {\r\n color: colors.common.white,\r\n flex: 1\r\n }\r\n },\r\n '.after-top-bar': {\r\n marginLeft: '8px'\r\n },\r\n '.content': {\r\n padding: '8px'\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Menu - String Type\r\ninterface IMenuWithTypeBaseProps {\r\n name: string\r\n validationResult?: IValidationResult\r\n}\r\n\r\ninterface IMenuWithTypeStringProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterBasicDef\r\n}\r\n\r\nexport const MenuWithTypeString: FC<IMenuWithTypeStringProps> = (props) => {\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent label={label} notes={props.fieldConfig?.notes}>\r\n <TextField\r\n autoFocus\r\n name={props.name}\r\n size='small'\r\n fullWidth\r\n error={!!props.validationResult?.hasError}\r\n helperText={props.validationResult?.message}\r\n />\r\n </FormContent>\r\n )\r\n}\r\n//#endregion\r\n\r\n//#region Menu - Select Type\r\nexport interface IMenuWithTypeSelectProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterSelectDef\r\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void\r\n}\r\n\r\nexport const MenuWithTypeSelect: FC<IMenuWithTypeSelectProps> = (props) => {\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent label={label} notes={props.fieldConfig?.notes}>\r\n <CustomRadioGroup name={props.name} className={props.validationResult?.hasError ? 'error' : ''} onChange={props.onChange}>\r\n {props.fieldConfig?.options.map((x, i) => (\r\n <FormControlLabel key={x.value.toString() + i} value={x.value} control={<Radio />} label={x.label ?? x.value} />\r\n ))}\r\n </CustomRadioGroup>\r\n </FormContent>\r\n )\r\n}\r\n\r\nconst CustomRadioGroup = styled(RadioGroup)({\r\n marginLeft: '-8px',\r\n marginRight: '-8px',\r\n '&.error .MuiRadio-root': {\r\n color: '#d32f2f'\r\n },\r\n '.MuiFormControlLabel-root': {\r\n margin: 0\r\n },\r\n '.MuiFormControlLabel-root:hover': {\r\n backgroundColor: 'rgba(25, 118, 210, 0.04)'\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Menu - Select Multi Type\r\nexport interface IMenuWithTypeSelectMultiProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterSelectDef\r\n onChange?: (event: React.SyntheticEvent, checked: boolean) => void\r\n}\r\n\r\nexport const MenuWithTypeSelectMulti: FC<IMenuWithTypeSelectMultiProps> = (props) => {\r\n const [filterLogic, setFilterLogic] = useState<IFilterLogic>('and')\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent\r\n label={label}\r\n notes={props.fieldConfig?.notes}\r\n afterTopBar={<FilterLogicToggle value={filterLogic} onChange={(_, value) => setFilterLogic(value)} />}\r\n >\r\n {/* Hidden input for logic value */}\r\n <input type='hidden' name='filterLogic' value={filterLogic} />\r\n <CustomFormGroup className={props.validationResult?.hasError ? 'error' : ''}>\r\n {props.fieldConfig?.options.map((x, i) => (\r\n <FormControlLabel\r\n key={x.value.toString() + i}\r\n value={x.value}\r\n control={<Checkbox name={props.name} />}\r\n label={x.label ?? x.value}\r\n onChange={props.onChange}\r\n />\r\n ))}\r\n </CustomFormGroup>\r\n </FormContent>\r\n )\r\n}\r\n\r\nconst CustomFormGroup = styled(FormGroup)({\r\n marginLeft: '-8px',\r\n marginRight: '-8px',\r\n '&.error .MuiCheckbox-root': {\r\n color: '#d32f2f'\r\n },\r\n '.MuiFormControlLabel-root': {\r\n margin: 0\r\n },\r\n '.MuiFormControlLabel-root:hover': {\r\n backgroundColor: 'rgba(25, 118, 210, 0.04)'\r\n }\r\n})\r\n//#endregion\r\n\r\nfunction convertDateToCustomFormat(dateString: string): string {\r\n if (!dateString || !/^\\d{4}-\\d{2}-\\d{2}$/.test(dateString)) return ''\r\n return `${dateString}T00:00:00.0000000`\r\n}\r\n//#region Menu - Date Type\r\nexport interface IMenuWithTypeDateProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterDateDef\r\n}\r\n\r\nexport const MenuWithTypeDate: FC<IMenuWithTypeDateProps> = (props) => {\r\n const [dateLogic, setDateLogic] = useState<IFilterDateLogic>('before')\r\n const [value, setValue] = useState<string>('')\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent\r\n label={label}\r\n notes={props.fieldConfig?.notes}\r\n afterTopBar={<DateLogicToggle value={dateLogic} onChange={(_, value) => setDateLogic(value)} />}\r\n >\r\n <Box className='content'>\r\n {/* Hidden input for logic value */}\r\n <input type='hidden' name='dateLogic' value={dateLogic} />\r\n <input hidden type='text' name={props.name} readOnly value={convertDateToCustomFormat(value)} />\r\n <TextField\r\n autoFocus\r\n fullWidth\r\n type='date'\r\n size='small'\r\n value={value}\r\n onChange={(event) => setValue(event.target.value)}\r\n error={!!props.validationResult?.hasError}\r\n helperText={props.validationResult?.message}\r\n inputProps={{ min: props.fieldConfig?.minDate, max: props.fieldConfig?.maxDate }}\r\n />\r\n </Box>\r\n </FormContent>\r\n )\r\n}\r\n//#endregion\r\n\r\n//#region Menu - Date Range Type\r\nexport interface IMenuWithTypeDateRangeProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterDateDef\r\n}\r\n\r\nexport const MenuWithTypeDateRange: FC<IMenuWithTypeDateRangeProps> = (props) => {\r\n const [dateRangeLogic, setDateRangeLogic] = useState<IFilterDateRangeLogic>('between')\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent\r\n label={label}\r\n notes={props.fieldConfig?.notes}\r\n afterTopBar={<DateRangeLogicToggle value={dateRangeLogic} onChange={(_, value) => setDateRangeLogic(value)} />}\r\n >\r\n {/* Hidden input for logic value */}\r\n <input type='hidden' name='dateRangeLogic' value={dateRangeLogic} />\r\n <DateRangeContainer>\r\n <TextField\r\n autoFocus\r\n fullWidth\r\n name={`${props.name}_start`}\r\n type='date'\r\n size='small'\r\n label='From'\r\n error={!!props.validationResult?.hasError}\r\n sx={{ marginBottom: 1 }}\r\n InputLabelProps={{ shrink: true }}\r\n inputProps={{ min: props.fieldConfig?.minDate, max: props.fieldConfig?.maxDate }}\r\n />\r\n <TextField\r\n fullWidth\r\n name={`${props.name}_end`}\r\n type='date'\r\n size='small'\r\n label='To'\r\n error={!!props.validationResult?.hasError}\r\n helperText={props.validationResult?.message}\r\n InputLabelProps={{ shrink: true }}\r\n inputProps={{ min: props.fieldConfig?.minDate, max: props.fieldConfig?.maxDate }}\r\n />\r\n </DateRangeContainer>\r\n </FormContent>\r\n )\r\n}\r\n\r\nconst DateRangeContainer = styled(Box)({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '8px'\r\n})\r\n//#endregion\r\n\r\n//#region Styled\r\nconst WrapIcon = styled(Box)({\r\n display: 'inline-flex',\r\n flex: '0 0 auto',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n '&:not(.disabled-size)': {\r\n width: '40px',\r\n height: '40px'\r\n }\r\n})\r\n\r\nconst WrapList = styled('ul')({\r\n paddingLeft: '1.7rem',\r\n marginBottom: 0,\r\n li: {\r\n position: 'relative',\r\n textAlign: 'justify',\r\n '&::before': {\r\n content: '\"►\"',\r\n display: 'block',\r\n position: 'absolute',\r\n top: '50%',\r\n right: 'calc(100% + 6px)',\r\n transform: 'translateY(-50%)',\r\n fontSize: '0.9em'\r\n }\r\n }\r\n})\r\n//#endregion\r\n"],"names":["mapSortConfigs","asc","title","icon","_jsx","ArrowUpwardIcon","fontSize","desc","ArrowDownwardIcon","FilterLogicToggle","props","_jsxs","ToggleButtonGroupCustom","size","value","exclusive","onChange","event","newValue","children","ToggleButton","DateLogicToggle","DateRangeLogicToggle","styled","ToggleButtonGroup","color","borderColor","fontWeight","lineHeight","minWidth","padding","backgroundColor","HelpTooltipContent","WrapList","items","map","item","index","Typography","component","variant","FilterNotes","_props$title","_props$items","WrapIcon","className","disabledSize","HelpTooltip","small","renderContent","FilterInput","React","forwardRef","ref","InputBase","_objectSpread","fullWidth","autoComplete","inputRef","FilterInputAdornment","InputAdornment","position","keyword","_Fragment","HelpButton","onClick","onEnterSearch","sx","display","xs","md","Tooltip","placement","arrow","IconButton","KeyboardReturnIcon","marginLeft","onClear","CloseIcon","notes","Button","textTransform","b","colors","blue","borderRadius","ClearAllButton","_ref","_objectWithoutProperties","_excluded","ClearButtonStyled","startIcon","ClearAllIcon","FilterButton","flex","FilterListIcon","SortButton","timeoutRef","useRef","mapDataViewContext","context","_filterState$sort","_configs$fields","_filterState$sort2","_filterState$sort3","_configs$sortButton","_configs$sortButton$i","_configs$sortButton3","_configs$sortButton4","_configs$sortButton2","filterState","configs","filterBarConfigs","config","sort","direction","fieldConfig","fields","field","text","label","toString","sortButton","ButtonGroup","SortButtonStyled","ShuffleIcon","e","stopPropagation","current","clearTimeout","setTimeout","_filterState$sort4","_filterState$sort5","currentDirection","newDirection","newSort","store","createFilterStore","changeSort","area","onFilterStateChange","build","handleSortButtonClick","wrapProps","p","onPopperPanelChange","currentTarget","KeyboardArrowDownIcon","endIcon","height","grey","border","PanelNotFound","_ref2","Box","textAlign","FormContent","_ref3","afterTopBar","FormContentWrapper","concat","overflow","alignItems","background","gap","common","white","MenuWithTypeString","_props$fieldConfig$la","_props$fieldConfig","_props$fieldConfig2","_props$validationResu","_props$validationResu2","name","TextField","autoFocus","error","validationResult","hasError","helperText","message","MenuWithTypeSelect","_props$fieldConfig$la2","_props$fieldConfig3","_props$fieldConfig4","_props$validationResu3","_props$fieldConfig5","CustomRadioGroup","options","x","i","_x$label","FormControlLabel","control","Radio","RadioGroup","marginRight","margin","MenuWithTypeSelectMulti","_props$fieldConfig$la3","_props$fieldConfig6","_props$fieldConfig7","_props$validationResu4","_props$fieldConfig8","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","_","type","CustomFormGroup","_x$label2","Checkbox","FormGroup","MenuWithTypeDate","_props$fieldConfig$la4","_props$fieldConfig9","_props$fieldConfig0","_props$validationResu5","_props$validationResu6","_props$fieldConfig1","_props$fieldConfig10","dateString","_useState3","_useState4","dateLogic","setDateLogic","_useState5","_useState6","setValue","hidden","readOnly","test","target","inputProps","min","minDate","max","maxDate","MenuWithTypeDateRange","_props$fieldConfig$la5","_props$fieldConfig11","_props$fieldConfig12","_props$validationResu7","_props$fieldConfig13","_props$fieldConfig14","_props$validationResu8","_props$validationResu9","_props$fieldConfig15","_props$fieldConfig16","_useState7","_useState8","dateRangeLogic","setDateRangeLogic","DateRangeContainer","marginBottom","InputLabelProps","shrink","flexDirection","justifyContent","width","paddingLeft","li","content","top","right","transform"],"mappings":"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"}
1
+ {"version":3,"file":"ui.units.js","sources":["../../src/data-view/ui.units.tsx"],"sourcesContent":["import React, { FC, ReactNode, useRef, useState } from 'react'\r\nimport { Box, Button, ButtonGroup, ButtonProps, Fade, IconButton, InputBaseProps, Typography } from '@mui/material'\r\nimport { FormControlLabel, FormGroup, Radio, RadioGroup, TextField, colors, styled } from '@mui/material'\r\nimport { ToggleButton, Tooltip, ToggleButtonGroup, Checkbox, IconButtonProps, InputAdornment, InputBase } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport ShuffleIcon from '@mui/icons-material/Shuffle'\r\nimport ClearAllIcon from '@mui/icons-material/ClearAll'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ArrowUpwardIcon from '@mui/icons-material/ArrowUpward'\r\nimport ArrowDownwardIcon from '@mui/icons-material/ArrowDownward'\r\nimport KeyboardReturnIcon from '@mui/icons-material/KeyboardReturn'\r\nimport KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'\r\nimport { mapDataViewContext } from './context'\r\nimport { IFilterLogic, IFilterDateLogic, IFilterDateRangeLogic, IFilterSelectDef, IValidationResult, IFilterDateDef, IFilterBasicDef } from './types'\r\nimport HelpTooltip from '../components/help-tooltip'\r\nimport { createFilterStore } from './filter-store'\r\n\r\nexport const mapSortConfigs: Record<'asc' | 'desc', { title: string; icon: ReactNode }> = {\r\n asc: { title: 'Ascending', icon: <ArrowUpwardIcon fontSize='small' /> },\r\n desc: { title: 'Descending', icon: <ArrowDownwardIcon fontSize='small' /> }\r\n}\r\n\r\n//#region Toggle Components\r\nexport interface IFilterLogicToggleProps {\r\n value?: IFilterLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: IFilterLogic) => void\r\n}\r\n\r\nexport const FilterLogicToggle: FC<IFilterLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as IFilterLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'and'} exclusive onChange={handleChange}>\r\n <ToggleButton size='small' value='and' aria-label='and logic'>\r\n AND\r\n </ToggleButton>\r\n <ToggleButton size='small' value='or' aria-label='or logic'>\r\n OR\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nexport interface IDateLogicToggleProps {\r\n value?: IFilterDateLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: IFilterDateLogic) => void\r\n}\r\n\r\nexport const DateLogicToggle: FC<IDateLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as IFilterDateLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'before'} exclusive onChange={handleChange}>\r\n <ToggleButton size='small' value='before' aria-label='before date'>\r\n before\r\n </ToggleButton>\r\n <ToggleButton size='small' value='after' aria-label='after date'>\r\n after\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nexport interface IDateRangeLogicToggleProps {\r\n value?: IFilterDateRangeLogic\r\n onChange?: (event: React.MouseEvent<HTMLElement>, value: IFilterDateRangeLogic) => void\r\n}\r\n\r\nexport const DateRangeLogicToggle: FC<IDateRangeLogicToggleProps> = (props) => {\r\n const handleChange = (event: React.MouseEvent<HTMLElement>, newValue: string | null) => {\r\n if (newValue && props.onChange) {\r\n props.onChange(event, newValue as IFilterDateRangeLogic)\r\n }\r\n }\r\n\r\n return (\r\n <ToggleButtonGroupCustom size='small' value={props.value || 'between'} exclusive onChange={handleChange}>\r\n <ToggleButton size='small' value='between' aria-label='between dates'>\r\n between\r\n </ToggleButton>\r\n <ToggleButton size='small' value='not-between' aria-label='not between dates'>\r\n not between\r\n </ToggleButton>\r\n </ToggleButtonGroupCustom>\r\n )\r\n}\r\n\r\nconst ToggleButtonGroupCustom = styled(ToggleButtonGroup)({\r\n '& .MuiToggleButton-root': {\r\n color: '#fff',\r\n borderColor: 'rgba(255, 255, 255, 0.3)',\r\n fontSize: '0.65rem',\r\n fontWeight: 600,\r\n lineHeight: 1,\r\n minWidth: '40px',\r\n padding: '6px 8px',\r\n '&.Mui-selected': {\r\n backgroundColor: '#1976d2',\r\n color: '#fff',\r\n '&:hover': {\r\n backgroundColor: '#1565c0'\r\n }\r\n },\r\n '&:hover': {\r\n backgroundColor: 'rgba(255, 255, 255, 0.08)'\r\n }\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Notes\r\nexport interface IFilterNotesProps {\r\n title?: string\r\n items?: string[]\r\n disabledSize?: boolean\r\n renderContent?: () => ReactNode\r\n}\r\n\r\nconst HelpTooltipContent: FC<{ items: string[] }> = (props) => (\r\n <WrapList>\r\n {props.items.map((item, index) => (\r\n <Typography key={index} component='li' variant='body2'>\r\n {item}\r\n </Typography>\r\n ))}\r\n </WrapList>\r\n)\r\n\r\nexport const FilterNotes: FC<IFilterNotesProps> = (props) => (\r\n <WrapIcon className={props.disabledSize === true ? 'disabled-size' : ''}>\r\n <HelpTooltip small title={props.title ?? 'The search includes'}>\r\n {props.renderContent ? props.renderContent() : <HelpTooltipContent items={props.items ?? []} />}\r\n </HelpTooltip>\r\n </WrapIcon>\r\n)\r\n//#endregion\r\n\r\n//#region Input\r\nexport const FilterInput = React.forwardRef<HTMLInputElement, InputBaseProps>((props, ref) => {\r\n return <InputBase fullWidth autoComplete='off' size='small' {...props} inputRef={ref} />\r\n})\r\n\r\ninterface IFilterInputAdornmentProps {\r\n notes?: IFilterNotesProps\r\n keyword?: string\r\n onClear: IconButtonProps['onClick']\r\n onEnterSearch: ButtonProps['onClick']\r\n}\r\n\r\nexport const FilterInputAdornment: FC<IFilterInputAdornmentProps> = (props) => (\r\n <InputAdornment position='end'>\r\n {props.keyword && (\r\n <>\r\n <HelpButton size='small' color='primary' onClick={props.onEnterSearch} sx={{ display: { xs: 'none', md: 'flex' } }}>\r\n <Typography variant='caption'>\r\n Type and hit <b>Enter ⏎</b> to filter.\r\n </Typography>\r\n </HelpButton>\r\n <Tooltip title='Press Enter to filter' placement='bottom' arrow>\r\n <IconButton size='small' color='primary' sx={{ display: { xs: 'flex', md: 'none' } }} onClick={props.onEnterSearch}>\r\n <KeyboardReturnIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n </>\r\n )}\r\n {props.keyword && (\r\n <Tooltip title='Press Esc to clear' placement='bottom' arrow>\r\n <IconButton size='small' sx={{ marginLeft: '8px', color: 'text.error', '&:hover': { color: 'error.main' } }} onClick={props.onClear}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Tooltip>\r\n )}\r\n {props.notes && <FilterNotes {...props.notes} />}\r\n </InputAdornment>\r\n)\r\n\r\nconst HelpButton = styled(Button)({\r\n padding: '4px 6px',\r\n textTransform: 'none',\r\n lineHeight: 1,\r\n '.MuiTypography-root': {\r\n fontWeight: 600,\r\n b: {\r\n fontWeight: 700,\r\n backgroundColor: colors.blue[100],\r\n borderRadius: '4px',\r\n padding: '2px 4px'\r\n }\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Button\r\nexport interface IButtonClearProps {\r\n visibled?: boolean\r\n onClick: IconButtonProps['onClick']\r\n}\r\n\r\nexport const ButtonClear: FC<IButtonClearProps> = (props) => (\r\n <WrapIcon>\r\n <Tooltip title='Remove filter'>\r\n <Fade in={props.visibled} unmountOnExit>\r\n <IconButton size='small' onClick={props.onClick}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Fade>\r\n </Tooltip>\r\n </WrapIcon>\r\n)\r\n\r\nexport const ClearAllButton = React.forwardRef<HTMLButtonElement, ButtonProps>(({ children, ...props }, ref) => (\r\n <ClearButtonStyled size='small' color='error' startIcon={<ClearAllIcon />} ref={ref} {...props}>\r\n {children || 'Clear all'}\r\n </ClearButtonStyled>\r\n))\r\n\r\nconst ClearButtonStyled = styled(Button)({ textTransform: 'none', fontWeight: 700 })\r\n\r\nexport const FilterButton = React.forwardRef<HTMLButtonElement, IconButtonProps>((props, ref) => (\r\n <IconButton ref={ref} size='small' sx={{ flex: '0 0 auto' }} {...props}>\r\n <FilterListIcon />\r\n </IconButton>\r\n))\r\n\r\nexport const SortIconButton = React.forwardRef<HTMLButtonElement, IconButtonProps>((props, ref) => (\r\n <IconButton ref={ref} size='small' sx={{ flex: '0 0 auto' }} {...props}>\r\n <ShuffleIcon />\r\n </IconButton>\r\n))\r\n\r\n//TODO - Add a button to toggle the visibility of the filter bar\r\nexport const SortButton: FC<ButtonProps> = (props) => {\r\n const timeoutRef = useRef<NodeJS.Timeout | null>(null)\r\n const debounceDelay = 500\r\n return (\r\n <>\r\n {mapDataViewContext((context) => {\r\n const { filterState, filterBarConfigs: configs } = context\r\n const config: Partial<{ title: string; icon: ReactNode }> = filterState.sort ? mapSortConfigs[filterState.sort?.direction] : {}\r\n const fieldConfig = configs.fields?.[filterState.sort?.field as any]\r\n const text = fieldConfig?.label || filterState.sort?.field?.toString() || configs.sortButton?.text\r\n // Debounce logic to prevent rapid/continuous calls\r\n const handleSortButtonClick = () => {\r\n if (!filterState.sort?.field) return\r\n const currentDirection = filterState.sort?.direction\r\n const newDirection: 'asc' | 'desc' = currentDirection ? (currentDirection === 'asc' ? 'desc' : 'asc') : 'asc'\r\n const newSort = { field: filterState.sort.field, direction: newDirection }\r\n const store = createFilterStore(filterState).changeSort(newSort, { area: 'sortButton' })\r\n context.onFilterStateChange(store.build())\r\n }\r\n\r\n const handlePopperPanelChange = (e: React.MouseEvent<HTMLButtonElement>) => {\r\n e.stopPropagation()\r\n timeoutRef.current && clearTimeout(timeoutRef.current)\r\n timeoutRef.current = setTimeout(() => handleSortButtonClick(), debounceDelay)\r\n }\r\n\r\n if (text) {\r\n return (\r\n <ButtonGroup aria-label='Button Sort' size='small'>\r\n <SortButtonStyled\r\n size='small'\r\n color='inherit'\r\n startIcon={config.icon || <ShuffleIcon fontSize='small' />}\r\n onClick={handlePopperPanelChange}\r\n {...configs.sortButton?.wrapProps}\r\n {...props}\r\n >\r\n {text}\r\n </SortButtonStyled>\r\n <SortButtonStyled\r\n size='small'\r\n color='inherit'\r\n sx={{ p: 0 }}\r\n onClick={(e) => context.onPopperPanelChange(e.currentTarget, 'sortButton')}\r\n >\r\n <KeyboardArrowDownIcon fontSize='small' />\r\n </SortButtonStyled>\r\n </ButtonGroup>\r\n )\r\n }\r\n\r\n return (\r\n <SortButtonStyled\r\n size='small'\r\n color='inherit'\r\n startIcon={config.icon || <ShuffleIcon fontSize='small' />}\r\n endIcon={configs.sortButton?.icon ?? <KeyboardArrowDownIcon fontSize='small' />}\r\n onClick={(e) => context.onPopperPanelChange(e.currentTarget, 'sortButton')}\r\n {...configs.sortButton?.wrapProps}\r\n {...props}\r\n >\r\n {text || 'Sort'}\r\n </SortButtonStyled>\r\n )\r\n })}\r\n </>\r\n )\r\n}\r\n\r\nconst SortButtonStyled = styled(Button)({\r\n height: 'var(--filter-bar-height, 40px)',\r\n padding: '0 16px',\r\n backgroundColor: colors.grey[50],\r\n border: '1px solid var(--color-divider, rgba(145 158 171 / 20%))',\r\n textTransform: 'none',\r\n fontWeight: 600,\r\n ':hover': {\r\n backgroundColor: colors.grey[100]\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Panel Not Found\r\nexport const PanelNotFound: FC<{ area?: string }> = ({ area }) => (\r\n <Box sx={{ padding: '8px', textAlign: 'center', border: '1px solid #ddd', borderRadius: '4px' }}>\r\n <Typography variant='body2' sx={{ padding: '8px' }}>\r\n No panel available for area: {area}\r\n </Typography>\r\n </Box>\r\n)\r\n//#endregion\r\n\r\n//#region Form\r\ninterface IFormContentProps {\r\n label: string\r\n notes?: any\r\n children?: React.ReactNode\r\n afterTopBar?: React.ReactNode\r\n}\r\n\r\nconst FormContent: FC<IFormContentProps> = ({ label, notes, children, afterTopBar }) => (\r\n <FormContentWrapper>\r\n <Box className='top-bar'>\r\n <Typography variant='subtitle2'>{label}</Typography>\r\n {afterTopBar && <Box className='after-top-bar'>{afterTopBar}</Box>}\r\n {notes && <FilterNotes title={`The ${label} includes`} disabledSize {...notes} />}\r\n </Box>\r\n <Box className='content'>{children}</Box>\r\n </FormContentWrapper>\r\n)\r\n\r\nconst FormContentWrapper = styled(Box)({\r\n minWidth: '200px',\r\n borderRadius: '4px',\r\n overflow: 'hidden',\r\n '.top-bar': {\r\n display: 'flex',\r\n alignItems: 'center',\r\n background: colors.grey[900],\r\n padding: '8px',\r\n gap: '8px',\r\n '.MuiTypography-root': {\r\n color: colors.common.white,\r\n flex: 1\r\n }\r\n },\r\n '.after-top-bar': {\r\n marginLeft: '8px'\r\n },\r\n '.content': {\r\n padding: '8px'\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Menu - String Type\r\ninterface IMenuWithTypeBaseProps {\r\n name: string\r\n validationResult?: IValidationResult\r\n}\r\n\r\ninterface IMenuWithTypeStringProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterBasicDef\r\n}\r\n\r\nexport const MenuWithTypeString: FC<IMenuWithTypeStringProps> = (props) => {\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent label={label} notes={props.fieldConfig?.notes}>\r\n <TextField\r\n autoFocus\r\n name={props.name}\r\n size='small'\r\n fullWidth\r\n error={!!props.validationResult?.hasError}\r\n helperText={props.validationResult?.message}\r\n />\r\n </FormContent>\r\n )\r\n}\r\n//#endregion\r\n\r\n//#region Menu - Select Type\r\nexport interface IMenuWithTypeSelectProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterSelectDef\r\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void\r\n}\r\n\r\nexport const MenuWithTypeSelect: FC<IMenuWithTypeSelectProps> = (props) => {\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent label={label} notes={props.fieldConfig?.notes}>\r\n <CustomRadioGroup name={props.name} className={props.validationResult?.hasError ? 'error' : ''} onChange={props.onChange}>\r\n {props.fieldConfig?.options.map((x, i) => (\r\n <FormControlLabel key={x.value.toString() + i} value={x.value} control={<Radio />} label={x.label ?? x.value} />\r\n ))}\r\n </CustomRadioGroup>\r\n </FormContent>\r\n )\r\n}\r\n\r\nconst CustomRadioGroup = styled(RadioGroup)({\r\n marginLeft: '-8px',\r\n marginRight: '-8px',\r\n '&.error .MuiRadio-root': {\r\n color: '#d32f2f'\r\n },\r\n '.MuiFormControlLabel-root': {\r\n margin: 0\r\n },\r\n '.MuiFormControlLabel-root:hover': {\r\n backgroundColor: 'rgba(25, 118, 210, 0.04)'\r\n }\r\n})\r\n//#endregion\r\n\r\n//#region Menu - Select Multi Type\r\nexport interface IMenuWithTypeSelectMultiProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterSelectDef\r\n onChange?: (event: React.SyntheticEvent, checked: boolean) => void\r\n}\r\n\r\nexport const MenuWithTypeSelectMulti: FC<IMenuWithTypeSelectMultiProps> = (props) => {\r\n const [filterLogic, setFilterLogic] = useState<IFilterLogic>('and')\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent\r\n label={label}\r\n notes={props.fieldConfig?.notes}\r\n afterTopBar={<FilterLogicToggle value={filterLogic} onChange={(_, value) => setFilterLogic(value)} />}\r\n >\r\n {/* Hidden input for logic value */}\r\n <input type='hidden' name='filterLogic' value={filterLogic} />\r\n <CustomFormGroup className={props.validationResult?.hasError ? 'error' : ''}>\r\n {props.fieldConfig?.options.map((x, i) => (\r\n <FormControlLabel\r\n key={x.value.toString() + i}\r\n value={x.value}\r\n control={<Checkbox name={props.name} />}\r\n label={x.label ?? x.value}\r\n onChange={props.onChange}\r\n />\r\n ))}\r\n </CustomFormGroup>\r\n </FormContent>\r\n )\r\n}\r\n\r\nconst CustomFormGroup = styled(FormGroup)({\r\n marginLeft: '-8px',\r\n marginRight: '-8px',\r\n '&.error .MuiCheckbox-root': {\r\n color: '#d32f2f'\r\n },\r\n '.MuiFormControlLabel-root': {\r\n margin: 0\r\n },\r\n '.MuiFormControlLabel-root:hover': {\r\n backgroundColor: 'rgba(25, 118, 210, 0.04)'\r\n }\r\n})\r\n//#endregion\r\n\r\nfunction convertDateToCustomFormat(dateString: string): string {\r\n if (!dateString || !/^\\d{4}-\\d{2}-\\d{2}$/.test(dateString)) return ''\r\n return `${dateString}T00:00:00.0000000`\r\n}\r\n//#region Menu - Date Type\r\nexport interface IMenuWithTypeDateProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterDateDef\r\n}\r\n\r\nexport const MenuWithTypeDate: FC<IMenuWithTypeDateProps> = (props) => {\r\n const [dateLogic, setDateLogic] = useState<IFilterDateLogic>('before')\r\n const [value, setValue] = useState<string>('')\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent\r\n label={label}\r\n notes={props.fieldConfig?.notes}\r\n afterTopBar={<DateLogicToggle value={dateLogic} onChange={(_, value) => setDateLogic(value)} />}\r\n >\r\n <Box className='content'>\r\n {/* Hidden input for logic value */}\r\n <input type='hidden' name='dateLogic' value={dateLogic} />\r\n <input hidden type='text' name={props.name} readOnly value={convertDateToCustomFormat(value)} />\r\n <TextField\r\n autoFocus\r\n fullWidth\r\n type='date'\r\n size='small'\r\n value={value}\r\n onChange={(event) => setValue(event.target.value)}\r\n error={!!props.validationResult?.hasError}\r\n helperText={props.validationResult?.message}\r\n inputProps={{ min: props.fieldConfig?.minDate, max: props.fieldConfig?.maxDate }}\r\n />\r\n </Box>\r\n </FormContent>\r\n )\r\n}\r\n//#endregion\r\n\r\n//#region Menu - Date Range Type\r\nexport interface IMenuWithTypeDateRangeProps extends IMenuWithTypeBaseProps {\r\n fieldConfig?: IFilterDateDef\r\n}\r\n\r\nexport const MenuWithTypeDateRange: FC<IMenuWithTypeDateRangeProps> = (props) => {\r\n const [dateRangeLogic, setDateRangeLogic] = useState<IFilterDateRangeLogic>('between')\r\n const label = props.fieldConfig?.label ?? props.name\r\n return (\r\n <FormContent\r\n label={label}\r\n notes={props.fieldConfig?.notes}\r\n afterTopBar={<DateRangeLogicToggle value={dateRangeLogic} onChange={(_, value) => setDateRangeLogic(value)} />}\r\n >\r\n {/* Hidden input for logic value */}\r\n <input type='hidden' name='dateRangeLogic' value={dateRangeLogic} />\r\n <DateRangeContainer>\r\n <TextField\r\n autoFocus\r\n fullWidth\r\n name={`${props.name}_start`}\r\n type='date'\r\n size='small'\r\n label='From'\r\n error={!!props.validationResult?.hasError}\r\n sx={{ marginBottom: 1 }}\r\n InputLabelProps={{ shrink: true }}\r\n inputProps={{ min: props.fieldConfig?.minDate, max: props.fieldConfig?.maxDate }}\r\n />\r\n <TextField\r\n fullWidth\r\n name={`${props.name}_end`}\r\n type='date'\r\n size='small'\r\n label='To'\r\n error={!!props.validationResult?.hasError}\r\n helperText={props.validationResult?.message}\r\n InputLabelProps={{ shrink: true }}\r\n inputProps={{ min: props.fieldConfig?.minDate, max: props.fieldConfig?.maxDate }}\r\n />\r\n </DateRangeContainer>\r\n </FormContent>\r\n )\r\n}\r\n\r\nconst DateRangeContainer = styled(Box)({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n gap: '8px'\r\n})\r\n//#endregion\r\n\r\n//#region Styled\r\nconst WrapIcon = styled(Box)({\r\n display: 'inline-flex',\r\n flex: '0 0 auto',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n '&:not(.disabled-size)': {\r\n width: '40px',\r\n height: '40px'\r\n }\r\n})\r\n\r\nconst WrapList = styled('ul')({\r\n paddingLeft: '1.7rem',\r\n marginBottom: 0,\r\n li: {\r\n position: 'relative',\r\n textAlign: 'justify',\r\n '&::before': {\r\n content: '\"►\"',\r\n display: 'block',\r\n position: 'absolute',\r\n top: '50%',\r\n right: 'calc(100% + 6px)',\r\n transform: 'translateY(-50%)',\r\n fontSize: '0.9em'\r\n }\r\n }\r\n})\r\n//#endregion\r\n"],"names":["mapSortConfigs","asc","title","icon","_jsx","ArrowUpwardIcon","fontSize","desc","ArrowDownwardIcon","FilterLogicToggle","props","_jsxs","ToggleButtonGroupCustom","size","value","exclusive","onChange","event","newValue","children","ToggleButton","DateLogicToggle","DateRangeLogicToggle","styled","ToggleButtonGroup","color","borderColor","fontWeight","lineHeight","minWidth","padding","backgroundColor","HelpTooltipContent","WrapList","items","map","item","index","Typography","component","variant","FilterNotes","_props$title","_props$items","WrapIcon","className","disabledSize","HelpTooltip","small","renderContent","FilterInput","React","forwardRef","ref","InputBase","_objectSpread","fullWidth","autoComplete","inputRef","FilterInputAdornment","InputAdornment","position","keyword","_Fragment","HelpButton","onClick","onEnterSearch","sx","display","xs","md","Tooltip","placement","arrow","IconButton","KeyboardReturnIcon","marginLeft","onClear","CloseIcon","notes","Button","textTransform","b","colors","blue","borderRadius","ClearAllButton","_ref","_objectWithoutProperties","_excluded","ClearButtonStyled","startIcon","ClearAllIcon","FilterButton","flex","FilterListIcon","SortButton","timeoutRef","useRef","mapDataViewContext","context","_filterState$sort","_configs$fields","_filterState$sort2","_filterState$sort3","_configs$sortButton","_configs$sortButton$i","_configs$sortButton3","_configs$sortButton4","_configs$sortButton2","filterState","configs","filterBarConfigs","config","sort","direction","fieldConfig","fields","field","text","label","toString","sortButton","ButtonGroup","SortButtonStyled","ShuffleIcon","e","stopPropagation","current","clearTimeout","setTimeout","_filterState$sort4","_filterState$sort5","currentDirection","newDirection","newSort","store","createFilterStore","changeSort","area","onFilterStateChange","build","handleSortButtonClick","wrapProps","p","onPopperPanelChange","currentTarget","KeyboardArrowDownIcon","endIcon","height","grey","border","PanelNotFound","_ref2","Box","textAlign","FormContent","_ref3","afterTopBar","FormContentWrapper","concat","overflow","alignItems","background","gap","common","white","MenuWithTypeString","_props$fieldConfig$la","_props$fieldConfig","_props$fieldConfig2","_props$validationResu","_props$validationResu2","name","TextField","autoFocus","error","validationResult","hasError","helperText","message","MenuWithTypeSelect","_props$fieldConfig$la2","_props$fieldConfig3","_props$fieldConfig4","_props$validationResu3","_props$fieldConfig5","CustomRadioGroup","options","x","i","_x$label","FormControlLabel","control","Radio","RadioGroup","marginRight","margin","MenuWithTypeSelectMulti","_props$fieldConfig$la3","_props$fieldConfig6","_props$fieldConfig7","_props$validationResu4","_props$fieldConfig8","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","_","type","CustomFormGroup","_x$label2","Checkbox","FormGroup","MenuWithTypeDate","_props$fieldConfig$la4","_props$fieldConfig9","_props$fieldConfig0","_props$validationResu5","_props$validationResu6","_props$fieldConfig1","_props$fieldConfig10","dateString","_useState3","_useState4","dateLogic","setDateLogic","_useState5","_useState6","setValue","hidden","readOnly","test","target","inputProps","min","minDate","max","maxDate","MenuWithTypeDateRange","_props$fieldConfig$la5","_props$fieldConfig11","_props$fieldConfig12","_props$validationResu7","_props$fieldConfig13","_props$fieldConfig14","_props$validationResu8","_props$validationResu9","_props$fieldConfig15","_props$fieldConfig16","_useState7","_useState8","dateRangeLogic","setDateRangeLogic","DateRangeContainer","marginBottom","InputLabelProps","shrink","flexDirection","justifyContent","width","paddingLeft","li","content","top","right","transform"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as e,createClass as t,objectSpread2 as r,classCallCheck as a,callSuper as o,defineProperty as i,objectWithoutProperties as n,asyncToGenerator as l,regenerator as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as u,jsx as d,Fragment as p}from"react/jsx-runtime";import{Component as c}from"react";import{styled as m,Box as h,TextField as v,InputAdornment as g,IconButton as f,Collapse as b,CircularProgress as x}from"@mui/material";import S from"@mui/icons-material/ContentPaste";import{mergeObjects as k}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{getErrorMessage as y}from"./helpers.js";import P from"../components/image-with-fallback.js";var j=["srcGetter","element","alt","fallbackSrc","debounceDelay"],L=function(m){return function(){function x(e){var t,u;return a(this,x),u=o(this,x,[e]),i(u,"_cachedSlots",{}),i(u,"mapTextFieldProps",(function(){var e,t,a,o,i=y(u.props.messageErrors,u.props.name),n={fullWidth:!0,variant:"outlined",name:null===(e=u.props.name)||void 0===e?void 0:e.toString(),error:i.error,helperText:i.message,disabled:u.props.disabled,onBlur:function(){u.props.name&&u.props.onBlur&&u.props.onBlur(u.props.name)},label:u.getLabel(),placeholder:u.props.placeholder,InputLabelProps:u.state.value?{shrink:!0}:{},value:null!==(t=u.state.value)&&void 0!==t?t:"",onChange:u.handleChange};return!0===u.slots.pastenable&&(n.InputProps={endAdornment:d(g,{position:"end",children:d(f,{onClick:u.handlePaste,edge:"end",children:d(S,{})})})}),null!==(a=u.slots)&&void 0!==a&&a.maxLength&&(n.inputProps=r(r({},n.inputProps),{},{maxLength:u.slots.maxLength})),k({},n,null===(o=u.slots)||void 0===o?void 0:o.textFieldProps)})),i(u,"renderImageSide",(function(e){var t,a="left"===e?u.slots.imageLeft:u.slots.imageRight;if(!a)return d(p,{});var o=a.srcGetter,i=a.element,l=a.alt,s=void 0===l?"input-image":l,c=a.fallbackSrc,m=void 0===c?"":c,h=a.debounceDelay,v=void 0===h?700:h,g=n(a,j);if(i)return d(w,{children:d(i,{value:u.state.value,model:u.props.data})});var f=o?o(u.state.value,u.props.data):null!==(t=g.src)&&void 0!==t?t:u.state.value,x={src:f,alt:s,fallbackSrc:m,debounceDelay:v};return d(b,{sx:{mx:"10px"},in:!!f,unmountOnExit:!0,orientation:"horizontal",children:d(w,{children:d(P,r(r(r({},g),x),{},{loading:d(C,{})}))})})})),i(u,"mergeSlots",(function(e){var t=k({},m,e),a=t.imageLeft,o=t.imageRight;return null!=a&&a.mirror&&!o?(t.imageRight=r({},a),delete t.imageRight.mirror):null!=o&&o.mirror&&!a&&(t.imageLeft=r({},o),delete t.imageLeft.mirror),t})),i(u,"getLabel",(function(){var e,t,r;if(u.props.label)return null!==(e=u.slots)&&void 0!==e&&e.maxLength?"".concat(u.props.label," (").concat(null!==(t=null===(r=u.state.value)||void 0===r?void 0:r.length)&&void 0!==t?t:0,"/").concat(u.slots.maxLength,")"):u.props.label})),i(u,"handleChange",(function(e){u.setState({value:e.target.value})})),i(u,"handlePaste",l(s().m((function e(){var t,r;return s().w((function(e){for(;;)switch(e.n){case 0:return e.p=0,e.n=1,navigator.clipboard.readText();case 1:t=e.v,u.setState({value:t}),e.n=3;break;case 2:e.p=2,r=e.v,console.error("Error clipboard:",r);case 3:return e.a(2)}}),e,null,[[0,2]])})))),u._cachedSlots=null!==(t=u.mergeSlots(e.slots))&&void 0!==t?t:{},u.state={value:u.defaulValue},u}return e(x,c),t(x,[{key:"slots",get:function(){return this._cachedSlots}},{key:"defaulValue",get:function(){var e,t,r=this.props,a=r.data,o=r.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:a&&o?null===(t=a[o])||void 0===t?void 0:t.toString():void 0}},{key:"componentDidUpdate",value:function(e){e.slots!==this.props.slots&&(this._cachedSlots=this.mergeSlots(this.props.slots))}},{key:"shouldComponentUpdate",value:function(e){var t=this.props,r=t.name;t.slots;if(r){var a,o,i,n,l=null!==(a=null===(o=this.props.data)||void 0===o||null===(o=o[r])||void 0===o?void 0:o.toString())&&void 0!==a?a:"",s=null!==(i=null===(n=e.data)||void 0===n||null===(n=n[r])||void 0===n?void 0:n.toString())&&void 0!==i?i:"";if(l!==s)return this.setState({value:s}),!1}return e.slots,!0}},{key:"render",value:function(){var e;return u(h,{sx:{display:"flex",alignItems:"center"},children:[!!this.props.disabled&&d("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaulValue}),this.renderImageSide("left"),d(v,r({},this.mapTextFieldProps())),this.renderImageSide("right")]})}}])}()},C=function(){return d("div",{children:d(x,{size:24})})},w=m(h)({fontSize:"1rem",height:"var(--input-base-image-size, 54px)",width:"var(--input-base-image-size, 54px)",position:"relative",borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.16) 0px 1px 4px",overflow:"hidden","& > img":{position:"absolute",top:0,left:0,backgroundRepeat:"no-repeat",height:"100%",width:"100%",backgroundSize:"contain"},"& > div":{position:"absolute",top:0,left:0,height:"100%",width:"100%",background:"#fafafa",zIndex:1,display:"flex",alignItems:"center",justifyContent:"center"}});export{L as default};
1
+ import{inherits as e,createClass as t,objectSpread2 as r,classCallCheck as a,callSuper as o,defineProperty as i,objectWithoutProperties as n,asyncToGenerator as l,regenerator as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as u,jsx as d,Fragment as p}from"react/jsx-runtime";import{Component as c}from"react";import{styled as m,Box as h,TextField as v,InputAdornment as g,IconButton as f,Collapse as b,CircularProgress as x}from"@mui/material";import S from"@mui/icons-material/ContentPaste";import{mergeObjects as k}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{getErrorMessage as y}from"./helpers.js";import{ImageWithFallback as P}from"../components/image-with-fallback.js";var j=["srcGetter","element","alt","fallbackSrc","debounceDelay"],L=function(m){return function(){function x(e){var t,u;return a(this,x),u=o(this,x,[e]),i(u,"_cachedSlots",{}),i(u,"mapTextFieldProps",(function(){var e,t,a,o,i=y(u.props.messageErrors,u.props.name),n={fullWidth:!0,variant:"outlined",name:null===(e=u.props.name)||void 0===e?void 0:e.toString(),error:i.error,helperText:i.message,disabled:u.props.disabled,onBlur:function(){u.props.name&&u.props.onBlur&&u.props.onBlur(u.props.name)},label:u.getLabel(),placeholder:u.props.placeholder,InputLabelProps:u.state.value?{shrink:!0}:{},value:null!==(t=u.state.value)&&void 0!==t?t:"",onChange:u.handleChange};return!0===u.slots.pastenable&&(n.InputProps={endAdornment:d(g,{position:"end",children:d(f,{onClick:u.handlePaste,edge:"end",children:d(S,{})})})}),null!==(a=u.slots)&&void 0!==a&&a.maxLength&&(n.inputProps=r(r({},n.inputProps),{},{maxLength:u.slots.maxLength})),k({},n,null===(o=u.slots)||void 0===o?void 0:o.textFieldProps)})),i(u,"renderImageSide",(function(e){var t,a="left"===e?u.slots.imageLeft:u.slots.imageRight;if(!a)return d(p,{});var o=a.srcGetter,i=a.element,l=a.alt,s=void 0===l?"input-image":l,c=a.fallbackSrc,m=void 0===c?"":c,h=a.debounceDelay,v=void 0===h?700:h,g=n(a,j);if(i)return d(w,{children:d(i,{value:u.state.value,model:u.props.data})});var f=o?o(u.state.value,u.props.data):null!==(t=g.src)&&void 0!==t?t:u.state.value,x={src:f,alt:s,fallbackSrc:m,debounceDelay:v};return d(b,{sx:{mx:"10px"},in:!!f,unmountOnExit:!0,orientation:"horizontal",children:d(w,{children:d(P,r(r(r({},g),x),{},{loading:d(C,{})}))})})})),i(u,"mergeSlots",(function(e){var t=k({},m,e),a=t.imageLeft,o=t.imageRight;return null!=a&&a.mirror&&!o?(t.imageRight=r({},a),delete t.imageRight.mirror):null!=o&&o.mirror&&!a&&(t.imageLeft=r({},o),delete t.imageLeft.mirror),t})),i(u,"getLabel",(function(){var e,t,r;if(u.props.label)return null!==(e=u.slots)&&void 0!==e&&e.maxLength?"".concat(u.props.label," (").concat(null!==(t=null===(r=u.state.value)||void 0===r?void 0:r.length)&&void 0!==t?t:0,"/").concat(u.slots.maxLength,")"):u.props.label})),i(u,"handleChange",(function(e){u.setState({value:e.target.value})})),i(u,"handlePaste",l(s().m((function e(){var t,r;return s().w((function(e){for(;;)switch(e.n){case 0:return e.p=0,e.n=1,navigator.clipboard.readText();case 1:t=e.v,u.setState({value:t}),e.n=3;break;case 2:e.p=2,r=e.v,console.error("Error clipboard:",r);case 3:return e.a(2)}}),e,null,[[0,2]])})))),u._cachedSlots=null!==(t=u.mergeSlots(e.slots))&&void 0!==t?t:{},u.state={value:u.defaulValue},u}return e(x,c),t(x,[{key:"slots",get:function(){return this._cachedSlots}},{key:"defaulValue",get:function(){var e,t,r=this.props,a=r.data,o=r.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:a&&o?null===(t=a[o])||void 0===t?void 0:t.toString():void 0}},{key:"componentDidUpdate",value:function(e){e.slots!==this.props.slots&&(this._cachedSlots=this.mergeSlots(this.props.slots))}},{key:"shouldComponentUpdate",value:function(e){var t=this.props,r=t.name;t.slots;if(r){var a,o,i,n,l=null!==(a=null===(o=this.props.data)||void 0===o||null===(o=o[r])||void 0===o?void 0:o.toString())&&void 0!==a?a:"",s=null!==(i=null===(n=e.data)||void 0===n||null===(n=n[r])||void 0===n?void 0:n.toString())&&void 0!==i?i:"";if(l!==s)return this.setState({value:s}),!1}return e.slots,!0}},{key:"render",value:function(){var e;return u(h,{sx:{display:"flex",alignItems:"center"},children:[!!this.props.disabled&&d("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaulValue}),this.renderImageSide("left"),d(v,r({},this.mapTextFieldProps())),this.renderImageSide("right")]})}}])}()},C=function(){return d("div",{children:d(x,{size:24})})},w=m(h)({fontSize:"1rem",height:"var(--input-base-image-size, 54px)",width:"var(--input-base-image-size, 54px)",position:"relative",borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.16) 0px 1px 4px",overflow:"hidden","& > img":{position:"absolute",top:0,left:0,backgroundRepeat:"no-repeat",height:"100%",width:"100%",backgroundSize:"contain"},"& > div":{position:"absolute",top:0,left:0,height:"100%",width:"100%",background:"#fafafa",zIndex:1,display:"flex",alignItems:"center",justifyContent:"center"}});export{L as default};
2
2
  //# sourceMappingURL=create.input.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.input.js","sources":["../../src/form/create.input.tsx"],"sourcesContent":["import React, { Component, ComponentType, FC } from 'react'\r\nimport { Box, CircularProgress, Collapse, IconButton, InputAdornment, styled, TextField, TextFieldProps } from '@mui/material'\r\nimport ContentPasteIcon from '@mui/icons-material/ContentPaste'\r\nimport { mergeObjects } from '../utils'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { ImageWithFallback, IImageWithFallbackPropsOwner } from '../components'\r\n\r\nexport interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {\r\n srcGetter?: (value: any, model?: Partial<T>) => string\r\n element?: React.ComponentType<{ value: any; model?: Partial<T> }>\r\n mirror?: boolean\r\n}\r\n\r\nexport interface IInputSlots<T> {\r\n maxLength?: number\r\n textFieldProps?: TextFieldProps\r\n pastenable?: boolean\r\n imageLeft?: InputBaseImage<T>\r\n imageRight?: InputBaseImage<T>\r\n}\r\n\r\nexport interface IInputProps<T> extends IFormInputBase<T, IInputSlots<T>> {}\r\n\r\nexport interface IInputState {\r\n value?: string\r\n}\r\n\r\nexport interface IInputParams<T> extends IInputSlots<T> {}\r\n\r\nconst CreateInput = function <T>(params?: IInputParams<T>): ComponentType<IInputProps<T>> {\r\n class InputBase extends Component<IInputProps<T>, IInputState> {\r\n private _cachedSlots: IInputSlots<T> = {}\r\n constructor(props: IInputProps<T>) {\r\n super(props)\r\n this._cachedSlots = this.mergeSlots(props.slots) ?? {}\r\n this.state = { value: this.defaulValue }\r\n }\r\n\r\n get slots() {\r\n return this._cachedSlots\r\n }\r\n\r\n get defaulValue(): string {\r\n const { data, name } = this.props\r\n return this.props.defaultValue ?? (!!data && !!name ? data[name]?.toString() : undefined)\r\n }\r\n\r\n componentDidUpdate(prevProps: IInputProps<T>) {\r\n if (prevProps.slots !== this.props.slots) {\r\n this._cachedSlots = this.mergeSlots(this.props.slots)\r\n }\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IInputProps<T>>): boolean {\r\n const { name, slots } = this.props\r\n if (!!name) {\r\n const currentDataValue = this.props.data?.[name]?.toString() ?? ''\r\n const nextDataValue = nextProps.data?.[name]?.toString() ?? ''\r\n if (currentDataValue !== nextDataValue) {\r\n this.setState({ value: nextDataValue })\r\n return false\r\n }\r\n }\r\n\r\n if (slots !== nextProps.slots) {\r\n return true\r\n }\r\n return true\r\n }\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const errorMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n const tfp: TextFieldProps = {\r\n fullWidth: true,\r\n variant: 'outlined',\r\n name: this.props.name?.toString(),\r\n error: errorMessage.error,\r\n helperText: errorMessage.message,\r\n disabled: this.props.disabled,\r\n onBlur: () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n },\r\n label: this.getLabel(),\r\n placeholder: this.props.placeholder,\r\n InputLabelProps: !!this.state.value ? { shrink: true } : {},\r\n value: this.state.value ?? '',\r\n onChange: this.handleChange\r\n }\r\n if (this.slots.pastenable === true) {\r\n tfp.InputProps = {\r\n endAdornment: (\r\n <InputAdornment position='end'>\r\n <IconButton onClick={this.handlePaste} edge='end'>\r\n <ContentPasteIcon />\r\n </IconButton>\r\n </InputAdornment>\r\n )\r\n }\r\n }\r\n if (this.slots?.maxLength) tfp.inputProps = { ...tfp.inputProps, maxLength: this.slots.maxLength }\r\n return mergeObjects<TextFieldProps>({}, tfp, this.slots?.textFieldProps)\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\r\n {!!this.props.disabled && <input hidden name={this.props.name?.toString()} defaultValue={this.defaulValue} />}\r\n {this.renderImageSide('left')}\r\n <TextField {...this.mapTextFieldProps()} />\r\n {this.renderImageSide('right')}\r\n </Box>\r\n )\r\n }\r\n\r\n renderImageSide = (side: 'left' | 'right') => {\r\n const image = side === 'left' ? this.slots.imageLeft : this.slots.imageRight\r\n if (!image) return <></>\r\n const { srcGetter, element, alt = 'input-image', fallbackSrc = '', debounceDelay = 700, ...imageOther } = image\r\n if (element) {\r\n const Element = element\r\n return (\r\n <WrapImage>\r\n <Element value={this.state.value} model={this.props.data} />\r\n </WrapImage>\r\n )\r\n }\r\n const src = srcGetter ? srcGetter(this.state.value, this.props.data) : imageOther.src ?? this.state.value\r\n const imageProps: IImageWithFallbackPropsOwner = { src, alt, fallbackSrc, debounceDelay }\r\n return (\r\n <Collapse sx={{ mx: '10px' }} in={!!src} unmountOnExit orientation='horizontal'>\r\n <WrapImage>\r\n <ImageWithFallback {...imageOther} {...imageProps} loading={<LoadingCircularProgress />} />\r\n </WrapImage>\r\n </Collapse>\r\n )\r\n }\r\n //#endregion\r\n\r\n private mergeSlots = (currentSlots?: IInputSlots<T>): IInputSlots<T> => {\r\n const base = mergeObjects<IInputSlots<T>>({}, params, currentSlots)\r\n const { imageLeft, imageRight } = base\r\n\r\n // mirror from left to right\r\n if (imageLeft?.mirror && !imageRight) {\r\n base.imageRight = { ...imageLeft }\r\n delete base.imageRight.mirror\r\n }\r\n // mirror from right to left\r\n else if (imageRight?.mirror && !imageLeft) {\r\n base.imageLeft = { ...imageRight }\r\n delete base.imageLeft.mirror\r\n }\r\n\r\n return base\r\n }\r\n\r\n getLabel = () => {\r\n if (!this.props.label) return\r\n if (!this.slots?.maxLength) return this.props.label\r\n return `${this.props.label} (${this.state.value?.length ?? 0}/${this.slots.maxLength})`\r\n }\r\n\r\n handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n this.setState({ value: event.target.value })\r\n }\r\n\r\n handlePaste = async () => {\r\n try {\r\n const clipboardText = await navigator.clipboard.readText()\r\n this.setState({ value: clipboardText })\r\n } catch (error) {\r\n console.error('Error clipboard:', error)\r\n }\r\n }\r\n }\r\n return InputBase\r\n}\r\n\r\nexport default CreateInput\r\n\r\n// export type InputTextType<T> = ReturnType<typeof CreateInputBase<T>>\r\n\r\nconst LoadingCircularProgress: FC = () => (\r\n <div>\r\n <CircularProgress size={24} />\r\n </div>\r\n)\r\n\r\nconst WrapImage = styled(Box)({\r\n fontSize: '1rem',\r\n height: 'var(--input-base-image-size, 54px)',\r\n width: 'var(--input-base-image-size, 54px)',\r\n position: 'relative',\r\n borderRadius: '8px',\r\n boxShadow: 'rgba(0, 0, 0, 0.16) 0px 1px 4px',\r\n overflow: 'hidden',\r\n '& > img': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n backgroundRepeat: 'no-repeat',\r\n height: '100%',\r\n width: '100%',\r\n backgroundSize: 'contain'\r\n },\r\n '& > div': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n height: '100%',\r\n width: '100%',\r\n background: '#fafafa',\r\n zIndex: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center'\r\n }\r\n})\r\n"],"names":["CreateInput","params","InputBase","props","_this$mergeSlots","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$name","_this$state$value","_this$slots","_this$slots2","errorMessage","getErrorMessage","messageErrors","name","tfp","fullWidth","variant","toString","error","helperText","message","disabled","onBlur","label","getLabel","placeholder","InputLabelProps","state","value","shrink","onChange","handleChange","slots","pastenable","InputProps","endAdornment","_jsx","InputAdornment","position","children","IconButton","onClick","handlePaste","edge","ContentPasteIcon","maxLength","inputProps","_objectSpread","mergeObjects","textFieldProps","side","_imageOther$src","image","imageLeft","imageRight","srcGetter","element","_image$alt","alt","_image$fallbackSrc","fallbackSrc","_image$debounceDelay","debounceDelay","imageOther","_objectWithoutProperties","_excluded","WrapImage","model","data","src","imageProps","Collapse","sx","mx","in","unmountOnExit","orientation","ImageWithFallback","loading","LoadingCircularProgress","currentSlots","base","mirror","_this$slots3","_this$state$value$len","_this$state$value2","concat","length","event","setState","target","_asyncToGenerator","_regenerator","m","_callee","clipboardText","_t","w","_context","n","p","navigator","clipboard","readText","v","console","a","_cachedSlots","mergeSlots","defaulValue","_inherits","Component","_createClass","key","get","this","_this$props$defaultVa","_data$name","_this$props","defaultValue","undefined","prevProps","nextProps","_this$props2","_this$props$data$name","_this$props$data","_nextProps$data$name$","_nextProps$data","currentDataValue","nextDataValue","_this$props$name2","_jsxs","Box","display","alignItems","hidden","renderImageSide","TextField","mapTextFieldProps","CircularProgress","size","styled","fontSize","height","width","borderRadius","boxShadow","overflow","top","left","backgroundRepeat","backgroundSize","background","zIndex","justifyContent"],"mappings":"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"}
1
+ {"version":3,"file":"create.input.js","sources":["../../src/form/create.input.tsx"],"sourcesContent":["import React, { Component, ComponentType, FC } from 'react'\r\nimport { Box, CircularProgress, Collapse, IconButton, InputAdornment, styled, TextField, TextFieldProps } from '@mui/material'\r\nimport ContentPasteIcon from '@mui/icons-material/ContentPaste'\r\nimport { mergeObjects } from '../utils'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { ImageWithFallback, IImageWithFallbackPropsOwner } from '../components'\r\n\r\nexport interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {\r\n srcGetter?: (value: any, model?: Partial<T>) => string\r\n element?: React.ComponentType<{ value: any; model?: Partial<T> }>\r\n mirror?: boolean\r\n}\r\n\r\nexport interface IInputSlots<T> {\r\n maxLength?: number\r\n textFieldProps?: TextFieldProps\r\n pastenable?: boolean\r\n imageLeft?: InputBaseImage<T>\r\n imageRight?: InputBaseImage<T>\r\n}\r\n\r\nexport interface IInputProps<T> extends IFormInputBase<T, IInputSlots<T>> {}\r\n\r\nexport interface IInputState {\r\n value?: string\r\n}\r\n\r\nexport interface IInputParams<T> extends IInputSlots<T> {}\r\n\r\nconst CreateInput = function <T>(params?: IInputParams<T>): ComponentType<IInputProps<T>> {\r\n class InputBase extends Component<IInputProps<T>, IInputState> {\r\n private _cachedSlots: IInputSlots<T> = {}\r\n constructor(props: IInputProps<T>) {\r\n super(props)\r\n this._cachedSlots = this.mergeSlots(props.slots) ?? {}\r\n this.state = { value: this.defaulValue }\r\n }\r\n\r\n get slots() {\r\n return this._cachedSlots\r\n }\r\n\r\n get defaulValue(): string {\r\n const { data, name } = this.props\r\n return this.props.defaultValue ?? (!!data && !!name ? data[name]?.toString() : undefined)\r\n }\r\n\r\n componentDidUpdate(prevProps: IInputProps<T>) {\r\n if (prevProps.slots !== this.props.slots) {\r\n this._cachedSlots = this.mergeSlots(this.props.slots)\r\n }\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IInputProps<T>>): boolean {\r\n const { name, slots } = this.props\r\n if (!!name) {\r\n const currentDataValue = this.props.data?.[name]?.toString() ?? ''\r\n const nextDataValue = nextProps.data?.[name]?.toString() ?? ''\r\n if (currentDataValue !== nextDataValue) {\r\n this.setState({ value: nextDataValue })\r\n return false\r\n }\r\n }\r\n\r\n if (slots !== nextProps.slots) {\r\n return true\r\n }\r\n return true\r\n }\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const errorMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n const tfp: TextFieldProps = {\r\n fullWidth: true,\r\n variant: 'outlined',\r\n name: this.props.name?.toString(),\r\n error: errorMessage.error,\r\n helperText: errorMessage.message,\r\n disabled: this.props.disabled,\r\n onBlur: () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n },\r\n label: this.getLabel(),\r\n placeholder: this.props.placeholder,\r\n InputLabelProps: !!this.state.value ? { shrink: true } : {},\r\n value: this.state.value ?? '',\r\n onChange: this.handleChange\r\n }\r\n if (this.slots.pastenable === true) {\r\n tfp.InputProps = {\r\n endAdornment: (\r\n <InputAdornment position='end'>\r\n <IconButton onClick={this.handlePaste} edge='end'>\r\n <ContentPasteIcon />\r\n </IconButton>\r\n </InputAdornment>\r\n )\r\n }\r\n }\r\n if (this.slots?.maxLength) tfp.inputProps = { ...tfp.inputProps, maxLength: this.slots.maxLength }\r\n return mergeObjects<TextFieldProps>({}, tfp, this.slots?.textFieldProps)\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\r\n {!!this.props.disabled && <input hidden name={this.props.name?.toString()} defaultValue={this.defaulValue} />}\r\n {this.renderImageSide('left')}\r\n <TextField {...this.mapTextFieldProps()} />\r\n {this.renderImageSide('right')}\r\n </Box>\r\n )\r\n }\r\n\r\n renderImageSide = (side: 'left' | 'right') => {\r\n const image = side === 'left' ? this.slots.imageLeft : this.slots.imageRight\r\n if (!image) return <></>\r\n const { srcGetter, element, alt = 'input-image', fallbackSrc = '', debounceDelay = 700, ...imageOther } = image\r\n if (element) {\r\n const Element = element\r\n return (\r\n <WrapImage>\r\n <Element value={this.state.value} model={this.props.data} />\r\n </WrapImage>\r\n )\r\n }\r\n const src = srcGetter ? srcGetter(this.state.value, this.props.data) : imageOther.src ?? this.state.value\r\n const imageProps: IImageWithFallbackPropsOwner = { src, alt, fallbackSrc, debounceDelay }\r\n return (\r\n <Collapse sx={{ mx: '10px' }} in={!!src} unmountOnExit orientation='horizontal'>\r\n <WrapImage>\r\n <ImageWithFallback {...imageOther} {...imageProps} loading={<LoadingCircularProgress />} />\r\n </WrapImage>\r\n </Collapse>\r\n )\r\n }\r\n //#endregion\r\n\r\n private mergeSlots = (currentSlots?: IInputSlots<T>): IInputSlots<T> => {\r\n const base = mergeObjects<IInputSlots<T>>({}, params, currentSlots)\r\n const { imageLeft, imageRight } = base\r\n\r\n // mirror from left to right\r\n if (imageLeft?.mirror && !imageRight) {\r\n base.imageRight = { ...imageLeft }\r\n delete base.imageRight.mirror\r\n }\r\n // mirror from right to left\r\n else if (imageRight?.mirror && !imageLeft) {\r\n base.imageLeft = { ...imageRight }\r\n delete base.imageLeft.mirror\r\n }\r\n\r\n return base\r\n }\r\n\r\n getLabel = () => {\r\n if (!this.props.label) return\r\n if (!this.slots?.maxLength) return this.props.label\r\n return `${this.props.label} (${this.state.value?.length ?? 0}/${this.slots.maxLength})`\r\n }\r\n\r\n handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n this.setState({ value: event.target.value })\r\n }\r\n\r\n handlePaste = async () => {\r\n try {\r\n const clipboardText = await navigator.clipboard.readText()\r\n this.setState({ value: clipboardText })\r\n } catch (error) {\r\n console.error('Error clipboard:', error)\r\n }\r\n }\r\n }\r\n return InputBase\r\n}\r\n\r\nexport default CreateInput\r\n\r\n// export type InputTextType<T> = ReturnType<typeof CreateInputBase<T>>\r\n\r\nconst LoadingCircularProgress: FC = () => (\r\n <div>\r\n <CircularProgress size={24} />\r\n </div>\r\n)\r\n\r\nconst WrapImage = styled(Box)({\r\n fontSize: '1rem',\r\n height: 'var(--input-base-image-size, 54px)',\r\n width: 'var(--input-base-image-size, 54px)',\r\n position: 'relative',\r\n borderRadius: '8px',\r\n boxShadow: 'rgba(0, 0, 0, 0.16) 0px 1px 4px',\r\n overflow: 'hidden',\r\n '& > img': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n backgroundRepeat: 'no-repeat',\r\n height: '100%',\r\n width: '100%',\r\n backgroundSize: 'contain'\r\n },\r\n '& > div': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n height: '100%',\r\n width: '100%',\r\n background: '#fafafa',\r\n zIndex: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center'\r\n }\r\n})\r\n"],"names":["CreateInput","params","InputBase","props","_this$mergeSlots","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$name","_this$state$value","_this$slots","_this$slots2","errorMessage","getErrorMessage","messageErrors","name","tfp","fullWidth","variant","toString","error","helperText","message","disabled","onBlur","label","getLabel","placeholder","InputLabelProps","state","value","shrink","onChange","handleChange","slots","pastenable","InputProps","endAdornment","_jsx","InputAdornment","position","children","IconButton","onClick","handlePaste","edge","ContentPasteIcon","maxLength","inputProps","_objectSpread","mergeObjects","textFieldProps","side","_imageOther$src","image","imageLeft","imageRight","srcGetter","element","_image$alt","alt","_image$fallbackSrc","fallbackSrc","_image$debounceDelay","debounceDelay","imageOther","_objectWithoutProperties","_excluded","WrapImage","model","data","src","imageProps","Collapse","sx","mx","in","unmountOnExit","orientation","ImageWithFallback","loading","LoadingCircularProgress","currentSlots","base","mirror","_this$slots3","_this$state$value$len","_this$state$value2","concat","length","event","setState","target","_asyncToGenerator","_regenerator","m","_callee","clipboardText","_t","w","_context","n","p","navigator","clipboard","readText","v","console","a","_cachedSlots","mergeSlots","defaulValue","_inherits","Component","_createClass","key","get","this","_this$props$defaultVa","_data$name","_this$props","defaultValue","undefined","prevProps","nextProps","_this$props2","_this$props$data$name","_this$props$data","_nextProps$data$name$","_nextProps$data","currentDataValue","nextDataValue","_this$props$name2","_jsxs","Box","display","alignItems","hidden","renderImageSide","TextField","mapTextFieldProps","CircularProgress","size","styled","fontSize","height","width","borderRadius","boxShadow","overflow","top","left","backgroundRepeat","backgroundSize","background","zIndex","justifyContent"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as e,createClass as r,objectSpread2 as o,classCallCheck as l,callSuper as t,defineProperty as i}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as n,jsx as a}from"react/jsx-runtime";import s,{Component as p}from"react";import{FormControl as u,InputLabel as d,Select as v,MenuItem as m,Collapse as f,FormHelperText as g}from"@mui/material";import{mergeObjects as h}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{getErrorMessage as c}from"./helpers.js";function b(b){return function(){function S(e){var r,o;return l(this,S),o=t(this,S,[e]),i(o,"mapProps",(function(){var e,r,l,t,i,n=o.getLabel(),a={id:null===(e=o.props.name)||void 0===e?void 0:e.toString(),labelId:(null===(r=o.props.name)||void 0===r?void 0:r.toString())+n,name:null===(l=o.props.name)||void 0===l?void 0:l.toString(),label:n,defaultValue:o.getDefaultValue(),value:o.state.value,onChange:function(e){var r=e.target.value+"";o.setState({value:r},(function(){o.props.name&&o.props.onBlur&&o.props.onBlur(o.props.name);var e=o.getOptions().find((function(e){var o;return(null===(o=e.value)||void 0===o?void 0:o.toString())===r}));e&&o.props.onChange&&o.props.onChange(e)}))},disabled:o.props.disabled,fullWidth:void 0===o.props.fullWidth||o.props.fullWidth},s=null!==(t=null===(i=o.props.slots)||void 0===i?void 0:i.selectProps)&&void 0!==t?t:null==b?void 0:b.selectProps;return h({},a,s)})),i(o,"getLabel",(function(){var e,r;return o.props.label&&"string"==typeof o.props.label?o.props.label:null!==(e=null===(r=o.props.name)||void 0===r?void 0:r.toString())&&void 0!==e?e:""})),i(o,"getDefaultValue",(function(){var e,r,l,t,i=o.props,n=i.data,a=i.name,s=o.getOptions();return null!==(e=null!==(r=null===(l=o.props.defaultValue)||void 0===l?void 0:l.toString())&&void 0!==r?r:n&&a?n[a]:void 0)&&void 0!==e?e:null===(t=s[0])||void 0===t?void 0:t.value})),i(o,"getOptions",(function(){var e,r;return null!==(e=null!==(r=null==b?void 0:b.options)&&void 0!==r?r:o.props.options)&&void 0!==e?e:[]})),o.state={value:null===(r=o.getDefaultValue())||void 0===r?void 0:r.toString()},o}return e(S,p),r(S,[{key:"render",value:function(){var e,r,l=this.getOptions(),t=this.getLabel(),i=c(this.props.messageErrors,this.props.name);return n(s.Fragment,{children:[!!this.props.disabled&&a("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.getDefaultValue()}),n(u,{fullWidth:!0,disabled:this.props.disabled,error:i.error,children:[a(d,{id:(null===(r=this.props.name)||void 0===r?void 0:r.toString())+t,children:t}),a(v,o(o({},this.mapProps()),{},{children:l.map((function(e){return a(m,{value:e.value,children:e.name},e.value)}))})),a(f,{in:i.error,children:a(g,{children:i.message})})]})]})}}])}()}export{b as default};
1
+ import{defineProperty as o,inherits as t,createClass as e,objectSpread2 as i,classCallCheck as l,callSuper as r}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as n,jsx as a}from"react/jsx-runtime";import{Fragment as p,Component as s}from"react";import{styled as u,FormControl as d,InputLabel as v,Select as c,MenuItem as f,Collapse as m,FormHelperText as g}from"@mui/material";import{mergeObjects as h}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{getErrorMessage as S}from"./helpers.js";import{RichTooltip as b,HelpOutlinePulseIcon as j}from"../components/rich-tooltip.js";function C(u){return function(){function d(t){var e,i;return l(this,d),i=r(this,d,[t]),o(i,"mapProps",(function(){var o,t,e,l,r,n=i.getLabel(),a={id:null===(o=i.props.name)||void 0===o?void 0:o.toString(),labelId:(null===(t=i.props.name)||void 0===t?void 0:t.toString())+n,name:null===(e=i.props.name)||void 0===e?void 0:e.toString(),label:n,defaultValue:i.getDefaultValue(),value:i.state.value,onChange:function(o){var t=o.target.value+"";i.setState({value:t},(function(){i.props.name&&i.props.onBlur&&i.props.onBlur(i.props.name);var o=i.getOptions().find((function(o){var e;return(null===(e=o.value)||void 0===e?void 0:e.toString())===t}));o&&i.props.onChange&&i.props.onChange(o)}))},disabled:i.props.disabled,fullWidth:void 0===i.props.fullWidth||i.props.fullWidth},p=null!==(l=null===(r=i.props.slots)||void 0===r?void 0:r.selectProps)&&void 0!==l?l:null==u?void 0:u.selectProps;return h({},a,p)})),o(i,"renderTooltip",(function(){var o=i.props.tooltip||(null==u?void 0:u.tooltip);return o?a("div",{className:W.tooltipWrap,children:a(b,{panel:o,children:a(j,{fontSize:"small"})})}):null})),o(i,"getRootClasses",(function(){var o=[W.root];return(i.props.tooltip||(null==u?void 0:u.tooltip))&&o.push(W.tooltip),o.join(" ")})),o(i,"getLabel",(function(){var o,t;return i.props.label&&"string"==typeof i.props.label?i.props.label:null!==(o=null===(t=i.props.name)||void 0===t?void 0:t.toString())&&void 0!==o?o:""})),o(i,"getDefaultValue",(function(){var o,t,e,l,r=i.props,n=r.data,a=r.name,p=i.getOptions();return null!==(o=null!==(t=null===(e=i.props.defaultValue)||void 0===e?void 0:e.toString())&&void 0!==t?t:n&&a?n[a]:void 0)&&void 0!==o?o:null===(l=p[0])||void 0===l?void 0:l.value})),o(i,"getOptions",(function(){var o,t;return null!==(o=null!==(t=null==u?void 0:u.options)&&void 0!==t?t:i.props.options)&&void 0!==o?o:[]})),i.state={value:null===(e=i.getDefaultValue())||void 0===e?void 0:e.toString()},i}return t(d,s),e(d,[{key:"render",value:function(){var o,t,e=this.getOptions(),l=this.getLabel(),r=S(this.props.messageErrors,this.props.name);return n(p,{children:[!!this.props.disabled&&a("input",{hidden:!0,name:null===(o=this.props.name)||void 0===o?void 0:o.toString(),defaultValue:this.getDefaultValue()}),n(V,{className:this.getRootClasses(),fullWidth:!0,disabled:this.props.disabled,error:r.error,children:[a(v,{id:(null===(t=this.props.name)||void 0===t?void 0:t.toString())+l,children:l}),a(c,i(i({},this.mapProps()),{},{children:e.map((function(o){return a(f,{value:o.value,children:o.name},o.value)}))})),a(m,{in:r.error,children:a(g,{children:r.message})}),this.renderTooltip()]})]})}}])}()}var W={root:"SelectSimple-root",tooltip:"SelectSimple-tooltip",tooltipWrap:"SelectSimple-tooltipWrap"},x=function(o,t){return"".concat((null==t?void 0:t.prefix)||"",".").concat(W[o]).concat((null==t?void 0:t.suffix)||"")},V=u(d)((function(t){var e=t.theme;return o(o(o({},x("root",{suffix:"&"}),{position:"relative"}),x("tooltipWrap"),{position:"absolute",top:e.spacing(2.25),right:e.spacing(1.5),display:"flex",alignItems:"center",gap:e.spacing(.5)}),x("tooltip",{suffix:"&"}),{".MuiSelect-icon":{right:e.spacing(4.5)}})}));export{C as default};
2
2
  //# sourceMappingURL=create.select-simple.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.select-simple.js","sources":["../../src/form/create.select-simple.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Collapse, FormControl, FormHelperText, InputLabel, MenuItem, Select, SelectProps } from '@mui/material'\r\nimport { mergeObjects } from '../utils'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\n\r\nexport interface ISelectSimpleOption<T extends string = string> {\r\n name: string\r\n value: T\r\n}\r\n\r\nexport interface ISelectSimpleSlots {\r\n selectProps?: Omit<SelectProps, 'variant'>\r\n}\r\n\r\nexport interface ISelectSimpleProps<T> extends Partial<IFormInputBase<T>> {\r\n options?: ISelectSimpleOption[]\r\n onChange?: (value: ISelectSimpleOption) => void\r\n slots?: ISelectSimpleSlots\r\n fullWidth?: boolean\r\n}\r\n\r\nexport interface ISelectSimpleState {\r\n value?: string\r\n}\r\n\r\nexport interface ISelectSimpleParams extends ISelectSimpleSlots {\r\n options?: ISelectSimpleOption[]\r\n}\r\n\r\nfunction CreateSelectSimple<T>(args?: ISelectSimpleParams): ComponentType<ISelectSimpleProps<T>> {\r\n class SelectSimple extends Component<ISelectSimpleProps<T>, ISelectSimpleState> {\r\n constructor(props: ISelectSimpleProps<T>) {\r\n super(props)\r\n this.state = { value: this.getDefaultValue()?.toString() }\r\n }\r\n mapProps = (): SelectProps => {\r\n const label = this.getLabel()\r\n const tfp: SelectProps = {\r\n id: this.props.name?.toString(),\r\n labelId: this.props.name?.toString() + label,\r\n name: this.props.name?.toString(),\r\n label: label,\r\n defaultValue: this.getDefaultValue(),\r\n value: this.state.value,\r\n onChange: (event) => {\r\n const value: string = event.target.value + ''\r\n this.setState({ value }, () => {\r\n if (!!this.props.name) {\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n }\r\n const options = this.getOptions()\r\n const temp = options.find((x) => x.value?.toString() === value)\r\n if (!temp) return\r\n this.props.onChange && this.props.onChange(temp)\r\n })\r\n },\r\n disabled: this.props.disabled,\r\n fullWidth: this.props.fullWidth !== undefined ? this.props.fullWidth : true\r\n }\r\n const selectProps = this.props.slots?.selectProps ?? args?.selectProps\r\n return mergeObjects({}, tfp, selectProps)\r\n }\r\n render() {\r\n const data = this.getOptions()\r\n const label = this.getLabel()\r\n const errorMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n return (\r\n <React.Fragment>\r\n {!!this.props.disabled && <input hidden name={this.props.name?.toString()} defaultValue={this.getDefaultValue()} />}\r\n <FormControl fullWidth disabled={this.props.disabled} error={errorMessage.error}>\r\n <InputLabel id={this.props.name?.toString() + label}>{label}</InputLabel>\r\n <Select {...this.mapProps()}>\r\n {data.map((item) => (\r\n <MenuItem key={item.value} value={item.value}>\r\n {item.name}\r\n </MenuItem>\r\n ))}\r\n </Select>\r\n <Collapse in={errorMessage.error}>\r\n <FormHelperText>{errorMessage.message}</FormHelperText>\r\n </Collapse>\r\n </FormControl>\r\n </React.Fragment>\r\n )\r\n }\r\n getLabel = () => {\r\n if (!!this.props.label && typeof this.props.label === 'string') return this.props.label\r\n return this.props.name?.toString() ?? ''\r\n }\r\n getDefaultValue = () => {\r\n const { data, name } = this.props\r\n const options = this.getOptions()\r\n return this.props.defaultValue?.toString() ?? (!!data && !!name ? data[name] : undefined) ?? options[0]?.value\r\n }\r\n getOptions = (): ISelectSimpleOption[] => {\r\n return args?.options ?? this.props.options ?? []\r\n }\r\n }\r\n return SelectSimple\r\n}\r\nexport default CreateSelectSimple\r\n"],"names":["CreateSelectSimple","args","SelectSimple","props","_this$getDefaultValue","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$name","_this$props$name2","_this$props$name3","_this$props$slots$sel","_this$props$slots","label","getLabel","tfp","id","name","toString","labelId","defaultValue","getDefaultValue","value","state","onChange","event","target","setState","onBlur","temp","getOptions","find","x","_x$value","disabled","fullWidth","undefined","selectProps","slots","mergeObjects","_this$props$name$toSt","_this$props$name4","_ref","_this$props$defaultVa","_this$props$defaultVa2","_options$","_this$props","data","options","_ref2","_args$options","_inherits","Component","_createClass","key","_this$props$name5","_this$props$name6","this","errorMessage","getErrorMessage","messageErrors","_jsxs","React","Fragment","children","_jsx","hidden","FormControl","error","InputLabel","Select","_objectSpread","mapProps","map","item","MenuItem","Collapse","in","FormHelperText","message"],"mappings":"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"}
1
+ {"version":3,"file":"create.select-simple.js","sources":["../../src/form/create.select-simple.tsx"],"sourcesContent":["import { Component, Fragment } from 'react'\r\nimport { Collapse, FormControl, FormHelperText, InputLabel, MenuItem, Select, styled } from '@mui/material'\r\nimport type { ComponentType } from 'react'\r\nimport type { SelectProps } from '@mui/material'\r\nimport { mergeObjects } from '../utils'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { RichTooltip, HelpOutlinePulseIcon } from '../components/rich-tooltip'\r\nimport type { IRichTooltipPanelConfig } from '../components/rich-tooltip'\r\n\r\nexport interface ISelectSimpleOption<T extends string = string> {\r\n name: string\r\n value: T\r\n}\r\n\r\nexport interface ISelectSimpleSlots {\r\n selectProps?: Omit<SelectProps, 'variant'>\r\n}\r\n\r\nexport interface ISelectSimpleProps<T> extends Partial<IFormInputBase<T>> {\r\n options?: ISelectSimpleOption[]\r\n onChange?: (value: ISelectSimpleOption) => void\r\n slots?: ISelectSimpleSlots\r\n fullWidth?: boolean\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nexport interface ISelectSimpleState {\r\n value?: string\r\n}\r\n\r\nexport interface ISelectSimpleParams extends ISelectSimpleSlots {\r\n options?: ISelectSimpleOption[]\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nfunction CreateSelectSimple<T>(args?: ISelectSimpleParams): ComponentType<ISelectSimpleProps<T>> {\r\n class SelectSimple extends Component<ISelectSimpleProps<T>, ISelectSimpleState> {\r\n constructor(props: ISelectSimpleProps<T>) {\r\n super(props)\r\n this.state = { value: this.getDefaultValue()?.toString() }\r\n }\r\n mapProps = (): SelectProps => {\r\n const label = this.getLabel()\r\n const tfp: SelectProps = {\r\n id: this.props.name?.toString(),\r\n labelId: this.props.name?.toString() + label,\r\n name: this.props.name?.toString(),\r\n label: label,\r\n defaultValue: this.getDefaultValue(),\r\n value: this.state.value,\r\n onChange: (event) => {\r\n const value: string = event.target.value + ''\r\n this.setState({ value }, () => {\r\n if (!!this.props.name) {\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n }\r\n const options = this.getOptions()\r\n const temp = options.find((x) => x.value?.toString() === value)\r\n if (!temp) return\r\n this.props.onChange && this.props.onChange(temp)\r\n })\r\n },\r\n disabled: this.props.disabled,\r\n fullWidth: this.props.fullWidth !== undefined ? this.props.fullWidth : true\r\n }\r\n const selectProps = this.props.slots?.selectProps ?? args?.selectProps\r\n return mergeObjects({}, tfp, selectProps)\r\n }\r\n render() {\r\n const data = this.getOptions()\r\n const label = this.getLabel()\r\n const errorMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n return (\r\n <Fragment>\r\n {!!this.props.disabled && <input hidden name={this.props.name?.toString()} defaultValue={this.getDefaultValue()} />}\r\n <SelectSimpleStyled className={this.getRootClasses()} fullWidth disabled={this.props.disabled} error={errorMessage.error}>\r\n <InputLabel id={this.props.name?.toString() + label}>{label}</InputLabel>\r\n <Select {...this.mapProps()}>\r\n {data.map((item) => (\r\n <MenuItem key={item.value} value={item.value}>\r\n {item.name}\r\n </MenuItem>\r\n ))}\r\n </Select>\r\n <Collapse in={errorMessage.error}>\r\n <FormHelperText>{errorMessage.message}</FormHelperText>\r\n </Collapse>\r\n {this.renderTooltip()}\r\n </SelectSimpleStyled>\r\n </Fragment>\r\n )\r\n }\r\n\r\n renderTooltip = () => {\r\n const tooltip = this.props.tooltip || args?.tooltip\r\n if (!tooltip) return null\r\n return (\r\n <div className={selectSimpleClasses.tooltipWrap}>\r\n <RichTooltip panel={tooltip}>\r\n <HelpOutlinePulseIcon fontSize='small' />\r\n </RichTooltip>\r\n </div>\r\n )\r\n }\r\n\r\n getRootClasses = () => {\r\n const classes = [selectSimpleClasses.root]\r\n const tooltip = this.props.tooltip || args?.tooltip\r\n if (tooltip) classes.push(selectSimpleClasses.tooltip)\r\n return classes.join(' ')\r\n }\r\n\r\n getLabel = () => {\r\n if (!!this.props.label && typeof this.props.label === 'string') return this.props.label\r\n return this.props.name?.toString() ?? ''\r\n }\r\n\r\n getDefaultValue = () => {\r\n const { data, name } = this.props\r\n const options = this.getOptions()\r\n return this.props.defaultValue?.toString() ?? (!!data && !!name ? data[name] : undefined) ?? options[0]?.value\r\n }\r\n\r\n getOptions = (): ISelectSimpleOption[] => {\r\n return args?.options ?? this.props.options ?? []\r\n }\r\n }\r\n return SelectSimple\r\n}\r\nexport default CreateSelectSimple\r\n\r\nconst selectSimpleClasses = {\r\n root: 'SelectSimple-root',\r\n tooltip: 'SelectSimple-tooltip',\r\n tooltipWrap: 'SelectSimple-tooltipWrap'\r\n}\r\n\r\nconst getSelectSimpleClass = (key: keyof typeof selectSimpleClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${selectSimpleClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nconst SelectSimpleStyled = styled(FormControl)(({ theme }) => ({\r\n [getSelectSimpleClass('root', { suffix: '&' })]: {\r\n position: 'relative'\r\n },\r\n [getSelectSimpleClass('tooltipWrap')]: {\r\n position: 'absolute',\r\n top: theme.spacing(2.25),\r\n right: theme.spacing(1.5),\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(0.5)\r\n },\r\n [getSelectSimpleClass('tooltip', { suffix: '&' })]: {\r\n '.MuiSelect-icon': {\r\n right: theme.spacing(4.5)\r\n }\r\n }\r\n}))\r\n"],"names":["CreateSelectSimple","args","SelectSimple","props","_this$getDefaultValue","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$name","_this$props$name2","_this$props$name3","_this$props$slots$sel","_this$props$slots","label","getLabel","tfp","id","name","toString","labelId","defaultValue","getDefaultValue","value","state","onChange","event","target","setState","onBlur","temp","getOptions","find","x","_x$value","disabled","fullWidth","undefined","selectProps","slots","mergeObjects","tooltip","_jsx","className","selectSimpleClasses","tooltipWrap","children","RichTooltip","panel","HelpOutlinePulseIcon","fontSize","classes","root","push","join","_this$props$name$toSt","_this$props$name4","_ref","_this$props$defaultVa","_this$props$defaultVa2","_options$","_this$props","data","options","_ref2","_args$options","_inherits","Component","_createClass","key","_this$props$name5","_this$props$name6","this","errorMessage","getErrorMessage","messageErrors","_jsxs","Fragment","hidden","SelectSimpleStyled","getRootClasses","error","InputLabel","Select","_objectSpread","mapProps","map","item","MenuItem","Collapse","in","FormHelperText","message","renderTooltip","getSelectSimpleClass","concat","prefix","suffix","styled","FormControl","_ref3","theme","position","top","spacing","right","display","alignItems","gap"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as t,createClass as e,objectSpread2 as n,classCallCheck as r,callSuper as o,defineProperty as i,asyncToGenerator as a,regenerator as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as s,Fragment as u,jsx as d}from"react/jsx-runtime";import{Component as p}from"react";import{Autocomplete as c,TextField as f}from"@mui/material";import{getErrorMessage as v}from"./helpers.js";import{ApiAlertContext as h}from"../api-context/alert-global.js";var m=function(m){var g=function(){function g(t){var e,n,s;return r(this,g),n=o(this,g,[t]),i(n,"abortController",{signalController:new AbortController}),i(n,"refInput",null),i(n,"existedIds",[]),i(n,"getFetchDataFunc",(function(){var t,e;return null!==(t=null!==(e=n.props.fetchData)&&void 0!==e?e:null==m?void 0:m.fetchData)&&void 0!==t?t:function(){return Promise.resolve([])}})),i(n,"timer",{_timer:0,_second:500,callback:(s=a(l().m((function t(e){var r,o,i;return l().w((function(t){for(;;)switch(t.n){case 0:return t.p=0,n.abortController.signalController=new AbortController,t.n=1,n.getFetchDataFunc()(e,n.abortController.signalController.signal);case 1:r=t.v,o=n.getOptionsFilter(r,n.existedIds),n.setState({options:o}),t.n=3;break;case 2:t.p=2,t.v,null===(i=h.ApiAlert)||void 0===i||i.PushError("Error from server!");case 3:return t.p=3,n.setState({statusText:"no items"}),t.f(3);case 4:return t.a(2)}}),t,null,[[0,2,3,4]])}))),function(t){return s.apply(this,arguments)}),start:function(t){n.timer.clear(),n.timer._timer=window.setTimeout((function(){return n.timer.callback(t)}),n.timer._second)},clear:function(){n.abortController.signalController.abort(),clearTimeout(n.timer._timer)}}),i(n,"fetchData",a(l().m((function t(){var e,r,o,i,a,s;return l().w((function(t){for(;;)switch(t.n){case 0:return t.p=0,r=n.getDefaultValue(),t.n=1,n.getFetchDataFunc()(r,n.abortController.signalController.signal);case 1:if(o=t.v,Array.isArray(o)){t.n=2;break}return t.a(2);case 2:return i=n.getOptionsFilter(o,n.existedIds),a=null!==(e=i.find((function(t){return t.Id===r})))&&void 0!==e?e:null,n.setState({options:i,optionSelected:a,loading:!1}),t.a(2);case 3:t.p=3,t.v,null===(s=h.ApiAlert)||void 0===s||s.PushError("Error from server!");case 4:return t.p=4,n.setState({statusText:"no items",loading:!1}),t.f(4);case 5:return t.a(2)}}),t,null,[[0,3,4,5]])})))),i(n,"handleChange",(function(t,e){var r;n.setState({optionSelected:e}),n.refInput&&(n.refInput.value=null!==(r=null==e?void 0:e.Id)&&void 0!==r?r:""),n.props.onChange&&n.props.onChange(e)})),i(n,"handleInputChange",(function(t,e){var r,o={inputValue:e};if(e!==(null===(r=n.state.optionSelected)||void 0===r?void 0:r.Name)){var i=e.trim().toLowerCase(),a=n.state.options.findIndex((function(t){var e;return null===(e=t.Name)||void 0===e?void 0:e.trim().toLowerCase().includes(i)}));(a<0||""===i)&&(o.statusText="loading..."),n.setState(o,(function(){(a<0||""===i)&&n.timer.start(i)}))}else n.setState(o)})),i(n,"fillterOptions",(function(t,e){return t.filter((function(t){var n,r=e.inputValue.toLowerCase();return t.Id.toLowerCase().includes(r)||(null===(n=t.Name)||void 0===n?void 0:n.toLowerCase().includes(r))}))})),i(n,"getLabel",(function(){var t,e;return null!==(t=n.props.label)&&void 0!==t?t:null===(e=n.props.name)||void 0===e?void 0:e.toString()})),i(n,"getDefaultValue",(function(){var t,e,r;if(n.props.name)return null===(t=null!==(e=n.props.defaultValue)&&void 0!==e?e:null===(r=n.props.data)||void 0===r?void 0:r[n.props.name])||void 0===t?void 0:t.toString()})),n.state={options:[],statusText:"no items",optionSelected:null,inputValue:"",loading:!0},n.existedIds=null!==(e=t.existedIds)&&void 0!==e?e:[],n}return t(g,p),e(g,[{key:"render",value:function(){var t,e,r,o,i=this,a=this.getDefaultValue(),l=v(this.props.messageErrors,this.props.name);return s(u,{children:[d(c,{disabled:this.state.loading||this.props.disabled,fullWidth:!0,noOptionsText:this.state.statusText,options:this.state.options,getOptionLabel:function(t){var e;return null!==(e=t.Name)&&void 0!==e?e:t.Id},getOptionKey:function(t){return JSON.stringify(t)},isOptionEqualToValue:function(t,e){return t.Id.toString()===e.Id.toString()&&t.Name===e.Name},filterOptions:this.fillterOptions,value:this.state.optionSelected,onChange:this.handleChange,inputValue:this.state.inputValue,onInputChange:this.handleInputChange,renderInput:function(t){var e;return d(f,n(n({},t),{},{label:i.getLabel(),error:l.error,helperText:l.message,onBlur:function(){i.props.name&&i.props.onBlur&&i.props.onBlur(i.props.name)}},null===(e=i.props.slots)||void 0===e?void 0:e.textFieldProps))}}),d("input",{ref:function(t){return i.refInput=t},hidden:!0,name:null===(t=this.props.name)||void 0===t?void 0:t.toString(),defaultValue:a}),(null===(e=this.state.optionSelected)||void 0===e?void 0:e.Other)&&d("input",{hidden:!0,name:"".concat(null===(r=this.props.name)||void 0===r?void 0:r.toString(),"Other"),defaultValue:JSON.stringify(this.state.optionSelected.Other)},null!==(o=this.state.optionSelected.Id)&&void 0!==o?o:"key")]})}},{key:"componentDidMount",value:function(){this.fetchData()}},{key:"componentWillUnmount",value:function(){this.timer.clear()}},{key:"componentDidUpdate",value:function(t){var e;JSON.stringify(t.existedIds)!==JSON.stringify(this.props.existedIds)&&(this.existedIds=null!==(e=this.props.existedIds)&&void 0!==e?e:[])}},{key:"getOptionsFilter",value:function(t){var e=new Set(arguments.length>1&&void 0!==arguments[1]?arguments[1]:[]);return t.reduce((function(t,n){return e.has(n.Id)||(t.push(n),e.add(n.Id)),t}),[])}}])}();return g};export{m as default};
1
+ import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as o,classCallCheck as r,callSuper as i,asyncToGenerator as l,regenerator as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as s,jsx as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as d,Box as c,Autocomplete as f,TextField as v}from"@mui/material";import{getErrorMessage as h}from"./helpers.js";import{RichTooltip as m,HelpOutlinePulseIcon as g}from"../components/rich-tooltip.js";import{ApiAlertContext as S}from"../api-context/alert-global.js";var C=function(d){var c=function(){function c(e){var n,o,s;return r(this,c),o=i(this,c,[e]),t(o,"abortController",{signalController:new AbortController}),t(o,"refInput",null),t(o,"existedIds",[]),t(o,"renderTooltip",(function(){var t=o.props.tooltip||(null==d?void 0:d.tooltip);return t?u("div",{className:I.tooltipWrap,children:u(m,{panel:t,children:u(g,{fontSize:"small"})})}):null})),t(o,"getRootClasses",(function(){var t=[I.root];return(o.props.tooltip||(null==d?void 0:d.tooltip))&&t.push(I.tooltip),t.join(" ")})),t(o,"getFetchDataFunc",(function(){var t,e;return null!==(t=null!==(e=o.props.fetchData)&&void 0!==e?e:null==d?void 0:d.fetchData)&&void 0!==t?t:function(){return Promise.resolve([])}})),t(o,"timer",{_timer:0,_second:500,callback:(s=l(a().m((function t(e){var n,r,i;return a().w((function(t){for(;;)switch(t.n){case 0:return t.p=0,o.abortController.signalController=new AbortController,t.n=1,o.getFetchDataFunc()(e,o.abortController.signalController.signal);case 1:n=t.v,r=o.getOptionsFilter(n,o.existedIds),o.setState({options:r}),t.n=3;break;case 2:t.p=2,t.v,null===(i=S.ApiAlert)||void 0===i||i.PushError("Error from server!");case 3:return t.p=3,o.setState({statusText:"no items"}),t.f(3);case 4:return t.a(2)}}),t,null,[[0,2,3,4]])}))),function(t){return s.apply(this,arguments)}),start:function(t){o.timer.clear(),o.timer._timer=window.setTimeout((function(){return o.timer.callback(t)}),o.timer._second)},clear:function(){o.abortController.signalController.abort(),clearTimeout(o.timer._timer)}}),t(o,"fetchData",l(a().m((function t(){var e,n,r,i,l,s;return a().w((function(t){for(;;)switch(t.n){case 0:return t.p=0,n=o.getDefaultValue(),t.n=1,o.getFetchDataFunc()(n,o.abortController.signalController.signal);case 1:if(r=t.v,Array.isArray(r)){t.n=2;break}return t.a(2);case 2:return i=o.getOptionsFilter(r,o.existedIds),l=null!==(e=i.find((function(t){return t.Id===n})))&&void 0!==e?e:null,o.setState({options:i,optionSelected:l,loading:!1}),t.a(2);case 3:t.p=3,t.v,null===(s=S.ApiAlert)||void 0===s||s.PushError("Error from server!");case 4:return t.p=4,o.setState({statusText:"no items",loading:!1}),t.f(4);case 5:return t.a(2)}}),t,null,[[0,3,4,5]])})))),t(o,"handleChange",(function(t,e){var n;o.setState({optionSelected:e}),o.refInput&&(o.refInput.value=null!==(n=null==e?void 0:e.Id)&&void 0!==n?n:""),o.props.onChange&&o.props.onChange(e)})),t(o,"handleInputChange",(function(t,e){var n,r={inputValue:e};if(e!==(null===(n=o.state.optionSelected)||void 0===n?void 0:n.Name)){var i=e.trim().toLowerCase(),l=o.state.options.findIndex((function(t){var e;return null===(e=t.Name)||void 0===e?void 0:e.trim().toLowerCase().includes(i)}));(l<0||""===i)&&(r.statusText="loading..."),o.setState(r,(function(){(l<0||""===i)&&o.timer.start(i)}))}else o.setState(r)})),t(o,"fillterOptions",(function(t,e){return t.filter((function(t){var n,o=e.inputValue.toLowerCase();return t.Id.toLowerCase().includes(o)||(null===(n=t.Name)||void 0===n?void 0:n.toLowerCase().includes(o))}))})),t(o,"getLabel",(function(){var t,e;return null!==(t=o.props.label)&&void 0!==t?t:null===(e=o.props.name)||void 0===e?void 0:e.toString()})),t(o,"getDefaultValue",(function(){var t,e,n;if(o.props.name)return null===(t=null!==(e=o.props.defaultValue)&&void 0!==e?e:null===(n=o.props.data)||void 0===n?void 0:n[o.props.name])||void 0===t?void 0:t.toString()})),o.state={options:[],statusText:"no items",optionSelected:null,inputValue:"",loading:!0},o.existedIds=null!==(n=e.existedIds)&&void 0!==n?n:[],o}return e(c,p),n(c,[{key:"componentDidMount",value:function(){this.fetchData()}},{key:"componentWillUnmount",value:function(){this.timer.clear()}},{key:"componentDidUpdate",value:function(t){var e;JSON.stringify(t.existedIds)!==JSON.stringify(this.props.existedIds)&&(this.existedIds=null!==(e=this.props.existedIds)&&void 0!==e?e:[])}},{key:"render",value:function(){var t,e,n,r,i=this,l=this.getDefaultValue(),a=h(this.props.messageErrors,this.props.name);return s(b,{className:this.getRootClasses(),children:[u(f,{disabled:this.state.loading||this.props.disabled,fullWidth:!0,noOptionsText:this.state.statusText,options:this.state.options,getOptionLabel:function(t){var e;return null!==(e=t.Name)&&void 0!==e?e:t.Id},getOptionKey:function(t){return JSON.stringify(t)},isOptionEqualToValue:function(t,e){return t.Id.toString()===e.Id.toString()&&t.Name===e.Name},filterOptions:this.fillterOptions,value:this.state.optionSelected,onChange:this.handleChange,inputValue:this.state.inputValue,onInputChange:this.handleInputChange,renderInput:function(t){var e;return u(v,o(o({},t),{},{label:i.getLabel(),error:a.error,helperText:a.message,onBlur:function(){i.props.name&&i.props.onBlur&&i.props.onBlur(i.props.name)}},null===(e=i.props.slots)||void 0===e?void 0:e.textFieldProps))}}),u("input",{ref:function(t){return i.refInput=t},hidden:!0,name:null===(t=this.props.name)||void 0===t?void 0:t.toString(),defaultValue:l}),(null===(e=this.state.optionSelected)||void 0===e?void 0:e.Other)&&u("input",{hidden:!0,name:"".concat(null===(n=this.props.name)||void 0===n?void 0:n.toString(),"Other"),defaultValue:JSON.stringify(this.state.optionSelected.Other)},null!==(r=this.state.optionSelected.Id)&&void 0!==r?r:"key"),this.renderTooltip()]})}},{key:"getOptionsFilter",value:function(t){var e=new Set(arguments.length>1&&void 0!==arguments[1]?arguments[1]:[]);return t.reduce((function(t,n){return e.has(n.Id)||(t.push(n),e.add(n.Id)),t}),[])}}])}();return c},I={root:"SelectWithApi-root",tooltip:"SelectWithApi-tooltip",tooltipWrap:"SelectWithApi-tooltipWrap"},x=function(t,e){return"".concat((null==e?void 0:e.prefix)||"",".").concat(I[t]).concat((null==e?void 0:e.suffix)||"")},b=d(c)((function(e){var n=e.theme;return t(t(t({},x("root",{suffix:"&"}),{width:"100%",position:"relative"}),x("tooltipWrap"),{position:"absolute",top:n.spacing(2.25),right:n.spacing(1.5),display:"flex",alignItems:"center",gap:n.spacing(.5)}),x("tooltip",{suffix:"&"}),{".MuiInputBase-root .MuiAutocomplete-endAdornment":{right:n.spacing(4.5)}})}));export{C as default};
2
2
  //# sourceMappingURL=create.select-with-api.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.select-with-api.js","sources":["../../src/form/create.select-with-api.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Autocomplete, FilterOptionsState, TextField, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { ApiAlertContext } from '../api-context'\r\n\r\nexport interface ISelectWithApiOption<TOther = any> {\r\n Id: string\r\n Name?: string\r\n Other?: TOther\r\n}\r\n\r\nexport interface ISelectWithApiPropsSlots {\r\n textFieldProps: TextFieldProps\r\n}\r\n\r\nexport type ISelectWithApiFetchData<O extends ISelectWithApiOption> = (value?: string, signal?: AbortSignal) => Promise<O[]>\r\n\r\nexport interface ISelectWithApiProps<T, O extends ISelectWithApiOption> extends IFormInputBase<T>, ISelectWithApiParams<O> {\r\n onChange?: (value: O | null) => void\r\n existedIds?: string[]\r\n slots?: ISelectWithApiPropsSlots\r\n}\r\n\r\nexport interface ISelectWithApiState<O extends ISelectWithApiOption> {\r\n options: O[]\r\n statusText?: string\r\n optionSelected: O | null\r\n inputValue: string\r\n loading?: boolean\r\n}\r\n\r\nexport interface ISelectWithApiParams<O extends ISelectWithApiOption> {\r\n fetchData?: ISelectWithApiFetchData<O>\r\n}\r\n\r\nconst CreateSelectWithApi = function <T, O extends ISelectWithApiOption = ISelectWithApiOption>(\r\n params?: ISelectWithApiParams<O>\r\n): ComponentType<ISelectWithApiProps<T, O>> {\r\n class SelectWithApi extends Component<ISelectWithApiProps<T, O>, ISelectWithApiState<O>> {\r\n abortController = { signalController: new AbortController() }\r\n refInput: HTMLInputElement | null = null\r\n existedIds: string[] = []\r\n constructor(props: ISelectWithApiProps<T, O>) {\r\n super(props)\r\n this.state = {\r\n options: [],\r\n statusText: 'no items',\r\n optionSelected: null,\r\n inputValue: '',\r\n loading: true\r\n }\r\n this.existedIds = props.existedIds ?? []\r\n }\r\n\r\n render() {\r\n const defaultValue = this.getDefaultValue()\r\n const eMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n return (\r\n <>\r\n <Autocomplete\r\n disabled={this.state.loading || this.props.disabled}\r\n fullWidth\r\n noOptionsText={this.state.statusText}\r\n options={this.state.options}\r\n getOptionLabel={(x) => x.Name ?? x.Id}\r\n getOptionKey={(x) => JSON.stringify(x)}\r\n isOptionEqualToValue={(o, v) => o.Id.toString() === v.Id.toString() && o.Name === v.Name}\r\n filterOptions={this.fillterOptions}\r\n // select\r\n value={this.state.optionSelected}\r\n onChange={this.handleChange}\r\n // input\r\n inputValue={this.state.inputValue}\r\n onInputChange={this.handleInputChange}\r\n renderInput={(params) => (\r\n <TextField\r\n {...params}\r\n label={this.getLabel()}\r\n error={eMessage.error}\r\n helperText={eMessage.message}\r\n onBlur={() => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n }}\r\n {...this.props.slots?.textFieldProps}\r\n />\r\n )}\r\n />\r\n <input ref={(ref) => (this.refInput = ref)} hidden name={this.props.name?.toString()} defaultValue={defaultValue} />\r\n {this.state.optionSelected?.Other && (\r\n <input\r\n hidden\r\n name={`${this.props.name?.toString()}Other`}\r\n key={this.state.optionSelected.Id ?? 'key'}\r\n defaultValue={JSON.stringify(this.state.optionSelected.Other)}\r\n />\r\n )}\r\n </>\r\n )\r\n }\r\n\r\n componentDidMount() {\r\n this.fetchData()\r\n }\r\n\r\n componentWillUnmount(): void {\r\n this.timer.clear()\r\n }\r\n\r\n componentDidUpdate(prevProps: Readonly<ISelectWithApiProps<T, O>>): void {\r\n if (JSON.stringify(prevProps.existedIds) !== JSON.stringify(this.props.existedIds)) {\r\n this.existedIds = this.props.existedIds ?? []\r\n }\r\n }\r\n\r\n getFetchDataFunc = (): ISelectWithApiFetchData<O> => {\r\n return this.props.fetchData ?? params?.fetchData ?? (() => Promise.resolve([]))\r\n }\r\n\r\n timer = {\r\n _timer: 0,\r\n _second: 500,\r\n callback: async (value: string) => {\r\n try {\r\n this.abortController.signalController = new AbortController()\r\n const res = await this.getFetchDataFunc()(value, this.abortController.signalController.signal)\r\n const options = this.getOptionsFilter(res, this.existedIds)\r\n this.setState({ options })\r\n } catch (error) {\r\n // console.log(error)\r\n ApiAlertContext.ApiAlert?.PushError('Error from server!')\r\n } finally {\r\n this.setState({ statusText: 'no items' })\r\n }\r\n },\r\n start: (text: string) => {\r\n this.timer.clear()\r\n this.timer._timer = window.setTimeout(() => this.timer.callback(text), this.timer._second)\r\n },\r\n clear: () => {\r\n this.abortController.signalController.abort()\r\n clearTimeout(this.timer._timer)\r\n }\r\n }\r\n\r\n fetchData = async () => {\r\n try {\r\n const defaultValue = this.getDefaultValue()\r\n const res = await this.getFetchDataFunc()(defaultValue, this.abortController.signalController.signal)\r\n if (!Array.isArray(res)) return\r\n const options = this.getOptionsFilter(res, this.existedIds)\r\n const optionSelected = options.find((x) => x.Id === defaultValue) ?? null\r\n this.setState({ options, optionSelected, loading: false })\r\n return\r\n } catch (error) {\r\n // console.log(error)\r\n ApiAlertContext.ApiAlert?.PushError('Error from server!')\r\n } finally {\r\n this.setState({ statusText: 'no items', loading: false })\r\n }\r\n }\r\n\r\n handleChange = (_: React.SyntheticEvent, value: O | null) => {\r\n this.setState({ optionSelected: value })\r\n if (this.refInput) this.refInput.value = value?.Id ?? ''\r\n this.props.onChange && this.props.onChange(value)\r\n }\r\n\r\n handleInputChange = (_: React.SyntheticEvent, value: string) => {\r\n const state: Pick<ISelectWithApiState<O>, 'inputValue' | 'statusText' | 'loading'> = { inputValue: value }\r\n if (value === this.state.optionSelected?.Name) {\r\n this.setState(state)\r\n return\r\n }\r\n const valueFormated = value.trim().toLowerCase()\r\n const selectedIndex = this.state.options.findIndex((x) => {\r\n return x.Name?.trim().toLowerCase().includes(valueFormated)\r\n })\r\n if (selectedIndex < 0 || valueFormated === '') state.statusText = 'loading...'\r\n this.setState(state, () => {\r\n if (selectedIndex < 0 || valueFormated === '') this.timer.start(valueFormated)\r\n })\r\n }\r\n\r\n fillterOptions = (options: O[], state: FilterOptionsState<O>) => {\r\n return options.filter((x) => {\r\n const value = state.inputValue.toLowerCase()\r\n return x.Id.toLowerCase().includes(value) || x.Name?.toLowerCase().includes(value)\r\n })\r\n }\r\n\r\n getLabel = () => {\r\n return this.props.label ?? this.props.name?.toString()\r\n }\r\n\r\n getDefaultValue = () => {\r\n if (!this.props.name) return\r\n return (this.props.defaultValue ?? this.props.data?.[this.props.name])?.toString()\r\n }\r\n\r\n getOptionsFilter<O extends ISelectWithApiOption = ISelectWithApiOption>(options: O[], existedId: string[] = []): O[] {\r\n const ids = new Set<string | number>(existedId)\r\n return options.reduce<O[]>((a, b) => {\r\n if (!ids.has(b.Id)) {\r\n a.push(b)\r\n ids.add(b.Id)\r\n }\r\n return a\r\n }, [])\r\n }\r\n }\r\n return SelectWithApi\r\n}\r\nexport default CreateSelectWithApi\r\n"],"names":["CreateSelectWithApi","params","SelectWithApi","props","_props$existedIds","_this","_callback","_classCallCheck","_callSuper","_defineProperty","signalController","AbortController","_ref","_this$props$fetchData","fetchData","Promise","resolve","_timer","_second","callback","_asyncToGenerator","_regenerator","m","_callee","value","res","options","_ApiAlertContext$ApiA","w","_context","n","p","abortController","getFetchDataFunc","signal","v","getOptionsFilter","existedIds","setState","ApiAlertContext","ApiAlert","PushError","statusText","f","a","_x","apply","this","arguments","start","text","timer","clear","window","setTimeout","abort","clearTimeout","_callee2","_options$find","defaultValue","optionSelected","_ApiAlertContext$ApiA2","_context2","getDefaultValue","Array","isArray","find","x","Id","loading","_","_value$Id","refInput","onChange","_this$state$optionSel","state","inputValue","Name","valueFormated","trim","toLowerCase","selectedIndex","findIndex","_x$Name","includes","filter","_x$Name2","_this$props$label","_this$props$name","label","name","toString","_ref3","_this$props$defaultVa","_this$props$data","data","_inherits","Component","_createClass","key","_this$props$name2","_this$state$optionSel2","_this$props$name3","_this$state$optionSel3","_this2","eMessage","getErrorMessage","messageErrors","_jsxs","_jsx","Autocomplete","disabled","fullWidth","noOptionsText","getOptionLabel","_x$Name3","getOptionKey","JSON","stringify","isOptionEqualToValue","o","filterOptions","fillterOptions","handleChange","onInputChange","handleInputChange","renderInput","_this2$props$slots","TextField","_objectSpread","getLabel","error","helperText","message","onBlur","slots","textFieldProps","ref","hidden","Other","concat","prevProps","_this$props$existedId","ids","Set","length","undefined","reduce","b","has","push","add"],"mappings":"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"}
1
+ {"version":3,"file":"create.select-with-api.js","sources":["../../src/form/create.select-with-api.tsx"],"sourcesContent":["import { Component } from 'react'\r\nimport { Autocomplete, Box, styled, TextField } from '@mui/material'\r\nimport type { ComponentType } from 'react'\r\nimport type { FilterOptionsState, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { ApiAlertContext } from '../api-context'\r\nimport { RichTooltip, HelpOutlinePulseIcon } from '../components/rich-tooltip'\r\nimport type { IRichTooltipPanelConfig } from '../components/rich-tooltip'\r\n\r\nexport interface ISelectWithApiOption<TOther = any> {\r\n Id: string\r\n Name?: string\r\n Other?: TOther\r\n}\r\n\r\nexport interface ISelectWithApiPropsSlots {\r\n textFieldProps: TextFieldProps\r\n}\r\n\r\nexport type ISelectWithApiFetchData<O extends ISelectWithApiOption> = (value?: string, signal?: AbortSignal) => Promise<O[]>\r\n\r\nexport interface ISelectWithApiProps<T, O extends ISelectWithApiOption> extends IFormInputBase<T>, ISelectWithApiParams<O> {\r\n tooltip?: IRichTooltipPanelConfig\r\n onChange?: (value: O | null) => void\r\n existedIds?: string[]\r\n slots?: ISelectWithApiPropsSlots\r\n}\r\n\r\nexport interface ISelectWithApiState<O extends ISelectWithApiOption> {\r\n options: O[]\r\n statusText?: string\r\n optionSelected: O | null\r\n inputValue: string\r\n loading?: boolean\r\n}\r\n\r\nexport interface ISelectWithApiParams<O extends ISelectWithApiOption> {\r\n fetchData?: ISelectWithApiFetchData<O>\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nconst CreateSelectWithApi = function <T, O extends ISelectWithApiOption = ISelectWithApiOption>(\r\n params?: ISelectWithApiParams<O>\r\n): ComponentType<ISelectWithApiProps<T, O>> {\r\n class SelectWithApi extends Component<ISelectWithApiProps<T, O>, ISelectWithApiState<O>> {\r\n abortController = { signalController: new AbortController() }\r\n refInput: HTMLInputElement | null = null\r\n existedIds: string[] = []\r\n constructor(props: ISelectWithApiProps<T, O>) {\r\n super(props)\r\n this.state = {\r\n options: [],\r\n statusText: 'no items',\r\n optionSelected: null,\r\n inputValue: '',\r\n loading: true\r\n }\r\n this.existedIds = props.existedIds ?? []\r\n }\r\n\r\n componentDidMount() {\r\n this.fetchData()\r\n }\r\n\r\n componentWillUnmount(): void {\r\n this.timer.clear()\r\n }\r\n\r\n componentDidUpdate(prevProps: Readonly<ISelectWithApiProps<T, O>>): void {\r\n if (JSON.stringify(prevProps.existedIds) !== JSON.stringify(this.props.existedIds)) {\r\n this.existedIds = this.props.existedIds ?? []\r\n }\r\n }\r\n\r\n render() {\r\n const defaultValue = this.getDefaultValue()\r\n const eMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n return (\r\n <SelectWithApiStyled className={this.getRootClasses()}>\r\n <Autocomplete\r\n disabled={this.state.loading || this.props.disabled}\r\n fullWidth\r\n noOptionsText={this.state.statusText}\r\n options={this.state.options}\r\n getOptionLabel={(x) => x.Name ?? x.Id}\r\n getOptionKey={(x) => JSON.stringify(x)}\r\n isOptionEqualToValue={(o, v) => o.Id.toString() === v.Id.toString() && o.Name === v.Name}\r\n filterOptions={this.fillterOptions}\r\n // select\r\n value={this.state.optionSelected}\r\n onChange={this.handleChange}\r\n // input\r\n inputValue={this.state.inputValue}\r\n onInputChange={this.handleInputChange}\r\n renderInput={(params) => (\r\n <TextField\r\n {...params}\r\n label={this.getLabel()}\r\n error={eMessage.error}\r\n helperText={eMessage.message}\r\n onBlur={() => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n }}\r\n {...this.props.slots?.textFieldProps}\r\n />\r\n )}\r\n />\r\n <input ref={(ref) => (this.refInput = ref)} hidden name={this.props.name?.toString()} defaultValue={defaultValue} />\r\n {this.state.optionSelected?.Other && (\r\n <input\r\n hidden\r\n name={`${this.props.name?.toString()}Other`}\r\n key={this.state.optionSelected.Id ?? 'key'}\r\n defaultValue={JSON.stringify(this.state.optionSelected.Other)}\r\n />\r\n )}\r\n {this.renderTooltip()}\r\n </SelectWithApiStyled>\r\n )\r\n }\r\n\r\n renderTooltip = () => {\r\n const tooltip = this.props.tooltip || params?.tooltip\r\n if (!tooltip) return null\r\n return (\r\n <div className={selectWithApiClasses.tooltipWrap}>\r\n <RichTooltip panel={tooltip}>\r\n <HelpOutlinePulseIcon fontSize='small' />\r\n </RichTooltip>\r\n </div>\r\n )\r\n }\r\n\r\n getRootClasses = () => {\r\n const classes = [selectWithApiClasses.root]\r\n const tooltip = this.props.tooltip || params?.tooltip\r\n if (tooltip) classes.push(selectWithApiClasses.tooltip)\r\n return classes.join(' ')\r\n }\r\n\r\n getFetchDataFunc = (): ISelectWithApiFetchData<O> => {\r\n return this.props.fetchData ?? params?.fetchData ?? (() => Promise.resolve([]))\r\n }\r\n\r\n timer = {\r\n _timer: 0,\r\n _second: 500,\r\n callback: async (value: string) => {\r\n try {\r\n this.abortController.signalController = new AbortController()\r\n const res = await this.getFetchDataFunc()(value, this.abortController.signalController.signal)\r\n const options = this.getOptionsFilter(res, this.existedIds)\r\n this.setState({ options })\r\n } catch (error) {\r\n // console.log(error)\r\n ApiAlertContext.ApiAlert?.PushError('Error from server!')\r\n } finally {\r\n this.setState({ statusText: 'no items' })\r\n }\r\n },\r\n start: (text: string) => {\r\n this.timer.clear()\r\n this.timer._timer = window.setTimeout(() => this.timer.callback(text), this.timer._second)\r\n },\r\n clear: () => {\r\n this.abortController.signalController.abort()\r\n clearTimeout(this.timer._timer)\r\n }\r\n }\r\n\r\n fetchData = async () => {\r\n try {\r\n const defaultValue = this.getDefaultValue()\r\n const res = await this.getFetchDataFunc()(defaultValue, this.abortController.signalController.signal)\r\n if (!Array.isArray(res)) return\r\n const options = this.getOptionsFilter(res, this.existedIds)\r\n const optionSelected = options.find((x) => x.Id === defaultValue) ?? null\r\n this.setState({ options, optionSelected, loading: false })\r\n return\r\n } catch (error) {\r\n // console.log(error)\r\n ApiAlertContext.ApiAlert?.PushError('Error from server!')\r\n } finally {\r\n this.setState({ statusText: 'no items', loading: false })\r\n }\r\n }\r\n\r\n handleChange = (_: React.SyntheticEvent, value: O | null) => {\r\n this.setState({ optionSelected: value })\r\n if (this.refInput) this.refInput.value = value?.Id ?? ''\r\n this.props.onChange && this.props.onChange(value)\r\n }\r\n\r\n handleInputChange = (_: React.SyntheticEvent, value: string) => {\r\n const state: Pick<ISelectWithApiState<O>, 'inputValue' | 'statusText' | 'loading'> = { inputValue: value }\r\n if (value === this.state.optionSelected?.Name) {\r\n this.setState(state)\r\n return\r\n }\r\n const valueFormated = value.trim().toLowerCase()\r\n const selectedIndex = this.state.options.findIndex((x) => {\r\n return x.Name?.trim().toLowerCase().includes(valueFormated)\r\n })\r\n if (selectedIndex < 0 || valueFormated === '') state.statusText = 'loading...'\r\n this.setState(state, () => {\r\n if (selectedIndex < 0 || valueFormated === '') this.timer.start(valueFormated)\r\n })\r\n }\r\n\r\n fillterOptions = (options: O[], state: FilterOptionsState<O>) => {\r\n return options.filter((x) => {\r\n const value = state.inputValue.toLowerCase()\r\n return x.Id.toLowerCase().includes(value) || x.Name?.toLowerCase().includes(value)\r\n })\r\n }\r\n\r\n getLabel = () => {\r\n return this.props.label ?? this.props.name?.toString()\r\n }\r\n\r\n getDefaultValue = () => {\r\n if (!this.props.name) return\r\n return (this.props.defaultValue ?? this.props.data?.[this.props.name])?.toString()\r\n }\r\n\r\n getOptionsFilter<O extends ISelectWithApiOption = ISelectWithApiOption>(options: O[], existedId: string[] = []): O[] {\r\n const ids = new Set<string | number>(existedId)\r\n return options.reduce<O[]>((a, b) => {\r\n if (!ids.has(b.Id)) {\r\n a.push(b)\r\n ids.add(b.Id)\r\n }\r\n return a\r\n }, [])\r\n }\r\n }\r\n return SelectWithApi\r\n}\r\nexport default CreateSelectWithApi\r\n\r\nconst selectWithApiClasses = {\r\n root: 'SelectWithApi-root',\r\n tooltip: 'SelectWithApi-tooltip',\r\n tooltipWrap: 'SelectWithApi-tooltipWrap'\r\n}\r\n\r\nconst getSelectWithApiClass = (key: keyof typeof selectWithApiClasses, options?: { prefix?: string; suffix?: string }) => {\r\n return `${options?.prefix || ''}.${selectWithApiClasses[key]}${options?.suffix || ''}`\r\n}\r\n\r\nconst SelectWithApiStyled = styled(Box)(({ theme }) => ({\r\n [getSelectWithApiClass('root', { suffix: '&' })]: {\r\n width: '100%',\r\n position: 'relative'\r\n },\r\n [getSelectWithApiClass('tooltipWrap')]: {\r\n position: 'absolute',\r\n top: theme.spacing(2.25),\r\n right: theme.spacing(1.5),\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: theme.spacing(0.5)\r\n },\r\n [getSelectWithApiClass('tooltip', { suffix: '&' })]: {\r\n '.MuiInputBase-root .MuiAutocomplete-endAdornment': {\r\n right: theme.spacing(4.5)\r\n }\r\n }\r\n}))\r\n"],"names":["CreateSelectWithApi","params","SelectWithApi","props","_props$existedIds","_this","_callback","_classCallCheck","_callSuper","_defineProperty","signalController","AbortController","tooltip","_jsx","className","selectWithApiClasses","tooltipWrap","children","RichTooltip","panel","HelpOutlinePulseIcon","fontSize","classes","root","push","join","_ref","_this$props$fetchData","fetchData","Promise","resolve","_timer","_second","callback","_asyncToGenerator","_regenerator","m","_callee","value","res","options","_ApiAlertContext$ApiA","w","_context","n","p","abortController","getFetchDataFunc","signal","v","getOptionsFilter","existedIds","setState","ApiAlertContext","ApiAlert","PushError","statusText","f","a","_x","apply","this","arguments","start","text","timer","clear","window","setTimeout","abort","clearTimeout","_callee2","_options$find","defaultValue","optionSelected","_ApiAlertContext$ApiA2","_context2","getDefaultValue","Array","isArray","find","x","Id","loading","_","_value$Id","refInput","onChange","_this$state$optionSel","state","inputValue","Name","valueFormated","trim","toLowerCase","selectedIndex","findIndex","_x$Name","includes","filter","_x$Name2","_this$props$label","_this$props$name","label","name","toString","_ref3","_this$props$defaultVa","_this$props$data","data","_inherits","Component","_createClass","key","prevProps","_this$props$existedId","JSON","stringify","_this$props$name2","_this$state$optionSel2","_this$props$name3","_this$state$optionSel3","_this2","eMessage","getErrorMessage","messageErrors","_jsxs","SelectWithApiStyled","getRootClasses","Autocomplete","disabled","fullWidth","noOptionsText","getOptionLabel","_x$Name3","getOptionKey","isOptionEqualToValue","o","filterOptions","fillterOptions","handleChange","onInputChange","handleInputChange","renderInput","_this2$props$slots","TextField","_objectSpread","getLabel","error","helperText","message","onBlur","slots","textFieldProps","ref","hidden","Other","concat","renderTooltip","ids","Set","length","undefined","reduce","b","has","add","getSelectWithApiClass","prefix","suffix","styled","Box","_ref5","theme","width","position","top","spacing","right","display","alignItems","gap"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sources":["../../src/redux/types.ts"],"sourcesContent":["export enum ELazyStatus {\r\n Loading = 'Loading',\r\n Loaded = 'Loaded',\r\n Error = 'Error'\r\n}\r\n\r\nexport interface IDinoReduxState {\r\n status: ELazyStatus\r\n requestedId?: string\r\n}\r\n\r\nexport interface IReturnDispatch {\r\n abort?: () => void\r\n}\r\n\r\nexport interface IDinoReduxDispatch<P = any> {\r\n fetchData?: (params?: P, signal?: AbortSignal) => IReturnDispatch\r\n setStatus: (status: ELazyStatus) => void\r\n}\r\n\r\nexport interface IBaseActions<T, Id extends keyof T> {\r\n create: (value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n update: (id: T[Id], value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n delete: (id: T[Id], value?: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n}\r\n\r\nexport type IDinoReduxActions<T, Id extends keyof T, K extends keyof IBaseActions<T, Id> = keyof IBaseActions<T, Id>> = Pick<IBaseActions<T, Id>, K>\r\n"],"names":["ELazyStatus"],"mappings":"IAAYA,GAAZ,SAAYA,GACVA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA"}
1
+ {"version":3,"file":"types.js","sources":["../../src/redux/types.ts"],"sourcesContent":["export enum ELazyStatus {\r\n Loading = 'Loading',\r\n Loaded = 'Loaded',\r\n Error = 'Error'\r\n}\r\n\r\nexport interface IDinoReduxState {\r\n status: ELazyStatus\r\n requestedId?: string\r\n}\r\n\r\nexport interface IReturnDispatch {\r\n abort?: () => void\r\n}\r\n\r\nexport interface IDinoReduxDispatch<P = any> {\r\n fetchData?: (params?: P, signal?: AbortSignal) => IReturnDispatch\r\n setStatus: (status: ELazyStatus) => void\r\n}\r\n\r\nexport interface IBaseActions<T, Id extends keyof T> {\r\n create: (value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n update: (id: T[Id], value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n updatePatch: (oldValue: T, value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n delete: (id: T[Id], value?: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n}\r\n\r\nexport type IDinoReduxActions<T, Id extends keyof T, K extends keyof IBaseActions<T, Id> = keyof IBaseActions<T, Id>> = Pick<IBaseActions<T, Id>, K>\r\n"],"names":["ELazyStatus"],"mappings":"IAAYA,GAAZ,SAAYA,GACVA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,MAAA,OACD,CAJD,CAAYA,IAAAA,EAIX,CAAA"}
@@ -1,2 +1,2 @@
1
- import{objectSpread2 as r,inherits as e,createClass as t,classCallCheck as n,callSuper as i,defineProperty as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as s,Fragment as o}from"react/jsx-runtime";import{Component as p}from"react";import{GridToolbar as c,GridToolbarQuickFilter as d}from"@mui/x-data-grid";import{styled as u,Typography as f,Box as m}from"@mui/material";import{BtnFormCreate as h}from"./ui.buttons.js";import{Breadcrumbs as x}from"../components/breadcrumbs.js";import g from"../components/help-tooltip.js";var b=function(){function r(){var e;n(this,r);for(var t=arguments.length,p=new Array(t),c=0;c<t;c++)p[c]=arguments[c];return e=i(this,r,[].concat(p)),a(e,"renderTitle",(function(){var r=e.props,t=r.title,n=r.afterTitle,i=r.breadcrumbs;if(!(!!t||!!i||!!n))return l(o,{});var a=t;return"string"==typeof t&&(a=l(y,{children:t})),i&&(a=l(x,{value:i})),s(m,{sx:{height:"56px",display:"flex",alignItems:"center"},children:[a,n]})})),a(e,"renderEndAdornment",(function(){return!e.props.searchInclude||e.props.searchInclude.length<=0?l(o,{}):l(g,{title:"The search includes",small:!0,children:l(v,{children:e.props.searchInclude.map((function(r,e){return l("li",{children:l(f,{variant:"body2",children:r})},e)}))})})})),e}return e(r,p),t(r,[{key:"render",value:function(){return s(m,{sx:{padding:"0 6px"},children:[this.renderTitle(),s(m,{sx:{display:"flex"},children:[s(m,{sx:{flex:1,display:"flex",alignItems:"center",flexWrap:"wrap"},children:[l(c,{sx:{padding:0}}),this.props.formCreate&&l(h,{children:this.props.formCreate}),this.props.afterAction]}),l(m,{sx:{display:"flex",gap:"8px",alignItems:"center"},children:s(m,{sx:{display:"flex",alignItems:"center"},children:[l(d,{fullWidth:!0,variant:"standard",size:"small",debounceMs:800,quickFilterParser:function(r){return[r]}}),this.renderEndAdornment()]})})]})]})}}])}(),v=u("ul")({margin:"0 0 0 18px",padding:0,li:{position:"relative"},"li::after":{content:'"►"',display:"inline-block",top:"50%",transform:"translateY(-50%)",position:"absolute",left:"-18px"}}),y=u((function(e){return l(f,r({noWrap:!0,variant:"subtitle1"},e))}))({fontWeight:700,flex:1});export{b as default};
1
+ import{objectSpread2 as r,inherits as e,createClass as t,classCallCheck as n,callSuper as i,defineProperty as a}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as s,Fragment as o}from"react/jsx-runtime";import{Component as p}from"react";import{GridToolbar as c,GridToolbarQuickFilter as d}from"@mui/x-data-grid";import{styled as u,Typography as f,Box as m}from"@mui/material";import{BtnFormCreate as h}from"./ui.buttons.js";import{Breadcrumbs as x}from"../components/breadcrumbs.js";import{HelpTooltip as g}from"../components/help-tooltip.js";var b=function(){function r(){var e;n(this,r);for(var t=arguments.length,p=new Array(t),c=0;c<t;c++)p[c]=arguments[c];return e=i(this,r,[].concat(p)),a(e,"renderTitle",(function(){var r=e.props,t=r.title,n=r.afterTitle,i=r.breadcrumbs;if(!(!!t||!!i||!!n))return l(o,{});var a=t;return"string"==typeof t&&(a=l(y,{children:t})),i&&(a=l(x,{value:i})),s(m,{sx:{height:"56px",display:"flex",alignItems:"center"},children:[a,n]})})),a(e,"renderEndAdornment",(function(){return!e.props.searchInclude||e.props.searchInclude.length<=0?l(o,{}):l(g,{title:"The search includes",small:!0,children:l(v,{children:e.props.searchInclude.map((function(r,e){return l("li",{children:l(f,{variant:"body2",children:r})},e)}))})})})),e}return e(r,p),t(r,[{key:"render",value:function(){return s(m,{sx:{padding:"0 6px"},children:[this.renderTitle(),s(m,{sx:{display:"flex"},children:[s(m,{sx:{flex:1,display:"flex",alignItems:"center",flexWrap:"wrap"},children:[l(c,{sx:{padding:0}}),this.props.formCreate&&l(h,{children:this.props.formCreate}),this.props.afterAction]}),l(m,{sx:{display:"flex",gap:"8px",alignItems:"center"},children:s(m,{sx:{display:"flex",alignItems:"center"},children:[l(d,{fullWidth:!0,variant:"standard",size:"small",debounceMs:800,quickFilterParser:function(r){return[r]}}),this.renderEndAdornment()]})})]})]})}}])}(),v=u("ul")({margin:"0 0 0 18px",padding:0,li:{position:"relative"},"li::after":{content:'"►"',display:"inline-block",top:"50%",transform:"translateY(-50%)",position:"absolute",left:"-18px"}}),y=u((function(e){return l(f,r({noWrap:!0,variant:"subtitle1"},e))}))({fontWeight:700,flex:1});export{b as default};
2
2
  //# sourceMappingURL=toolbar-pannel.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"toolbar-pannel.js","sources":["../../src/table/toolbar-pannel.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { GridToolbar, GridToolbarQuickFilter } from '@mui/x-data-grid'\r\nimport { Box, styled, Typography, TypographyProps } from '@mui/material'\r\nimport { BtnFormCreate } from './ui.buttons'\r\nimport { Breadcrumbs, IBreadcrumbConfig, HelpTooltip } from '../components'\r\n\r\nexport interface IToolbarPannelOptions {\r\n searchInclude?: string[]\r\n formCreate?: React.ReactNode\r\n afterAction?: React.ReactNode\r\n breadcrumbs?: IBreadcrumbConfig[]\r\n}\r\n\r\nexport interface IToolbarPannelProps extends IToolbarPannelOptions {\r\n title?: React.ReactNode\r\n afterTitle?: React.ReactNode\r\n}\r\n\r\nclass ToolbarPannel extends Component<React.PropsWithChildren<IToolbarPannelProps>> {\r\n render() {\r\n return (\r\n <Box sx={{ padding: '0 6px' }}>\r\n {this.renderTitle()}\r\n <Box sx={{ display: 'flex' }}>\r\n <Box sx={{ flex: 1, display: 'flex', alignItems: 'center', flexWrap: 'wrap' }}>\r\n <GridToolbar sx={{ padding: 0 }} />\r\n {this.props.formCreate && <BtnFormCreate>{this.props.formCreate}</BtnFormCreate>}\r\n {this.props.afterAction}\r\n </Box>\r\n <Box sx={{ display: 'flex', gap: '8px', alignItems: 'center' }}>\r\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\r\n <GridToolbarQuickFilter fullWidth variant='standard' size='small' debounceMs={800} quickFilterParser={(x: any) => [x]} />\r\n {this.renderEndAdornment()}\r\n </Box>\r\n </Box>\r\n </Box>\r\n </Box>\r\n )\r\n }\r\n\r\n renderTitle = () => {\r\n const { title, afterTitle, breadcrumbs } = this.props\r\n\r\n const isVisible = !!title || !!breadcrumbs || !!afterTitle\r\n if (!isVisible) return <></>\r\n\r\n let titleElm = title\r\n if (typeof title === 'string') titleElm = <Title>{title}</Title>\r\n if (breadcrumbs) titleElm = <Breadcrumbs value={breadcrumbs} />\r\n\r\n return (\r\n <Box sx={{ height: '56px', display: 'flex', alignItems: 'center' }}>\r\n {titleElm}\r\n {afterTitle}\r\n </Box>\r\n )\r\n }\r\n\r\n renderEndAdornment = () => {\r\n if (!this.props.searchInclude || this.props.searchInclude.length <= 0) return <></>\r\n return (\r\n <HelpTooltip title='The search includes' small>\r\n <SeachHelp>\r\n {this.props.searchInclude.map((item, index) => (\r\n <li key={index}>\r\n <Typography variant='body2'>{item}</Typography>\r\n </li>\r\n ))}\r\n </SeachHelp>\r\n </HelpTooltip>\r\n )\r\n }\r\n}\r\n\r\nexport default ToolbarPannel\r\n\r\nconst SeachHelp = styled('ul')({\r\n margin: '0 0 0 18px',\r\n padding: 0,\r\n li: {\r\n position: 'relative'\r\n },\r\n 'li::after': {\r\n content: '\"►\"',\r\n display: 'inline-block',\r\n top: '50%',\r\n transform: 'translateY(-50%)',\r\n position: 'absolute',\r\n left: '-18px'\r\n }\r\n})\r\n\r\nconst Title = styled((props: TypographyProps) => <Typography noWrap variant='subtitle1' {...props} />)({\r\n fontWeight: 700,\r\n flex: 1\r\n})\r\n"],"names":["ToolbarPannel","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_this$props","props","title","afterTitle","breadcrumbs","_jsx","titleElm","Title","children","Breadcrumbs","value","_jsxs","Box","sx","height","display","alignItems","searchInclude","HelpTooltip","small","SeachHelp","map","item","index","Typography","variant","_inherits","Component","_createClass","key","padding","renderTitle","flex","flexWrap","GridToolbar","formCreate","BtnFormCreate","afterAction","gap","GridToolbarQuickFilter","fullWidth","size","debounceMs","quickFilterParser","x","renderEndAdornment","styled","margin","li","position","content","top","transform","left","_objectSpread","noWrap","fontWeight"],"mappings":"oiBAkBMA,IAAAA,aAAc,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GAqDjB,OArDiBP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,eAsBJ,WACZ,IAAAY,EAA2CZ,EAAKa,MAAxCC,EAAKF,EAALE,MAAOC,EAAUH,EAAVG,WAAYC,EAAWJ,EAAXI,YAG3B,OADoBF,KAAWE,KAAiBD,GAChC,OAAOE,QAEvB,IAAIC,EAAWJ,EAIf,MAHqB,iBAAVA,IAAoBI,EAAWD,EAACE,EAAO,CAAAC,SAAAN,KAC9CE,IAAaE,EAAWD,EAACI,EAAW,CAACC,MAAON,KAG9CO,EAACC,EAAI,CAAAC,GAAI,CAAEC,OAAQ,OAAQC,QAAS,OAAQC,WAAY,UACrDR,SAAA,CAAAF,EACAH,QAGNJ,EAAAX,EAAA,sBAEoB,WACnB,OAAKA,EAAKa,MAAMgB,eAAiB7B,EAAKa,MAAMgB,cAAczB,QAAU,EAAUa,QAE5EA,EAACa,EAAW,CAAChB,MAAM,sBAAsBiB,OAAK,EAAAX,SAC5CH,EAACe,EAAS,CAAAZ,SACPpB,EAAKa,MAAMgB,cAAcI,KAAI,SAACC,EAAMC,GAAK,OACxClB,iBACEA,EAACmB,EAAW,CAAAC,QAAQ,iBAASH,KADtBC,EAGV,WAIRnC,CAAA,CAAA,OAAAsC,EAAAvC,EArDyBwC,GAqDzBC,EAAAzC,EAAA,CAAA,CAAA0C,IAAA,SAAAnB,MApDD,WACE,OACEC,EAACC,EAAI,CAAAC,GAAI,CAAEiB,QAAS,SACjBtB,SAAA,CAAAX,KAAKkC,cACNpB,EAACC,EAAG,CAACC,GAAI,CAAEE,QAAS,QAAQP,SAAA,CAC1BG,EAACC,GAAIC,GAAI,CAAEmB,KAAM,EAAGjB,QAAS,OAAQC,WAAY,SAAUiB,SAAU,kBACnE5B,EAAC6B,EAAY,CAAArB,GAAI,CAAEiB,QAAS,KAC3BjC,KAAKI,MAAMkC,YAAc9B,EAAC+B,EAAe,CAAA5B,SAAAX,KAAKI,MAAMkC,aACpDtC,KAAKI,MAAMoC,eAEdhC,EAACO,EAAG,CAACC,GAAI,CAAEE,QAAS,OAAQuB,IAAK,MAAOtB,WAAY,UAClDR,SAAAG,EAACC,EAAI,CAAAC,GAAI,CAAEE,QAAS,OAAQC,WAAY,UACtCR,SAAA,CAAAH,EAACkC,EAAuB,CAAAC,WAAU,EAAAf,QAAQ,WAAWgB,KAAK,QAAQC,WAAY,IAAKC,kBAAmB,SAACC,GAAM,MAAK,CAACA,EAAE,IACpH/C,KAAKgD,+BAMlB,IAAC,IAsCGzB,EAAY0B,EAAO,KAAPA,CAAa,CAC7BC,OAAQ,aACRjB,QAAS,EACTkB,GAAI,CACFC,SAAU,YAEZ,YAAa,CACXC,QAAS,MACTnC,QAAS,eACToC,IAAK,MACLC,UAAW,mBACXH,SAAU,WACVI,KAAM,WAIJ9C,EAAQuC,GAAO,SAAC7C,GAAsB,OAAKI,EAACmB,EAAU8B,EAAA,CAACC,UAAO9B,QAAQ,aAAgBxB,GAAS,GAAvF6C,CAAyF,CACrGU,WAAY,IACZxB,KAAM"}
1
+ {"version":3,"file":"toolbar-pannel.js","sources":["../../src/table/toolbar-pannel.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { GridToolbar, GridToolbarQuickFilter } from '@mui/x-data-grid'\r\nimport { Box, styled, Typography, TypographyProps } from '@mui/material'\r\nimport { BtnFormCreate } from './ui.buttons'\r\nimport { Breadcrumbs, IBreadcrumbConfig, HelpTooltip } from '../components'\r\n\r\nexport interface IToolbarPannelOptions {\r\n searchInclude?: string[]\r\n formCreate?: React.ReactNode\r\n afterAction?: React.ReactNode\r\n breadcrumbs?: IBreadcrumbConfig[]\r\n}\r\n\r\nexport interface IToolbarPannelProps extends IToolbarPannelOptions {\r\n title?: React.ReactNode\r\n afterTitle?: React.ReactNode\r\n}\r\n\r\nclass ToolbarPannel extends Component<React.PropsWithChildren<IToolbarPannelProps>> {\r\n render() {\r\n return (\r\n <Box sx={{ padding: '0 6px' }}>\r\n {this.renderTitle()}\r\n <Box sx={{ display: 'flex' }}>\r\n <Box sx={{ flex: 1, display: 'flex', alignItems: 'center', flexWrap: 'wrap' }}>\r\n <GridToolbar sx={{ padding: 0 }} />\r\n {this.props.formCreate && <BtnFormCreate>{this.props.formCreate}</BtnFormCreate>}\r\n {this.props.afterAction}\r\n </Box>\r\n <Box sx={{ display: 'flex', gap: '8px', alignItems: 'center' }}>\r\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\r\n <GridToolbarQuickFilter fullWidth variant='standard' size='small' debounceMs={800} quickFilterParser={(x: any) => [x]} />\r\n {this.renderEndAdornment()}\r\n </Box>\r\n </Box>\r\n </Box>\r\n </Box>\r\n )\r\n }\r\n\r\n renderTitle = () => {\r\n const { title, afterTitle, breadcrumbs } = this.props\r\n\r\n const isVisible = !!title || !!breadcrumbs || !!afterTitle\r\n if (!isVisible) return <></>\r\n\r\n let titleElm = title\r\n if (typeof title === 'string') titleElm = <Title>{title}</Title>\r\n if (breadcrumbs) titleElm = <Breadcrumbs value={breadcrumbs} />\r\n\r\n return (\r\n <Box sx={{ height: '56px', display: 'flex', alignItems: 'center' }}>\r\n {titleElm}\r\n {afterTitle}\r\n </Box>\r\n )\r\n }\r\n\r\n renderEndAdornment = () => {\r\n if (!this.props.searchInclude || this.props.searchInclude.length <= 0) return <></>\r\n return (\r\n <HelpTooltip title='The search includes' small>\r\n <SeachHelp>\r\n {this.props.searchInclude.map((item, index) => (\r\n <li key={index}>\r\n <Typography variant='body2'>{item}</Typography>\r\n </li>\r\n ))}\r\n </SeachHelp>\r\n </HelpTooltip>\r\n )\r\n }\r\n}\r\n\r\nexport default ToolbarPannel\r\n\r\nconst SeachHelp = styled('ul')({\r\n margin: '0 0 0 18px',\r\n padding: 0,\r\n li: {\r\n position: 'relative'\r\n },\r\n 'li::after': {\r\n content: '\"►\"',\r\n display: 'inline-block',\r\n top: '50%',\r\n transform: 'translateY(-50%)',\r\n position: 'absolute',\r\n left: '-18px'\r\n }\r\n})\r\n\r\nconst Title = styled((props: TypographyProps) => <Typography noWrap variant='subtitle1' {...props} />)({\r\n fontWeight: 700,\r\n flex: 1\r\n})\r\n"],"names":["ToolbarPannel","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_this$props","props","title","afterTitle","breadcrumbs","_jsx","titleElm","Title","children","Breadcrumbs","value","_jsxs","Box","sx","height","display","alignItems","searchInclude","HelpTooltip","small","SeachHelp","map","item","index","Typography","variant","_inherits","Component","_createClass","key","padding","renderTitle","flex","flexWrap","GridToolbar","formCreate","BtnFormCreate","afterAction","gap","GridToolbarQuickFilter","fullWidth","size","debounceMs","quickFilterParser","x","renderEndAdornment","styled","margin","li","position","content","top","transform","left","_objectSpread","noWrap","fontWeight"],"mappings":"mjBAkBMA,IAAAA,aAAc,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GAqDjB,OArDiBP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,eAsBJ,WACZ,IAAAY,EAA2CZ,EAAKa,MAAxCC,EAAKF,EAALE,MAAOC,EAAUH,EAAVG,WAAYC,EAAWJ,EAAXI,YAG3B,OADoBF,KAAWE,KAAiBD,GAChC,OAAOE,QAEvB,IAAIC,EAAWJ,EAIf,MAHqB,iBAAVA,IAAoBI,EAAWD,EAACE,EAAO,CAAAC,SAAAN,KAC9CE,IAAaE,EAAWD,EAACI,EAAW,CAACC,MAAON,KAG9CO,EAACC,EAAI,CAAAC,GAAI,CAAEC,OAAQ,OAAQC,QAAS,OAAQC,WAAY,UACrDR,SAAA,CAAAF,EACAH,QAGNJ,EAAAX,EAAA,sBAEoB,WACnB,OAAKA,EAAKa,MAAMgB,eAAiB7B,EAAKa,MAAMgB,cAAczB,QAAU,EAAUa,QAE5EA,EAACa,EAAW,CAAChB,MAAM,sBAAsBiB,OAAK,EAAAX,SAC5CH,EAACe,EAAS,CAAAZ,SACPpB,EAAKa,MAAMgB,cAAcI,KAAI,SAACC,EAAMC,GAAK,OACxClB,iBACEA,EAACmB,EAAW,CAAAC,QAAQ,iBAASH,KADtBC,EAGV,WAIRnC,CAAA,CAAA,OAAAsC,EAAAvC,EArDyBwC,GAqDzBC,EAAAzC,EAAA,CAAA,CAAA0C,IAAA,SAAAnB,MApDD,WACE,OACEC,EAACC,EAAI,CAAAC,GAAI,CAAEiB,QAAS,SACjBtB,SAAA,CAAAX,KAAKkC,cACNpB,EAACC,EAAG,CAACC,GAAI,CAAEE,QAAS,QAAQP,SAAA,CAC1BG,EAACC,GAAIC,GAAI,CAAEmB,KAAM,EAAGjB,QAAS,OAAQC,WAAY,SAAUiB,SAAU,kBACnE5B,EAAC6B,EAAY,CAAArB,GAAI,CAAEiB,QAAS,KAC3BjC,KAAKI,MAAMkC,YAAc9B,EAAC+B,EAAe,CAAA5B,SAAAX,KAAKI,MAAMkC,aACpDtC,KAAKI,MAAMoC,eAEdhC,EAACO,EAAG,CAACC,GAAI,CAAEE,QAAS,OAAQuB,IAAK,MAAOtB,WAAY,UAClDR,SAAAG,EAACC,EAAI,CAAAC,GAAI,CAAEE,QAAS,OAAQC,WAAY,UACtCR,SAAA,CAAAH,EAACkC,EAAuB,CAAAC,WAAU,EAAAf,QAAQ,WAAWgB,KAAK,QAAQC,WAAY,IAAKC,kBAAmB,SAACC,GAAM,MAAK,CAACA,EAAE,IACpH/C,KAAKgD,+BAMlB,IAAC,IAsCGzB,EAAY0B,EAAO,KAAPA,CAAa,CAC7BC,OAAQ,aACRjB,QAAS,EACTkB,GAAI,CACFC,SAAU,YAEZ,YAAa,CACXC,QAAS,MACTnC,QAAS,eACToC,IAAK,MACLC,UAAW,mBACXH,SAAU,WACVI,KAAM,WAIJ9C,EAAQuC,GAAO,SAAC7C,GAAsB,OAAKI,EAACmB,EAAU8B,EAAA,CAACC,UAAO9B,QAAQ,aAAgBxB,GAAS,GAAvF6C,CAAyF,CACrGU,WAAY,IACZxB,KAAM"}
@@ -1,2 +1,2 @@
1
- import{jsx as e}from"react/jsx-runtime";import{styled as i,Box as t,Tooltip as n,Fade as l,IconButton as r,Typography as o}from"@mui/material";import s from"@mui/icons-material/Close";import a from"../../components/help-tooltip.js";var m=function(i){return e(u,{children:e(n,{title:"Remove filter",children:e(l,{in:i.visibled,unmountOnExit:!0,children:e(r,{size:"small",onClick:i.onClick,children:e(s,{fontSize:"small"})})})})})},c=function(i){return e(p,{children:i.items.map((function(i,t){return e(o,{component:"li",variant:"body2",children:i},t)}))})},d=function(i){var t,n;return e(u,{className:!0===i.disabledSize?"disabled-size":"",children:e(a,{small:!0,title:null!==(t=i.title)&&void 0!==t?t:"The search includes",children:i.renderContent?i.renderContent():e(c,{items:null!==(n=i.items)&&void 0!==n?n:[]})})})},u=i(t)({display:"inline-flex",flex:"0 0 auto",justifyContent:"center",alignItems:"center","&:not(.disabled-size)":{width:"40px",height:"40px"}}),p=i("ul")({paddingLeft:"1.7rem",marginBottom:0,li:{position:"relative",textAlign:"justify","&::before":{content:'"►"',display:"block",position:"absolute",top:"50%",right:"calc(100% + 6px)",transform:"translateY(-50%)",fontSize:"0.9em"}}});export{m as ButtonClear,d as FilterNotes};
1
+ import{jsx as e}from"react/jsx-runtime";import{styled as i,Box as t,Tooltip as n,Fade as l,IconButton as r,Typography as o}from"@mui/material";import s from"@mui/icons-material/Close";import{HelpTooltip as a}from"../../components/help-tooltip.js";var m=function(i){return e(u,{children:e(n,{title:"Remove filter",children:e(l,{in:i.visibled,unmountOnExit:!0,children:e(r,{size:"small",onClick:i.onClick,children:e(s,{fontSize:"small"})})})})})},c=function(i){return e(p,{children:i.items.map((function(i,t){return e(o,{component:"li",variant:"body2",children:i},t)}))})},d=function(i){var t,n;return e(u,{className:!0===i.disabledSize?"disabled-size":"",children:e(a,{small:!0,title:null!==(t=i.title)&&void 0!==t?t:"The search includes",children:i.renderContent?i.renderContent():e(c,{items:null!==(n=i.items)&&void 0!==n?n:[]})})})},u=i(t)({display:"inline-flex",flex:"0 0 auto",justifyContent:"center",alignItems:"center","&:not(.disabled-size)":{width:"40px",height:"40px"}}),p=i("ul")({paddingLeft:"1.7rem",marginBottom:0,li:{position:"relative",textAlign:"justify","&::before":{content:'"►"',display:"block",position:"absolute",top:"50%",right:"calc(100% + 6px)",transform:"translateY(-50%)",fontSize:"0.9em"}}});export{m as ButtonClear,d as FilterNotes};
2
2
  //# sourceMappingURL=ui.units.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ui.units.js","sources":["../../../src/table-grid/filter-bar/ui.units.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react'\r\nimport { Box, Fade, IconButton, IconButtonProps, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport HelpTooltip from '../../components/help-tooltip'\r\n\r\nexport interface IButtonClearProps {\r\n visibled?: boolean\r\n onClick: IconButtonProps['onClick']\r\n}\r\n\r\nexport const ButtonClear: FC<IButtonClearProps> = (props) => (\r\n <WrapIcon>\r\n <Tooltip title='Remove filter'>\r\n <Fade in={props.visibled} unmountOnExit>\r\n <IconButton size='small' onClick={props.onClick}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Fade>\r\n </Tooltip>\r\n </WrapIcon>\r\n)\r\n\r\nexport interface IFilterNotesProps {\r\n title?: string\r\n items?: string[]\r\n disabledSize?: boolean\r\n renderContent?: () => ReactNode\r\n}\r\n\r\nconst HelpTooltipContent: FC<{ items: string[] }> = (props) => (\r\n <WrapList>\r\n {props.items.map((item, index) => (\r\n <Typography key={index} component='li' variant='body2'>\r\n {item}\r\n </Typography>\r\n ))}\r\n </WrapList>\r\n)\r\n\r\nexport const FilterNotes: FC<IFilterNotesProps> = (props) => (\r\n <WrapIcon className={props.disabledSize === true ? 'disabled-size' : ''}>\r\n <HelpTooltip small title={props.title ?? 'The search includes'}>\r\n {props.renderContent ? props.renderContent() : <HelpTooltipContent items={props.items ?? []} />}\r\n </HelpTooltip>\r\n </WrapIcon>\r\n)\r\nconst WrapIcon = styled(Box)({\r\n display: 'inline-flex',\r\n flex: '0 0 auto',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n '&:not(.disabled-size)': {\r\n width: '40px',\r\n height: '40px'\r\n }\r\n})\r\n\r\nconst WrapList = styled('ul')({\r\n paddingLeft: '1.7rem',\r\n marginBottom: 0,\r\n li: {\r\n position: 'relative',\r\n textAlign: 'justify',\r\n '&::before': {\r\n content: '\"►\"',\r\n display: 'block',\r\n position: 'absolute',\r\n top: '50%',\r\n right: 'calc(100% + 6px)',\r\n transform: 'translateY(-50%)',\r\n fontSize: '0.9em'\r\n }\r\n }\r\n})\r\n"],"names":["ButtonClear","props","_jsx","WrapIcon","children","Tooltip","title","Fade","in","visibled","unmountOnExit","IconButton","size","onClick","CloseIcon","fontSize","HelpTooltipContent","WrapList","items","map","item","index","Typography","component","variant","FilterNotes","_props$title","_props$items","className","disabledSize","HelpTooltip","small","renderContent","styled","Box","display","flex","justifyContent","alignItems","width","height","paddingLeft","marginBottom","li","position","textAlign","content","top","right","transform"],"mappings":"4OAUaA,EAAqC,SAACC,GAAK,OACtDC,EAACC,EAAQ,CAAAC,SACPF,EAACG,EAAO,CAACC,MAAM,gBAAeF,SAC5BF,EAACK,EAAK,CAAAC,GAAIP,EAAMQ,SAAUC,eAAa,EAAAN,SACrCF,EAACS,EAAW,CAAAC,KAAK,QAAQC,QAASZ,EAAMY,iBACtCX,EAACY,EAAU,CAAAC,SAAS,iBAIjB,EAUPC,EAA8C,SAACf,GAAK,OACxDC,EAACe,YACEhB,EAAMiB,MAAMC,KAAI,SAACC,EAAMC,GAAK,OAC3BnB,EAACoB,EAAU,CAAaC,UAAU,KAAKC,QAAQ,QAC5CpB,SAAAgB,GADcC,EAGlB,KACQ,EAGAI,EAAqC,SAACxB,GAAK,IAAAyB,EAAAC,EAAA,OACtDzB,EAACC,EAAQ,CAACyB,WAAkC,IAAvB3B,EAAM4B,aAAwB,gBAAkB,GAAEzB,SACrEF,EAAC4B,GAAYC,OAAK,EAACzB,MAAkB,QAAboB,EAAEzB,EAAMK,aAAK,IAAAoB,EAAAA,EAAI,sBACtCtB,SAAAH,EAAM+B,cAAgB/B,EAAM+B,gBAAkB9B,EAACc,EAAkB,CAACE,MAAkBS,QAAbA,EAAE1B,EAAMiB,aAAKS,IAAAA,EAAAA,EAAI,QAElF,EAEPxB,EAAW8B,EAAOC,EAAPD,CAAY,CAC3BE,QAAS,cACTC,KAAM,WACNC,eAAgB,SAChBC,WAAY,SACZ,wBAAyB,CACvBC,MAAO,OACPC,OAAQ,UAINvB,EAAWgB,EAAO,KAAPA,CAAa,CAC5BQ,YAAa,SACbC,aAAc,EACdC,GAAI,CACFC,SAAU,WACVC,UAAW,UACX,YAAa,CACXC,QAAS,MACTX,QAAS,QACTS,SAAU,WACVG,IAAK,MACLC,MAAO,mBACPC,UAAW,mBACXlC,SAAU"}
1
+ {"version":3,"file":"ui.units.js","sources":["../../../src/table-grid/filter-bar/ui.units.tsx"],"sourcesContent":["import React, { FC, ReactNode } from 'react'\r\nimport { Box, Fade, IconButton, IconButtonProps, styled, Tooltip, Typography } from '@mui/material'\r\nimport CloseIcon from '@mui/icons-material/Close'\r\nimport HelpTooltip from '../../components/help-tooltip'\r\n\r\nexport interface IButtonClearProps {\r\n visibled?: boolean\r\n onClick: IconButtonProps['onClick']\r\n}\r\n\r\nexport const ButtonClear: FC<IButtonClearProps> = (props) => (\r\n <WrapIcon>\r\n <Tooltip title='Remove filter'>\r\n <Fade in={props.visibled} unmountOnExit>\r\n <IconButton size='small' onClick={props.onClick}>\r\n <CloseIcon fontSize='small' />\r\n </IconButton>\r\n </Fade>\r\n </Tooltip>\r\n </WrapIcon>\r\n)\r\n\r\nexport interface IFilterNotesProps {\r\n title?: string\r\n items?: string[]\r\n disabledSize?: boolean\r\n renderContent?: () => ReactNode\r\n}\r\n\r\nconst HelpTooltipContent: FC<{ items: string[] }> = (props) => (\r\n <WrapList>\r\n {props.items.map((item, index) => (\r\n <Typography key={index} component='li' variant='body2'>\r\n {item}\r\n </Typography>\r\n ))}\r\n </WrapList>\r\n)\r\n\r\nexport const FilterNotes: FC<IFilterNotesProps> = (props) => (\r\n <WrapIcon className={props.disabledSize === true ? 'disabled-size' : ''}>\r\n <HelpTooltip small title={props.title ?? 'The search includes'}>\r\n {props.renderContent ? props.renderContent() : <HelpTooltipContent items={props.items ?? []} />}\r\n </HelpTooltip>\r\n </WrapIcon>\r\n)\r\nconst WrapIcon = styled(Box)({\r\n display: 'inline-flex',\r\n flex: '0 0 auto',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n '&:not(.disabled-size)': {\r\n width: '40px',\r\n height: '40px'\r\n }\r\n})\r\n\r\nconst WrapList = styled('ul')({\r\n paddingLeft: '1.7rem',\r\n marginBottom: 0,\r\n li: {\r\n position: 'relative',\r\n textAlign: 'justify',\r\n '&::before': {\r\n content: '\"►\"',\r\n display: 'block',\r\n position: 'absolute',\r\n top: '50%',\r\n right: 'calc(100% + 6px)',\r\n transform: 'translateY(-50%)',\r\n fontSize: '0.9em'\r\n }\r\n }\r\n})\r\n"],"names":["ButtonClear","props","_jsx","WrapIcon","children","Tooltip","title","Fade","in","visibled","unmountOnExit","IconButton","size","onClick","CloseIcon","fontSize","HelpTooltipContent","WrapList","items","map","item","index","Typography","component","variant","FilterNotes","_props$title","_props$items","className","disabledSize","HelpTooltip","small","renderContent","styled","Box","display","flex","justifyContent","alignItems","width","height","paddingLeft","marginBottom","li","position","textAlign","content","top","right","transform"],"mappings":"2PAUaA,EAAqC,SAACC,GAAK,OACtDC,EAACC,EAAQ,CAAAC,SACPF,EAACG,EAAO,CAACC,MAAM,gBAAeF,SAC5BF,EAACK,EAAK,CAAAC,GAAIP,EAAMQ,SAAUC,eAAa,EAAAN,SACrCF,EAACS,EAAW,CAAAC,KAAK,QAAQC,QAASZ,EAAMY,iBACtCX,EAACY,EAAU,CAAAC,SAAS,iBAIjB,EAUPC,EAA8C,SAACf,GAAK,OACxDC,EAACe,YACEhB,EAAMiB,MAAMC,KAAI,SAACC,EAAMC,GAAK,OAC3BnB,EAACoB,EAAU,CAAaC,UAAU,KAAKC,QAAQ,QAC5CpB,SAAAgB,GADcC,EAGlB,KACQ,EAGAI,EAAqC,SAACxB,GAAK,IAAAyB,EAAAC,EAAA,OACtDzB,EAACC,EAAQ,CAACyB,WAAkC,IAAvB3B,EAAM4B,aAAwB,gBAAkB,GAAEzB,SACrEF,EAAC4B,GAAYC,OAAK,EAACzB,MAAkB,QAAboB,EAAEzB,EAAMK,aAAK,IAAAoB,EAAAA,EAAI,sBACtCtB,SAAAH,EAAM+B,cAAgB/B,EAAM+B,gBAAkB9B,EAACc,EAAkB,CAACE,MAAkBS,QAAbA,EAAE1B,EAAMiB,aAAKS,IAAAA,EAAAA,EAAI,QAElF,EAEPxB,EAAW8B,EAAOC,EAAPD,CAAY,CAC3BE,QAAS,cACTC,KAAM,WACNC,eAAgB,SAChBC,WAAY,SACZ,wBAAyB,CACvBC,MAAO,OACPC,OAAQ,UAINvB,EAAWgB,EAAO,KAAPA,CAAa,CAC5BQ,YAAa,SACbC,aAAc,EACdC,GAAI,CACFC,SAAU,WACVC,UAAW,UACX,YAAa,CACXC,QAAS,MACTX,QAAS,QACTS,SAAU,WACVG,IAAK,MACLC,MAAO,mBACPC,UAAW,mBACXlC,SAAU"}
@@ -1,11 +1,11 @@
1
- import React, { FC, PropsWithChildren, ReactNode } from 'react';
2
- import { SxProps, Theme } from '@mui/material';
1
+ import type { FC, PropsWithChildren, ReactNode } from 'react';
2
+ import type { SxProps, Theme } from '@mui/material';
3
3
  export interface IHelpTooltipProps {
4
4
  title: string;
5
5
  small?: boolean;
6
6
  sxIcon?: SxProps<Theme>;
7
7
  }
8
- declare const HelpTooltip: FC<PropsWithChildren<IHelpTooltipProps>>;
8
+ export declare const HelpTooltip: FC<PropsWithChildren<IHelpTooltipProps>>;
9
9
  export default HelpTooltip;
10
10
  export interface IHelpTooltipWrapProps {
11
11
  content: ReactNode;
@@ -1,4 +1,4 @@
1
- import React, { FC, ReactNode } from 'react';
1
+ import type { FC, ImgHTMLAttributes, ReactNode } from 'react';
2
2
  export interface IImageWithFallbackPropsOwner {
3
3
  src?: string;
4
4
  alt?: string;
@@ -6,8 +6,8 @@ export interface IImageWithFallbackPropsOwner {
6
6
  loading?: ReactNode;
7
7
  debounceDelay?: number;
8
8
  }
9
- export type IImageProps = Omit<React.ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>;
9
+ export type IImageProps = Omit<ImgHTMLAttributes<HTMLImageElement>, keyof IImageWithFallbackPropsOwner>;
10
10
  export interface IImageWithFallbackProps extends IImageProps, IImageWithFallbackPropsOwner {
11
11
  }
12
- declare const ImageWithFallback: FC<IImageWithFallbackProps>;
12
+ export declare const ImageWithFallback: FC<IImageWithFallbackProps>;
13
13
  export default ImageWithFallback;
@@ -4,10 +4,9 @@ export * from './buttons';
4
4
  export * from './copy-to-clipboard';
5
5
  export { default as CreateMultiSelectDropdown } from './create.multi-select-dropdown';
6
6
  export * from './create.multi-select-dropdown';
7
- export { default as ImageWithFallback } from './image-with-fallback';
8
7
  export * from './image-with-fallback';
9
- export { default as HelpTooltip } from './help-tooltip';
10
8
  export * from './help-tooltip';
9
+ export * from './rich-tooltip';
11
10
  export { default as TextEditorPreview } from './text-editor.preview';
12
11
  export * from './text-editor.preview';
13
12
  export { default as TextEditor } from './text-editor';
@@ -0,0 +1,25 @@
1
+ import { Component } from 'react';
2
+ import type { ReactNode } from 'react';
3
+ import type { TooltipProps } from '@mui/material';
4
+ export interface IRichTooltipPanelConfig {
5
+ title: ReactNode;
6
+ content: ReactNode;
7
+ }
8
+ export interface IRichTooltipProps {
9
+ panel?: IRichTooltipPanelConfig;
10
+ renderPanel?: () => ReactNode;
11
+ children: React.ReactNode;
12
+ slots?: {
13
+ tooltipProps?: Partial<TooltipProps>;
14
+ };
15
+ }
16
+ export declare class RichTooltip extends Component<IRichTooltipProps> {
17
+ render(): import("react/jsx-runtime").JSX.Element;
18
+ renderTitlePanel: () => string | number | boolean | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | null | undefined;
19
+ renderTitle: (value: ReactNode) => number | true | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | null;
20
+ renderContent: (value: ReactNode) => number | true | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | null;
21
+ }
22
+ export default RichTooltip;
23
+ export declare const HelpOutlinePulseIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
24
+ ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
25
+ }, "classes" | "className" | "style" | "children" | "sx" | "color" | "fontSize" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
@@ -1,6 +1,7 @@
1
- import { ComponentType } from 'react';
2
- import { SelectProps } from '@mui/material';
1
+ import type { ComponentType } from 'react';
2
+ import type { SelectProps } from '@mui/material';
3
3
  import { IFormInputBase } from './types';
4
+ import type { IRichTooltipPanelConfig } from '../components/rich-tooltip';
4
5
  export interface ISelectSimpleOption<T extends string = string> {
5
6
  name: string;
6
7
  value: T;
@@ -13,12 +14,14 @@ export interface ISelectSimpleProps<T> extends Partial<IFormInputBase<T>> {
13
14
  onChange?: (value: ISelectSimpleOption) => void;
14
15
  slots?: ISelectSimpleSlots;
15
16
  fullWidth?: boolean;
17
+ tooltip?: IRichTooltipPanelConfig;
16
18
  }
17
19
  export interface ISelectSimpleState {
18
20
  value?: string;
19
21
  }
20
22
  export interface ISelectSimpleParams extends ISelectSimpleSlots {
21
23
  options?: ISelectSimpleOption[];
24
+ tooltip?: IRichTooltipPanelConfig;
22
25
  }
23
26
  declare function CreateSelectSimple<T>(args?: ISelectSimpleParams): ComponentType<ISelectSimpleProps<T>>;
24
27
  export default CreateSelectSimple;
@@ -1,6 +1,7 @@
1
- import React, { ComponentType } from 'react';
2
- import { TextFieldProps } from '@mui/material';
1
+ import type { ComponentType } from 'react';
2
+ import type { TextFieldProps } from '@mui/material';
3
3
  import { IFormInputBase } from './types';
4
+ import type { IRichTooltipPanelConfig } from '../components/rich-tooltip';
4
5
  export interface ISelectWithApiOption<TOther = any> {
5
6
  Id: string;
6
7
  Name?: string;
@@ -11,6 +12,7 @@ export interface ISelectWithApiPropsSlots {
11
12
  }
12
13
  export type ISelectWithApiFetchData<O extends ISelectWithApiOption> = (value?: string, signal?: AbortSignal) => Promise<O[]>;
13
14
  export interface ISelectWithApiProps<T, O extends ISelectWithApiOption> extends IFormInputBase<T>, ISelectWithApiParams<O> {
15
+ tooltip?: IRichTooltipPanelConfig;
14
16
  onChange?: (value: O | null) => void;
15
17
  existedIds?: string[];
16
18
  slots?: ISelectWithApiPropsSlots;
@@ -24,6 +26,7 @@ export interface ISelectWithApiState<O extends ISelectWithApiOption> {
24
26
  }
25
27
  export interface ISelectWithApiParams<O extends ISelectWithApiOption> {
26
28
  fetchData?: ISelectWithApiFetchData<O>;
29
+ tooltip?: IRichTooltipPanelConfig;
27
30
  }
28
- declare const CreateSelectWithApi: <T, O extends ISelectWithApiOption<any> = ISelectWithApiOption<any>>(params?: ISelectWithApiParams<O> | undefined) => React.ComponentType<ISelectWithApiProps<T, O>>;
31
+ declare const CreateSelectWithApi: <T, O extends ISelectWithApiOption<any> = ISelectWithApiOption<any>>(params?: ISelectWithApiParams<O> | undefined) => ComponentType<ISelectWithApiProps<T, O>>;
29
32
  export default CreateSelectWithApi;
@@ -17,6 +17,7 @@ export interface IDinoReduxDispatch<P = any> {
17
17
  export interface IBaseActions<T, Id extends keyof T> {
18
18
  create: (value: Partial<T>, signal?: AbortSignal) => Promise<void>;
19
19
  update: (id: T[Id], value: Partial<T>, signal?: AbortSignal) => Promise<void>;
20
+ updatePatch: (oldValue: T, value: Partial<T>, signal?: AbortSignal) => Promise<void>;
20
21
  delete: (id: T[Id], value?: Partial<T>, signal?: AbortSignal) => Promise<void>;
21
22
  }
22
23
  export type IDinoReduxActions<T, Id extends keyof T, K extends keyof IBaseActions<T, Id> = keyof IBaseActions<T, Id>> = Pick<IBaseActions<T, Id>, K>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dinocollab-core",
3
- "version": "2.1.4",
3
+ "version": "2.1.6",
4
4
  "description": "Dinocollab core - libraries for building collaborative applications with React 18",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",