dinocollab-core 1.0.7 → 1.0.8

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 (50) hide show
  1. package/dist/components/buttons.js +2 -0
  2. package/dist/components/buttons.js.map +1 -0
  3. package/dist/components/create.multi-select-dropdown.js +1 -1
  4. package/dist/components/create.multi-select-dropdown.js.map +1 -1
  5. package/dist/components/help-tooltip.js +1 -1
  6. package/dist/filter-bar/create.filter-bar.js.map +1 -1
  7. package/dist/filter-bar/ui.units.js.map +1 -1
  8. package/dist/form/create.date-expired.js +1 -1
  9. package/dist/form/create.date-expired.js.map +1 -1
  10. package/dist/form/create.date-picker.js +1 -1
  11. package/dist/form/create.date-picker.js.map +1 -1
  12. package/dist/form/create.form-comfirm.js +1 -1
  13. package/dist/form/create.form-comfirm.js.map +1 -1
  14. package/dist/form/create.input.js +1 -1
  15. package/dist/form/create.input.js.map +1 -1
  16. package/dist/form/create.select-simple.js +1 -1
  17. package/dist/form/create.select-simple.js.map +1 -1
  18. package/dist/form/create.text-editor.js +1 -1
  19. package/dist/form/create.text-editor.js.map +1 -1
  20. package/dist/form/validator.js +1 -1
  21. package/dist/form/validator.js.map +1 -1
  22. package/dist/index.js +1 -1
  23. package/dist/table/create.action-row.js +1 -1
  24. package/dist/table/create.action-row.js.map +1 -1
  25. package/dist/table/create.table.js +1 -1
  26. package/dist/table/create.table.js.map +1 -1
  27. package/dist/table/dino.js +1 -1
  28. package/dist/table/dino.js.map +1 -1
  29. package/dist/table/helpers.js +1 -1
  30. package/dist/table/helpers.js.map +1 -1
  31. package/dist/table/toolbar-pannel.js +1 -1
  32. package/dist/table/toolbar-pannel.js.map +1 -1
  33. package/dist/table/ui.units.js +1 -1
  34. package/dist/table/ui.units.js.map +1 -1
  35. package/dist/table-grid/create.table-grid.js +1 -1
  36. package/dist/table-grid/create.table-grid.js.map +1 -1
  37. package/dist/table-grid/toolbar-pannel.js +1 -1
  38. package/dist/table-grid/toolbar-pannel.js.map +1 -1
  39. package/dist/types/components/index.d.ts +1 -0
  40. package/dist/types/filter-bar/create.filter-bar.d.ts +5 -5
  41. package/dist/types/filter-bar/index.d.ts +1 -2
  42. package/dist/types/filter-bar/ui.units.d.ts +4 -5
  43. package/dist/types/lab/select-mul-with-api/ui.units.d.ts +1 -1
  44. package/dist/types/utils/index.d.ts +2 -1
  45. package/dist/utils/mfe-events.js +2 -0
  46. package/dist/utils/mfe-events.js.map +1 -0
  47. package/package.json +1 -1
  48. package/dist/filter-bar/demo.js +0 -2
  49. package/dist/filter-bar/demo.js.map +0 -1
  50. /package/dist/types/components/{loading-buttons.d.ts → buttons.d.ts} +0 -0
@@ -0,0 +1,2 @@
1
+ import{defineProperty as e,objectWithoutProperties as i,objectSpread2 as r}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as t,jsx as n}from"react/jsx-runtime";import{styled as o,Button as l,Fade as a,CircularProgress as s}from"@mui/material";var d=["loading","children"],p=function(e){var o=e.loading,l=e.children,p=i(e,d);return t(c,r(r({},p),{},{disabled:p.disabled||o,children:[n(a,{in:!o,children:n("span",{children:l})}),n(a,{in:o,children:n("div",{className:"LoadingButton-progress",children:n(s,{size:24})})})]}))},c=o(l)(e({position:"relative"},".LoadingButton-progress",{position:"absolute",top:0,left:0,width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center"}));export{p as LoadingButton};
2
+ //# sourceMappingURL=buttons.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"buttons.js","sources":["../../src/components/buttons.tsx"],"sourcesContent":["import React, { FC } from 'react'\r\nimport { Button, ButtonProps, CircularProgress, Fade, styled } from '@mui/material'\r\n\r\nexport interface LoadingButtonProps extends ButtonProps {\r\n loading?: boolean\r\n}\r\n\r\nexport const LoadingButton: FC<LoadingButtonProps> = ({ loading, children, ...props }) => (\r\n <ButtonCustom {...props} disabled={props.disabled || loading}>\r\n <Fade in={!loading}>\r\n <span>{children}</span>\r\n </Fade>\r\n <Fade in={loading}>\r\n <div className='LoadingButton-progress'>\r\n <CircularProgress size={24} />\r\n </div>\r\n </Fade>\r\n </ButtonCustom>\r\n)\r\n\r\nconst ButtonCustom = styled(Button)({\r\n position: 'relative',\r\n [`.LoadingButton-progress`]: {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n width: '100%',\r\n height: '100%',\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center'\r\n }\r\n})\r\n"],"names":["LoadingButton","_ref","loading","children","props","_objectWithoutProperties","_excluded","_jsxs","ButtonCustom","_objectSpread","disabled","_jsx","Fade","in","className","CircularProgress","size","styled","Button","_defineProperty","position","top","left","width","height","display","alignItems","justifyContent"],"mappings":"4RAOaA,EAAwC,SAA3BC,GAAA,IAA8BC,EAAOD,EAAPC,QAASC,EAAQF,EAARE,SAAaC,EAAKC,EAAAJ,EAAAK,GAAA,OACjFC,EAACC,EAAYC,EAAAA,KAAKL,GAAK,GAAA,CAAEM,SAAUN,EAAMM,UAAYR,EAAOC,SAAA,CAC1DQ,EAACC,EAAI,CAACC,IAAKX,EACTC,SAAAQ,EAAA,OAAA,CAAAR,SAAOA,MAETQ,EAACC,EAAK,CAAAC,GAAIX,EAAOC,SACfQ,EAAK,MAAA,CAAAG,UAAU,yBACbX,SAAAQ,EAACI,EAAiB,CAAAC,KAAM,YAGf,EAGXR,EAAeS,EAAOC,EAAPD,CAAcE,EAAA,CACjCC,SAAU,YACmB,0BAAA,CAC3BA,SAAU,WACVC,IAAK,EACLC,KAAM,EACNC,MAAO,OACPC,OAAQ,OACRC,QAAS,OACTC,WAAY,SACZC,eAAgB"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as n,slicedToArray as o,objectSpread2 as e,toConsumableArray as r}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,Fragment as t,jsx as i}from"react/jsx-runtime";import{useState as a,useEffect as c}from"react";import{styled as u,Popover as s,Badge as p,badgeClasses as d,Box as h,Button as m,TextField as v,ToggleButtonGroup as f,ToggleButton as g,Typography as x,List as C,ListItem as b,FormControlLabel as y,Checkbox as P}from"@mui/material";import w from"@mui/icons-material/FilterAltOutlined";import{mergeObjects as j}from"../utils/helpers.js";import"../utils/query-param.js";import"../utils/dayjs-config.js";import z from"./help-tooltip.js";function A(n){return function(u){var s,p,d,A,S,L,T,q,B,D,F,H,I,R=a(null),Y=o(R,2),_=Y[0],E=Y[1],M=a([]),W=o(M,2),X=W[0],G=W[1],J=a(null!==(s=null!==(p=u.options)&&void 0!==p?p:n.options)&&void 0!==s?s:[]),K=o(J,2),Q=K[0],U=K[1],V=a(""),Z=o(V,2),$=Z[0],nn=Z[1],on=a("and"),en=o(on,2),rn=en[0],ln=en[1],tn={buttonProps:j(null==n?void 0:n.buttonProps,null===(d=u.slots)||void 0===d?void 0:d.buttonProps),contentProps:null!==(A=null!==(S=null===(L=u.slots)||void 0===L?void 0:L.contentPorps)&&void 0!==S?S:null==n?void 0:n.contentPorps)&&void 0!==A?A:{}},an=function(n,o){E(null)};return c((function(){u.options&&u.options.length>0&&U(u.options)}),[u.options]),c((function(){var n;G(null!==(n=u.value)&&void 0!==n?n:[])}),[u.value]),l(t,{children:[l(m,e(e({color:"inherit",endIcon:i(w,{})},tn.buttonProps),{},{onClick:function(n){E(n.currentTarget)},children:[n.btnText,i(O,{badgeContent:null===(T=u.value)||void 0===T?void 0:T.length,color:"error",overlap:"circular",sx:{transform:"translateY(-50%) translateX(24px)"}})]})),l(k,{open:Boolean(_),anchorEl:_,onClose:an,anchorOrigin:{vertical:"bottom",horizontal:"left"},children:[l(N,{className:"top",children:[i(v,{size:"small",placeholder:null!==(q=n.placeholder)&&void 0!==q?q:"Search",fullWidth:!0,value:$,onChange:function(n){return nn(n.target.value)}}),l(f,{size:"small",exclusive:!0,color:"primary",value:rn,onChange:function(n,o){o&&ln(o)},children:[i(g,{value:"and",children:"AND"}),i(g,{value:"or",children:"OR"})]}),i(z,{title:"Filter Logic",small:!0,children:l(x,{variant:"body2",color:"text.secondary",children:["Choose how multiple categories are applied.",i("br",{}),i("strong",{children:" AND "})," requires all selected categories, while",i("br",{}),i("strong",{children:" OR "})," matches any."]})})]}),i(h,e(e({className:"menu-content"},tn.contentProps),{},{children:i(C,{children:(D=null!==(B=u.value)&&void 0!==B?B:[],F=Q.filter((function(n){return n.toLowerCase().includes($.toLowerCase())})).sort((function(n,o){return n.localeCompare(o)})),H=F.filter((function(n){return D.includes(n)})),I=F.filter((function(n){return!D.includes(n)})),[].concat(r(H),r(I))).map((function(n){return i(b,{sx:{whiteSpace:"nowrap"},children:i(y,{label:n,control:i(P,{checked:X.includes(n),onChange:function(){return o=n,void G((function(n){return n.includes(o)?n.filter((function(n){return n!==o})):[].concat(r(n),[o])}));var o}})})},n)}))})})),l(N,{children:[i(m,{size:"small",onClick:function(){G([]),u.onChange&&u.onChange([])},color:"inherit",children:"Clear"}),i(h,{sx:{flex:1}}),i(m,{size:"small",onClick:function(){var n;G(null!==(n=u.value)&&void 0!==n?n:[]),an()},color:"inherit",children:"Cancel"}),i(m,{size:"small",variant:"contained",onClick:function(){u.onChange&&u.onChange(X),an()},children:"Apply"})]})]})]})}}var k=u(s)({".MuiPaper-root":{overflow:"hidden",position:"relative",width:"360px"},".menu-content":{overflowY:"auto",maxHeight:"".concat(290,"px"),margin:"2px 2px 2px 0"}}),O=u(p)(n({},"& .".concat(d.badge),{top:"-12px",right:"-6px"})),N=u(h)({alignItems:"center",display:"flex",gap:"6px",height:"58px",padding:"8px 10px",boxShadow:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"});export{A as default};
1
+ import{defineProperty as n,slicedToArray as o,objectSpread2 as e,toConsumableArray as r}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,Fragment as t,jsx as i}from"react/jsx-runtime";import{useState as a,useEffect as c}from"react";import{styled as u,Popover as s,Badge as p,badgeClasses as d,Box as h,Button as m,TextField as v,ToggleButtonGroup as f,ToggleButton as g,Typography as x,List as C,ListItem as b,FormControlLabel as y,Checkbox as P}from"@mui/material";import w from"@mui/icons-material/FilterAltOutlined";import{mergeObjects as j}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"react-router-dom";import"../utils/query-param.js";import z from"./help-tooltip.js";function A(n){return function(u){var s,p,d,A,S,L,T,q,B,D,F,H,I,R=a(null),Y=o(R,2),_=Y[0],E=Y[1],M=a([]),W=o(M,2),X=W[0],G=W[1],J=a(null!==(s=null!==(p=u.options)&&void 0!==p?p:n.options)&&void 0!==s?s:[]),K=o(J,2),Q=K[0],U=K[1],V=a(""),Z=o(V,2),$=Z[0],nn=Z[1],on=a("and"),en=o(on,2),rn=en[0],ln=en[1],tn={buttonProps:j(null==n?void 0:n.buttonProps,null===(d=u.slots)||void 0===d?void 0:d.buttonProps),contentProps:null!==(A=null!==(S=null===(L=u.slots)||void 0===L?void 0:L.contentPorps)&&void 0!==S?S:null==n?void 0:n.contentPorps)&&void 0!==A?A:{}},an=function(n,o){E(null)};return c((function(){u.options&&u.options.length>0&&U(u.options)}),[u.options]),c((function(){var n;G(null!==(n=u.value)&&void 0!==n?n:[])}),[u.value]),l(t,{children:[l(m,e(e({color:"inherit",endIcon:i(w,{})},tn.buttonProps),{},{onClick:function(n){E(n.currentTarget)},children:[n.btnText,i(O,{badgeContent:null===(T=u.value)||void 0===T?void 0:T.length,color:"error",overlap:"circular",sx:{transform:"translateY(-50%) translateX(24px)"}})]})),l(k,{open:Boolean(_),anchorEl:_,onClose:an,anchorOrigin:{vertical:"bottom",horizontal:"left"},children:[l(N,{className:"top",children:[i(v,{size:"small",placeholder:null!==(q=n.placeholder)&&void 0!==q?q:"Search",fullWidth:!0,value:$,onChange:function(n){return nn(n.target.value)}}),l(f,{size:"small",exclusive:!0,color:"primary",value:rn,onChange:function(n,o){o&&ln(o)},children:[i(g,{value:"and",children:"AND"}),i(g,{value:"or",children:"OR"})]}),i(z,{title:"Filter Logic",small:!0,children:l(x,{variant:"body2",color:"text.secondary",children:["Choose how multiple categories are applied.",i("br",{}),i("strong",{children:" AND "})," requires all selected categories, while",i("br",{}),i("strong",{children:" OR "})," matches any."]})})]}),i(h,e(e({className:"menu-content"},tn.contentProps),{},{children:i(C,{children:(D=null!==(B=u.value)&&void 0!==B?B:[],F=Q.filter((function(n){return n.toLowerCase().includes($.toLowerCase())})).sort((function(n,o){return n.localeCompare(o)})),H=F.filter((function(n){return D.includes(n)})),I=F.filter((function(n){return!D.includes(n)})),[].concat(r(H),r(I))).map((function(n){return i(b,{sx:{whiteSpace:"nowrap"},children:i(y,{label:n,control:i(P,{checked:X.includes(n),onChange:function(){return o=n,void G((function(n){return n.includes(o)?n.filter((function(n){return n!==o})):[].concat(r(n),[o])}));var o}})})},n)}))})})),l(N,{children:[i(m,{size:"small",onClick:function(){G([]),u.onChange&&u.onChange([])},color:"inherit",children:"Clear"}),i(h,{sx:{flex:1}}),i(m,{size:"small",onClick:function(){var n;G(null!==(n=u.value)&&void 0!==n?n:[]),an()},color:"inherit",children:"Cancel"}),i(m,{size:"small",variant:"contained",onClick:function(){u.onChange&&u.onChange(X),an()},children:"Apply"})]})]})]})}}var k=u(s)({".MuiPaper-root":{overflow:"hidden",position:"relative",width:"360px"},".menu-content":{overflowY:"auto",maxHeight:"".concat(290,"px"),margin:"2px 2px 2px 0"}}),O=u(p)(n({},"& .".concat(d.badge),{top:"-12px",right:"-6px"})),N=u(h)({alignItems:"center",display:"flex",gap:"6px",height:"58px",padding:"8px 10px",boxShadow:"rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"});export{A 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, 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\ntype ILogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n logic?: ILogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n buttonProps?: ButtonProps\r\n contentPorps?: BoxProps\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n options?: string[]\r\n value?: string[]\r\n onChange?: (value: string[], filter?: IMultiSelectDropdownFilter) => void\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 [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const [selectedOptions, setSelectedOptions] = useState<string[]>([])\r\n const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n const [search, setSearch] = useState('')\r\n const [filterLogic, setFilterLogic] = useState<ILogic>('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 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 }\r\n\r\n const handleToggle = (value: string) => {\r\n setSelectedOptions((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n }\r\n\r\n const handleClear = () => {\r\n setSelectedOptions([])\r\n props.onChange && props.onChange([])\r\n }\r\n\r\n const handleCancel = () => {\r\n setSelectedOptions(props.value ?? [])\r\n handleClose()\r\n }\r\n\r\n const handleApply = () => {\r\n props.onChange && props.onChange(selectedOptions)\r\n handleClose()\r\n }\r\n\r\n const getOptions = () => {\r\n const values = props.value ?? []\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 useEffect(() => {\r\n if (props.options && props.options.length > 0) setOptions(props.options)\r\n }, [props.options])\r\n\r\n useEffect(() => {\r\n setSelectedOptions(props.value ?? [])\r\n }, [props.value])\r\n\r\n return (\r\n <>\r\n <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n {params.btnText}\r\n <ButtonBadge badgeContent={props.value?.length} color='error' overlap='circular' sx={{ transform: 'translateY(-50%) translateX(24px)' }} />\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\r\n size='small'\r\n exclusive\r\n color='primary'\r\n value={filterLogic}\r\n onChange={(_, value) => {\r\n if (value) setFilterLogic(value)\r\n }}\r\n >\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={selectedOptions.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 // minWidth: '300px',\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","_ref2","_props$slots$contentP","_props$slots2","_props$value4","_params$placeholder","_props$value2","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","_useState3","_useState4","selectedOptions","setSelectedOptions","_useState5","options","_useState6","setOptions","_useState7","_useState8","search","setSearch","_useState9","_useState0","filterLogic","setFilterLogic","mergeConfig","buttonProps","mergeObjects","slots","contentProps","contentPorps","handleClose","event","reason","useEffect","length","_props$value3","value","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","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","_props$value","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, 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\ntype ILogic = 'and' | 'or'\r\n\r\nexport interface IMultiSelectDropdownFilter {\r\n logic?: ILogic\r\n}\r\n\r\nexport interface IMultiSelectDropdownSlots {\r\n buttonProps?: ButtonProps\r\n contentPorps?: BoxProps\r\n}\r\n\r\nexport interface IMultiSelectDropdownProps {\r\n options?: string[]\r\n value?: string[]\r\n onChange?: (value: string[], filter?: IMultiSelectDropdownFilter) => void\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 [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const [selectedOptions, setSelectedOptions] = useState<string[]>([])\r\n const [options, setOptions] = useState<string[]>(props.options ?? params.options ?? [])\r\n const [search, setSearch] = useState('')\r\n const [filterLogic, setFilterLogic] = useState<ILogic>('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 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 }\r\n\r\n const handleToggle = (value: string) => {\r\n setSelectedOptions((prev) => (prev.includes(value) ? prev.filter((t) => t !== value) : [...prev, value]))\r\n }\r\n\r\n const handleClear = () => {\r\n setSelectedOptions([])\r\n props.onChange && props.onChange([])\r\n }\r\n\r\n const handleCancel = () => {\r\n setSelectedOptions(props.value ?? [])\r\n handleClose()\r\n }\r\n\r\n const handleApply = () => {\r\n props.onChange && props.onChange(selectedOptions)\r\n handleClose()\r\n }\r\n\r\n const getOptions = () => {\r\n const values = props.value ?? []\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 useEffect(() => {\r\n if (props.options && props.options.length > 0) setOptions(props.options)\r\n }, [props.options])\r\n\r\n useEffect(() => {\r\n setSelectedOptions(props.value ?? [])\r\n }, [props.value])\r\n\r\n return (\r\n <>\r\n <Button color='inherit' endIcon={<FilterAltOutlinedIcon />} {...mergeConfig.buttonProps} onClick={handleOpen}>\r\n {params.btnText}\r\n <ButtonBadge badgeContent={props.value?.length} color='error' overlap='circular' sx={{ transform: 'translateY(-50%) translateX(24px)' }} />\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\r\n size='small'\r\n exclusive\r\n color='primary'\r\n value={filterLogic}\r\n onChange={(_, value) => {\r\n if (value) setFilterLogic(value)\r\n }}\r\n >\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={selectedOptions.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 // minWidth: '300px',\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","_ref2","_props$slots$contentP","_props$slots2","_props$value4","_params$placeholder","_props$value2","values","list","prioritized","others","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","_useState3","_useState4","selectedOptions","setSelectedOptions","_useState5","options","_useState6","setOptions","_useState7","_useState8","search","setSearch","_useState9","_useState0","filterLogic","setFilterLogic","mergeConfig","buttonProps","mergeObjects","slots","contentProps","contentPorps","handleClose","event","reason","useEffect","length","_props$value3","value","_jsxs","_Fragment","children","Button","_objectSpread","color","endIcon","_jsx","FilterAltOutlinedIcon","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","_props$value","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,Stack as m,Divider as s,IconButton 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(m,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:t.title}),i(s,{}),i(c,{sx:{p:"6px 12px"},children:t.children})]}),children:i(c,{sx:r({cursor:"default"},t.sxIcon),children:i(x,{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(m,{sx:{gap:"6px",py:"6px",minWidth:"200px",maxWidth:"400px "},children:[i(b,{children:r.title}),i(s,{}),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};
2
2
  //# sourceMappingURL=help-tooltip.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.filter-bar.js","sources":["../../src/filter-bar/create.filter-bar.tsx"],"sourcesContent":["import React from 'react'\r\nimport { Box, ClickAwayListener, IconButton, InputBase, styled } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport { ButtonClear, FilterHelpNotes, FilterHelpNotesProps } from './ui.units'\r\nimport { IFilterFields, IFilterItemModel, IFilterModel, FilterReason, IFilterState } from './types'\r\nimport CreateFilterPanel, { FilterPanelState } from './create.filter-panel'\r\nimport FilterBarBase from './base'\r\nimport CreateFiltered from './create.filtered'\r\n\r\nexport interface FilterBarParams<T> {\r\n fields: IFilterFields<T>\r\n id?: string\r\n placeholder?: string\r\n helpNotes?: FilterHelpNotesProps\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n id?: string\r\n placeholder?: string\r\n value?: IFilterState<T>\r\n onChange?: (value: IFilterState<T>) => void\r\n}\r\n\r\nexport interface IFilterBarState {\r\n panelState: FilterPanelState\r\n keyword: string\r\n}\r\n\r\nfunction CreateFilterBar<T>(params: FilterBarParams<T>) {\r\n const FilterPanelInstance = CreateFilterPanel<T>({ fields: params.fields })\r\n const FilteredInstance = CreateFiltered<T>()\r\n\r\n class FilterBar extends FilterBarBase<IFilterBarProps<T>, IFilterBarState, T> {\r\n defaultState: IFilterBarState = { keyword: '', panelState: { anchorEl: null } }\r\n constructor(props: IFilterBarProps<T>) {\r\n super(props)\r\n this.state = this.defaultState\r\n }\r\n\r\n filterStateStore: IFilterState<T> = { filter: {} }\r\n get filterState(): IFilterState<T> {\r\n return this.props.value ?? this.filterStateStore\r\n }\r\n\r\n setFilterState = (filterState: IFilterState<T>) => {\r\n if (!this.props.value) {\r\n this.filterStateStore = filterState\r\n }\r\n this.props.onChange && this.props.onChange(filterState)\r\n }\r\n\r\n get configs() {\r\n return {\r\n id: this.props.id ?? params.id ?? new Date().getTime().toString(),\r\n placeholder: this.props.placeholder ?? params.placeholder ?? 'Filter',\r\n helpNotes: params.helpNotes\r\n }\r\n }\r\n\r\n refFilterButton: HTMLButtonElement | null = null\r\n refSortButton: HTMLButtonElement | null = null\r\n render() {\r\n return (\r\n <ClickAwayListener onClickAway={this.closePanel}>\r\n <Wrapper>\r\n <IconButton ref={(ref) => (this.refFilterButton = ref)} onClick={() => this.showPanel('filterButton')}>\r\n <FilterListIcon />\r\n </IconButton>\r\n <Content>\r\n <FilteredInstance fields={params.fields} filterState={this.filterState} onRemove={this.handleRemove} />\r\n {this.renderTextField()}\r\n </Content>\r\n <ButtonClear visibled={!this.isFilterEmpty(this.filterState)} onClick={this.handleClear} />\r\n {/* <IconButton ref={(ref) => (this.refSortButton = ref)} onClick={() => this.showPanel('sortButton')}>\r\n <SwapVertIcon />\r\n </IconButton> */}\r\n <FilterHelpNotes {...this.configs.helpNotes} />\r\n <FilterPanelInstance {...this.state.panelState} keyword={this.state.keyword} onSubmit={this.handleAdd} onClose={this.closePanel} />\r\n </Wrapper>\r\n </ClickAwayListener>\r\n )\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n refBeforeInput: HTMLElement | null = null\r\n renderTextField = () => (\r\n <Box component='label' htmlFor={this.configs.id} sx={{ flex: 1, display: 'flex', alignItems: 'flex-end' }}>\r\n <Box ref={(ref: HTMLElement) => (this.refBeforeInput = ref)} sx={{ height: '100%' }} />\r\n <InputBase\r\n id={this.configs.id}\r\n placeholder={this.configs.placeholder}\r\n fullWidth\r\n autoComplete='off'\r\n inputRef={(ref: HTMLInputElement) => (this.refInput = ref)}\r\n onChange={(event) => this.setState({ keyword: event.target.value })}\r\n value={this.state.keyword}\r\n onFocus={() => this.showPanel('searchInput')}\r\n onKeyDown={this.handleKeyDown}\r\n />\r\n </Box>\r\n )\r\n\r\n handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n if (!this.state.keyword) return\r\n const temp = this.patchFilterWithKey(this.filterState, 'Search', { value: this.state.keyword })\r\n temp.filterState.details = 'add'\r\n if (!!temp.isChanged) {\r\n this.refInput?.blur()\r\n this.setFilterState(temp.filterState)\r\n this.setState(this.defaultState)\r\n }\r\n } else if (keyCode === 27) {\r\n this.refInput?.blur()\r\n this.setState(this.defaultState)\r\n }\r\n }\r\n\r\n handleAdd = (key: keyof IFilterModel<T>, value: IFilterItemModel) => {\r\n const temp = this.patchFilterWithKey(this.filterState, key, value)\r\n temp.filterState.details = 'add'\r\n if (!!temp.isChanged) {\r\n this.refInput?.blur()\r\n this.setFilterState(temp.filterState)\r\n this.setState(this.defaultState)\r\n }\r\n }\r\n\r\n handleRemove = (key: keyof IFilterModel<T>) => {\r\n const temp = this.deleteFilterWithKey(this.filterState, key)\r\n temp.filterState.details = 'remove'\r\n if (!!temp.isChanged) {\r\n this.refInput?.blur()\r\n this.setFilterState(temp.filterState)\r\n this.forceUpdate()\r\n }\r\n }\r\n\r\n handleClear = () => {\r\n this.setFilterState({ filter: {}, details: 'remove' })\r\n this.setState(this.defaultState)\r\n }\r\n\r\n showPanel = (reason: FilterReason) => {\r\n let anchorEl = null\r\n switch (reason) {\r\n case 'searchInput':\r\n anchorEl = this.refBeforeInput\r\n break\r\n case 'filterButton':\r\n anchorEl = this.refFilterButton\r\n break\r\n case 'sortButton':\r\n anchorEl = this.refSortButton\r\n break\r\n default:\r\n break\r\n }\r\n this.setState({ panelState: { anchorEl, reason } })\r\n }\r\n\r\n closePanel = () => this.setState({ panelState: { anchorEl: null } })\r\n }\r\n\r\n return FilterBar\r\n}\r\n\r\nexport default CreateFilterBar\r\n\r\nconst Wrapper = styled(Box)({\r\n display: 'flex',\r\n gap: '8px',\r\n width: '100%',\r\n borderRadius: '6px',\r\n transition: 'all linear 0.2s',\r\n padding: '2px',\r\n backgroundColor: '#fafafa',\r\n '&:hover': { backgroundColor: '#ededed' }\r\n})\r\n\r\nconst Content = styled(Box)({\r\n flex: 1,\r\n minHeight: '40px',\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n alignItems: 'center',\r\n gap: '6px'\r\n})\r\n"],"names":["CreateFilterBar","params","FilterPanelInstance","CreateFilterPanel","fields","FilteredInstance","CreateFiltered","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","keyword","panelState","anchorEl","filter","filterState","value","filterStateStore","onChange","_jsxs","Box","component","htmlFor","configs","id","sx","flex","display","alignItems","children","_jsx","ref","refBeforeInput","height","InputBase","placeholder","fullWidth","autoComplete","inputRef","refInput","event","setState","target","state","onFocus","showPanel","onKeyDown","handleKeyDown","keyCode","_this$refInput","temp","patchFilterWithKey","details","isChanged","blur","setFilterState","defaultState","_this$refInput2","key","_this$refInput3","_this$refInput4","deleteFilterWithKey","forceUpdate","reason","refFilterButton","refSortButton","_inherits","FilterBarBase","_createClass","get","_this$props$value","this","_ref2","_this$props$id","_ref3","_this$props$placehold","Date","getTime","toString","helpNotes","_this2","ClickAwayListener","onClickAway","closePanel","Wrapper","IconButton","onClick","FilterListIcon","Content","onRemove","handleRemove","renderTextField","ButtonClear","visibled","isFilterEmpty","handleClear","FilterHelpNotes","_objectSpread","onSubmit","handleAdd","onClose","styled","gap","width","borderRadius","transition","padding","backgroundColor","minHeight","flexWrap"],"mappings":"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"}
1
+ {"version":3,"file":"create.filter-bar.js","sources":["../../src/filter-bar/create.filter-bar.tsx"],"sourcesContent":["import React from 'react'\r\nimport { Box, ClickAwayListener, IconButton, InputBase, styled } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport { ButtonClear, FilterHelpNotes, IFilterHelpNotesProps } from './ui.units'\r\nimport { IFilterFields, IFilterItemModel, IFilterModel, FilterReason, IFilterState } from './types'\r\nimport CreateFilterPanel, { FilterPanelState } from './create.filter-panel'\r\nimport FilterBarBase from './base'\r\nimport CreateFiltered from './create.filtered'\r\n\r\nexport interface IFilterBarParams<T> {\r\n fields: IFilterFields<T>\r\n id?: string\r\n placeholder?: string\r\n helpNotes?: IFilterHelpNotesProps\r\n}\r\n\r\nexport interface IFilterBarProps<T> {\r\n id?: string\r\n placeholder?: string\r\n value?: IFilterState<T>\r\n onChange?: (value: IFilterState<T>) => void\r\n}\r\n\r\nexport interface IFilterBarState {\r\n panelState: FilterPanelState\r\n keyword: string\r\n}\r\n\r\nfunction CreateFilterBar<T>(params: IFilterBarParams<T>) {\r\n const FilterPanelInstance = CreateFilterPanel<T>({ fields: params.fields })\r\n const FilteredInstance = CreateFiltered<T>()\r\n\r\n class FilterBar extends FilterBarBase<IFilterBarProps<T>, IFilterBarState, T> {\r\n defaultState: IFilterBarState = { keyword: '', panelState: { anchorEl: null } }\r\n constructor(props: IFilterBarProps<T>) {\r\n super(props)\r\n this.state = this.defaultState\r\n }\r\n\r\n filterStateStore: IFilterState<T> = { filter: {} }\r\n get filterState(): IFilterState<T> {\r\n return this.props.value ?? this.filterStateStore\r\n }\r\n\r\n setFilterState = (filterState: IFilterState<T>) => {\r\n if (!this.props.value) {\r\n this.filterStateStore = filterState\r\n }\r\n this.props.onChange && this.props.onChange(filterState)\r\n }\r\n\r\n get configs() {\r\n return {\r\n id: this.props.id ?? params.id ?? new Date().getTime().toString(),\r\n placeholder: this.props.placeholder ?? params.placeholder ?? 'Filter',\r\n helpNotes: params.helpNotes\r\n }\r\n }\r\n\r\n refFilterButton: HTMLButtonElement | null = null\r\n refSortButton: HTMLButtonElement | null = null\r\n render() {\r\n return (\r\n <ClickAwayListener onClickAway={this.closePanel}>\r\n <Wrapper>\r\n <IconButton ref={(ref) => (this.refFilterButton = ref)} onClick={() => this.showPanel('filterButton')}>\r\n <FilterListIcon />\r\n </IconButton>\r\n <Content>\r\n <FilteredInstance fields={params.fields} filterState={this.filterState} onRemove={this.handleRemove} />\r\n {this.renderTextField()}\r\n </Content>\r\n <ButtonClear visibled={!this.isFilterEmpty(this.filterState)} onClick={this.handleClear} />\r\n {/* <IconButton ref={(ref) => (this.refSortButton = ref)} onClick={() => this.showPanel('sortButton')}>\r\n <SwapVertIcon />\r\n </IconButton> */}\r\n <FilterHelpNotes {...this.configs.helpNotes} />\r\n <FilterPanelInstance {...this.state.panelState} keyword={this.state.keyword} onSubmit={this.handleAdd} onClose={this.closePanel} />\r\n </Wrapper>\r\n </ClickAwayListener>\r\n )\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n refBeforeInput: HTMLElement | null = null\r\n renderTextField = () => (\r\n <Box component='label' htmlFor={this.configs.id} sx={{ flex: 1, display: 'flex', alignItems: 'flex-end' }}>\r\n <Box ref={(ref: HTMLElement) => (this.refBeforeInput = ref)} sx={{ height: '100%' }} />\r\n <InputBase\r\n id={this.configs.id}\r\n placeholder={this.configs.placeholder}\r\n fullWidth\r\n autoComplete='off'\r\n inputRef={(ref: HTMLInputElement) => (this.refInput = ref)}\r\n onChange={(event) => this.setState({ keyword: event.target.value })}\r\n value={this.state.keyword}\r\n onFocus={() => this.showPanel('searchInput')}\r\n onKeyDown={this.handleKeyDown}\r\n />\r\n </Box>\r\n )\r\n\r\n handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n if (!this.state.keyword) return\r\n const temp = this.patchFilterWithKey(this.filterState, 'Search', { value: this.state.keyword })\r\n temp.filterState.details = 'add'\r\n if (!!temp.isChanged) {\r\n this.refInput?.blur()\r\n this.setFilterState(temp.filterState)\r\n this.setState(this.defaultState)\r\n }\r\n } else if (keyCode === 27) {\r\n this.refInput?.blur()\r\n this.setState(this.defaultState)\r\n }\r\n }\r\n\r\n handleAdd = (key: keyof IFilterModel<T>, value: IFilterItemModel) => {\r\n const temp = this.patchFilterWithKey(this.filterState, key, value)\r\n temp.filterState.details = 'add'\r\n if (!!temp.isChanged) {\r\n this.refInput?.blur()\r\n this.setFilterState(temp.filterState)\r\n this.setState(this.defaultState)\r\n }\r\n }\r\n\r\n handleRemove = (key: keyof IFilterModel<T>) => {\r\n const temp = this.deleteFilterWithKey(this.filterState, key)\r\n temp.filterState.details = 'remove'\r\n if (!!temp.isChanged) {\r\n this.refInput?.blur()\r\n this.setFilterState(temp.filterState)\r\n this.forceUpdate()\r\n }\r\n }\r\n\r\n handleClear = () => {\r\n this.setFilterState({ filter: {}, details: 'remove' })\r\n this.setState(this.defaultState)\r\n }\r\n\r\n showPanel = (reason: FilterReason) => {\r\n let anchorEl = null\r\n switch (reason) {\r\n case 'searchInput':\r\n anchorEl = this.refBeforeInput\r\n break\r\n case 'filterButton':\r\n anchorEl = this.refFilterButton\r\n break\r\n case 'sortButton':\r\n anchorEl = this.refSortButton\r\n break\r\n default:\r\n break\r\n }\r\n this.setState({ panelState: { anchorEl, reason } })\r\n }\r\n\r\n closePanel = () => this.setState({ panelState: { anchorEl: null } })\r\n }\r\n\r\n return FilterBar\r\n}\r\n\r\nexport default CreateFilterBar\r\n\r\nconst Wrapper = styled(Box)({\r\n display: 'flex',\r\n gap: '8px',\r\n width: '100%',\r\n borderRadius: '6px',\r\n transition: 'all linear 0.2s',\r\n padding: '2px',\r\n backgroundColor: '#fafafa',\r\n '&:hover': { backgroundColor: '#ededed' }\r\n})\r\n\r\nconst Content = styled(Box)({\r\n flex: 1,\r\n minHeight: '40px',\r\n display: 'flex',\r\n flexWrap: 'wrap',\r\n alignItems: 'center',\r\n gap: '6px'\r\n})\r\n"],"names":["CreateFilterBar","params","FilterPanelInstance","CreateFilterPanel","fields","FilteredInstance","CreateFiltered","FilterBar","props","_this","_classCallCheck","_callSuper","_defineProperty","keyword","panelState","anchorEl","filter","filterState","value","filterStateStore","onChange","_jsxs","Box","component","htmlFor","configs","id","sx","flex","display","alignItems","children","_jsx","ref","refBeforeInput","height","InputBase","placeholder","fullWidth","autoComplete","inputRef","refInput","event","setState","target","state","onFocus","showPanel","onKeyDown","handleKeyDown","keyCode","_this$refInput","temp","patchFilterWithKey","details","isChanged","blur","setFilterState","defaultState","_this$refInput2","key","_this$refInput3","_this$refInput4","deleteFilterWithKey","forceUpdate","reason","refFilterButton","refSortButton","_inherits","FilterBarBase","_createClass","get","_this$props$value","this","_ref2","_this$props$id","_ref3","_this$props$placehold","Date","getTime","toString","helpNotes","_this2","ClickAwayListener","onClickAway","closePanel","Wrapper","IconButton","onClick","FilterListIcon","Content","onRemove","handleRemove","renderTextField","ButtonClear","visibled","isFilterEmpty","handleClear","FilterHelpNotes","_objectSpread","onSubmit","handleAdd","onClose","styled","gap","width","borderRadius","transition","padding","backgroundColor","minHeight","flexWrap"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ui.units.js","sources":["../../src/filter-bar/ui.units.tsx"],"sourcesContent":["import React, { FC } 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\ninterface ButtonClearProps {\r\n visibled?: boolean\r\n onClick: IconButtonProps['onClick']\r\n}\r\n\r\nexport const ButtonClear: FC<ButtonClearProps> = (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 FilterHelpNotesProps {\r\n title?: string\r\n items?: string[]\r\n}\r\n\r\nexport const FilterHelpNotes: FC<FilterHelpNotesProps> = (props) => {\r\n if (!props.items || props.items.length < 1) return <></>\r\n return (\r\n <WrapIcon>\r\n <HelpTooltip small title={props.title ?? 'The search includes'}>\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 </HelpTooltip>\r\n </WrapIcon>\r\n )\r\n}\r\n\r\nconst WrapIcon = styled(Box)({\r\n display: 'flex',\r\n flex: '0 0 auto',\r\n width: '40px',\r\n height: '40px',\r\n justifyContent: 'center',\r\n alignItems: 'center'\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","FilterHelpNotes","_props$title","items","length","HelpTooltip","small","WrapList","map","item","index","Typography","component","variant","styled","Box","display","flex","width","height","justifyContent","alignItems","paddingLeft","marginBottom","li","position","textAlign","content","top","right","transform"],"mappings":"uPAUaA,EAAoC,SAACC,GAAK,OACrDC,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,EAQAC,EAA4C,SAACf,GAAS,IAAAgB,EACjE,OAAKhB,EAAMiB,OAASjB,EAAMiB,MAAMC,OAAS,EAAUjB,QAEjDA,EAACC,EACC,CAAAC,SAAAF,EAACkB,EAAY,CAAAC,OAAM,EAAAf,MAAkB,QAAbW,EAAEhB,EAAMK,aAAK,IAAAW,EAAAA,EAAI,sBAAqBb,SAC5DF,EAACoB,EACE,CAAAlB,SAAAH,EAAMiB,MAAMK,KAAI,SAACC,EAAMC,GAAK,OAC3BvB,EAACwB,EAAuB,CAAAC,UAAU,KAAKC,QAAQ,QAAOxB,SACnDoB,GADcC,EAGlB,SAKX,EAEMtB,EAAW0B,EAAOC,EAAPD,CAAY,CAC3BE,QAAS,OACTC,KAAM,WACNC,MAAO,OACPC,OAAQ,OACRC,eAAgB,SAChBC,WAAY,WAGRd,EAAWO,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,mBACX9B,SAAU"}
1
+ {"version":3,"file":"ui.units.js","sources":["../../src/filter-bar/ui.units.tsx"],"sourcesContent":["import React, { FC } 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 IFilterHelpNotesProps {\r\n title?: string\r\n items?: string[]\r\n}\r\n\r\nexport const FilterHelpNotes: FC<IFilterHelpNotesProps> = (props) => {\r\n if (!props.items || props.items.length < 1) return <></>\r\n return (\r\n <WrapIcon>\r\n <HelpTooltip small title={props.title ?? 'The search includes'}>\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 </HelpTooltip>\r\n </WrapIcon>\r\n )\r\n}\r\n\r\nconst WrapIcon = styled(Box)({\r\n display: 'flex',\r\n flex: '0 0 auto',\r\n width: '40px',\r\n height: '40px',\r\n justifyContent: 'center',\r\n alignItems: 'center'\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","FilterHelpNotes","_props$title","items","length","HelpTooltip","small","WrapList","map","item","index","Typography","component","variant","styled","Box","display","flex","width","height","justifyContent","alignItems","paddingLeft","marginBottom","li","position","textAlign","content","top","right","transform"],"mappings":"uPAUaA,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,EAQAC,EAA6C,SAACf,GAAS,IAAAgB,EAClE,OAAKhB,EAAMiB,OAASjB,EAAMiB,MAAMC,OAAS,EAAUjB,QAEjDA,EAACC,EACC,CAAAC,SAAAF,EAACkB,EAAY,CAAAC,OAAM,EAAAf,MAAkB,QAAbW,EAAEhB,EAAMK,aAAK,IAAAW,EAAAA,EAAI,sBAAqBb,SAC5DF,EAACoB,EACE,CAAAlB,SAAAH,EAAMiB,MAAMK,KAAI,SAACC,EAAMC,GAAK,OAC3BvB,EAACwB,EAAuB,CAAAC,UAAU,KAAKC,QAAQ,QAAOxB,SACnDoB,GADcC,EAGlB,SAKX,EAEMtB,EAAW0B,EAAOC,EAAPD,CAAY,CAC3BE,QAAS,OACTC,KAAM,WACNC,MAAO,OACPC,OAAQ,OACRC,eAAgB,SAChBC,WAAY,WAGRd,EAAWO,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,mBACX9B,SAAU"}
@@ -1,2 +1,2 @@
1
- import{defineProperty as e,inherits as t,createClass as a,objectSpread2 as r,classCallCheck as s,callSuper as i}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as l}from"react/jsx-runtime";import{Component as o}from"react";import{LocalizationProvider as u}from"@mui/x-date-pickers";import{AdapterDayjs as d}from"@mui/x-date-pickers/AdapterDayjs";import{styled as c,Box as p,TextField as h,Typography as f,Switch as m}from"@mui/material";import{getErrorMessage as g}from"./helper.js";import{mergeObjects as v,tryParseIntRequired as y}from"../utils/helpers.js";import"../utils/query-param.js";import"../utils/dayjs-config.js";import D from"dayjs";var b="DateExpired-root",x="DateExpired-control",k="DateExpired-label",C="DateExpired-labelSwitch",w="DateExpired-input",O="DateExpired-switch";function j(c){var p=function(){function p(t){var a;return s(this,p),a=i(this,p,[t]),e(a,"defaultNumberOfDays",30),e(a,"getNumberOfDays",(function(){return"number"===a.slots.type?y(a.defaulValue,a.defaultNumberOfDays):a.getDaysUntilDate(a.defaulValue,a.defaultNumberOfDays)})),e(a,"mapTextFieldProps",(function(){var e=a.props,t=e.messageErrors,r=e.name,s=e.onBlur,i=a.props.disabled||!a.state.switchChecked,o={fullWidth:!0,className:w,label:l("span",{className:k,children:["Expiry date",a.state.switchChecked&&n("b",{children:a.getOffsetDate(a.state.numberOfDays)})]}),variant:"outlined",type:"number",disabled:i,value:a.state.switchChecked?a.state.numberOfDays:0,onChange:a.handleChange};if(r){o.onBlur=function(){return s&&s(r)};var u,d=g(t,r);if(d.error)o.error=Boolean(d.error),o.helperText=null!==(u=d.message)&&void 0!==u?u:""}return v({},o,a.slots.textFieldProps)})),e(a,"handleChange",(function(e){var t=""!=e.target.value?parseInt(e.target.value):0;a.setState({numberOfDays:t})})),e(a,"getOffsetDate",(function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"MM-DD-YYYY";return D().add(e,"day").format(t)})),e(a,"getDaysUntilDate",(function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;try{if(!e)return t;var a=D(e),r=D(),s=a.diff(r,"day",!0);return Math.round(s)}catch(e){return t}})),a.state={numberOfDays:a.getNumberOfDays(),switchChecked:a.slots.switchChecked},a.id=(new Date).getTime().toString(),a}return t(p,o),a(p,[{key:"slots",get:function(){var e,t,a=null!==(e=this.props.slots)&&void 0!==e?e:{},s=a.switchChecked,i=a.switchCheckedGetter,n=v(c,this.props.slots),l=null===(t=this.defaulValue?!!this.defaulValue:s)||void 0===t||t;return i&&(l=i(this.defaulValue,this.props.data)),r(r({},n),{},{switchChecked:l})}},{key:"defaulValue",get:function(){var e,t,a=this.props,r=a.data,s=a.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:r&&s?null===(t=r[s])||void 0===t?void 0:t.toString():void 0}},{key:"defaultValueInput",get:function(){return"number"===this.slots.type?this.state.numberOfDays:this.getOffsetDate(this.state.numberOfDays,"YYYY-MM-DDTHH:mm:ss.sssZ")}},{key:"render",value:function(){var e,t=this;return n(u,{dateAdapter:d,children:l(N,{className:b,children:[n("input",{type:"text",hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaultValueInput},this.defaultValueInput),n(h,r({},this.mapTextFieldProps())),l("div",{className:x,children:[n(f,r(r({variant:"caption",className:C},{component:"label",htmlFor:this.id}),{},{sx:{color:this.state.switchChecked?"success.main":"#767676"},children:this.state.switchChecked?"Use Expiration Date":"No Expiration"})),n(m,{id:this.id,size:"small",color:"success",checked:this.state.switchChecked,onChange:function(e,a){return t.setState({switchChecked:a})}})]})]})})}}])}();return p}var N=c(p)(e(e(e(e(e({display:"flex",alignItems:"center",gap:"10px",position:"relative"},".".concat(O),{margin:0,flex:"0 0 auto"}),".".concat(k),{b:{color:"#1976d2",marginLeft:"8px"}}),".".concat(C),{fontWeight:600,cursor:"pointer"}),".".concat(x),{position:"absolute",top:0,right:0,height:"100%",display:"flex",alignItems:"center"}),".".concat(w),{".MuiInputBase-input":{paddingRight:"160px"}}));export{j as default};
1
+ import{defineProperty as e,inherits as t,createClass as a,objectSpread2 as r,classCallCheck as s,callSuper as i}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as n,jsxs as l}from"react/jsx-runtime";import{Component as o}from"react";import{LocalizationProvider as u}from"@mui/x-date-pickers";import{AdapterDayjs as d}from"@mui/x-date-pickers/AdapterDayjs";import{styled as c,Box as p,TextField as h,Typography as f,Switch as m}from"@mui/material";import{getErrorMessage as g}from"./helper.js";import{mergeObjects as v,tryParseIntRequired as y}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"react-router-dom";import"../utils/query-param.js";import D from"dayjs";var b="DateExpired-root",x="DateExpired-control",k="DateExpired-label",C="DateExpired-labelSwitch",w="DateExpired-input",O="DateExpired-switch";function j(c){var p=function(){function p(t){var a;return s(this,p),a=i(this,p,[t]),e(a,"defaultNumberOfDays",30),e(a,"getNumberOfDays",(function(){return"number"===a.slots.type?y(a.defaulValue,a.defaultNumberOfDays):a.getDaysUntilDate(a.defaulValue,a.defaultNumberOfDays)})),e(a,"mapTextFieldProps",(function(){var e=a.props,t=e.messageErrors,r=e.name,s=e.onBlur,i=a.props.disabled||!a.state.switchChecked,o={fullWidth:!0,className:w,label:l("span",{className:k,children:["Expiry date",a.state.switchChecked&&n("b",{children:a.getOffsetDate(a.state.numberOfDays)})]}),variant:"outlined",type:"number",disabled:i,value:a.state.switchChecked?a.state.numberOfDays:0,onChange:a.handleChange};if(r){o.onBlur=function(){return s&&s(r)};var u,d=g(t,r);if(d.error)o.error=Boolean(d.error),o.helperText=null!==(u=d.message)&&void 0!==u?u:""}return v({},o,a.slots.textFieldProps)})),e(a,"handleChange",(function(e){var t=""!=e.target.value?parseInt(e.target.value):0;a.setState({numberOfDays:t})})),e(a,"getOffsetDate",(function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"MM-DD-YYYY";return D().add(e,"day").format(t)})),e(a,"getDaysUntilDate",(function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0;try{if(!e)return t;var a=D(e),r=D(),s=a.diff(r,"day",!0);return Math.round(s)}catch(e){return t}})),a.state={numberOfDays:a.getNumberOfDays(),switchChecked:a.slots.switchChecked},a.id=(new Date).getTime().toString(),a}return t(p,o),a(p,[{key:"slots",get:function(){var e,t,a=null!==(e=this.props.slots)&&void 0!==e?e:{},s=a.switchChecked,i=a.switchCheckedGetter,n=v(c,this.props.slots),l=null===(t=this.defaulValue?!!this.defaulValue:s)||void 0===t||t;return i&&(l=i(this.defaulValue,this.props.data)),r(r({},n),{},{switchChecked:l})}},{key:"defaulValue",get:function(){var e,t,a=this.props,r=a.data,s=a.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:r&&s?null===(t=r[s])||void 0===t?void 0:t.toString():void 0}},{key:"defaultValueInput",get:function(){return"number"===this.slots.type?this.state.numberOfDays:this.getOffsetDate(this.state.numberOfDays,"YYYY-MM-DDTHH:mm:ss.sssZ")}},{key:"render",value:function(){var e,t=this;return n(u,{dateAdapter:d,children:l(N,{className:b,children:[n("input",{type:"text",hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaultValueInput},this.defaultValueInput),n(h,r({},this.mapTextFieldProps())),l("div",{className:x,children:[n(f,r(r({variant:"caption",className:C},{component:"label",htmlFor:this.id}),{},{sx:{color:this.state.switchChecked?"success.main":"#767676"},children:this.state.switchChecked?"Use Expiration Date":"No Expiration"})),n(m,{id:this.id,size:"small",color:"success",checked:this.state.switchChecked,onChange:function(e,a){return t.setState({switchChecked:a})}})]})]})})}}])}();return p}var N=c(p)(e(e(e(e(e({display:"flex",alignItems:"center",gap:"10px",position:"relative"},".".concat(O),{margin:0,flex:"0 0 auto"}),".".concat(k),{b:{color:"#1976d2",marginLeft:"8px"}}),".".concat(C),{fontWeight:600,cursor:"pointer"}),".".concat(x),{position:"absolute",top:0,right:0,height:"100%",display:"flex",alignItems:"center"}),".".concat(w),{".MuiInputBase-input":{paddingRight:"160px"}}));export{j as default};
2
2
  //# sourceMappingURL=create.date-expired.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.date-expired.js","sources":["../../src/form/create.date-expired.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { LocalizationProvider } from '@mui/x-date-pickers'\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'\r\nimport { Switch, Typography, TextField, styled, Box, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\nimport { dayjsCustom, mergeObjects, tryParseIntRequired } from '../utils'\r\n\r\nconst defaultFormatString = 'MM-DD-YYYY'\r\n\r\nconst dateExpiredClasses = {\r\n root: 'DateExpired-root',\r\n control: 'DateExpired-control',\r\n label: 'DateExpired-label',\r\n labelSwitch: 'DateExpired-labelSwitch',\r\n input: 'DateExpired-input',\r\n switch: 'DateExpired-switch'\r\n}\r\n\r\nexport interface IDateExpiredSlots<T> {\r\n /** @default string */\r\n type?: 'number' | 'string'\r\n textFieldProps?: Partial<TextFieldProps>\r\n switchChecked?: boolean\r\n switchCheckedGetter?: (value: any, model?: Partial<T>) => boolean\r\n}\r\n\r\nexport interface IDateExpiredProps<T> extends IFormInputBase<T> {\r\n slots?: IDateExpiredSlots<T>\r\n}\r\n\r\nexport interface IDateExpiredState {\r\n numberOfDays: number\r\n switchChecked: boolean\r\n}\r\n\r\nfunction CreateDateExpired<T>(params?: IDateExpiredSlots<T>): React.ComponentType<IDateExpiredProps<T>> {\r\n class DateExpired extends Component<IDateExpiredProps<T>, IDateExpiredState> {\r\n defaultNumberOfDays: number = 30\r\n private id\r\n constructor(props: IDateExpiredProps<T>) {\r\n super(props)\r\n this.state = {\r\n numberOfDays: this.getNumberOfDays(),\r\n switchChecked: this.slots.switchChecked\r\n }\r\n this.id = new Date().getTime().toString()\r\n }\r\n\r\n get slots(): IDateExpiredSlots<T> & { switchChecked: boolean } {\r\n const { switchChecked, switchCheckedGetter } = this.props.slots ?? {}\r\n const obj = mergeObjects(params, this.props.slots)\r\n let check = (this.defaulValue ? !!this.defaulValue : switchChecked) ?? true\r\n if (switchCheckedGetter) check = switchCheckedGetter(this.defaulValue, this.props.data)\r\n return { ...obj, switchChecked: check }\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 get defaultValueInput(): string | number {\r\n if (this.slots.type === 'number') {\r\n return this.state.numberOfDays\r\n } else {\r\n return this.getOffsetDate(this.state.numberOfDays, 'YYYY-MM-DDTHH:mm:ss.sssZ')\r\n }\r\n }\r\n\r\n getNumberOfDays = (): number => {\r\n if (this.slots.type === 'number') {\r\n return tryParseIntRequired(this.defaulValue, this.defaultNumberOfDays)\r\n } else {\r\n return this.getDaysUntilDate(this.defaulValue, this.defaultNumberOfDays)\r\n }\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <LocalizationProvider dateAdapter={AdapterDayjs}>\r\n <Wrap className={dateExpiredClasses.root}>\r\n <input key={this.defaultValueInput} type='text' hidden name={this.props.name?.toString()} defaultValue={this.defaultValueInput} />\r\n <TextField {...this.mapTextFieldProps()} />\r\n <div className={dateExpiredClasses.control}>\r\n <Typography\r\n variant='caption'\r\n className={dateExpiredClasses.labelSwitch}\r\n {...{ component: 'label', htmlFor: this.id }}\r\n sx={{ color: this.state.switchChecked ? 'success.main' : '#767676' }}\r\n >\r\n {this.state.switchChecked ? 'Use Expiration Date' : 'No Expiration'}\r\n </Typography>\r\n <Switch\r\n id={this.id}\r\n size='small'\r\n color='success'\r\n checked={this.state.switchChecked}\r\n onChange={(_, checked) => this.setState({ switchChecked: checked })}\r\n />\r\n </div>\r\n </Wrap>\r\n </LocalizationProvider>\r\n )\r\n }\r\n //#endregion\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const { messageErrors, name, onBlur } = this.props\r\n const disabled = this.props.disabled || !this.state.switchChecked\r\n const obj: TextFieldProps = {\r\n fullWidth: true,\r\n className: dateExpiredClasses.input,\r\n label: (\r\n <span className={dateExpiredClasses.label}>\r\n Expiry date\r\n {this.state.switchChecked && <b>{this.getOffsetDate(this.state.numberOfDays)}</b>}\r\n </span>\r\n ),\r\n variant: 'outlined',\r\n type: 'number',\r\n disabled: disabled,\r\n value: this.state.switchChecked ? this.state.numberOfDays : 0,\r\n onChange: this.handleChange\r\n }\r\n if (!!name) {\r\n obj.onBlur = () => onBlur && onBlur(name)\r\n const temp = getErrorMessage(messageErrors, name)\r\n if (temp.error) {\r\n obj.error = Boolean(temp.error)\r\n obj.helperText = temp.message ?? ''\r\n }\r\n }\r\n return mergeObjects<TextFieldProps>({}, obj, this.slots.textFieldProps)\r\n }\r\n\r\n handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n const numberOfDays: number = e.target.value != '' ? parseInt(e.target.value) : 0\r\n this.setState({ numberOfDays })\r\n }\r\n\r\n getOffsetDate = (num: number, formatString = defaultFormatString): string => {\r\n return dayjsCustom().add(num, 'day').format(formatString)\r\n }\r\n\r\n getDaysUntilDate = (value?: string, defaultValue = 0): number => {\r\n try {\r\n if (!value) return defaultValue\r\n const target = dayjsCustom(value)\r\n const today = dayjsCustom()\r\n const diff = target.diff(today, 'day', true)\r\n return Math.round(diff)\r\n } catch {\r\n return defaultValue\r\n }\r\n }\r\n }\r\n return DateExpired\r\n}\r\nexport default CreateDateExpired\r\n\r\nconst Wrap = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: '10px',\r\n position: 'relative',\r\n [`.${dateExpiredClasses.switch}`]: {\r\n margin: 0,\r\n flex: '0 0 auto'\r\n },\r\n [`.${dateExpiredClasses.label}`]: {\r\n b: {\r\n color: '#1976d2',\r\n marginLeft: '8px'\r\n }\r\n },\r\n [`.${dateExpiredClasses.labelSwitch}`]: {\r\n fontWeight: 600,\r\n cursor: 'pointer'\r\n },\r\n [`.${dateExpiredClasses.control}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n right: 0,\r\n height: '100%',\r\n display: 'flex',\r\n alignItems: 'center'\r\n },\r\n [`.${dateExpiredClasses.input}`]: {\r\n '.MuiInputBase-input': {\r\n paddingRight: '160px'\r\n }\r\n }\r\n})\r\n"],"names":["dateExpiredClasses","CreateDateExpired","params","DateExpired","props","_this","_classCallCheck","_callSuper","_defineProperty","slots","type","tryParseIntRequired","defaulValue","defaultNumberOfDays","getDaysUntilDate","_this$props","messageErrors","name","onBlur","disabled","state","switchChecked","obj","fullWidth","className","label","_jsxs","children","_jsx","getOffsetDate","numberOfDays","variant","value","onChange","handleChange","_temp$message","temp","getErrorMessage","error","Boolean","helperText","message","mergeObjects","textFieldProps","e","target","parseInt","setState","num","formatString","arguments","length","undefined","dayjsCustom","add","format","defaultValue","today","diff","Math","round","_unused","getNumberOfDays","id","Date","getTime","toString","_inherits","Component","_createClass","key","get","_this$props$slots","_ref2","_ref","this","switchCheckedGetter","check","data","_objectSpread","_this$props$defaultVa","_data$name","_this$props2","_this$props$name","_this2","LocalizationProvider","dateAdapter","AdapterDayjs","Wrap","hidden","defaultValueInput","TextField","mapTextFieldProps","Typography","component","htmlFor","sx","color","Switch","size","checked","_","styled","Box","display","alignItems","gap","position","concat","margin","flex","b","marginLeft","fontWeight","cursor","top","right","height","paddingRight"],"mappings":"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"}
1
+ {"version":3,"file":"create.date-expired.js","sources":["../../src/form/create.date-expired.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { LocalizationProvider } from '@mui/x-date-pickers'\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'\r\nimport { Switch, Typography, TextField, styled, Box, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\nimport { dayjsCustom, mergeObjects, tryParseIntRequired } from '../utils'\r\n\r\nconst defaultFormatString = 'MM-DD-YYYY'\r\n\r\nconst dateExpiredClasses = {\r\n root: 'DateExpired-root',\r\n control: 'DateExpired-control',\r\n label: 'DateExpired-label',\r\n labelSwitch: 'DateExpired-labelSwitch',\r\n input: 'DateExpired-input',\r\n switch: 'DateExpired-switch'\r\n}\r\n\r\nexport interface IDateExpiredSlots<T> {\r\n /** @default string */\r\n type?: 'number' | 'string'\r\n textFieldProps?: Partial<TextFieldProps>\r\n switchChecked?: boolean\r\n switchCheckedGetter?: (value: any, model?: Partial<T>) => boolean\r\n}\r\n\r\nexport interface IDateExpiredProps<T> extends IFormInputBase<T> {\r\n slots?: IDateExpiredSlots<T>\r\n}\r\n\r\nexport interface IDateExpiredState {\r\n numberOfDays: number\r\n switchChecked: boolean\r\n}\r\n\r\nfunction CreateDateExpired<T>(params?: IDateExpiredSlots<T>): React.ComponentType<IDateExpiredProps<T>> {\r\n class DateExpired extends Component<IDateExpiredProps<T>, IDateExpiredState> {\r\n defaultNumberOfDays: number = 30\r\n private id\r\n constructor(props: IDateExpiredProps<T>) {\r\n super(props)\r\n this.state = {\r\n numberOfDays: this.getNumberOfDays(),\r\n switchChecked: this.slots.switchChecked\r\n }\r\n this.id = new Date().getTime().toString()\r\n }\r\n\r\n get slots(): IDateExpiredSlots<T> & { switchChecked: boolean } {\r\n const { switchChecked, switchCheckedGetter } = this.props.slots ?? {}\r\n const obj = mergeObjects(params, this.props.slots)\r\n let check = (this.defaulValue ? !!this.defaulValue : switchChecked) ?? true\r\n if (switchCheckedGetter) check = switchCheckedGetter(this.defaulValue, this.props.data)\r\n return { ...obj, switchChecked: check }\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 get defaultValueInput(): string | number {\r\n if (this.slots.type === 'number') {\r\n return this.state.numberOfDays\r\n } else {\r\n return this.getOffsetDate(this.state.numberOfDays, 'YYYY-MM-DDTHH:mm:ss.sssZ')\r\n }\r\n }\r\n\r\n getNumberOfDays = (): number => {\r\n if (this.slots.type === 'number') {\r\n return tryParseIntRequired(this.defaulValue, this.defaultNumberOfDays)\r\n } else {\r\n return this.getDaysUntilDate(this.defaulValue, this.defaultNumberOfDays)\r\n }\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <LocalizationProvider dateAdapter={AdapterDayjs}>\r\n <Wrap className={dateExpiredClasses.root}>\r\n <input key={this.defaultValueInput} type='text' hidden name={this.props.name?.toString()} defaultValue={this.defaultValueInput} />\r\n <TextField {...this.mapTextFieldProps()} />\r\n <div className={dateExpiredClasses.control}>\r\n <Typography\r\n variant='caption'\r\n className={dateExpiredClasses.labelSwitch}\r\n {...{ component: 'label', htmlFor: this.id }}\r\n sx={{ color: this.state.switchChecked ? 'success.main' : '#767676' }}\r\n >\r\n {this.state.switchChecked ? 'Use Expiration Date' : 'No Expiration'}\r\n </Typography>\r\n <Switch\r\n id={this.id}\r\n size='small'\r\n color='success'\r\n checked={this.state.switchChecked}\r\n onChange={(_, checked) => this.setState({ switchChecked: checked })}\r\n />\r\n </div>\r\n </Wrap>\r\n </LocalizationProvider>\r\n )\r\n }\r\n //#endregion\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const { messageErrors, name, onBlur } = this.props\r\n const disabled = this.props.disabled || !this.state.switchChecked\r\n const obj: TextFieldProps = {\r\n fullWidth: true,\r\n className: dateExpiredClasses.input,\r\n label: (\r\n <span className={dateExpiredClasses.label}>\r\n Expiry date\r\n {this.state.switchChecked && <b>{this.getOffsetDate(this.state.numberOfDays)}</b>}\r\n </span>\r\n ),\r\n variant: 'outlined',\r\n type: 'number',\r\n disabled: disabled,\r\n value: this.state.switchChecked ? this.state.numberOfDays : 0,\r\n onChange: this.handleChange\r\n }\r\n if (!!name) {\r\n obj.onBlur = () => onBlur && onBlur(name)\r\n const temp = getErrorMessage(messageErrors, name)\r\n if (temp.error) {\r\n obj.error = Boolean(temp.error)\r\n obj.helperText = temp.message ?? ''\r\n }\r\n }\r\n return mergeObjects<TextFieldProps>({}, obj, this.slots.textFieldProps)\r\n }\r\n\r\n handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\r\n const numberOfDays: number = e.target.value != '' ? parseInt(e.target.value) : 0\r\n this.setState({ numberOfDays })\r\n }\r\n\r\n getOffsetDate = (num: number, formatString = defaultFormatString): string => {\r\n return dayjsCustom().add(num, 'day').format(formatString)\r\n }\r\n\r\n getDaysUntilDate = (value?: string, defaultValue = 0): number => {\r\n try {\r\n if (!value) return defaultValue\r\n const target = dayjsCustom(value)\r\n const today = dayjsCustom()\r\n const diff = target.diff(today, 'day', true)\r\n return Math.round(diff)\r\n } catch {\r\n return defaultValue\r\n }\r\n }\r\n }\r\n return DateExpired\r\n}\r\nexport default CreateDateExpired\r\n\r\nconst Wrap = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n gap: '10px',\r\n position: 'relative',\r\n [`.${dateExpiredClasses.switch}`]: {\r\n margin: 0,\r\n flex: '0 0 auto'\r\n },\r\n [`.${dateExpiredClasses.label}`]: {\r\n b: {\r\n color: '#1976d2',\r\n marginLeft: '8px'\r\n }\r\n },\r\n [`.${dateExpiredClasses.labelSwitch}`]: {\r\n fontWeight: 600,\r\n cursor: 'pointer'\r\n },\r\n [`.${dateExpiredClasses.control}`]: {\r\n position: 'absolute',\r\n top: 0,\r\n right: 0,\r\n height: '100%',\r\n display: 'flex',\r\n alignItems: 'center'\r\n },\r\n [`.${dateExpiredClasses.input}`]: {\r\n '.MuiInputBase-input': {\r\n paddingRight: '160px'\r\n }\r\n }\r\n})\r\n"],"names":["dateExpiredClasses","CreateDateExpired","params","DateExpired","props","_this","_classCallCheck","_callSuper","_defineProperty","slots","type","tryParseIntRequired","defaulValue","defaultNumberOfDays","getDaysUntilDate","_this$props","messageErrors","name","onBlur","disabled","state","switchChecked","obj","fullWidth","className","label","_jsxs","children","_jsx","getOffsetDate","numberOfDays","variant","value","onChange","handleChange","_temp$message","temp","getErrorMessage","error","Boolean","helperText","message","mergeObjects","textFieldProps","e","target","parseInt","setState","num","formatString","arguments","length","undefined","dayjsCustom","add","format","defaultValue","today","diff","Math","round","_unused","getNumberOfDays","id","Date","getTime","toString","_inherits","Component","_createClass","key","get","_this$props$slots","_ref2","_ref","this","switchCheckedGetter","check","data","_objectSpread","_this$props$defaultVa","_data$name","_this$props2","_this$props$name","_this2","LocalizationProvider","dateAdapter","AdapterDayjs","Wrap","hidden","defaultValueInput","TextField","mapTextFieldProps","Typography","component","htmlFor","sx","color","Switch","size","checked","_","styled","Box","display","alignItems","gap","position","concat","margin","flex","b","marginLeft","fontWeight","cursor","top","right","height","paddingRight"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as t,createClass as e,objectSpread2 as r,classCallCheck as o,callSuper as a,defineProperty as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as s,jsx as n}from"react/jsx-runtime";import{Component as i}from"react";import{styled as u}from"@mui/material";import{AdapterDayjs as p}from"@mui/x-date-pickers/AdapterDayjs";import{DatePicker as d,LocalizationProvider as m}from"@mui/x-date-pickers";import{getErrorMessage as f}from"./helper.js";import{mergeObjects as c}from"../utils/helpers.js";import"../utils/query-param.js";import"../utils/dayjs-config.js";import v from"dayjs";var h=function(u){return function(){function d(t){var e,r;return o(this,d),r=a(this,d,[t]),l(r,"_cachedSlots",{}),l(r,"getDatePickerProps",(function(){var t,e,o,a,l,s=null!==(t=null==u?void 0:u.minDateOffset)&&void 0!==t?t:0,n=s>0?v().add(s,"day").startOf("day"):null==u?void 0:u.minDate,i=null!==(e=r.props.label)&&void 0!==e?e:null===(o=r.props.name)||void 0===o?void 0:o.toString(),p=null!==(a=r.props.format)&&void 0!==a?a:"MM/DD/YYYY",d=f(r.props.messageErrors,r.props.name),m={label:i,format:p,views:["day","month","year"],value:r.state.value,onChange:r.handleChange,disabled:r.props.disabled,minDate:n,slotProps:{textField:{onBlur:r.handleBlur,fullWidth:!0,error:d.error,helperText:d.message,variant:"outlined"}}};return c(m,null==u?void 0:u.datePickerProps,null===(l=r.slots)||void 0===l?void 0:l.datePickerProps)})),l(r,"refInput",null),l(r,"mergeSlots",(function(t){return c({},u,t)})),l(r,"handleBlur",(function(){r.props.name&&r.props.onBlur&&r.props.onBlur(r.props.name)})),l(r,"handleChange",(function(t){r.setState({value:t}),r.refInput&&(r.refInput.value=t&&!isNaN(t.toDate().getTime())?t.toDate().toISOString():""),setTimeout(r.handleBlur,50)})),l(r,"getDefaultValue",(function(){try{var t,e;if(!r.props.defaultValue&&!r.slots.defaultValue&&r.slots.minDateOffset)return v().add(1,"day").startOf("day");if(!r.props.defaultValue&&r.slots.minDate)return r.slots.minDate;var o=r.props,a=o.data,l=o.name,s=null!==(t=null!==(e=r.props.defaultValue)&&void 0!==e?e:r.slots.defaultValue)&&void 0!==t?t:l?null==a?void 0:a[l]:"";return s?v(s.toString()):v()}catch(t){return v()}})),r._cachedSlots=null!==(e=r.mergeSlots(t.slots))&&void 0!==e?e:{},r.state={value:r.getDefaultValue()},r}return t(d,i),e(d,[{key:"slots",get:function(){return this._cachedSlots}},{key:"componentDidUpdate",value:function(t){t.slots!==this.props.slots&&(this._cachedSlots=this.mergeSlots(this.props.slots))}},{key:"render",value:function(){var t,e,o=this;return s(m,{dateAdapter:p,children:[n(g,r({},this.getDatePickerProps())),n("input",{hidden:!0,name:null===(t=this.props.name)||void 0===t?void 0:t.toString(),defaultValue:null===(e=this.getDefaultValue())||void 0===e?void 0:e.toDate().toISOString(),ref:function(t){return o.refInput=t}})]})}}])}()},g=u(d)({"& .MuiInputBase-root::before, & .MuiInputBase-root::after":{borderBottom:"none !important"}});export{h as default};
1
+ import{inherits as t,createClass as e,objectSpread2 as r,classCallCheck as o,callSuper as a,defineProperty as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as s,jsx as n}from"react/jsx-runtime";import{Component as i}from"react";import{styled as u}from"@mui/material";import{AdapterDayjs as p}from"@mui/x-date-pickers/AdapterDayjs";import{DatePicker as d,LocalizationProvider as m}from"@mui/x-date-pickers";import{getErrorMessage as f}from"./helper.js";import{mergeObjects as c}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"react-router-dom";import"../utils/query-param.js";import v from"dayjs";var h=function(u){return function(){function d(t){var e,r;return o(this,d),r=a(this,d,[t]),l(r,"_cachedSlots",{}),l(r,"getDatePickerProps",(function(){var t,e,o,a,l,s=null!==(t=null==u?void 0:u.minDateOffset)&&void 0!==t?t:0,n=s>0?v().add(s,"day").startOf("day"):null==u?void 0:u.minDate,i=null!==(e=r.props.label)&&void 0!==e?e:null===(o=r.props.name)||void 0===o?void 0:o.toString(),p=null!==(a=r.props.format)&&void 0!==a?a:"MM/DD/YYYY",d=f(r.props.messageErrors,r.props.name),m={label:i,format:p,views:["day","month","year"],value:r.state.value,onChange:r.handleChange,disabled:r.props.disabled,minDate:n,slotProps:{textField:{onBlur:r.handleBlur,fullWidth:!0,error:d.error,helperText:d.message,variant:"outlined"}}};return c(m,null==u?void 0:u.datePickerProps,null===(l=r.slots)||void 0===l?void 0:l.datePickerProps)})),l(r,"refInput",null),l(r,"mergeSlots",(function(t){return c({},u,t)})),l(r,"handleBlur",(function(){r.props.name&&r.props.onBlur&&r.props.onBlur(r.props.name)})),l(r,"handleChange",(function(t){r.setState({value:t}),r.refInput&&(r.refInput.value=t&&!isNaN(t.toDate().getTime())?t.toDate().toISOString():""),setTimeout(r.handleBlur,50)})),l(r,"getDefaultValue",(function(){try{var t,e;if(!r.props.defaultValue&&!r.slots.defaultValue&&r.slots.minDateOffset)return v().add(1,"day").startOf("day");if(!r.props.defaultValue&&r.slots.minDate)return r.slots.minDate;var o=r.props,a=o.data,l=o.name,s=null!==(t=null!==(e=r.props.defaultValue)&&void 0!==e?e:r.slots.defaultValue)&&void 0!==t?t:l?null==a?void 0:a[l]:"";return s?v(s.toString()):v()}catch(t){return v()}})),r._cachedSlots=null!==(e=r.mergeSlots(t.slots))&&void 0!==e?e:{},r.state={value:r.getDefaultValue()},r}return t(d,i),e(d,[{key:"slots",get:function(){return this._cachedSlots}},{key:"componentDidUpdate",value:function(t){t.slots!==this.props.slots&&(this._cachedSlots=this.mergeSlots(this.props.slots))}},{key:"render",value:function(){var t,e,o=this;return s(m,{dateAdapter:p,children:[n(g,r({},this.getDatePickerProps())),n("input",{hidden:!0,name:null===(t=this.props.name)||void 0===t?void 0:t.toString(),defaultValue:null===(e=this.getDefaultValue())||void 0===e?void 0:e.toDate().toISOString(),ref:function(t){return o.refInput=t}})]})}}])}()},g=u(d)({"& .MuiInputBase-root::before, & .MuiInputBase-root::after":{borderBottom:"none !important"}});export{h as default};
2
2
  //# sourceMappingURL=create.date-picker.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.date-picker.js","sources":["../../src/form/create.date-picker.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Dayjs } from 'dayjs'\r\nimport { styled } from '@mui/material'\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'\r\nimport { DatePicker as MUIDatePicker, LocalizationProvider, DatePickerProps } from '@mui/x-date-pickers'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\nimport { dayjsCustom, mergeObjects } from '../utils'\r\n\r\nconst formatDefault = 'MM/DD/YYYY'\r\n\r\nexport interface IDatePickerSlots {\r\n defaultValue?: string\r\n minDate?: Dayjs\r\n minDateOffset?: number\r\n datePickerProps?: DatePickerProps<Dayjs>\r\n}\r\n\r\nexport interface IDatePickerProps<T> extends IFormInputBase<T> {\r\n format?: string\r\n slots?: Omit<IDatePickerSlots, 'defaultValue'>\r\n}\r\n\r\nexport interface IDatePickerState {\r\n value: Dayjs | null\r\n}\r\n\r\nconst CreateDatePicker = function <T extends Object>(params?: IDatePickerSlots): ComponentType<IDatePickerProps<T>> {\r\n class DatePicker extends Component<IDatePickerProps<T>, IDatePickerState> {\r\n private _cachedSlots: IDatePickerSlots = {}\r\n constructor(props: IDatePickerProps<T>) {\r\n super(props)\r\n this._cachedSlots = this.mergeSlots(props.slots) ?? {}\r\n this.state = { value: this.getDefaultValue() }\r\n }\r\n\r\n get slots() {\r\n return this._cachedSlots\r\n }\r\n\r\n componentDidUpdate(prevProps: IDatePickerProps<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 getDatePickerProps = (): DatePickerProps<Dayjs> => {\r\n const delayInDays = params?.minDateOffset ?? 0\r\n const minDate = delayInDays > 0 ? dayjsCustom().add(delayInDays, 'day').startOf('day') : params?.minDate\r\n const label = this.props.label ?? this.props.name?.toString()\r\n const format = this.props.format ?? formatDefault\r\n const eMessage = getErrorMessage<T>(this.props.messageErrors, this.props.name)\r\n const obj: DatePickerProps<Dayjs> = {\r\n label,\r\n format,\r\n views: ['day', 'month', 'year'],\r\n value: this.state.value,\r\n onChange: this.handleChange,\r\n disabled: this.props.disabled,\r\n minDate,\r\n slotProps: {\r\n textField: { onBlur: this.handleBlur, fullWidth: true, error: eMessage.error, helperText: eMessage.message, variant: 'outlined' }\r\n }\r\n }\r\n return mergeObjects(obj, params?.datePickerProps, this.slots?.datePickerProps)\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n render() {\r\n return (\r\n <LocalizationProvider dateAdapter={AdapterDayjs}>\r\n <CustomDatePicker {...this.getDatePickerProps()} />\r\n <input\r\n hidden\r\n name={this.props.name?.toString()}\r\n defaultValue={this.getDefaultValue()?.toDate().toISOString()}\r\n ref={(ref) => (this.refInput = ref)}\r\n />\r\n </LocalizationProvider>\r\n )\r\n }\r\n\r\n private mergeSlots = (currentSlots?: IDatePickerSlots): IDatePickerSlots => {\r\n return mergeObjects<IDatePickerSlots>({}, params, currentSlots)\r\n }\r\n\r\n handleBlur = () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n }\r\n\r\n handleChange = (newValue: Dayjs | null) => {\r\n this.setState({ value: newValue })\r\n if (this.refInput) {\r\n this.refInput.value = newValue && !isNaN(newValue.toDate().getTime()) ? newValue.toDate().toISOString() : ''\r\n }\r\n setTimeout(this.handleBlur, 50)\r\n }\r\n\r\n getDefaultValue = (): Dayjs => {\r\n try {\r\n if (!this.props.defaultValue && !this.slots.defaultValue && this.slots.minDateOffset) return dayjsCustom().add(1, 'day').startOf('day')\r\n if (!this.props.defaultValue && this.slots.minDate) return this.slots.minDate\r\n\r\n const { data, name } = this.props\r\n const dValue = this.props.defaultValue ?? this.slots.defaultValue ?? (name ? data?.[name] : '')\r\n return dValue ? dayjsCustom(dValue.toString()) : dayjsCustom()\r\n } catch {\r\n return dayjsCustom()\r\n }\r\n }\r\n }\r\n return DatePicker\r\n}\r\n\r\nexport default CreateDatePicker\r\n\r\nconst CustomDatePicker = styled(MUIDatePicker<Dayjs>)({\r\n '& .MuiInputBase-root::before, & .MuiInputBase-root::after': {\r\n borderBottom: 'none !important'\r\n }\r\n})\r\n"],"names":["CreateDatePicker","params","DatePicker","props","_this$mergeSlots","_this","_classCallCheck","_callSuper","_defineProperty","_params$minDateOffset","_this$props$label","_this$props$name","_this$props$format","_this$slots","delayInDays","minDateOffset","minDate","dayjsCustom","add","startOf","label","name","toString","format","eMessage","getErrorMessage","messageErrors","obj","views","value","state","onChange","handleChange","disabled","slotProps","textField","onBlur","handleBlur","fullWidth","error","helperText","message","variant","mergeObjects","datePickerProps","slots","currentSlots","newValue","setState","refInput","isNaN","toDate","getTime","toISOString","setTimeout","_ref","_this$props$defaultVa","defaultValue","_this$props","data","dValue","_unused","_cachedSlots","mergeSlots","getDefaultValue","_inherits","Component","_createClass","key","get","this","prevProps","_this$props$name2","_this$getDefaultValue","_this2","_jsxs","LocalizationProvider","dateAdapter","AdapterDayjs","children","_jsx","CustomDatePicker","_objectSpread","getDatePickerProps","hidden","ref","styled","MUIDatePicker","borderBottom"],"mappings":"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"}
1
+ {"version":3,"file":"create.date-picker.js","sources":["../../src/form/create.date-picker.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Dayjs } from 'dayjs'\r\nimport { styled } from '@mui/material'\r\nimport { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'\r\nimport { DatePicker as MUIDatePicker, LocalizationProvider, DatePickerProps } from '@mui/x-date-pickers'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helper'\r\nimport { dayjsCustom, mergeObjects } from '../utils'\r\n\r\nconst formatDefault = 'MM/DD/YYYY'\r\n\r\nexport interface IDatePickerSlots {\r\n defaultValue?: string\r\n minDate?: Dayjs\r\n minDateOffset?: number\r\n datePickerProps?: DatePickerProps<Dayjs>\r\n}\r\n\r\nexport interface IDatePickerProps<T> extends IFormInputBase<T> {\r\n format?: string\r\n slots?: Omit<IDatePickerSlots, 'defaultValue'>\r\n}\r\n\r\nexport interface IDatePickerState {\r\n value: Dayjs | null\r\n}\r\n\r\nconst CreateDatePicker = function <T extends Object>(params?: IDatePickerSlots): ComponentType<IDatePickerProps<T>> {\r\n class DatePicker extends Component<IDatePickerProps<T>, IDatePickerState> {\r\n private _cachedSlots: IDatePickerSlots = {}\r\n constructor(props: IDatePickerProps<T>) {\r\n super(props)\r\n this._cachedSlots = this.mergeSlots(props.slots) ?? {}\r\n this.state = { value: this.getDefaultValue() }\r\n }\r\n\r\n get slots() {\r\n return this._cachedSlots\r\n }\r\n\r\n componentDidUpdate(prevProps: IDatePickerProps<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 getDatePickerProps = (): DatePickerProps<Dayjs> => {\r\n const delayInDays = params?.minDateOffset ?? 0\r\n const minDate = delayInDays > 0 ? dayjsCustom().add(delayInDays, 'day').startOf('day') : params?.minDate\r\n const label = this.props.label ?? this.props.name?.toString()\r\n const format = this.props.format ?? formatDefault\r\n const eMessage = getErrorMessage<T>(this.props.messageErrors, this.props.name)\r\n const obj: DatePickerProps<Dayjs> = {\r\n label,\r\n format,\r\n views: ['day', 'month', 'year'],\r\n value: this.state.value,\r\n onChange: this.handleChange,\r\n disabled: this.props.disabled,\r\n minDate,\r\n slotProps: {\r\n textField: { onBlur: this.handleBlur, fullWidth: true, error: eMessage.error, helperText: eMessage.message, variant: 'outlined' }\r\n }\r\n }\r\n return mergeObjects(obj, params?.datePickerProps, this.slots?.datePickerProps)\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n render() {\r\n return (\r\n <LocalizationProvider dateAdapter={AdapterDayjs}>\r\n <CustomDatePicker {...this.getDatePickerProps()} />\r\n <input\r\n hidden\r\n name={this.props.name?.toString()}\r\n defaultValue={this.getDefaultValue()?.toDate().toISOString()}\r\n ref={(ref) => (this.refInput = ref)}\r\n />\r\n </LocalizationProvider>\r\n )\r\n }\r\n\r\n private mergeSlots = (currentSlots?: IDatePickerSlots): IDatePickerSlots => {\r\n return mergeObjects<IDatePickerSlots>({}, params, currentSlots)\r\n }\r\n\r\n handleBlur = () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n }\r\n\r\n handleChange = (newValue: Dayjs | null) => {\r\n this.setState({ value: newValue })\r\n if (this.refInput) {\r\n this.refInput.value = newValue && !isNaN(newValue.toDate().getTime()) ? newValue.toDate().toISOString() : ''\r\n }\r\n setTimeout(this.handleBlur, 50)\r\n }\r\n\r\n getDefaultValue = (): Dayjs => {\r\n try {\r\n if (!this.props.defaultValue && !this.slots.defaultValue && this.slots.minDateOffset) return dayjsCustom().add(1, 'day').startOf('day')\r\n if (!this.props.defaultValue && this.slots.minDate) return this.slots.minDate\r\n\r\n const { data, name } = this.props\r\n const dValue = this.props.defaultValue ?? this.slots.defaultValue ?? (name ? data?.[name] : '')\r\n return dValue ? dayjsCustom(dValue.toString()) : dayjsCustom()\r\n } catch {\r\n return dayjsCustom()\r\n }\r\n }\r\n }\r\n return DatePicker\r\n}\r\n\r\nexport default CreateDatePicker\r\n\r\nconst CustomDatePicker = styled(MUIDatePicker<Dayjs>)({\r\n '& .MuiInputBase-root::before, & .MuiInputBase-root::after': {\r\n borderBottom: 'none !important'\r\n }\r\n})\r\n"],"names":["CreateDatePicker","params","DatePicker","props","_this$mergeSlots","_this","_classCallCheck","_callSuper","_defineProperty","_params$minDateOffset","_this$props$label","_this$props$name","_this$props$format","_this$slots","delayInDays","minDateOffset","minDate","dayjsCustom","add","startOf","label","name","toString","format","eMessage","getErrorMessage","messageErrors","obj","views","value","state","onChange","handleChange","disabled","slotProps","textField","onBlur","handleBlur","fullWidth","error","helperText","message","variant","mergeObjects","datePickerProps","slots","currentSlots","newValue","setState","refInput","isNaN","toDate","getTime","toISOString","setTimeout","_ref","_this$props$defaultVa","defaultValue","_this$props","data","dValue","_unused","_cachedSlots","mergeSlots","getDefaultValue","_inherits","Component","_createClass","key","get","this","prevProps","_this$props$name2","_this$getDefaultValue","_this2","_jsxs","LocalizationProvider","dateAdapter","AdapterDayjs","children","_jsx","CustomDatePicker","_objectSpread","getDatePickerProps","hidden","ref","styled","MUIDatePicker","borderBottom"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as r,createClass as t,classCallCheck as e,callSuper as n,defineProperty as o,asyncToGenerator as i,regeneratorRuntime as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as s}from"react/jsx-runtime";import{Component as c}from"react";import{styled as u,Button as p,Box as d,Card as f,DialogTitle as h,DialogContent as m,DialogActions as v}from"@mui/material";import{fetchDelay as g}from"../utils/helpers.js";import"../utils/query-param.js";import"../utils/dayjs-config.js";import"../api-context/alert-global.js";import"../api-context/drawer-global.js";import{mapGlobalModalContext as x}from"../api-context/global-modal.js";var C=function(u){var p=function(){function p(r){var t;return e(this,p),t=n(this,p,[r]),o(t,"handleClickNo",(function(r){r.close(),t.props.onCancel&&t.props.onCancel()})),o(t,"handleClickYes",function(){var r=i(l().mark((function r(e){return l().wrap((function(r){for(;;)switch(r.prev=r.next){case 0:if(t.props.onSubmit){r.next=2;break}return r.abrupt("return");case 2:return r.prev=2,t.setState({loading:!0}),r.next=6,g((function(){return t.props.onSubmit(t.props.data)}),700);case 6:e.close(),r.next=12;break;case 9:r.prev=9,r.t0=r.catch(2),console.log(r.t0);case 12:return r.prev=12,t.setState({loading:!1}),r.finish(12);case 15:case"end":return r.stop()}}),r,null,[[2,9,12,15]])})));return function(t){return r.apply(this,arguments)}}()),t.state={loading:!1},t}return r(p,c),t(p,[{key:"render",value:function(){var r,t,e=this,n=this.props.children||(null!=u&&u.content?null==u?void 0:u.content(this.props.data):void 0),o=null!==(r=null!==(t=this.props.title)&&void 0!==t?t:null==u?void 0:u.title)&&void 0!==r?r:"Are you sure?";return a(d,{sx:{flex:1,display:"flex",alignItems:"center",justifyContent:"center"},children:x((function(r){var t,i;return s(f,{children:[a(h,{id:"alert-dialog-title",children:o}),a(m,{sx:{minWidth:"300px"},children:n}),s(v,{children:[a(b,{disabled:e.state.loading,color:(null==u||null===(t=u.colors)||void 0===t?void 0:t.no)||"inherit",onClick:function(){return e.handleClickNo(r)},children:"No"}),a(b,{color:(null==u||null===(i=u.colors)||void 0===i?void 0:i.yes)||"error",disabled:e.state.loading,onClick:function(){return e.handleClickYes(r)},children:"Yes"})]})]})}))})}}])}();return p},b=u(p)({textTransform:"capitalize",fontWeight:600,"&.MuiButton-colorInherit":{color:"#606060!important"}});export{C as default};
1
+ import{inherits as r,createClass as t,classCallCheck as e,callSuper as n,defineProperty as o,asyncToGenerator as i,regeneratorRuntime as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as a,jsxs as s}from"react/jsx-runtime";import{Component as c}from"react";import{styled as u,Button as p,Box as d,Card as m,DialogTitle as f,DialogContent as h,DialogActions as v}from"@mui/material";import{fetchDelay as g}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"react-router-dom";import"../utils/query-param.js";import"../api-context/alert-global.js";import"../api-context/drawer-global.js";import{mapGlobalModalContext as x}from"../api-context/global-modal.js";var C=function(u){var p=function(){function p(r){var t;return e(this,p),t=n(this,p,[r]),o(t,"handleClickNo",(function(r){r.close(),t.props.onCancel&&t.props.onCancel()})),o(t,"handleClickYes",function(){var r=i(l().mark((function r(e){return l().wrap((function(r){for(;;)switch(r.prev=r.next){case 0:if(t.props.onSubmit){r.next=2;break}return r.abrupt("return");case 2:return r.prev=2,t.setState({loading:!0}),r.next=6,g((function(){return t.props.onSubmit(t.props.data)}),700);case 6:e.close(),r.next=12;break;case 9:r.prev=9,r.t0=r.catch(2),console.log(r.t0);case 12:return r.prev=12,t.setState({loading:!1}),r.finish(12);case 15:case"end":return r.stop()}}),r,null,[[2,9,12,15]])})));return function(t){return r.apply(this,arguments)}}()),t.state={loading:!1},t}return r(p,c),t(p,[{key:"render",value:function(){var r,t,e=this,n=this.props.children||(null!=u&&u.content?null==u?void 0:u.content(this.props.data):void 0),o=null!==(r=null!==(t=this.props.title)&&void 0!==t?t:null==u?void 0:u.title)&&void 0!==r?r:"Are you sure?";return a(d,{sx:{flex:1,display:"flex",alignItems:"center",justifyContent:"center"},children:x((function(r){var t,i;return s(m,{children:[a(f,{id:"alert-dialog-title",children:o}),a(h,{sx:{minWidth:"300px"},children:n}),s(v,{children:[a(b,{disabled:e.state.loading,color:(null==u||null===(t=u.colors)||void 0===t?void 0:t.no)||"inherit",onClick:function(){return e.handleClickNo(r)},children:"No"}),a(b,{color:(null==u||null===(i=u.colors)||void 0===i?void 0:i.yes)||"error",disabled:e.state.loading,onClick:function(){return e.handleClickYes(r)},children:"Yes"})]})]})}))})}}])}();return p},b=u(p)({textTransform:"capitalize",fontWeight:600,"&.MuiButton-colorInherit":{color:"#606060!important"}});export{C as default};
2
2
  //# sourceMappingURL=create.form-comfirm.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.form-comfirm.js","sources":["../../src/form/create.form-comfirm.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, Button, Card, DialogActions, DialogContent, DialogTitle, styled } from '@mui/material'\r\nimport { fetchDelay } from '../utils'\r\nimport { IGlobalModalContext, mapGlobalModalContext } from '../api-context'\r\n\r\nexport interface IFormComfirmParam<T> {\r\n title?: string\r\n content: (value?: T) => JSX.Element\r\n colors?: {\r\n yes?: 'inherit' | 'error' | 'primary' | 'secondary' | 'success' | 'info' | 'warning'\r\n no?: 'inherit' | 'error' | 'primary' | 'secondary' | 'success' | 'info' | 'warning'\r\n }\r\n}\r\n\r\nexport interface IFormComfirmProps<T> {\r\n data?: T\r\n title?: string\r\n onSubmit: (value?: T) => Promise<void>\r\n onCancel?: () => void\r\n}\r\n\r\nexport interface IFormComfirmState {\r\n loading?: boolean\r\n}\r\n\r\nconst CreateFormComfirm = function <T = any>(param?: IFormComfirmParam<T>): ComponentType<React.PropsWithChildren<IFormComfirmProps<T>>> {\r\n class FormConfirm extends Component<React.PropsWithChildren<IFormComfirmProps<T>>, IFormComfirmState> {\r\n constructor(props: IFormComfirmProps<T>) {\r\n super(props)\r\n this.state = { loading: false }\r\n }\r\n\r\n render() {\r\n const content = this.props.children || (param?.content ? param?.content(this.props.data) : undefined)\r\n const title = this.props.title ?? param?.title ?? 'Are you sure?'\r\n return (\r\n <Box sx={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>\r\n {mapGlobalModalContext((context) => (\r\n <Card>\r\n <DialogTitle id='alert-dialog-title'>{title}</DialogTitle>\r\n <DialogContent sx={{ minWidth: '300px' }}>{content}</DialogContent>\r\n <DialogActions>\r\n <CustomButton disabled={this.state.loading} color={param?.colors?.no || 'inherit'} onClick={() => this.handleClickNo(context)}>\r\n No\r\n </CustomButton>\r\n <CustomButton color={param?.colors?.yes || 'error'} disabled={this.state.loading} onClick={() => this.handleClickYes(context)}>\r\n Yes\r\n </CustomButton>\r\n </DialogActions>\r\n </Card>\r\n ))}\r\n </Box>\r\n )\r\n }\r\n\r\n handleClickNo = (context: IGlobalModalContext) => {\r\n context.close()\r\n this.props.onCancel && this.props.onCancel()\r\n }\r\n\r\n handleClickYes = async (context: IGlobalModalContext) => {\r\n if (!this.props.onSubmit) return\r\n try {\r\n this.setState({ loading: true })\r\n await fetchDelay(() => this.props.onSubmit(this.props.data), 700)\r\n context.close()\r\n } catch (error) {\r\n console.log(error)\r\n } finally {\r\n this.setState({ loading: false })\r\n }\r\n }\r\n }\r\n return FormConfirm\r\n}\r\nexport default CreateFormComfirm\r\n\r\nconst CustomButton = styled(Button)({\r\n textTransform: 'capitalize',\r\n fontWeight: 600,\r\n '&.MuiButton-colorInherit': {\r\n color: '#606060!important'\r\n }\r\n})\r\n"],"names":["CreateFormComfirm","param","FormConfirm","props","_this","_classCallCheck","_callSuper","_defineProperty","context","close","onCancel","_ref","_asyncToGenerator","_regeneratorRuntime","mark","_callee","wrap","_context","prev","next","onSubmit","abrupt","setState","loading","fetchDelay","data","t0","console","log","finish","stop","_x","apply","this","arguments","state","_inherits","Component","_createClass","key","value","_ref2","_this$props$title","_this2","content","children","undefined","title","_jsx","Box","sx","flex","display","alignItems","justifyContent","mapGlobalModalContext","_param$colors","_param$colors2","_jsxs","Card","DialogTitle","id","DialogContent","minWidth","DialogActions","CustomButton","disabled","color","colors","no","onClick","handleClickNo","yes","handleClickYes","styled","Button","textTransform","fontWeight"],"mappings":"mpBAyBA,IAAMA,EAAoB,SAAmBC,GAA4B,IACjEC,aACJ,SAAAA,EAAYC,GAA2B,IAAAC,EAEN,OAFMC,OAAAH,GACrCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EA2BE,iBAAA,SAACI,GACfA,EAAQC,QACRL,EAAKD,MAAMO,UAAYN,EAAKD,MAAMO,cACnCH,EAAAH,EAAA,iBAAA,WAAA,IAAAO,EAAAC,EAAAC,IAAAC,MAEgB,SAAAC,EAAOP,GAA4B,OAAAK,IAAAG,MAAA,SAAAC,GAAA,cAAAA,EAAAC,KAAAD,EAAAE,MAAA,KAAA,EAAA,GAC7Cf,EAAKD,MAAMiB,SAAQ,CAAAH,EAAAE,KAAA,EAAA,KAAA,CAAA,OAAAF,EAAAI,OAAA,UAAA,KAAA,EAEU,OAFVJ,EAAAC,KAAA,EAEtBd,EAAKkB,SAAS,CAAEC,SAAS,IAAON,EAAAE,KAAA,EAC1BK,GAAW,WAAA,OAAMpB,EAAKD,MAAMiB,SAAShB,EAAKD,MAAMsB,KAAK,GAAE,KAAI,KAAA,EACjEjB,EAAQC,QAAOQ,EAAAE,KAAA,GAAA,MAAA,KAAA,EAAAF,EAAAC,KAAA,EAAAD,EAAAS,GAAAT,EAAA,MAAA,GAEfU,QAAQC,IAAGX,EAAAS,IAAO,KAAA,GAEe,OAFfT,EAAAC,KAAA,GAElBd,EAAKkB,SAAS,CAAEC,SAAS,IAAQN,EAAAY,OAAA,IAAA,KAAA,GAAA,IAAA,MAAA,OAAAZ,EAAAa,OAAA,GAAAf,EAAA,KAAA,CAAA,CAAA,EAAA,EAAA,GAAA,UAEpC,OAAA,SAAAgB,GAAA,OAAApB,EAAAqB,MAAAC,KAAAC,UAAA,CAAA,CAbA,IA7BC9B,EAAK+B,MAAQ,CAAEZ,SAAS,GAAOnB,CACjC,CAAC,OAAAgC,EAAAlC,EAJuBmC,GAIvBC,EAAApC,EAAA,CAAA,CAAAqC,IAAA,SAAAC,MAED,WAAM,IAAAC,EAAAC,EAAAC,EAAAV,KACEW,EAAUX,KAAK9B,MAAM0C,WAAa5C,SAAAA,EAAO2C,QAAU3C,aAAK,EAALA,EAAO2C,QAAQX,KAAK9B,MAAMsB,WAAQqB,GACrFC,EAAwC,QAAnCN,EAAmB,QAAnBC,EAAGT,KAAK9B,MAAM4C,aAAK,IAAAL,EAAAA,EAAIzC,aAAK,EAALA,EAAO8C,aAAK,IAAAN,EAAAA,EAAI,gBAClD,OACEO,EAACC,EAAG,CAACC,GAAI,CAAEC,KAAM,EAAGC,QAAS,OAAQC,WAAY,SAAUC,eAAgB,UACxET,SAAAU,GAAsB,SAAC/C,GAAO,IAAAgD,EAAAC,EAAA,OAC7BC,EAACC,EACC,CAAAd,SAAA,CAAAG,EAACY,EAAW,CAACC,GAAG,qBAAoBhB,SAAEE,IACtCC,EAACc,EAAc,CAAAZ,GAAI,CAAEa,SAAU,kBAAYnB,IAC3Cc,EAACM,EAAa,CAAAnB,SAAA,CACZG,EAACiB,GAAaC,SAAUvB,EAAKR,MAAMZ,QAAS4C,OAAOlE,iBAAKuD,EAALvD,EAAOmE,cAAM,IAAAZ,OAAA,EAAbA,EAAea,KAAM,UAAWC,QAAS,WAAF,OAAQ3B,EAAK4B,cAAc/D,EAAQ,EAAAqC,SAAA,OAG7HG,EAACiB,EAAY,CAACE,OAAOlE,iBAAKwD,EAALxD,EAAOmE,cAAM,IAAAX,OAAA,EAAbA,EAAee,MAAO,QAASN,SAAUvB,EAAKR,MAAMZ,QAAS+C,QAAS,WAAF,OAAQ3B,EAAK8B,eAAejE,EAAQ,EAE9GqC,SAAA,aAGpB,KAGP,IAAC,IAoBH,OAAO3C,CACT,EAGM+D,EAAeS,EAAOC,EAAPD,CAAe,CAClCE,cAAe,aACfC,WAAY,IACZ,2BAA4B,CAC1BV,MAAO"}
1
+ {"version":3,"file":"create.form-comfirm.js","sources":["../../src/form/create.form-comfirm.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, Button, Card, DialogActions, DialogContent, DialogTitle, styled } from '@mui/material'\r\nimport { fetchDelay } from '../utils'\r\nimport { IGlobalModalContext, mapGlobalModalContext } from '../api-context'\r\n\r\nexport interface IFormComfirmParam<T> {\r\n title?: string\r\n content: (value?: T) => JSX.Element\r\n colors?: {\r\n yes?: 'inherit' | 'error' | 'primary' | 'secondary' | 'success' | 'info' | 'warning'\r\n no?: 'inherit' | 'error' | 'primary' | 'secondary' | 'success' | 'info' | 'warning'\r\n }\r\n}\r\n\r\nexport interface IFormComfirmProps<T> {\r\n data?: T\r\n title?: string\r\n onSubmit: (value?: T) => Promise<void>\r\n onCancel?: () => void\r\n}\r\n\r\nexport interface IFormComfirmState {\r\n loading?: boolean\r\n}\r\n\r\nconst CreateFormComfirm = function <T = any>(param?: IFormComfirmParam<T>): ComponentType<React.PropsWithChildren<IFormComfirmProps<T>>> {\r\n class FormConfirm extends Component<React.PropsWithChildren<IFormComfirmProps<T>>, IFormComfirmState> {\r\n constructor(props: IFormComfirmProps<T>) {\r\n super(props)\r\n this.state = { loading: false }\r\n }\r\n\r\n render() {\r\n const content = this.props.children || (param?.content ? param?.content(this.props.data) : undefined)\r\n const title = this.props.title ?? param?.title ?? 'Are you sure?'\r\n return (\r\n <Box sx={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>\r\n {mapGlobalModalContext((context) => (\r\n <Card>\r\n <DialogTitle id='alert-dialog-title'>{title}</DialogTitle>\r\n <DialogContent sx={{ minWidth: '300px' }}>{content}</DialogContent>\r\n <DialogActions>\r\n <CustomButton disabled={this.state.loading} color={param?.colors?.no || 'inherit'} onClick={() => this.handleClickNo(context)}>\r\n No\r\n </CustomButton>\r\n <CustomButton color={param?.colors?.yes || 'error'} disabled={this.state.loading} onClick={() => this.handleClickYes(context)}>\r\n Yes\r\n </CustomButton>\r\n </DialogActions>\r\n </Card>\r\n ))}\r\n </Box>\r\n )\r\n }\r\n\r\n handleClickNo = (context: IGlobalModalContext) => {\r\n context.close()\r\n this.props.onCancel && this.props.onCancel()\r\n }\r\n\r\n handleClickYes = async (context: IGlobalModalContext) => {\r\n if (!this.props.onSubmit) return\r\n try {\r\n this.setState({ loading: true })\r\n await fetchDelay(() => this.props.onSubmit(this.props.data), 700)\r\n context.close()\r\n } catch (error) {\r\n console.log(error)\r\n } finally {\r\n this.setState({ loading: false })\r\n }\r\n }\r\n }\r\n return FormConfirm\r\n}\r\nexport default CreateFormComfirm\r\n\r\nconst CustomButton = styled(Button)({\r\n textTransform: 'capitalize',\r\n fontWeight: 600,\r\n '&.MuiButton-colorInherit': {\r\n color: '#606060!important'\r\n }\r\n})\r\n"],"names":["CreateFormComfirm","param","FormConfirm","props","_this","_classCallCheck","_callSuper","_defineProperty","context","close","onCancel","_ref","_asyncToGenerator","_regeneratorRuntime","mark","_callee","wrap","_context","prev","next","onSubmit","abrupt","setState","loading","fetchDelay","data","t0","console","log","finish","stop","_x","apply","this","arguments","state","_inherits","Component","_createClass","key","value","_ref2","_this$props$title","_this2","content","children","undefined","title","_jsx","Box","sx","flex","display","alignItems","justifyContent","mapGlobalModalContext","_param$colors","_param$colors2","_jsxs","Card","DialogTitle","id","DialogContent","minWidth","DialogActions","CustomButton","disabled","color","colors","no","onClick","handleClickNo","yes","handleClickYes","styled","Button","textTransform","fontWeight"],"mappings":"4qBAyBA,IAAMA,EAAoB,SAAmBC,GAA4B,IACjEC,aACJ,SAAAA,EAAYC,GAA2B,IAAAC,EAEN,OAFMC,OAAAH,GACrCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EA2BE,iBAAA,SAACI,GACfA,EAAQC,QACRL,EAAKD,MAAMO,UAAYN,EAAKD,MAAMO,cACnCH,EAAAH,EAAA,iBAAA,WAAA,IAAAO,EAAAC,EAAAC,IAAAC,MAEgB,SAAAC,EAAOP,GAA4B,OAAAK,IAAAG,MAAA,SAAAC,GAAA,cAAAA,EAAAC,KAAAD,EAAAE,MAAA,KAAA,EAAA,GAC7Cf,EAAKD,MAAMiB,SAAQ,CAAAH,EAAAE,KAAA,EAAA,KAAA,CAAA,OAAAF,EAAAI,OAAA,UAAA,KAAA,EAEU,OAFVJ,EAAAC,KAAA,EAEtBd,EAAKkB,SAAS,CAAEC,SAAS,IAAON,EAAAE,KAAA,EAC1BK,GAAW,WAAA,OAAMpB,EAAKD,MAAMiB,SAAShB,EAAKD,MAAMsB,KAAK,GAAE,KAAI,KAAA,EACjEjB,EAAQC,QAAOQ,EAAAE,KAAA,GAAA,MAAA,KAAA,EAAAF,EAAAC,KAAA,EAAAD,EAAAS,GAAAT,EAAA,MAAA,GAEfU,QAAQC,IAAGX,EAAAS,IAAO,KAAA,GAEe,OAFfT,EAAAC,KAAA,GAElBd,EAAKkB,SAAS,CAAEC,SAAS,IAAQN,EAAAY,OAAA,IAAA,KAAA,GAAA,IAAA,MAAA,OAAAZ,EAAAa,OAAA,GAAAf,EAAA,KAAA,CAAA,CAAA,EAAA,EAAA,GAAA,UAEpC,OAAA,SAAAgB,GAAA,OAAApB,EAAAqB,MAAAC,KAAAC,UAAA,CAAA,CAbA,IA7BC9B,EAAK+B,MAAQ,CAAEZ,SAAS,GAAOnB,CACjC,CAAC,OAAAgC,EAAAlC,EAJuBmC,GAIvBC,EAAApC,EAAA,CAAA,CAAAqC,IAAA,SAAAC,MAED,WAAM,IAAAC,EAAAC,EAAAC,EAAAV,KACEW,EAAUX,KAAK9B,MAAM0C,WAAa5C,SAAAA,EAAO2C,QAAU3C,aAAK,EAALA,EAAO2C,QAAQX,KAAK9B,MAAMsB,WAAQqB,GACrFC,EAAwC,QAAnCN,EAAmB,QAAnBC,EAAGT,KAAK9B,MAAM4C,aAAK,IAAAL,EAAAA,EAAIzC,aAAK,EAALA,EAAO8C,aAAK,IAAAN,EAAAA,EAAI,gBAClD,OACEO,EAACC,EAAG,CAACC,GAAI,CAAEC,KAAM,EAAGC,QAAS,OAAQC,WAAY,SAAUC,eAAgB,UACxET,SAAAU,GAAsB,SAAC/C,GAAO,IAAAgD,EAAAC,EAAA,OAC7BC,EAACC,EACC,CAAAd,SAAA,CAAAG,EAACY,EAAW,CAACC,GAAG,qBAAoBhB,SAAEE,IACtCC,EAACc,EAAc,CAAAZ,GAAI,CAAEa,SAAU,kBAAYnB,IAC3Cc,EAACM,EAAa,CAAAnB,SAAA,CACZG,EAACiB,GAAaC,SAAUvB,EAAKR,MAAMZ,QAAS4C,OAAOlE,iBAAKuD,EAALvD,EAAOmE,cAAM,IAAAZ,OAAA,EAAbA,EAAea,KAAM,UAAWC,QAAS,WAAF,OAAQ3B,EAAK4B,cAAc/D,EAAQ,EAAAqC,SAAA,OAG7HG,EAACiB,EAAY,CAACE,OAAOlE,iBAAKwD,EAALxD,EAAOmE,cAAM,IAAAX,OAAA,EAAbA,EAAee,MAAO,QAASN,SAAUvB,EAAKR,MAAMZ,QAAS+C,QAAS,WAAF,OAAQ3B,EAAK8B,eAAejE,EAAQ,EAE9GqC,SAAA,aAGpB,KAGP,IAAC,IAoBH,OAAO3C,CACT,EAGM+D,EAAeS,EAAOC,EAAPD,CAAe,CAClCE,cAAe,aACfC,WAAY,IACZ,2BAA4B,CAC1BV,MAAO"}
@@ -1,2 +1,2 @@
1
- import{inherits as e,createClass as t,objectSpread2 as r,classCallCheck as o,callSuper as a,defineProperty as i,objectWithoutProperties as n,asyncToGenerator as l,regeneratorRuntime as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as p,jsx as u,Fragment as d}from"react/jsx-runtime";import{Component as c}from"react";import{styled as m,Box as h,TextField as v,InputAdornment as f,IconButton as g,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/query-param.js";import"../utils/dayjs-config.js";import{getErrorMessage as y}from"./helper.js";import"../components/breadcrumbs.js";import"clipboard-copy";import"@mui/icons-material/Done";import"@mui/icons-material/ContentCopy";import"../components/create.multi-select-dropdown.js";import j from"../components/image-with-fallback.js";import"../components/help-tooltip.js";import"../components/text-editor.js";var P=["srcValue","element","alt","fallbackSrc","debounceDelay"],C=function(m){return function(){function x(e){var t,p;return o(this,x),p=a(this,x,[e]),i(p,"_cachedSlots",{}),i(p,"mapTextFieldProps",(function(){var e,t,o,a,i=y(p.props.messageErrors,p.props.name),n={fullWidth:!0,variant:"outlined",name:null===(e=p.props.name)||void 0===e?void 0:e.toString(),error:i.error,helperText:i.message,disabled:p.props.disabled,onBlur:function(){p.props.name&&p.props.onBlur&&p.props.onBlur(p.props.name)},label:p.getLabel(),placeholder:p.props.placeholder,InputLabelProps:p.state.value?{shrink:!0}:{},value:null!==(t=p.state.value)&&void 0!==t?t:"",onChange:p.handleChange};return!0===p.slots.pastenable&&(n.InputProps={endAdornment:u(f,{position:"end",children:u(g,{onClick:p.handlePaste,edge:"end",children:u(S,{})})})}),null!==(o=p.slots)&&void 0!==o&&o.maxLength&&(n.inputProps=r(r({},n.inputProps),{},{maxLength:p.slots.maxLength})),k({},n,null===(a=p.slots)||void 0===a?void 0:a.textFieldProps)})),i(p,"renderImageSide",(function(e){var t,o="left"===e?p.slots.imageLeft:p.slots.imageRight;if(!o)return u(d,{});var a=o.srcValue,i=o.element,l=o.alt,s=void 0===l?"input-image":l,c=o.fallbackSrc,m=void 0===c?"":c,h=o.debounceDelay,v=void 0===h?700:h,f=n(o,P);if(i)return u(w,{children:u(i,{value:p.state.value,model:p.props.data})});var g=a?a(p.state.value,p.props.data):null!==(t=f.src)&&void 0!==t?t:p.state.value,x={src:g,alt:s,fallbackSrc:m,debounceDelay:v};return u(b,{sx:{mx:"10px"},in:!!g,unmountOnExit:!0,orientation:"horizontal",children:u(w,{children:u(j,r(r(r({},f),x),{},{loading:u(L,{})}))})})})),i(p,"mergeSlots",(function(e){var t=k({},m,e),o=t.imageLeft,a=t.imageRight;return null!=o&&o.mirror&&!a?(t.imageRight=r({},o),delete t.imageRight.mirror):null!=a&&a.mirror&&!o&&(t.imageLeft=r({},a),delete t.imageLeft.mirror),t})),i(p,"getLabel",(function(){var e,t,r;if(p.props.label)return null!==(e=p.slots)&&void 0!==e&&e.maxLength?"".concat(p.props.label," (").concat(null!==(t=null===(r=p.state.value)||void 0===r?void 0:r.length)&&void 0!==t?t:0,"/").concat(p.slots.maxLength,")"):p.props.label})),i(p,"handleChange",(function(e){p.setState((function(t){return r(r({},t),{},{value:e.target.value})}))})),i(p,"handlePaste",l(s().mark((function e(){var t;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.prev=0,e.next=3,navigator.clipboard.readText();case 3:t=e.sent,p.setState({value:t}),e.next=10;break;case 7:e.prev=7,e.t0=e.catch(0),console.error("Error clipboard:",e.t0);case 10:case"end":return e.stop()}}),e,null,[[0,7]])})))),p._cachedSlots=null!==(t=p.mergeSlots(e.slots))&&void 0!==t?t:{},p.state={value:p.defaulValue},p}return e(x,c),t(x,[{key:"slots",get:function(){return this._cachedSlots}},{key:"defaulValue",get:function(){var e,t,r=this.props,o=r.data,a=r.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:o&&a?null===(t=o[a])||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 o,a,i,n,l=null!==(o=null===(a=this.props.data)||void 0===a||null===(a=a[r])||void 0===a?void 0:a.toString())&&void 0!==o?o:"",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 p(h,{sx:{display:"flex",alignItems:"center"},children:[!!this.props.disabled&&u("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaulValue}),this.renderImageSide("left"),u(v,r({},this.mapTextFieldProps())),this.renderImageSide("right")]})}}])}()},L=function(){return u("div",{children:u(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{C as default};
1
+ import{inherits as e,createClass as t,objectSpread2 as r,classCallCheck as o,callSuper as a,defineProperty as n,objectWithoutProperties as i,asyncToGenerator as l,regeneratorRuntime as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as p,jsx as u,Fragment as d}from"react/jsx-runtime";import{Component as c}from"react";import{styled as m,Box as h,TextField as v,InputAdornment as f,IconButton as g,Collapse as b,CircularProgress as x}from"@mui/material";import S from"@mui/icons-material/ContentPaste";import{mergeObjects as j}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"react-router-dom";import"../utils/query-param.js";import{getErrorMessage as k}from"./helper.js";import"../components/breadcrumbs.js";import"../components/buttons.js";import"clipboard-copy";import"@mui/icons-material/Done";import"@mui/icons-material/ContentCopy";import"../components/create.multi-select-dropdown.js";import y from"../components/image-with-fallback.js";import"../components/help-tooltip.js";import"../components/text-editor.js";var P=["srcValue","element","alt","fallbackSrc","debounceDelay"],C=function(m){return function(){function x(e){var t,p;return o(this,x),p=a(this,x,[e]),n(p,"_cachedSlots",{}),n(p,"mapTextFieldProps",(function(){var e,t,o,a,n=k(p.props.messageErrors,p.props.name),i={fullWidth:!0,variant:"outlined",name:null===(e=p.props.name)||void 0===e?void 0:e.toString(),error:n.error,helperText:n.message,disabled:p.props.disabled,onBlur:function(){p.props.name&&p.props.onBlur&&p.props.onBlur(p.props.name)},label:p.getLabel(),placeholder:p.props.placeholder,InputLabelProps:p.state.value?{shrink:!0}:{},value:null!==(t=p.state.value)&&void 0!==t?t:"",onChange:p.handleChange};return!0===p.slots.pastenable&&(i.InputProps={endAdornment:u(f,{position:"end",children:u(g,{onClick:p.handlePaste,edge:"end",children:u(S,{})})})}),null!==(o=p.slots)&&void 0!==o&&o.maxLength&&(i.inputProps=r(r({},i.inputProps),{},{maxLength:p.slots.maxLength})),j({},i,null===(a=p.slots)||void 0===a?void 0:a.textFieldProps)})),n(p,"renderImageSide",(function(e){var t,o="left"===e?p.slots.imageLeft:p.slots.imageRight;if(!o)return u(d,{});var a=o.srcValue,n=o.element,l=o.alt,s=void 0===l?"input-image":l,c=o.fallbackSrc,m=void 0===c?"":c,h=o.debounceDelay,v=void 0===h?700:h,f=i(o,P);if(n)return u(w,{children:u(n,{value:p.state.value,model:p.props.data})});var g=a?a(p.state.value,p.props.data):null!==(t=f.src)&&void 0!==t?t:p.state.value,x={src:g,alt:s,fallbackSrc:m,debounceDelay:v};return u(b,{sx:{mx:"10px"},in:!!g,unmountOnExit:!0,orientation:"horizontal",children:u(w,{children:u(y,r(r(r({},f),x),{},{loading:u(L,{})}))})})})),n(p,"mergeSlots",(function(e){var t=j({},m,e),o=t.imageLeft,a=t.imageRight;return null!=o&&o.mirror&&!a?(t.imageRight=r({},o),delete t.imageRight.mirror):null!=a&&a.mirror&&!o&&(t.imageLeft=r({},a),delete t.imageLeft.mirror),t})),n(p,"getLabel",(function(){var e,t,r;if(p.props.label)return null!==(e=p.slots)&&void 0!==e&&e.maxLength?"".concat(p.props.label," (").concat(null!==(t=null===(r=p.state.value)||void 0===r?void 0:r.length)&&void 0!==t?t:0,"/").concat(p.slots.maxLength,")"):p.props.label})),n(p,"handleChange",(function(e){p.setState((function(t){return r(r({},t),{},{value:e.target.value})}))})),n(p,"handlePaste",l(s().mark((function e(){var t;return s().wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.prev=0,e.next=3,navigator.clipboard.readText();case 3:t=e.sent,p.setState({value:t}),e.next=10;break;case 7:e.prev=7,e.t0=e.catch(0),console.error("Error clipboard:",e.t0);case 10:case"end":return e.stop()}}),e,null,[[0,7]])})))),p._cachedSlots=null!==(t=p.mergeSlots(e.slots))&&void 0!==t?t:{},p.state={value:p.defaulValue},p}return e(x,c),t(x,[{key:"slots",get:function(){return this._cachedSlots}},{key:"defaulValue",get:function(){var e,t,r=this.props,o=r.data,a=r.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:o&&a?null===(t=o[a])||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 o,a,n,i,l=null!==(o=null===(a=this.props.data)||void 0===a||null===(a=a[r])||void 0===a?void 0:a.toString())&&void 0!==o?o:"",s=null!==(n=null===(i=e.data)||void 0===i||null===(i=i[r])||void 0===i?void 0:i.toString())&&void 0!==n?n:"";if(l!==s)return this.setState({value:s}),!1}return e.slots,!0}},{key:"render",value:function(){var e;return p(h,{sx:{display:"flex",alignItems:"center"},children:[!!this.props.disabled&&u("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaulValue}),this.renderImageSide("left"),u(v,r({},this.mapTextFieldProps())),this.renderImageSide("right")]})}}])}()},L=function(){return u("div",{children:u(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{C 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 './helper'\r\nimport { ImageWithFallback, IImageWithFallbackPropsOwner } from '../components'\r\n\r\nexport interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {\r\n srcValue?: (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> {\r\n slots?: IInputSlots<T>\r\n}\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 { srcValue, 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 = srcValue ? srcValue(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((st) => ({ ...st, 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","srcValue","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","st","target","_asyncToGenerator","_regeneratorRuntime","mark","_callee","clipboardText","wrap","_context","prev","next","navigator","clipboard","readText","sent","t0","console","stop","_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 './helper'\r\nimport { ImageWithFallback, IImageWithFallbackPropsOwner } from '../components'\r\n\r\nexport interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {\r\n srcValue?: (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> {\r\n slots?: IInputSlots<T>\r\n}\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 { srcValue, 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 = srcValue ? srcValue(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((st) => ({ ...st, 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","srcValue","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","st","target","_asyncToGenerator","_regeneratorRuntime","mark","_callee","clipboardText","wrap","_context","prev","next","navigator","clipboard","readText","sent","t0","console","stop","_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/query-param.js";import"../utils/dayjs-config.js";import{getErrorMessage as c}from"./helper.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{inherits as e,createClass as r,objectSpread2 as o,classCallCheck as t,callSuper as l,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 c}from"@mui/material";import{mergeObjects as g}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"react-router-dom";import"../utils/query-param.js";import{getErrorMessage as h}from"./helper.js";function b(b){return function(){function S(e){var r,o;return t(this,S),o=l(this,S,[e]),i(o,"mapProps",(function(){var e,r,t,l,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===(t=o.props.name)||void 0===t?void 0:t.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!==(l=null===(i=o.props.slots)||void 0===i?void 0:i.selectProps)&&void 0!==l?l:null==b?void 0:b.selectProps;return g({},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,t,l,i=o.props,n=i.data,a=i.name,s=o.getOptions();return null!==(e=null!==(r=null===(t=o.props.defaultValue)||void 0===t?void 0:t.toString())&&void 0!==r?r:n&&a?n[a]:void 0)&&void 0!==e?e:null===(l=s[0])||void 0===l?void 0:l.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,t=this.getOptions(),l=this.getLabel(),i=h(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())+l,children:l}),a(v,o(o({},this.mapProps()),{},{children:t.map((function(e){return a(m,{value:e.value,children:e.name},e.value)}))})),a(f,{in:i.error,children:a(c,{children:i.message})})]})]})}}])}()}export{b as default};
2
2
  //# sourceMappingURL=create.select-simple.js.map