dinocollab-core 2.2.17 → 2.2.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/api-context/alert-global.js +1 -1
- package/dist/src/api-context/alert-global.js.map +1 -1
- package/dist/src/filter-bar/components/filter-input.js +1 -1
- package/dist/src/filter-bar/components/filter-input.js.map +1 -1
- package/dist/src/filter-bar/components/popper-custom.js +1 -1
- package/dist/src/filter-bar/components/popper-custom.js.map +1 -1
- package/dist/src/filter-bar/menu/create-form-field-select-multiple.js +1 -1
- package/dist/src/filter-bar/menu/create-form-field-select-multiple.js.map +1 -1
- package/dist/src/filter-bar/menu/create-form-field-select.js +1 -1
- package/dist/src/filter-bar/menu/create-form-field-select.js.map +1 -1
- package/dist/src/filter-bar/menu/create-form-field-string.js +1 -1
- package/dist/src/filter-bar/menu/create-form-field-string.js.map +1 -1
- package/dist/src/filter-bar/menu/create.js +1 -1
- package/dist/src/filter-bar/menu/create.js.map +1 -1
- package/dist/src/form/create.form-base.js +1 -1
- package/dist/src/form/create.form-base.js.map +1 -1
- package/dist/src/form/create.form-comfirm.js +1 -1
- package/dist/src/form/create.form-comfirm.js.map +1 -1
- package/dist/src/form/create.form-grid-layout.js +1 -1
- package/dist/src/form/create.form-grid-layout.js.map +1 -1
- package/dist/src/form/create.select-with-api.js +1 -1
- package/dist/src/form/create.select-with-api.js.map +1 -1
- package/dist/src/form/modal-wrapper.js +1 -1
- package/dist/src/form/modal-wrapper.js.map +1 -1
- package/dist/src/table/create.table.js +1 -1
- package/dist/src/table/create.table.js.map +1 -1
- package/dist/src/table/ui.buttons.js +1 -1
- package/dist/src/table/ui.buttons.js.map +1 -1
- package/dist/src/table-grid/create.table-grid.js +1 -1
- package/dist/src/table-grid/create.table-grid.js.map +1 -1
- package/dist/src/table-grid/item-actions.js +1 -1
- package/dist/src/table-grid/item-actions.js.map +1 -1
- package/dist/src/table-grid/toolbar-pannel.js +1 -1
- package/dist/src/table-grid/toolbar-pannel.js.map +1 -1
- package/dist/types/filter-bar/components/popper-custom.d.ts +4 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create-form-field-string.js","sources":["../../../../src/filter-bar/menu/create-form-field-string.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useMemo, useState } from 'react'\r\nimport { Box, Button, styled, TextField } from '@mui/material'\r\nimport { createChipViewers } from '../components/chip-viewer'\r\nimport { convertFormDataToJson, getErrorMessage } from '../../form/helpers'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { TChipViewerGroup } from '../components/chip-viewer'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './types'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\n/** Props for the `FormFieldString` component returned by `createFormFieldString`. Extends the base filter-menu form props. */\r\nexport interface IFormFieldStringProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\n/** Parameters passed to `createFormFieldString` to configure the generated component. */\r\nexport interface IFormFieldStringParam<T> {\r\n /** Optional configuration for the form field */\r\n config?: IFieldMenuConfig<T>\r\n}\r\n\r\n/**\r\n * Factory function that creates a `FormFieldString` filter-menu component.\r\n *\r\n * The generated component renders a free-text input inside a popper/menu panel,\r\n * letting the user type arbitrary string values as filter criteria. It supports:\r\n * - OR / AND logic toggle when more than one value is applied\r\n * - Chip viewers showing the currently applied values\r\n * - Auto-focus and input reset after each successful submission\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n *\r\n * @param params - Static configuration (optional field config override)\r\n * @returns A React FC ready to be used as a free-text filter-menu field component\r\n */\r\nfunction createFormFieldString<T>(params?: IFormFieldStringParam<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FormFieldString: FC<IFormFieldStringProps<T>> = (props) => {\r\n /** Merge `props.currentConfig` with `params.config` (if provided).\r\n * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n */\r\n const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n const refInput = createRef<HTMLInputElement>()\r\n const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'or' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault() // Prevent default form submission behavior\r\n event.stopPropagation() // Stop the event from bubbling up to parent elements (like Popper) which might cause it to close prematurely\r\n const formData = new FormData(event.currentTarget)\r\n const obj = convertFormDataToJson<TFieldModelValid<T>>(formData)\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData || {})\r\n\r\n if (!errorData || Object.keys(errorData).length === 0) {\r\n const { field } = mergedConfig\r\n const newValues = (Array.isArray(obj[field]) ? obj[field] : [obj[field]]) as TFieldValid[]\r\n const newValue: TFieldValue = { values: newValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n\r\n if (refInput.current) {\r\n refInput.current.blur()\r\n refInput.current.value = ''\r\n }\r\n }\r\n }\r\n\r\n const error = getErrorMessage(errorData, mergedConfig.field)\r\n\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return { field: mergedConfig.field, items: items.map((v) => ({ value: v })) }\r\n }, [mergedConfig.field, value])\r\n\r\n const handleChangeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(mergedConfig.field)\r\n if (params?.config?.closeAfterClear !== false) props.onClose()\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values || value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n }\r\n\r\n const rootClasses: string[] = []\r\n if (props.isLoading) rootClasses.push('disabled')\r\n\r\n return (\r\n <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <TextField\r\n inputRef={refInput}\r\n autoFocus\r\n name={mergedConfig.field.toString()}\r\n size='small'\r\n fullWidth\r\n placeholder='Enter value'\r\n error={error.error}\r\n helperText={error.message}\r\n sx={{ '.MuiInputBase-root': { minHeight: '42px' } }}\r\n />\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='error' variant='text' disabled={!value.values || value.values.length === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </RootStyled>\r\n )\r\n }\r\n\r\n return FormFieldString\r\n}\r\n\r\nexport default createFormFieldString\r\n\r\nconst RootStyled = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n }\r\n})\r\n"],"names":["createFormFieldString","params","ChipViewers","createChipViewers","props","_mergedConfig$default","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","refInput","createRef","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","_useState3","_useState4","errorData","setErrorData","handleSubmit","newValue","onSubmit","error","getErrorMessage","filterViewerValue","items","Array","isArray","map","v","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","stopPropagation","formData","FormData","currentTarget","obj","convertFormDataToJson","validator","run","keys","length","newValues","current","blur","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","newLogic","handleChangeLogic","PopperBody","mb","borderBottom","placement","enableMinimalesticView","onRemove","TextField","inputRef","autoFocus","name","fullWidth","placeholder","helperText","message","minHeight","PopperFooter","Button","color","variant","disabled","_props$onRemoveField","_params$config","onRemoveField","call","closeAfterClear","Box","flex","type","styled","position","content","display","inset","backgroundColor","filter","zIndex","opacity","transition","visibility","pointerEvents"],"mappings":"0lBAuCA,SAASA,EAAyBC,GAChC,IAAMC,EAAcC,IAsHpB,OApHsD,SAACC,GAAS,IAAAC,EAAAC,EAKxDC,EAAeC,EAAQ,WAAA,OAAMC,OAAOC,OAAO,GAAIN,EAAMO,cAAeV,eAAAA,EAAQW,OAAO,EAAE,CAACX,aAAAA,EAAAA,EAAQW,OAAQR,EAAMO,gBAE5GE,EAAWC,IACjBC,EAA8EX,EAAtEY,MAAAA,OAAQ,IAAHD,EAAG,CAAEE,OAAQ,GAAIC,MAAiC,QAA5Bb,EAAEE,aAAY,EAAZA,EAAcY,oBAAY,IAAAd,EAAAA,EAAI,MAAMU,EACzEK,EAAsCC,EAAiBL,EAAME,OAAOI,EAAAC,EAAAH,EAAA,GAA7DI,EAAWF,EAAA,GAAEG,EAAcH,EAAA,GAE5BI,UAAKpB,EAAGC,aAAAA,EAAAA,EAAcmB,aAAK,IAAApB,EAAAA,EAAIC,EAAaoB,MAAMC,WAExDC,EAAkCR,EAA6C,IAAGS,EAAAP,EAAAM,EAAA,GAA3EE,EAASD,EAAA,GAAEE,EAAYF,EAAA,GAExBG,EAAe,SAACC,GACpB9B,EAAM+B,SAAS5B,EAAaoB,MAAOO,EAAU3B,EAC9C,EAwBK6B,EAAQC,EAAgBN,EAAWxB,EAAaoB,OAEhDW,EAAoB9B,EAA6B,WACrD,IAAM+B,EAAQC,MAAMC,QAAQzB,EAAMC,QAAUD,EAAMC,OAAS,CAACD,EAAMC,QAClE,MAAO,CAAEU,MAAOpB,EAAaoB,MAAOY,MAAOA,EAAMG,IAAI,SAACC,GAAC,MAAM,CAAE3B,MAAO2B,EAAI,GAC3E,EAAE,CAACpC,EAAaoB,MAAOX,IAmBlB4B,EAAwB,GAG9B,OAFIxC,EAAMyC,WAAWD,EAAYE,KAAK,YAGpCC,EAACC,EAAU,CAACC,UAAWL,EAAYM,KAAK,KAAMC,cAAWhB,SAlDlC,SAACiB,GAA2C,IAAAC,EACnED,EAAME,iBACNF,EAAMG,kBACN,IAAMC,EAAW,IAAIC,SAASL,EAAMM,eAC9BC,EAAMC,EAA2CJ,GACnDzB,EAA2BsB,QAAlBA,EAAGjD,EAAMyD,qBAASR,SAAfA,EAAiBS,IAAIH,GAIrC,GAFA3B,EAAaD,GAAa,KAErBA,GAA+C,IAAlCtB,OAAOsD,KAAKhC,GAAWiC,OAAc,CACrD,IAAQrC,EAAUpB,EAAVoB,MACFsC,EAAazB,MAAMC,QAAQkB,EAAIhC,IAAUgC,EAAIhC,GAAS,CAACgC,EAAIhC,IAEjEM,EAD8B,CAAEhB,OAAQgD,EAAW/C,MAAOM,IAGtDX,EAASqD,UACXrD,EAASqD,QAAQC,OACjBtD,EAASqD,QAAQlD,MAAQ,GAE5B,CACF,EA8BoFoD,SACjFC,EAACC,EAAa,CACZC,MAAKC,aAAAA,OAAe9C,GACpB+C,QAASrE,EAAMqE,QACfC,MAAO,CACLC,YAAa5B,EAAC6B,EAAU,CAACC,KAAK,QAAQC,QAAS1E,EAAM2E,SACrDC,WAfFzE,EAAa0E,YAAoBlC,EAACmC,EAAQ,CAACC,GAAI,CAAEC,GAAI,KAAOP,KAAK,QAAQnD,MAAM,qBAC9EV,EAAMC,QAAUD,EAAMC,OAAO+C,OAAS,EAAU,KAC9CjB,EAACsC,EAAkB,CAAAF,GAAI,CAAEC,GAAI,GAAKpE,MAAOQ,EAAa8D,SAAU,SAACC,EAAGC,GAAI,OAdvD,SAACC,GACzBhE,EAAegE,GACf,IAAMvD,EAAwB,CAAEjB,OAAQD,EAAMC,OAAQC,MAAOuE,GAC7DxD,EAAaC,EACd,CAUqFwD,CAAkBF,EAAK,KAgBvGpB,SAAA,CAAAC,EAACsB,EACC,CAAAvB,SAAA,CAAArB,EAAC7C,EACC,CAAAiF,GAAI,CAAES,GAAI,EAAGC,aAAc,kBAC3BnE,MAAM,UACNoE,UAAU,aACVC,wBAAsB,EACtB/E,MAAOsB,EACP0D,SAAU5F,EAAM4F,WAElBjD,EAACkD,EACC,CAAAC,SAAUrF,EACVsF,WACA,EAAAC,KAAM7F,EAAaoB,MAAMC,WACzBiD,KAAK,QACLwB,WACA,EAAAC,YAAY,cACZlE,MAAOA,EAAMA,MACbmE,WAAYnE,EAAMoE,QAClBrB,GAAI,CAAE,qBAAsB,CAAEsB,UAAW,cAG7CpC,EAACqC,EACC,CAAAtC,SAAA,CAAArB,EAAC4D,EAAO,CAAA9B,KAAK,QAAQ+B,MAAM,QAAQC,QAAQ,OAAOC,UAAW9F,EAAMC,QAAkC,IAAxBD,EAAMC,OAAO+C,OAAcc,QA9CzF,WAAK,IAAAiC,EAAAC,UAC1BD,EAAA3G,EAAM6G,qBAAa,IAAAF,GAAnBA,EAAAG,KAAA9G,EAAsBG,EAAaoB,QACK,KAApC1B,SAAc,QAAR+G,EAAN/G,EAAQW,cAARoG,IAAcA,OAAdA,EAAAA,EAAgBG,kBAA2B/G,EAAMqE,SACtD,EA2CsIL,SAAA,cAG/HrB,EAACqE,GAAIjC,GAAI,CAAEkC,KAAM,KACjBtE,EAAC4D,GAAO9B,KAAK,QAAQ+B,MAAM,UAAUC,QAAQ,OAAO/B,QAAS1E,EAAMqE,4BAGnE1B,EAAC4D,EAAO,CAAA9B,KAAK,QAAQyC,KAAK,SAASV,MAAM,UAAUC,QAAQ,YAAWzC,SAAA,iBAO/E,CAGH,CAIA,IAAMpB,EAAauE,EAAO,OAAPA,CAAe,CAChCC,SAAU,WACV,WAAY,CACVC,QAAS,KACTC,QAAS,QACTF,SAAU,WACVG,MAAO,EACPC,gBAAiB,qBACjBC,OAAQ,YACRC,QAAU,EACVC,QAAS,EACTC,WAAY,eACZC,WAAY,UAEd,aAAc,CACZC,cAAe,OACf,WAAY,CACVJ,OAAQ,EACRC,QAAS,EACTE,WAAY"}
|
|
1
|
+
{"version":3,"file":"create-form-field-string.js","sources":["../../../../src/filter-bar/menu/create-form-field-string.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useMemo, useState } from 'react'\r\nimport { Box, Button, styled, TextField } from '@mui/material'\r\nimport { createChipViewers } from '../components/chip-viewer'\r\nimport { convertFormDataToJson, getErrorMessage } from '../../form/helpers'\r\nimport { ButtonBack, ChipDark, FilterLogicToggle } from '../components/ui.units'\r\nimport { PopperBody, PopperContent, PopperFooter } from '../components/popper-custom'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IPartialError } from '../../form/validator'\r\nimport type { TChipViewerGroup } from '../components/chip-viewer'\r\nimport type { IFieldMenuConfig, IFilterMenuFormProps } from './types'\r\nimport type { TFieldModelValid, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\n/** Props for the `FormFieldString` component returned by `createFormFieldString`. Extends the base filter-menu form props. */\r\nexport interface IFormFieldStringProps<T> extends IFilterMenuFormProps<T> {}\r\n\r\n/** Parameters passed to `createFormFieldString` to configure the generated component. */\r\nexport interface IFormFieldStringParam<T> {\r\n /** Optional configuration for the form field */\r\n config?: IFieldMenuConfig<T>\r\n}\r\n\r\n/**\r\n * Factory function that creates a `FormFieldString` filter-menu component.\r\n *\r\n * The generated component renders a free-text input inside a popper/menu panel,\r\n * letting the user type arbitrary string values as filter criteria. It supports:\r\n * - OR / AND logic toggle when more than one value is applied\r\n * - Chip viewers showing the currently applied values\r\n * - Auto-focus and input reset after each successful submission\r\n * - Built-in validation via an optional `validator` prop\r\n * - A loading overlay that disables interaction while `isLoading` is true\r\n *\r\n * @param params - Static configuration (optional field config override)\r\n * @returns A React FC ready to be used as a free-text filter-menu field component\r\n */\r\nfunction createFormFieldString<T>(params?: IFormFieldStringParam<T>) {\r\n const ChipViewers = createChipViewers<T>()\r\n\r\n const FormFieldString: FC<IFormFieldStringProps<T>> = (props) => {\r\n /** Merge `props.currentConfig` with `params.config` (if provided).\r\n * Fields from `params.config` override the corresponding keys in `props.currentConfig`.\r\n * Any keys not present in `params.config` are preserved from `props.currentConfig`.\r\n */\r\n const mergedConfig = useMemo(() => Object.assign({}, props.currentConfig, params?.config), [params?.config, props.currentConfig])\r\n\r\n const refInput = createRef<HTMLInputElement>()\r\n const { value = { values: [], logic: mergedConfig?.defaultLogic ?? 'and' } } = props\r\n const [filterLogic, setFilterLogic] = useState<TLogic>(value.logic!)\r\n\r\n const label = mergedConfig?.label ?? mergedConfig.field.toString()\r\n\r\n const [errorData, setErrorData] = useState<IPartialError<TFieldModelValid<T>>>({})\r\n\r\n const handleSubmit = (newValue: TFieldValue) => {\r\n props.onSubmit(mergedConfig.field, newValue, mergedConfig)\r\n }\r\n\r\n const handleSubmitForm = (event: React.FormEvent<HTMLFormElement>) => {\r\n event.preventDefault() // Prevent default form submission behavior\r\n event.stopPropagation() // Stop the event from bubbling up to parent elements (like Popper) which might cause it to close prematurely\r\n const formData = new FormData(event.currentTarget)\r\n const obj = convertFormDataToJson<TFieldModelValid<T>>(formData)\r\n let errorData = props.validator?.run(obj) as IPartialError<TFieldModelValid<T>>\r\n\r\n setErrorData(errorData || {})\r\n\r\n if (!errorData || Object.keys(errorData).length === 0) {\r\n const { field } = mergedConfig\r\n const newValues = (Array.isArray(obj[field]) ? obj[field] : [obj[field]]) as TFieldValid[]\r\n const newValue: TFieldValue = { values: newValues, logic: filterLogic }\r\n handleSubmit(newValue)\r\n\r\n if (refInput.current) {\r\n refInput.current.blur()\r\n refInput.current.value = ''\r\n }\r\n }\r\n }\r\n\r\n const error = getErrorMessage(errorData, mergedConfig.field)\r\n\r\n const filterViewerValue = useMemo<TChipViewerGroup<T>>(() => {\r\n const items = Array.isArray(value.values) ? value.values : [value.values]\r\n return { field: mergedConfig.field, items: items.map((v) => ({ value: v })) }\r\n }, [mergedConfig.field, value])\r\n\r\n const handleChangeLogic = (newLogic: TLogic) => {\r\n setFilterLogic(newLogic)\r\n const newValue: TFieldValue = { values: value.values, logic: newLogic }\r\n handleSubmit(newValue)\r\n }\r\n\r\n const handleClearAll = () => {\r\n props.onRemoveField?.(mergedConfig.field)\r\n if (params?.config?.closeAfterClear !== false) props.onClose()\r\n }\r\n\r\n const renderAfterTitle = () => {\r\n if (mergedConfig.singleValue) return <ChipDark sx={{ ml: 1.5 }} size='small' label='Last value only' />\r\n if (!value.values || value.values.length < 2) return null\r\n return <FilterLogicToggle sx={{ ml: 1 }} value={filterLogic} onChange={(_, nVal) => handleChangeLogic(nVal)} />\r\n }\r\n\r\n const rootClasses: string[] = []\r\n if (props.isLoading) rootClasses.push('disabled')\r\n\r\n return (\r\n <RootStyled className={rootClasses.join(' ')} noValidate onSubmit={handleSubmitForm}>\r\n <PopperContent\r\n title={`Filter by ${label}`}\r\n onClose={props.onClose}\r\n slots={{\r\n beforeTitle: <ButtonBack size='small' onClick={props.onBack} />,\r\n afterTitle: renderAfterTitle()\r\n }}\r\n >\r\n <PopperBody>\r\n <ChipViewers\r\n sx={{ mb: 1, borderBottom: 'none!important' }}\r\n label='Applied'\r\n placement='horizontal'\r\n enableMinimalesticView\r\n value={filterViewerValue}\r\n onRemove={props.onRemove}\r\n />\r\n <TextField\r\n inputRef={refInput}\r\n autoFocus\r\n name={mergedConfig.field.toString()}\r\n size='small'\r\n fullWidth\r\n placeholder='Enter value'\r\n error={error.error}\r\n helperText={error.message}\r\n sx={{ '.MuiInputBase-root': { minHeight: '42px' } }}\r\n />\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button size='small' color='error' variant='text' disabled={!value.values || value.values.length === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n <Box sx={{ flex: 1 }} />\r\n <Button size='small' color='inherit' variant='text' onClick={props.onClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' type='submit' color='primary' variant='contained'>\r\n Apply\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n </RootStyled>\r\n )\r\n }\r\n\r\n return FormFieldString\r\n}\r\n\r\nexport default createFormFieldString\r\n\r\nconst RootStyled = styled('form')({\r\n position: 'relative',\r\n '&::after': {\r\n content: '\"\"',\r\n display: 'block',\r\n position: 'absolute',\r\n inset: 0, // top: 0, left: 0, right: 0, bottom: 0\r\n backgroundColor: 'rgba(0, 0, 0, 0.2)',\r\n filter: 'blur(2px)',\r\n zIndex: -1,\r\n opacity: 0,\r\n transition: 'opacity 0.3s',\r\n visibility: 'hidden'\r\n },\r\n '&.disabled': {\r\n pointerEvents: 'none',\r\n '&::after': {\r\n zIndex: 1,\r\n opacity: 1,\r\n visibility: 'visible'\r\n }\r\n }\r\n})\r\n"],"names":["createFormFieldString","params","ChipViewers","createChipViewers","props","_mergedConfig$default","_mergedConfig$label","mergedConfig","useMemo","Object","assign","currentConfig","config","refInput","createRef","_props$value","value","values","logic","defaultLogic","_useState","useState","_useState2","_slicedToArray","filterLogic","setFilterLogic","label","field","toString","_useState3","_useState4","errorData","setErrorData","handleSubmit","newValue","onSubmit","error","getErrorMessage","filterViewerValue","items","Array","isArray","map","v","rootClasses","isLoading","push","_jsx","RootStyled","className","join","noValidate","event","_props$validator","preventDefault","stopPropagation","formData","FormData","currentTarget","obj","convertFormDataToJson","validator","run","keys","length","newValues","current","blur","children","_jsxs","PopperContent","title","concat","onClose","slots","beforeTitle","ButtonBack","size","onClick","onBack","afterTitle","singleValue","ChipDark","sx","ml","FilterLogicToggle","onChange","_","nVal","newLogic","handleChangeLogic","PopperBody","mb","borderBottom","placement","enableMinimalesticView","onRemove","TextField","inputRef","autoFocus","name","fullWidth","placeholder","helperText","message","minHeight","PopperFooter","Button","color","variant","disabled","_props$onRemoveField","_params$config","onRemoveField","call","closeAfterClear","Box","flex","type","styled","position","content","display","inset","backgroundColor","filter","zIndex","opacity","transition","visibility","pointerEvents"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as e,objectWithoutProperties as n,objectSpread2 as r,slicedToArray as o,asyncToGenerator as t,regenerator as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{useState as u,useContext as c,useMemo as s,createRef as d}from"react";import{styled as m,Box as f,MenuList as p,Tooltip as v,IconButton as b,Badge as h,MenuItem as g,Typography as y,Button as j}from"@mui/material";import F from"@mui/icons-material/FilterList";import C from"@mui/material/ClickAwayListener";import{KeySpecial as k}from"../types.js";import{useFilterActions as I}from"../hooks.js";import{FilterBarContext as S}from"../index.context.js";import{FilterMenuNoField as x}from"../components/ui.units.js";import{mapSpecialLabel as w,mapSpecialTexts as P}from"../helpers.js";import{SingleRuleValidate as A,FormValidator as R}from"../../form/validator.js";import{PopperCustom as q,PopperContent as T,PopperFooter as
|
|
1
|
+
import{defineProperty as e,objectWithoutProperties as n,objectSpread2 as r,slicedToArray as o,asyncToGenerator as t,regenerator as i}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{useState as u,useContext as c,useMemo as s,createRef as d}from"react";import{styled as m,Box as f,MenuList as p,Tooltip as v,IconButton as b,Badge as h,MenuItem as g,Typography as y,Button as j}from"@mui/material";import F from"@mui/icons-material/FilterList";import C from"@mui/material/ClickAwayListener";import{KeySpecial as k}from"../types.js";import{useFilterActions as I}from"../hooks.js";import{FilterBarContext as S}from"../index.context.js";import{FilterMenuNoField as x}from"../components/ui.units.js";import{mapSpecialLabel as w,mapSpecialTexts as P}from"../helpers.js";import{SingleRuleValidate as A,FormValidator as R}from"../../form/validator.js";import{PopperCustom as q,PopperContent as T,PopperBody as B,PopperFooter as O}from"../components/popper-custom.js";import M from"./create-form-field-string.js";var D=["fields","validation","enableQuickSearch"];function L(m){var f=N,p=function(e){var o=e.fields,t=e.validation,i=e.enableQuickSearch,l=void 0===i||i,a=n(e,D),u=k.quickSearch,c=r({},o);if(l){var s=c[u],d=null!=s&&s.label?s.label:w[u],m=Object.assign({},c[u],{field:u,label:d,singleValue:!0});c[u]=m}else delete c[u];var f=Object.keys(c),p=f.reduce(function(e,n){var o=c[n];return o?(e[n]=r(r({},o),{},{field:n}),e):e},{}),v=r({},t);return f.forEach(function(e){var n,r,o,t=v[e],i=null!==(n=null!==(r=null==t?void 0:t.label)&&void 0!==r?r:null===(o=c[e])||void 0===o?void 0:o.label)&&void 0!==n?n:e.toString();t?t.Rules.some(function(e){return e.rule===A.Required})||(t.label=i,t.Rules.push({rule:A.Required})):v[e]={Rules:[{rule:A.Required}],label:i}}),r(r({},a),{},{fields:p,validation:v,enableQuickSearch:l})}(m),L=function(n){return Object.keys(n.fields).reduce(function(r,o){var t,i=o,l=null===(t=n.validation)||void 0===t?void 0:t[i];return l&&(r[i]=new R(e({},i,l))),r},{})}(p),z=function(e){var n=e.fields;return Object.keys(n).reduce(function(e,r){var o,t=r,i=n[t];return i&&(e[t]=null!==(o=i.FormComponent)&&void 0!==o?o:M()),e},{})}(p),E=m.quickSearchHint;return function(e){var n=d(),w=u(null),A=o(w,2),R=A[0],M=A[1],D=Boolean(R),N=c(S),G=I(N),H=u(null),_=o(H,2),W=_[0],J=_[1],K=s(function(){var n=m.popperProps,r=m.rootProps;return Object.assign({},{popperProps:n,rootProps:r},e.slots)},[m,e.slots]),U=function(){M(null),setTimeout(function(){J(null)},300)},X=function(){G.clearAllFilters(),U()},Y=function(){var e=t(i().m(function e(n,r,o){return i().w(function(e){for(;;)switch(e.n){case 0:if(r){e.n=1;break}return e.a(2);case 1:null!=o&&o.singleValue||null!=o&&o.replaceValue?G.replaceFilter(n,r,{logic:r.logic}):G.upsertManyFilter(n,r,{logic:r.logic}),!1!==(null==m?void 0:m.closeAfterSubmit)&&!1!==(null==o?void 0:o.closeAfterSubmit)&&U();case 2:return e.a(2)}},e)}));return function(n,r,o){return e.apply(this,arguments)}}(),Z=s(function(){var e=Object.values(p.fields);return Array.from(e)},[p.fields]),$=G.getTotalCount(),ee="".concat($," Filter").concat(1!==$?"s":"");return l(C,{onClickAway:U,children:a(V,r(r({className:f.root},K.rootProps),{},{children:[l(v,{title:ee,arrow:!0,placement:"top",children:l(b,{size:"small",ref:n,onClick:function(){J(null),M(n.current)},children:l(h,{badgeContent:$,color:"primary",invisible:0===$,children:l(F,{fontSize:"small"})})})}),l(q,r(r({open:D,anchorEl:R,placement:"bottom",transition:!0,disablePortal:!0},K.popperProps),{},{children:function(){if(0===Z.length)return l(x,{onClose:U});var e=W?p.fields[W]:void 0;if(W&&e){var n,o=z[W];if(!o)return null;var t=r({},e);null!=t&&t.FormComponent&&delete t.FormComponent;var i=null===(n=N.filterState.storeFilter)||void 0===n?void 0:n[W];return l(o,{currentConfig:t,value:i,isLoading:N.isLoading,onRemove:G.removeFilterByFieldValue,validator:L[W],onSubmit:Y,onClose:U,onRemoveField:function(e){return G.removeFilter(e)},onBack:function(){return J(null)}})}return a(T,{title:"Filter by",onClose:U,children:[l(B,{disableGutter:!0,children:l(Q,{className:f.menu,children:Z.map(function(e){var n,r,o=e.field.toString();if(!o)return null;var t=G.getFieldInfo(e.field),i=null!==(n=null==t?void 0:t.values.join(", "))&&void 0!==n?n:"",u=t?t.values.length:0,c=u>0?" (".concat(u,")"):"",s=null!==(r=e.label)&&void 0!==r?r:o.toString(),d=u>0?"Filter by ".concat(s,": ").concat(i):void 0;if(e.field===k.quickSearch){var m=P.qsTooltip;d="function"==typeof E?E(m):null!=E?E:m}else if(e.tooltip){var p,b="function"==typeof e.tooltip?e.tooltip(null==t?void 0:t.values):e.tooltip;d=(null!==(p=null==t?void 0:t.values.length)&&void 0!==p?p:0)>0?b:void 0}return l(g,{className:f.menuItem,sx:{justifyContent:"space-between"},onClick:function(){return n=e.field,void J(n);var n},children:l(v,{title:d,placement:"right",arrow:!0,children:a("div",{className:f.menuItemInner,children:[l(y,{variant:"body2",children:s}),l(y,{variant:"caption",sx:{ml:1,color:"text.secondary"},children:c})]})})},o)})})}),l(O,{children:l(j,{color:"error",disabled:0===$,onClick:X,children:"Clear All"})})]})}()}))]}))})}}var N={root:"DinoFilterMenu-root",menu:"DinoFilterMenu-menu",menuItem:"DinoFilterMenu-menuItem",menuItemInner:"DinoFilterMenu-menuItemInner"},V=m(f)(e({},"&.".concat(N.root),{display:"inline-flex",justifyContent:"center",alignItems:"center",flex:"0 0 auto"})),Q=m(p)(e(e({},".".concat(N.menuItem),{paddingTop:0,paddingBottom:0}),".".concat(N.menuItemInner),{display:"flex",justifyContent:"space-between",alignItems:"center",width:"100%",gap:"4px",paddingTop:"6px",paddingBottom:"6px"}));export{L as createFilterMenu,N as filterMenuClasses};
|
|
2
2
|
//# sourceMappingURL=create.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create.js","sources":["../../../../src/filter-bar/menu/create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from '../hooks'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FilterMenuNoField } from '../components/ui.units'\r\nimport { mapSpecialLabel, mapSpecialTexts } from '../helpers'\r\nimport { FormValidator, SingleRuleValidate } from '../../form/validator'\r\nimport { PopperContent, PopperCustom, PopperFooter } from '../components/popper-custom'\r\nimport createFormFieldString from './create-form-field-string'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldModelValid, TFieldType, TFieldValue } from '../types'\r\nimport type { IConfigValue, IFormValidatorConfig } from '../../form/validator'\r\nimport type { IFilterMenuConfigInternal, TFieldMenuConfigsInternal } from './types'\r\nimport type { IFilterMenuProps, IFilterMenuSlots, TFieldMenuConfigs } from './types'\r\nimport type { IFieldMenuConfig, IFilterMenuConfig, IFilterMenuFormProps } from './types'\r\n\r\n// #region utils\r\n/**\r\n * Builds a map of `FormValidator` instances keyed by field name.\r\n * Each validator is constructed from the validation rules defined in `config.validation`.\r\n * Fields with no validation config are skipped.\r\n *\r\n * @internal\r\n */\r\nfunction generateValidatorMap<T>(config: IFilterMenuConfig<T>) {\r\n const keys = Object.keys(config.fields) as TFieldType<T>[]\r\n const validateMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = config.validation?.[fieldKey]\r\n if (fieldConfig) {\r\n acc[fieldKey] = new FormValidator({ [fieldKey]: fieldConfig } as IFormValidatorConfig<Partial<TFieldModelValid<T>>>)\r\n }\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, FormValidator<Partial<TFieldModelValid<T>>>>\r\n )\r\n return validateMaps\r\n}\r\n\r\n/**\r\n * Builds a map of form input components keyed by field name.\r\n * If a field defines a custom `FormComponent`, that is used; otherwise falls back to\r\n * the default `createFormFieldString()` free-text component.\r\n *\r\n * @internal\r\n */\r\nfunction generateFormInputMap<T>(config: IFilterMenuConfig<T>) {\r\n const { fields } = config\r\n const keys = Object.keys(fields) as TFieldType<T>[]\r\n const formInputMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = fields[fieldKey] as IFieldMenuConfig<T>\r\n if (fieldConfig) {\r\n acc[fieldKey] = fieldConfig.FormComponent ?? createFormFieldString()\r\n }\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, React.ComponentType<IFilterMenuFormProps<T>>>\r\n )\r\n return formInputMaps\r\n}\r\n\r\n/**\r\n * Normalises a raw `IFilterMenuConfig` into the internal format used by the menu:\r\n * - Injects the quick-search pseudo-field when `enableQuickSearch` is `true` (default)\r\n * - Stamps each field entry with its own `field` key\r\n * - Ensures every field has at least a `Required` validation rule\r\n *\r\n * @internal\r\n */\r\nfunction generateConfigs<T>(config: IFilterMenuConfig<T>): IFilterMenuConfigInternal<T> {\r\n const { fields, validation, enableQuickSearch = true, ...rest } = config\r\n const qsKey = KeySpecial.quickSearch\r\n\r\n // Merge quick search field if enabled\r\n const mergedFields: TFieldMenuConfigs<T> = { ...fields }\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label, singleValue: true })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n const keys = Object.keys(mergedFields) as TFieldType<T>[]\r\n const finalFields = keys.reduce<TFieldMenuConfigsInternal<T>>((acc, key) => {\r\n const fieldConfig = mergedFields[key]\r\n if (!fieldConfig) return acc\r\n acc[key] = { ...fieldConfig, field: key }\r\n return acc\r\n }, {} as TFieldMenuConfigsInternal<T>)\r\n\r\n // Merge validation config with default required rule\r\n const mergedValidation: IFormValidatorConfig<Partial<TFieldModelValid<T>>> = { ...validation }\r\n keys.forEach((key) => {\r\n const item: IConfigValue<Partial<TFieldModelValid<T>>> | undefined = mergedValidation[key]\r\n const label = item?.label ?? mergedFields[key]?.label ?? key.toString()\r\n if (!item) {\r\n mergedValidation[key] = { Rules: [{ rule: SingleRuleValidate.Required }], label }\r\n } else if (!item.Rules.some((r) => r.rule === SingleRuleValidate.Required)) {\r\n item.label = label\r\n item.Rules.push({ rule: SingleRuleValidate.Required })\r\n }\r\n })\r\n\r\n return { ...rest, fields: finalFields, validation: mergedValidation, enableQuickSearch }\r\n}\r\n// #endregion\r\n\r\n// #region main\r\n/**\r\n * Factory function that creates a `FilterMenu` component from a static field configuration.\r\n *\r\n * The generated component renders a badge icon button that opens a popper panel with:\r\n * - A **field list** view — lists all configured filter fields with applied-value counts\r\n * - A **field form** view — renders the appropriate input component for the selected field\r\n * - A **quick-search** field (opt-out via `enableQuickSearch: false`)\r\n * - OR / AND logic toggle support per field\r\n * - \"Clear All\" action to reset all active filters at once\r\n *\r\n * All state (open/close, selected field) is local; filter values are read/written through\r\n * `FilterBarContext` via `useFilterActions`.\r\n *\r\n * @param config - Static filter-menu configuration (fields, validation, slots, etc.)\r\n * @returns A React FC ready to be dropped anywhere inside a `FilterBarProvider`\r\n */\r\nexport function createFilterMenu<T>(config: IFilterMenuConfig<T>) {\r\n const classes = filterMenuClasses\r\n const mergedConfigs = generateConfigs(config)\r\n const validateMaps = generateValidatorMap(mergedConfigs)\r\n const formInputMaps = generateFormInputMap(mergedConfigs)\r\n const quickSearchHint = config.quickSearchHint\r\n\r\n // Component\r\n const FilterMenu: FC<IFilterMenuProps<T>> = (props) => {\r\n const refButton = createRef<HTMLButtonElement>()\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const [fieldSelected, setFieldSelected] = useState<TFieldType<T> | null>(null)\r\n\r\n const mergedSlots = useMemo<IFilterMenuSlots>(() => {\r\n const { popperProps, rootProps } = config\r\n return Object.assign({}, { popperProps, rootProps }, props.slots)\r\n }, [config, props.slots])\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n setTimeout(() => {\r\n setFieldSelected(null)\r\n }, 300)\r\n }\r\n\r\n const handleOpen = () => {\r\n setFieldSelected(null)\r\n setAnchorEl(refButton.current)\r\n }\r\n\r\n const handleMenuItemClick = (field: TFieldType<T>) => {\r\n setFieldSelected(field)\r\n }\r\n\r\n const handleClearAll = () => {\r\n filterActions.clearAllFilters()\r\n handleClose()\r\n }\r\n\r\n const handleSubmit = async (key: TFieldType<T>, value?: TFieldValue, fieldConfig?: IFieldMenuConfig<T>) => {\r\n if (!value) return\r\n if (fieldConfig?.singleValue || fieldConfig?.replaceValue) {\r\n filterActions.replaceFilter(key, value, { logic: value.logic })\r\n } else {\r\n filterActions.upsertManyFilter(key, value, { logic: value.logic })\r\n }\r\n if (config?.closeAfterSubmit !== false && fieldConfig?.closeAfterSubmit !== false) {\r\n handleClose()\r\n }\r\n }\r\n\r\n const data = useMemo(() => {\r\n const keys = Object.values(mergedConfigs.fields)\r\n return Array.from(keys) as IFieldMenuConfig<T>[]\r\n }, [mergedConfigs.fields])\r\n\r\n const renderContent = () => {\r\n if (data.length === 0) {\r\n return <FilterMenuNoField onClose={handleClose} />\r\n }\r\n const currentConfig = fieldSelected ? mergedConfigs.fields[fieldSelected] : undefined\r\n\r\n if (fieldSelected && currentConfig) {\r\n const FormComponent = formInputMaps[fieldSelected] as React.ComponentType<IFilterMenuFormProps<T>>\r\n if (!FormComponent) return null\r\n\r\n const config: IFieldMenuConfig<T> = { ...currentConfig }\r\n // Remove FormComponent from config before passing to form, as it's not needed there and can cause unnecessary re-renders\r\n if (config?.FormComponent) delete config.FormComponent\r\n\r\n const value = context.filterState.storeFilter?.[fieldSelected]\r\n return (\r\n <FormComponent\r\n currentConfig={config}\r\n value={value}\r\n isLoading={context.isLoading}\r\n onRemove={filterActions.removeFilterByFieldValue}\r\n validator={validateMaps[fieldSelected]}\r\n onSubmit={handleSubmit}\r\n onClose={handleClose}\r\n onRemoveField={(f) => filterActions.removeFilter(f)}\r\n onBack={() => setFieldSelected(null)}\r\n />\r\n )\r\n }\r\n\r\n return (\r\n <PopperContent title='Filter by' onClose={handleClose}>\r\n <MenuListCustom className={classes.menu}>\r\n {data.map((item) => {\r\n const key = item.field.toString()\r\n if (!key) return null\r\n const info = filterActions.getFieldInfo(item.field)\r\n const note = info?.values.join(', ') ?? ''\r\n const fieldCount = info ? info.values.length : 0\r\n const suffix = fieldCount > 0 ? ` (${fieldCount})` : ''\r\n const label = item.label ?? key.toString()\r\n let tooltipTitle = fieldCount > 0 ? `Filter by ${label}: ${note}` : undefined\r\n if (item.field === KeySpecial.quickSearch) {\r\n const txt = mapSpecialTexts.qsTooltip\r\n tooltipTitle = typeof quickSearchHint === 'function' ? quickSearchHint(txt) : (quickSearchHint ?? txt)\r\n } else if (item.tooltip) {\r\n const tooltip = typeof item.tooltip === 'function' ? item.tooltip(info?.values) : item.tooltip\r\n tooltipTitle = (info?.values.length ?? 0) > 0 ? tooltip : undefined\r\n }\r\n return (\r\n <MenuItem\r\n key={key}\r\n className={classes.menuItem}\r\n sx={{ justifyContent: 'space-between' }}\r\n onClick={() => handleMenuItemClick(item.field)}\r\n >\r\n <Tooltip title={tooltipTitle} placement='right' arrow>\r\n <div className={classes.menuItemInner}>\r\n <Typography variant='body2'>{label}</Typography>\r\n <Typography variant='caption' sx={{ ml: 1, color: 'text.secondary' }}>\r\n {suffix}\r\n </Typography>\r\n </div>\r\n </Tooltip>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuListCustom>\r\n <PopperFooter>\r\n <Button color='error' disabled={filterCount === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n const filterCount = filterActions.getTotalCount()\r\n const iconTitle = `${filterCount} Filter${filterCount !== 1 ? 's' : ''}`\r\n return (\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterInputStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={iconTitle} arrow placement='top'>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n <Badge badgeContent={filterCount} color='primary' invisible={filterCount === 0}>\r\n <FilterListIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterMenu\r\n}\r\n// #endregion\r\n\r\n// #region styles\r\n/** CSS class names used by the `FilterMenu` component for external style overrides. */\r\nexport const filterMenuClasses = {\r\n root: 'DinoFilterMenu-root',\r\n input: 'DinoFilterMenu-input',\r\n beforeInput: 'DinoFilterMenu-beforeInput',\r\n menu: 'DinoFilterMenu-menu',\r\n menuItem: 'DinoFilterMenu-menuItem',\r\n menuItemInner: 'DinoFilterMenu-menuItemInner'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)({\r\n [`&.${filterMenuClasses.root}`]: {\r\n display: 'inline-flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n flex: '0 0 auto'\r\n }\r\n})\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n [`.${filterMenuClasses.menuItem}`]: { paddingTop: 0, paddingBottom: 0 },\r\n [`.${filterMenuClasses.menuItemInner}`]: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n width: '100%',\r\n gap: '4px',\r\n paddingTop: '6px',\r\n paddingBottom: '6px'\r\n }\r\n})\r\n// #endregion\r\n"],"names":["createFilterMenu","config","classes","filterMenuClasses","mergedConfigs","fields","validation","_config$enableQuickSe","enableQuickSearch","rest","_objectWithoutProperties","_excluded","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","singleValue","keys","finalFields","reduce","acc","key","fieldConfig","mergedValidation","forEach","_ref","_item$label","_mergedFields$key","toString","Rules","some","r","rule","SingleRuleValidate","Required","push","generateConfigs","validateMaps","_config$validation","fieldKey","FormValidator","_defineProperty","generateValidatorMap","formInputMaps","_fieldConfig$FormComp","FormComponent","createFormFieldString","generateFormInputMap","quickSearchHint","props","refButton","createRef","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","filterActions","useFilterActions","_useState3","_useState4","fieldSelected","setFieldSelected","mergedSlots","useMemo","popperProps","rootProps","slots","handleClose","setTimeout","handleClearAll","clearAllFilters","handleSubmit","_ref2","_asyncToGenerator","_regenerator","m","_callee","value","w","_context","n","a","replaceValue","replaceFilter","logic","upsertManyFilter","closeAfterSubmit","_x","_x2","_x3","apply","this","arguments","data","values","Array","from","filterCount","getTotalCount","iconTitle","concat","_jsx","ClickAwayListener","onClickAway","children","_jsxs","FilterInputStyled","className","root","Tooltip","title","arrow","placement","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","transition","disablePortal","length","FilterMenuNoField","onClose","currentConfig","undefined","_context$filterState$","filterState","storeFilter","isLoading","onRemove","removeFilterByFieldValue","validator","onSubmit","onRemoveField","f","removeFilter","onBack","PopperContent","MenuListCustom","menu","map","_info$values$join","_item$label2","info","getFieldInfo","note","join","fieldCount","suffix","tooltipTitle","txt","mapSpecialTexts","qsTooltip","tooltip","_info$values$length","MenuItem","menuItem","sx","justifyContent","menuItemInner","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex","MenuList","paddingTop","paddingBottom","width","gap"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"create.js","sources":["../../../../src/filter-bar/menu/create.tsx"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// imports\r\nimport { createRef, useContext, useMemo, useState } from 'react'\r\nimport { Badge, Box, Button, IconButton, MenuItem, MenuList, styled, Tooltip, Typography } from '@mui/material'\r\nimport FilterListIcon from '@mui/icons-material/FilterList'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { KeySpecial } from '../types'\r\nimport { useFilterActions } from '../hooks'\r\nimport { FilterBarContext } from '../index.context'\r\nimport { FilterMenuNoField } from '../components/ui.units'\r\nimport { mapSpecialLabel, mapSpecialTexts } from '../helpers'\r\nimport { FormValidator, SingleRuleValidate } from '../../form/validator'\r\nimport { PopperBody, PopperContent, PopperCustom, PopperFooter } from '../components/popper-custom'\r\nimport createFormFieldString from './create-form-field-string'\r\n// types\r\nimport type { FC } from 'react'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldModelValid, TFieldType, TFieldValue } from '../types'\r\nimport type { IConfigValue, IFormValidatorConfig } from '../../form/validator'\r\nimport type { IFilterMenuConfigInternal, TFieldMenuConfigsInternal } from './types'\r\nimport type { IFilterMenuProps, IFilterMenuSlots, TFieldMenuConfigs } from './types'\r\nimport type { IFieldMenuConfig, IFilterMenuConfig, IFilterMenuFormProps } from './types'\r\n\r\n// #region utils\r\n/**\r\n * Builds a map of `FormValidator` instances keyed by field name.\r\n * Each validator is constructed from the validation rules defined in `config.validation`.\r\n * Fields with no validation config are skipped.\r\n *\r\n * @internal\r\n */\r\nfunction generateValidatorMap<T>(config: IFilterMenuConfig<T>) {\r\n const keys = Object.keys(config.fields) as TFieldType<T>[]\r\n const validateMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = config.validation?.[fieldKey]\r\n if (fieldConfig) {\r\n acc[fieldKey] = new FormValidator({ [fieldKey]: fieldConfig } as IFormValidatorConfig<Partial<TFieldModelValid<T>>>)\r\n }\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, FormValidator<Partial<TFieldModelValid<T>>>>\r\n )\r\n return validateMaps\r\n}\r\n\r\n/**\r\n * Builds a map of form input components keyed by field name.\r\n * If a field defines a custom `FormComponent`, that is used; otherwise falls back to\r\n * the default `createFormFieldString()` free-text component.\r\n *\r\n * @internal\r\n */\r\nfunction generateFormInputMap<T>(config: IFilterMenuConfig<T>) {\r\n const { fields } = config\r\n const keys = Object.keys(fields) as TFieldType<T>[]\r\n const formInputMaps = keys.reduce(\r\n (acc, key) => {\r\n const fieldKey = key as TFieldType<T>\r\n const fieldConfig = fields[fieldKey] as IFieldMenuConfig<T>\r\n if (fieldConfig) {\r\n acc[fieldKey] = fieldConfig.FormComponent ?? createFormFieldString()\r\n }\r\n return acc\r\n },\r\n {} as Record<TFieldType<T>, React.ComponentType<IFilterMenuFormProps<T>>>\r\n )\r\n return formInputMaps\r\n}\r\n\r\n/**\r\n * Normalises a raw `IFilterMenuConfig` into the internal format used by the menu:\r\n * - Injects the quick-search pseudo-field when `enableQuickSearch` is `true` (default)\r\n * - Stamps each field entry with its own `field` key\r\n * - Ensures every field has at least a `Required` validation rule\r\n *\r\n * @internal\r\n */\r\nfunction generateConfigs<T>(config: IFilterMenuConfig<T>): IFilterMenuConfigInternal<T> {\r\n const { fields, validation, enableQuickSearch = true, ...rest } = config\r\n const qsKey = KeySpecial.quickSearch\r\n\r\n // Merge quick search field if enabled\r\n const mergedFields: TFieldMenuConfigs<T> = { ...fields }\r\n if (enableQuickSearch) {\r\n const item = mergedFields[qsKey]\r\n const label = item?.label ? item.label : mapSpecialLabel[qsKey]\r\n const temp = Object.assign({}, mergedFields[qsKey], { field: qsKey, label, singleValue: true })\r\n mergedFields[qsKey] = temp\r\n } else {\r\n delete mergedFields[qsKey]\r\n }\r\n\r\n const keys = Object.keys(mergedFields) as TFieldType<T>[]\r\n const finalFields = keys.reduce<TFieldMenuConfigsInternal<T>>((acc, key) => {\r\n const fieldConfig = mergedFields[key]\r\n if (!fieldConfig) return acc\r\n acc[key] = { ...fieldConfig, field: key }\r\n return acc\r\n }, {} as TFieldMenuConfigsInternal<T>)\r\n\r\n // Merge validation config with default required rule\r\n const mergedValidation: IFormValidatorConfig<Partial<TFieldModelValid<T>>> = { ...validation }\r\n keys.forEach((key) => {\r\n const item: IConfigValue<Partial<TFieldModelValid<T>>> | undefined = mergedValidation[key]\r\n const label = item?.label ?? mergedFields[key]?.label ?? key.toString()\r\n if (!item) {\r\n mergedValidation[key] = { Rules: [{ rule: SingleRuleValidate.Required }], label }\r\n } else if (!item.Rules.some((r) => r.rule === SingleRuleValidate.Required)) {\r\n item.label = label\r\n item.Rules.push({ rule: SingleRuleValidate.Required })\r\n }\r\n })\r\n\r\n return { ...rest, fields: finalFields, validation: mergedValidation, enableQuickSearch }\r\n}\r\n// #endregion\r\n\r\n// #region main\r\n/**\r\n * Factory function that creates a `FilterMenu` component from a static field configuration.\r\n *\r\n * The generated component renders a badge icon button that opens a popper panel with:\r\n * - A **field list** view — lists all configured filter fields with applied-value counts\r\n * - A **field form** view — renders the appropriate input component for the selected field\r\n * - A **quick-search** field (opt-out via `enableQuickSearch: false`)\r\n * - OR / AND logic toggle support per field\r\n * - \"Clear All\" action to reset all active filters at once\r\n *\r\n * All state (open/close, selected field) is local; filter values are read/written through\r\n * `FilterBarContext` via `useFilterActions`.\r\n *\r\n * @param config - Static filter-menu configuration (fields, validation, slots, etc.)\r\n * @returns A React FC ready to be dropped anywhere inside a `FilterBarProvider`\r\n */\r\nexport function createFilterMenu<T>(config: IFilterMenuConfig<T>) {\r\n const classes = filterMenuClasses\r\n const mergedConfigs = generateConfigs(config)\r\n const validateMaps = generateValidatorMap(mergedConfigs)\r\n const formInputMaps = generateFormInputMap(mergedConfigs)\r\n const quickSearchHint = config.quickSearchHint\r\n\r\n // Component\r\n const FilterMenu: FC<IFilterMenuProps<T>> = (props) => {\r\n const refButton = createRef<HTMLButtonElement>()\r\n\r\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null)\r\n const isOpen = Boolean(anchorEl)\r\n\r\n const context = useContext(FilterBarContext) as IFilterBarContext<T>\r\n const filterActions = useFilterActions<T>(context)\r\n\r\n const [fieldSelected, setFieldSelected] = useState<TFieldType<T> | null>(null)\r\n\r\n const mergedSlots = useMemo<IFilterMenuSlots>(() => {\r\n const { popperProps, rootProps } = config\r\n return Object.assign({}, { popperProps, rootProps }, props.slots)\r\n }, [config, props.slots])\r\n\r\n const handleClose = () => {\r\n setAnchorEl(null)\r\n setTimeout(() => {\r\n setFieldSelected(null)\r\n }, 300)\r\n }\r\n\r\n const handleOpen = () => {\r\n setFieldSelected(null)\r\n setAnchorEl(refButton.current)\r\n }\r\n\r\n const handleMenuItemClick = (field: TFieldType<T>) => {\r\n setFieldSelected(field)\r\n }\r\n\r\n const handleClearAll = () => {\r\n filterActions.clearAllFilters()\r\n handleClose()\r\n }\r\n\r\n const handleSubmit = async (key: TFieldType<T>, value?: TFieldValue, fieldConfig?: IFieldMenuConfig<T>) => {\r\n if (!value) return\r\n if (fieldConfig?.singleValue || fieldConfig?.replaceValue) {\r\n filterActions.replaceFilter(key, value, { logic: value.logic })\r\n } else {\r\n filterActions.upsertManyFilter(key, value, { logic: value.logic })\r\n }\r\n if (config?.closeAfterSubmit !== false && fieldConfig?.closeAfterSubmit !== false) {\r\n handleClose()\r\n }\r\n }\r\n\r\n const data = useMemo(() => {\r\n const keys = Object.values(mergedConfigs.fields)\r\n return Array.from(keys) as IFieldMenuConfig<T>[]\r\n }, [mergedConfigs.fields])\r\n\r\n const renderContent = () => {\r\n if (data.length === 0) {\r\n return <FilterMenuNoField onClose={handleClose} />\r\n }\r\n const currentConfig = fieldSelected ? mergedConfigs.fields[fieldSelected] : undefined\r\n\r\n if (fieldSelected && currentConfig) {\r\n const FormComponent = formInputMaps[fieldSelected] as React.ComponentType<IFilterMenuFormProps<T>>\r\n if (!FormComponent) return null\r\n\r\n const config: IFieldMenuConfig<T> = { ...currentConfig }\r\n // Remove FormComponent from config before passing to form, as it's not needed there and can cause unnecessary re-renders\r\n if (config?.FormComponent) delete config.FormComponent\r\n\r\n const value = context.filterState.storeFilter?.[fieldSelected]\r\n return (\r\n <FormComponent\r\n currentConfig={config}\r\n value={value}\r\n isLoading={context.isLoading}\r\n onRemove={filterActions.removeFilterByFieldValue}\r\n validator={validateMaps[fieldSelected]}\r\n onSubmit={handleSubmit}\r\n onClose={handleClose}\r\n onRemoveField={(f) => filterActions.removeFilter(f)}\r\n onBack={() => setFieldSelected(null)}\r\n />\r\n )\r\n }\r\n\r\n return (\r\n <PopperContent title='Filter by' onClose={handleClose}>\r\n <PopperBody disableGutter>\r\n <MenuListCustom className={classes.menu}>\r\n {data.map((item) => {\r\n const key = item.field.toString()\r\n if (!key) return null\r\n const info = filterActions.getFieldInfo(item.field)\r\n const note = info?.values.join(', ') ?? ''\r\n const fieldCount = info ? info.values.length : 0\r\n const suffix = fieldCount > 0 ? ` (${fieldCount})` : ''\r\n const label = item.label ?? key.toString()\r\n let tooltipTitle = fieldCount > 0 ? `Filter by ${label}: ${note}` : undefined\r\n if (item.field === KeySpecial.quickSearch) {\r\n const txt = mapSpecialTexts.qsTooltip\r\n tooltipTitle = typeof quickSearchHint === 'function' ? quickSearchHint(txt) : (quickSearchHint ?? txt)\r\n } else if (item.tooltip) {\r\n const tooltip = typeof item.tooltip === 'function' ? item.tooltip(info?.values) : item.tooltip\r\n tooltipTitle = (info?.values.length ?? 0) > 0 ? tooltip : undefined\r\n }\r\n return (\r\n <MenuItem\r\n key={key}\r\n className={classes.menuItem}\r\n sx={{ justifyContent: 'space-between' }}\r\n onClick={() => handleMenuItemClick(item.field)}\r\n >\r\n <Tooltip title={tooltipTitle} placement='right' arrow>\r\n <div className={classes.menuItemInner}>\r\n <Typography variant='body2'>{label}</Typography>\r\n <Typography variant='caption' sx={{ ml: 1, color: 'text.secondary' }}>\r\n {suffix}\r\n </Typography>\r\n </div>\r\n </Tooltip>\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuListCustom>\r\n </PopperBody>\r\n <PopperFooter>\r\n <Button color='error' disabled={filterCount === 0} onClick={handleClearAll}>\r\n Clear All\r\n </Button>\r\n </PopperFooter>\r\n </PopperContent>\r\n )\r\n }\r\n\r\n const filterCount = filterActions.getTotalCount()\r\n const iconTitle = `${filterCount} Filter${filterCount !== 1 ? 's' : ''}`\r\n return (\r\n <ClickAwayListener onClickAway={handleClose}>\r\n <FilterInputStyled className={classes.root} {...mergedSlots.rootProps}>\r\n <Tooltip title={iconTitle} arrow placement='top'>\r\n <IconButton size='small' ref={refButton} onClick={handleOpen}>\r\n <Badge badgeContent={filterCount} color='primary' invisible={filterCount === 0}>\r\n <FilterListIcon fontSize='small' />\r\n </Badge>\r\n </IconButton>\r\n </Tooltip>\r\n <PopperCustom open={isOpen} anchorEl={anchorEl} placement='bottom' transition disablePortal {...mergedSlots.popperProps}>\r\n {renderContent()}\r\n </PopperCustom>\r\n </FilterInputStyled>\r\n </ClickAwayListener>\r\n )\r\n }\r\n return FilterMenu\r\n}\r\n// #endregion\r\n\r\n// #region styles\r\n/** CSS class names used by the `FilterMenu` component for external style overrides. */\r\nexport const filterMenuClasses = {\r\n root: 'DinoFilterMenu-root',\r\n input: 'DinoFilterMenu-input',\r\n beforeInput: 'DinoFilterMenu-beforeInput',\r\n menu: 'DinoFilterMenu-menu',\r\n menuItem: 'DinoFilterMenu-menuItem',\r\n menuItemInner: 'DinoFilterMenu-menuItemInner'\r\n}\r\n\r\nconst FilterInputStyled = styled(Box)({\r\n [`&.${filterMenuClasses.root}`]: {\r\n display: 'inline-flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n flex: '0 0 auto'\r\n }\r\n})\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n [`.${filterMenuClasses.menuItem}`]: { paddingTop: 0, paddingBottom: 0 },\r\n [`.${filterMenuClasses.menuItemInner}`]: {\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n width: '100%',\r\n gap: '4px',\r\n paddingTop: '6px',\r\n paddingBottom: '6px'\r\n }\r\n})\r\n// #endregion\r\n"],"names":["createFilterMenu","config","classes","filterMenuClasses","mergedConfigs","fields","validation","_config$enableQuickSe","enableQuickSearch","rest","_objectWithoutProperties","_excluded","qsKey","KeySpecial","quickSearch","mergedFields","_objectSpread","item","label","mapSpecialLabel","temp","Object","assign","field","singleValue","keys","finalFields","reduce","acc","key","fieldConfig","mergedValidation","forEach","_ref","_item$label","_mergedFields$key","toString","Rules","some","r","rule","SingleRuleValidate","Required","push","generateConfigs","validateMaps","_config$validation","fieldKey","FormValidator","_defineProperty","generateValidatorMap","formInputMaps","_fieldConfig$FormComp","FormComponent","createFormFieldString","generateFormInputMap","quickSearchHint","props","refButton","createRef","_useState","useState","_useState2","_slicedToArray","anchorEl","setAnchorEl","isOpen","Boolean","context","useContext","FilterBarContext","filterActions","useFilterActions","_useState3","_useState4","fieldSelected","setFieldSelected","mergedSlots","useMemo","popperProps","rootProps","slots","handleClose","setTimeout","handleClearAll","clearAllFilters","handleSubmit","_ref2","_asyncToGenerator","_regenerator","m","_callee","value","w","_context","n","a","replaceValue","replaceFilter","logic","upsertManyFilter","closeAfterSubmit","_x","_x2","_x3","apply","this","arguments","data","values","Array","from","filterCount","getTotalCount","iconTitle","concat","_jsx","ClickAwayListener","onClickAway","children","_jsxs","FilterInputStyled","className","root","Tooltip","title","arrow","placement","IconButton","size","ref","onClick","current","Badge","badgeContent","color","invisible","FilterListIcon","fontSize","PopperCustom","open","transition","disablePortal","length","FilterMenuNoField","onClose","currentConfig","undefined","_context$filterState$","filterState","storeFilter","isLoading","onRemove","removeFilterByFieldValue","validator","onSubmit","onRemoveField","f","removeFilter","onBack","PopperContent","PopperBody","disableGutter","MenuListCustom","menu","map","_info$values$join","_item$label2","info","getFieldInfo","note","join","fieldCount","suffix","tooltipTitle","txt","mapSpecialTexts","qsTooltip","tooltip","_info$values$length","MenuItem","menuItem","sx","justifyContent","menuItemInner","Typography","variant","ml","PopperFooter","Button","disabled","renderContent","styled","Box","display","alignItems","flex","MenuList","paddingTop","paddingBottom","width","gap"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as o,callSuper as a,defineProperty as s,asyncToGenerator as n,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Box as
|
|
1
|
+
import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as o,callSuper as a,defineProperty as s,asyncToGenerator as n,regenerator as l}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Box as u}from"@mui/material";import{createContext as m,Component as c}from"react";import{validateMerge as f,convertFormDataToJson as p,trimAllStrings as d,singleValidate as v,getErrorCommonFromResponse as E,getErrorFromResponse as g}from"./helpers.js";import{FormValidator as S,SingleRuleValidate as h}from"./validator.js";import{ApiAlertContext as b}from"../api-context/alert-global.js";var j=function(j){var A=m({setModelState:function(){},messageErrors:{},onBlur:function(){},setError:function(){},removeError:function(){},clearErrorAll:function(){}}),C=function(){function m(r){var e;return o(this,m),e=a(this,m,[r]),s(e,"refForm",null),s(e,"mapContext",function(){var r=e,t=r.setError,o=r.removeError,a=r.setModelState,s=r.clearErrorAll,n=r.onBlur,l=e.state;return{modelState:l.modelState,messageErrors:l.messageErrors,setError:t,onBlur:n,clearErrorAll:s,setModelState:a,removeError:o}}),s(e,"setModelState",function(r){var t=Object.assign({},e.state.modelState,r);e.setState({modelState:t})}),s(e,"getValidate",function(){var r=new S({});return f(r,null==j?void 0:j.validate,e.props.validate)}),s(e,"setError",function(r,t){var o=s({},r,[{rule:h.Custom,message:t}]);e.setState({messageErrors:Object.assign({},e.state.messageErrors,o)})}),s(e,"removeError",function(r){var o=t({},e.state.messageErrors);Array.isArray(r)?r.forEach(function(r){o[r]&&delete o[r]}):o[r]&&delete o[r],e.setState({messageErrors:o})}),s(e,"clearErrorAll",function(){e.setState({messageErrors:{}})}),s(e,"onSubmit",function(){var r=n(l().m(function r(o){var a,s,n,i,u,m,c,f;return l().w(function(r){for(;;)switch(r.p=r.n){case 0:if(o.preventDefault(),a=new FormData(o.currentTarget),s=p(a),n=d(s),e.setState({modelState:n}),i=e.validate.run(n),e.props.onError&&Object.keys(i).length>0&&e.props.onError(i),!i){r.n=1;break}if(e.setState({messageErrors:i}),!(Object.keys(i).length>0)){r.n=1;break}return r.a(2);case 1:return r.p=1,r.n=2,e.props.onSubmit(n,o);case 2:r.n=4;break;case 3:r.p=3,f=r.v,(m=E(f)).length>0&&(null===(u=b.ApiAlert)||void 0===u||u.PushError(m[0])),c=g(f,n),e.setState({messageErrors:t(t({},e.state.messageErrors),c||{})});case 4:return r.a(2)}},r,null,[[1,3]])}));return function(e){return r.apply(this,arguments)}}()),s(e,"onBlur",function(r){if(e.refForm){var t=e.state.messageErrors,o=new FormData(e.refForm),a=p(o),s=d(a);e.setState({modelState:s});var n=v(r,s,t,e.validate)||{};e.setState({messageErrors:n})}}),e.validate=e.getValidate(),e.state={messageErrors:{}},e}return r(m,c),e(m,[{key:"render",value:function(){var r,e,o=this,a=[this.props.className,null===(r=this.props.slots)||void 0===r||null===(r=r.formProps)||void 0===r?void 0:r.className].filter(Boolean);return i(u,t(t({component:"form",ref:function(r){return o.refForm=r},onSubmit:this.onSubmit},null===(e=this.props.slots)||void 0===e?void 0:e.formProps),{},{className:a.join(" "),children:i(A.Provider,{value:this.mapContext(),children:this.props.children})}))}}])}();return{Form:C,Validator:null==j?void 0:j.validate,Context:A,mapContext:function(r){return i(A.Consumer,{children:r})}}};export{j as default};
|
|
2
2
|
//# sourceMappingURL=create.form-base.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create.form-base.js","sources":["../../../src/form/create.form-base.tsx"],"sourcesContent":["import { Box, BoxProps } from '@mui/material'\r\nimport { Component, ComponentType, createContext, PropsWithChildren, ReactNode } from 'react'\r\nimport { ApiAlertContext } from '../api-context'\r\nimport { IFormBaseContext, ISetModelStateFunc } from './types'\r\nimport { convertFormDataToJson, getErrorCommonFromResponse, getErrorFromResponse, singleValidate, trimAllStrings, validateMerge } from './helpers'\r\nimport FormValidator, { IPartialError, SingleRuleValidate } from './validator'\r\n\r\nexport interface IFormBaseSlots {\r\n formProps?: Omit<BoxProps, 'ref' | 'onSubmit' | 'component'> & { [key: string]: any }\r\n}\r\n\r\nexport interface IFormBaseConfigs<T> {\r\n validate?: FormValidator<Partial<T>>\r\n dataTrimed?: boolean\r\n dataGetter?: (data: Partial<T>) => Partial<T>\r\n}\r\n\r\nexport interface IFormBaseParams<T> extends IFormBaseConfigs<T> {}\r\n\r\nexport interface IFormBaseProps<T> extends PropsWithChildren, IFormBaseConfigs<T> {\r\n className?: string\r\n onSubmit: (data: Partial<T>, e: React.FormEvent<HTMLFormElement>) => Promise<void>\r\n onError?: (error: IPartialError<T>) => void\r\n slots?: IFormBaseSlots\r\n}\r\n\r\nexport interface IFormBaseState<T> {\r\n modelState?: Partial<T>\r\n messageErrors: IPartialError<T>\r\n}\r\n\r\nexport interface IFormBaseResult<T> {\r\n Form: ComponentType<IFormBaseProps<T>>\r\n Validator?: FormValidator<Partial<T>>\r\n Context: React.Context<IFormBaseContext<T>>\r\n mapContext: (params: (context: IFormBaseContext<T>) => JSX.Element) => JSX.Element\r\n}\r\n\r\nconst createFormBase = function <T>(params?: IFormBaseParams<T>): IFormBaseResult<T> {\r\n const FormBaseContext = createContext<IFormBaseContext<T>>({\r\n setModelState: () => {},\r\n messageErrors: {},\r\n onBlur: () => {},\r\n setError: () => {},\r\n removeError: () => {},\r\n clearErrorAll: () => {}\r\n })\r\n\r\n class FormBase extends Component<IFormBaseProps<T>, IFormBaseState<T>> {\r\n refForm: HTMLFormElement | null = null\r\n constructor(props: IFormBaseProps<T>) {\r\n super(props)\r\n this.validate = this.getValidate()\r\n this.state = { messageErrors: {} }\r\n }\r\n\r\n render() {\r\n const rootClass = [this.props.className, this.props.slots?.formProps?.className].filter(Boolean)\r\n return (\r\n <Box\r\n component='form'\r\n ref={(ref: HTMLFormElement) => (this.refForm = ref)}\r\n onSubmit={this.onSubmit}\r\n {...(this.props.slots?.formProps as any)}\r\n className={rootClass.join(' ')}\r\n >\r\n <FormBaseContext.Provider value={this.mapContext()}>{this.props.children}</FormBaseContext.Provider>\r\n </Box>\r\n )\r\n }\r\n\r\n private mapContext = (): IFormBaseContext<T> => {\r\n const { setError, removeError, setModelState, clearErrorAll, onBlur } = this\r\n const { modelState, messageErrors } = this.state\r\n return { modelState, messageErrors, setError, onBlur, clearErrorAll, setModelState, removeError }\r\n }\r\n\r\n setModelState: ISetModelStateFunc<T> = (state) => {\r\n const obj = Object.assign({}, this.state.modelState, state)\r\n this.setState({ modelState: obj })\r\n }\r\n\r\n getValidate = (): FormValidator<Partial<T>> => {\r\n const defaultValidate = new FormValidator<Partial<T>>({})\r\n return validateMerge(defaultValidate, params?.validate, this.props.validate)\r\n }\r\n\r\n setError = (keyName: keyof T, message: string) => {\r\n const error = { [keyName]: [{ rule: SingleRuleValidate.Custom, message }] }\r\n this.setState({ messageErrors: Object.assign({}, this.state.messageErrors, error) })\r\n }\r\n\r\n removeError = (keyNames: keyof T | (keyof T)[]) => {\r\n const newErrors = { ...this.state.messageErrors }\r\n if (Array.isArray(keyNames)) {\r\n keyNames.forEach((key) => {\r\n if (newErrors[key]) delete newErrors[key]\r\n })\r\n } else {\r\n if (newErrors[keyNames]) delete newErrors[keyNames]\r\n }\r\n this.setState({ messageErrors: newErrors })\r\n }\r\n\r\n clearErrorAll = () => {\r\n this.setState({ messageErrors: {} })\r\n }\r\n\r\n private validate: FormValidator<Partial<T>>\r\n onSubmit: React.FormEventHandler<HTMLFormElement> = async (e) => {\r\n e.preventDefault()\r\n const formData = new FormData(e.currentTarget as HTMLFormElement)\r\n const raw = convertFormDataToJson<T>(formData)\r\n // TODO: validate raw data\r\n const trimmed = trimAllStrings(raw)\r\n this.setState({ modelState: trimmed })\r\n const messageErrors = this.validate.run(trimmed) as IPartialError<T>\r\n\r\n if (this.props.onError && Object.keys(messageErrors).length > 0) {\r\n this.props.onError(messageErrors)\r\n }\r\n\r\n if (messageErrors) {\r\n this.setState({ messageErrors: messageErrors })\r\n if (Object.keys(messageErrors).length > 0) return\r\n }\r\n try {\r\n await this.props.onSubmit(trimmed, e)\r\n } catch (error: any) {\r\n const errorCommon = getErrorCommonFromResponse(error as any)\r\n if (errorCommon.length > 0) ApiAlertContext.ApiAlert?.PushError(errorCommon[0])\r\n const messageError = getErrorFromResponse(error, trimmed)\r\n this.setState({ messageErrors: { ...this.state.messageErrors, ...(messageError || {}) } })\r\n // throw error\r\n }\r\n }\r\n\r\n onBlur = (keyName: keyof T) => {\r\n if (!this.refForm) return\r\n const { messageErrors } = this.state\r\n const formData = new FormData(this.refForm)\r\n const raw = convertFormDataToJson(formData)\r\n const trimmed = trimAllStrings(raw)\r\n this.setState({ modelState: trimmed })\r\n const error = singleValidate<T, Partial<T>>(keyName, trimmed, messageErrors, this.validate) || {}\r\n this.setState({ messageErrors: error as IPartialError<T> })\r\n }\r\n }\r\n\r\n return {\r\n Form: FormBase,\r\n Validator: params?.validate,\r\n Context: FormBaseContext,\r\n mapContext: (params: (context: IFormBaseContext<T>) => ReactNode) => <FormBaseContext.Consumer>{params}</FormBaseContext.Consumer>\r\n }\r\n}\r\nexport default createFormBase\r\n"],"names":["createFormBase","params","FormBaseContext","createContext","setModelState","messageErrors","onBlur","setError","removeError","clearErrorAll","FormBase","props","_this","_classCallCheck","_callSuper","_defineProperty","_this2","_this$state","state","modelState","obj","Object","assign","setState","defaultValidate","FormValidator","validateMerge","validate","keyName","message","error","rule","SingleRuleValidate","Custom","keyNames","newErrors","_objectSpread","Array","isArray","forEach","key","_ref","_asyncToGenerator","_regenerator","m","_callee","e","formData","raw","trimmed","_ApiAlertContext$ApiA","errorCommon","messageError","_t","w","_context","p","n","preventDefault","FormData","currentTarget","convertFormDataToJson","trimAllStrings","run","onError","keys","length","a","onSubmit","v","getErrorCommonFromResponse","ApiAlertContext","ApiAlert","PushError","getErrorFromResponse","_x","apply","this","arguments","refForm","singleValidate","getValidate","_inherits","Component","_createClass","value","_this$props$slots","_this$props$slots2","_this3","rootClass","className","slots","formProps","filter","Boolean","_jsx","Box","component","ref","join","children","Provider","mapContext","Form","Validator","Context","Consumer"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"create.form-base.js","sources":["../../../src/form/create.form-base.tsx"],"sourcesContent":["import { Box, BoxProps } from '@mui/material'\r\nimport { Component, ComponentType, createContext, PropsWithChildren, ReactNode } from 'react'\r\nimport { ApiAlertContext } from '../api-context'\r\nimport { IFormBaseContext, ISetModelStateFunc } from './types'\r\nimport { convertFormDataToJson, getErrorCommonFromResponse, getErrorFromResponse, singleValidate, trimAllStrings, validateMerge } from './helpers'\r\nimport FormValidator, { IPartialError, SingleRuleValidate } from './validator'\r\n\r\nexport interface IFormBaseSlots {\r\n formProps?: Omit<BoxProps, 'ref' | 'onSubmit' | 'component'> & { [key: string]: any }\r\n}\r\n\r\nexport interface IFormBaseConfigs<T> {\r\n validate?: FormValidator<Partial<T>>\r\n dataTrimed?: boolean\r\n dataGetter?: (data: Partial<T>) => Partial<T>\r\n}\r\n\r\nexport interface IFormBaseParams<T> extends IFormBaseConfigs<T> {}\r\n\r\nexport interface IFormBaseProps<T> extends PropsWithChildren, IFormBaseConfigs<T> {\r\n className?: string\r\n onSubmit: (data: Partial<T>, e: React.FormEvent<HTMLFormElement>) => Promise<void>\r\n onError?: (error: IPartialError<T>) => void\r\n slots?: IFormBaseSlots\r\n}\r\n\r\nexport interface IFormBaseState<T> {\r\n modelState?: Partial<T>\r\n messageErrors: IPartialError<T>\r\n}\r\n\r\nexport interface IFormBaseResult<T> {\r\n Form: ComponentType<IFormBaseProps<T>>\r\n Validator?: FormValidator<Partial<T>>\r\n Context: React.Context<IFormBaseContext<T>>\r\n mapContext: (params: (context: IFormBaseContext<T>) => JSX.Element) => JSX.Element\r\n}\r\n\r\nconst createFormBase = function <T>(params?: IFormBaseParams<T>): IFormBaseResult<T> {\r\n const FormBaseContext = createContext<IFormBaseContext<T>>({\r\n setModelState: () => {},\r\n messageErrors: {},\r\n onBlur: () => {},\r\n setError: () => {},\r\n removeError: () => {},\r\n clearErrorAll: () => {}\r\n })\r\n\r\n class FormBase extends Component<IFormBaseProps<T>, IFormBaseState<T>> {\r\n refForm: HTMLFormElement | null = null\r\n constructor(props: IFormBaseProps<T>) {\r\n super(props)\r\n this.validate = this.getValidate()\r\n this.state = { messageErrors: {} }\r\n }\r\n\r\n render() {\r\n const rootClass = [this.props.className, this.props.slots?.formProps?.className].filter(Boolean)\r\n return (\r\n <Box\r\n component='form'\r\n ref={(ref: HTMLFormElement) => (this.refForm = ref)}\r\n onSubmit={this.onSubmit}\r\n {...(this.props.slots?.formProps as any)}\r\n className={rootClass.join(' ')}\r\n >\r\n <FormBaseContext.Provider value={this.mapContext()}>{this.props.children}</FormBaseContext.Provider>\r\n </Box>\r\n )\r\n }\r\n\r\n private mapContext = (): IFormBaseContext<T> => {\r\n const { setError, removeError, setModelState, clearErrorAll, onBlur } = this\r\n const { modelState, messageErrors } = this.state\r\n return { modelState, messageErrors, setError, onBlur, clearErrorAll, setModelState, removeError }\r\n }\r\n\r\n setModelState: ISetModelStateFunc<T> = (state) => {\r\n const obj = Object.assign({}, this.state.modelState, state)\r\n this.setState({ modelState: obj })\r\n }\r\n\r\n getValidate = (): FormValidator<Partial<T>> => {\r\n const defaultValidate = new FormValidator<Partial<T>>({})\r\n return validateMerge(defaultValidate, params?.validate, this.props.validate)\r\n }\r\n\r\n setError = (keyName: keyof T, message: string) => {\r\n const error = { [keyName]: [{ rule: SingleRuleValidate.Custom, message }] }\r\n this.setState({ messageErrors: Object.assign({}, this.state.messageErrors, error) })\r\n }\r\n\r\n removeError = (keyNames: keyof T | (keyof T)[]) => {\r\n const newErrors = { ...this.state.messageErrors }\r\n if (Array.isArray(keyNames)) {\r\n keyNames.forEach((key) => {\r\n if (newErrors[key]) delete newErrors[key]\r\n })\r\n } else {\r\n if (newErrors[keyNames]) delete newErrors[keyNames]\r\n }\r\n this.setState({ messageErrors: newErrors })\r\n }\r\n\r\n clearErrorAll = () => {\r\n this.setState({ messageErrors: {} })\r\n }\r\n\r\n private validate: FormValidator<Partial<T>>\r\n onSubmit: React.FormEventHandler<HTMLFormElement> = async (e) => {\r\n e.preventDefault()\r\n const formData = new FormData(e.currentTarget as HTMLFormElement)\r\n const raw = convertFormDataToJson<T>(formData)\r\n // TODO: validate raw data\r\n const trimmed = trimAllStrings(raw)\r\n this.setState({ modelState: trimmed })\r\n const messageErrors = this.validate.run(trimmed) as IPartialError<T>\r\n\r\n if (this.props.onError && Object.keys(messageErrors).length > 0) {\r\n this.props.onError(messageErrors)\r\n }\r\n\r\n if (messageErrors) {\r\n this.setState({ messageErrors: messageErrors })\r\n if (Object.keys(messageErrors).length > 0) return\r\n }\r\n try {\r\n await this.props.onSubmit(trimmed, e)\r\n } catch (error: any) {\r\n const errorCommon = getErrorCommonFromResponse(error as any)\r\n if (errorCommon.length > 0) ApiAlertContext.ApiAlert?.PushError(errorCommon[0])\r\n const messageError = getErrorFromResponse(error, trimmed)\r\n this.setState({ messageErrors: { ...this.state.messageErrors, ...(messageError || {}) } })\r\n // throw error\r\n }\r\n }\r\n\r\n onBlur = (keyName: keyof T) => {\r\n if (!this.refForm) return\r\n const { messageErrors } = this.state\r\n const formData = new FormData(this.refForm)\r\n const raw = convertFormDataToJson(formData)\r\n const trimmed = trimAllStrings(raw)\r\n this.setState({ modelState: trimmed })\r\n const error = singleValidate<T, Partial<T>>(keyName, trimmed, messageErrors, this.validate) || {}\r\n this.setState({ messageErrors: error as IPartialError<T> })\r\n }\r\n }\r\n\r\n return {\r\n Form: FormBase,\r\n Validator: params?.validate,\r\n Context: FormBaseContext,\r\n mapContext: (params: (context: IFormBaseContext<T>) => ReactNode) => <FormBaseContext.Consumer>{params}</FormBaseContext.Consumer>\r\n }\r\n}\r\nexport default createFormBase\r\n"],"names":["createFormBase","params","FormBaseContext","createContext","setModelState","messageErrors","onBlur","setError","removeError","clearErrorAll","FormBase","props","_this","_classCallCheck","_callSuper","_defineProperty","_this2","_this$state","state","modelState","obj","Object","assign","setState","defaultValidate","FormValidator","validateMerge","validate","keyName","message","error","rule","SingleRuleValidate","Custom","keyNames","newErrors","_objectSpread","Array","isArray","forEach","key","_ref","_asyncToGenerator","_regenerator","m","_callee","e","formData","raw","trimmed","_ApiAlertContext$ApiA","errorCommon","messageError","_t","w","_context","p","n","preventDefault","FormData","currentTarget","convertFormDataToJson","trimAllStrings","run","onError","keys","length","a","onSubmit","v","getErrorCommonFromResponse","ApiAlertContext","ApiAlert","PushError","getErrorFromResponse","_x","apply","this","arguments","refForm","singleValidate","getValidate","_inherits","Component","_createClass","value","_this$props$slots","_this$props$slots2","_this3","rootClass","className","slots","formProps","filter","Boolean","_jsx","Box","component","ref","join","children","Provider","mapContext","Form","Validator","Context","Consumer"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{inherits as r,createClass as
|
|
1
|
+
import{inherits as r,createClass as n,classCallCheck as e,callSuper as t,defineProperty as o,asyncToGenerator as i,regenerator 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 d,Box as p,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/dayjs-config.js";import"../utils/query-param.js";import{mapGlobalModalContext as C}from"../api-context/global-modal.js";var k=function(u){var d=function(){function d(r){var n;return e(this,d),n=t(this,d,[r]),o(n,"handleClickNo",function(r){r.close(),n.props.onCancel&&n.props.onCancel()}),o(n,"handleClickYes",function(){var r=i(l().m(function r(e){var t;return l().w(function(r){for(;;)switch(r.p=r.n){case 0:if(n.props.onSubmit){r.n=1;break}return r.a(2);case 1:return r.p=1,n.setState({loading:!0}),r.n=2,g(function(){return n.props.onSubmit(n.props.data)},700);case 2:e.close(),r.n=4;break;case 3:r.p=3,t=r.v,console.log("Handle Click Yes error:",t);case 4:return r.p=4,n.setState({loading:!1}),r.f(4);case 5:return r.a(2)}},r,null,[[1,3,4,5]])}));return function(n){return r.apply(this,arguments)}}()),n.state={loading:!1},n}return r(d,c),n(d,[{key:"render",value:function(){var r,n,e=this,t=this.props.children||(null!=u&&u.content?null==u?void 0:u.content(this.props.data):void 0),o=null!==(r=null!==(n=this.props.title)&&void 0!==n?n:null==u?void 0:u.title)&&void 0!==r?r:"Are you sure?";return a(p,{sx:{flex:1,display:"flex",alignItems:"center",justifyContent:"center"},children:C(function(r){var n,i;return s(f,{children:[a(h,{id:"alert-dialog-title",children:o}),a(m,{sx:{minWidth:"300px"},children:t}),s(v,{children:[a(y,{disabled:e.state.loading,color:(null==u||null===(n=u.colors)||void 0===n?void 0:n.no)||"inherit",onClick:function(){return e.handleClickNo(r)},children:"No"}),a(y,{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 d},y=u(d)({textTransform:"capitalize",fontWeight:600,"&.MuiButton-colorInherit":{color:"#606060!important"}});export{k 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('Handle Click Yes error:', 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","_regenerator","m","_callee","_t","w","_context","p","n","onSubmit","a","setState","loading","fetchDelay","data","v","console","log","f","_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":"
|
|
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('Handle Click Yes error:', 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","_regenerator","m","_callee","_t","w","_context","p","n","onSubmit","a","setState","loading","fetchDelay","data","v","console","log","f","_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":"gkBAyBA,IAAMA,EAAoB,SAAmBC,GAA4B,IACjEC,aACJ,SAAAA,EAAYC,GAA2B,IAAAC,EAEN,OAFMC,OAAAH,GACrCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EA2BE,gBAAA,SAACI,GACfA,EAAQC,QACRL,EAAKD,MAAMO,UAAYN,EAAKD,MAAMO,aACnCH,EAAAH,EAAA,iBAAA,WAAA,IAAAO,EAAAC,EAAAC,IAAAC,EAEgB,SAAAC,EAAOP,GAA4B,IAAAQ,EAAA,OAAAH,IAAAI,EAAA,SAAAC,GAAA,cAAAA,EAAAC,EAAAD,EAAAE,GAAA,KAAA,EAAA,GAC7ChB,EAAKD,MAAMkB,SAAQ,CAAAH,EAAAE,EAAA,EAAA,KAAA,CAAA,OAAAF,EAAAI,EAAA,GAAA,KAAA,EAEU,OAFVJ,EAAAC,EAAA,EAEtBf,EAAKmB,SAAS,CAAEC,SAAS,IAAON,EAAAE,EAAA,EAC1BK,EAAW,WAAA,OAAMrB,EAAKD,MAAMkB,SAASjB,EAAKD,MAAMuB,KAAK,EAAE,KAAI,KAAA,EACjElB,EAAQC,QAAOS,EAAAE,EAAA,EAAA,MAAA,KAAA,EAAAF,EAAAC,EAAA,EAAAH,EAAAE,EAAAS,EAEfC,QAAQC,IAAI,0BAAyBb,GAAQ,KAAA,EAEZ,OAFYE,EAAAC,EAAA,EAE7Cf,EAAKmB,SAAS,CAAEC,SAAS,IAAQN,EAAAY,EAAA,GAAA,KAAA,EAAA,OAAAZ,EAAAI,EAAA,GAAA,EAAAP,EAAA,KAAA,CAAA,CAAA,EAAA,EAAA,EAAA,QAEpC,OAAA,SAAAgB,GAAA,OAAApB,EAAAqB,MAAAC,KAAAC,UAAA,CAAA,CAbA,IA7BC9B,EAAK+B,MAAQ,CAAEX,SAAS,GAAOpB,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,MAAMuB,WAAQoB,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,EAAsB,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,MAAMX,QAAS2C,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,MAAMX,QAAS8C,QAAS,WAAF,OAAQ3B,EAAK8B,eAAejE,EAAQ,EAE9GqC,SAAA,aAGpB,IAGP,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 o,createClass as r,objectSpread2 as e,classCallCheck as t,callSuper as n,defineProperty as l,asyncToGenerator as i,regenerator as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Fragment as d,Component as p}from"react";import{Grid as c}from"@mui/material";import{cleanObject as m}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import
|
|
1
|
+
import{inherits as o,createClass as r,objectSpread2 as e,classCallCheck as t,callSuper as n,defineProperty as l,asyncToGenerator as i,regenerator as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Fragment as d,Component as p}from"react";import{Grid as c}from"@mui/material";import{cleanObject as m}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{formGridLayoutClasses as f,FormGridLayoutStyled as v,CreateFormBottomBar as g}from"./create.form-grid-layout.units.js";import b from"./create.form-base.js";import h from"./create.input.js";import{mapGlobalModalContext as S}from"../api-context/global-modal.js";var y=function(y){var F=b(),C=g(),j=h({maxLength:250}),E=function(){function g(o){var r;return t(this,g),r=n(this,g,[o]),l(r,"renderFormFieldElement",function(o,t){var n,l,i=r.props.data,a=null!==(n=t.inputElement)&&void 0!==n?n:j,u=o.modelState||{},d=r.configMerged.disabledFields,p="function"==typeof d?d(u,i):d||{},c={data:i,onBlur:o.onBlur,messageErrors:o.messageErrors,name:t.key,label:t.label,placeholder:t.placeholder,disabled:!!p[t.key]||void 0,defaultValue:null!==(l=null==i?void 0:i[t.key])&&void 0!==l?l:null==t?void 0:t.defaultValue,formContext:o};return s(a,e({},m(c)))}),l(r,"loading",function(){return r.setState({loadding:!0})}),l(r,"unloading",function(){return r.setState({loadding:!1})}),l(r,"onSubmit",function(){var o=i(a().m(function o(e,t){var n,l,i,s,u,d,p,c,m;return a().w(function(o){for(;;)switch(o.p=o.n){case 0:return s=r.props.slots,u=null!==(n=null!==(l=null===(i=r.props.slots)||void 0===i?void 0:i.preSubmit)&&void 0!==l?l:y.preSubmit)&&void 0!==n?n:r.preSubmit,d=u(e,r.props.data),o.p=1,r.loading(),null===(p=r.abortController)||void 0===p||p.abort(),r.abortController=new AbortController,o.n=2,r.props.onSubmit(d,null===(c=r.abortController)||void 0===c?void 0:c.signal);case 2:null!=s&&s.closeState&&!1===s.closeState.Success||(t&&t(),r.props.onClose&&r.props.onClose()),o.n=4;break;case 3:throw o.p=3,m=o.v,null!=s&&s.closeState&&!0===s.closeState.Fail&&(t&&t(),r.props.onClose&&r.props.onClose()),r.props.onError&&r.props.onError(m),m;case 4:return o.p=4,r.unloading(),o.f(4);case 5:return o.a(2)}},o,null,[[1,3,4,5]])}));return function(r,e){return o.apply(this,arguments)}}()),l(r,"preSubmit",function(o){return o}),l(r,"getFormSlots",function(){var o,t=r.state.loadding,n=((null===(o=r.props.slots)||void 0===o?void 0:o.formSlots)||{}).formProps;return{formProps:e(e({},n),{},{sx:e(e({},r.props.sx),{},{opacity:t?.7:1,pointerEvents:t?"none":"auto"})})}}),r.state={loadding:!1},r}return o(g,p),r(g,[{key:"configMerged",get:function(){var o,r,e,t,n=this.props.slots,l=void 0===n?{}:n;return{hiddenFields:null!==(o=null!==(r=l.hiddenFields)&&void 0!==r?r:y.hiddenFields)&&void 0!==o?o:function(){return{}},disabledFields:null!==(e=null!==(t=l.disabledFields)&&void 0!==t?t:y.disabledFields)&&void 0!==e?e:function(){return{}}}}},{key:"render",value:function(){var o,r,t,n=this,l=this.props,i=l.slots,a=l.data,p=l.autoHeight,m=null!==(o=null!==(r=null==y?void 0:y.action)&&void 0!==r?r:null==i?void 0:i.action)&&void 0!==o?o:C,g=[f.root,null==i||null===(t=i.rootProps)||void 0===t?void 0:t.className];return(null!=p?p:y.autoHeight)&&g.push(f.autoHeight),S(function(o){var r=o.close;return s(v,e(e({},null==i?void 0:i.rootProps),{},{className:g.filter(Boolean).join(" "),children:u(F.Form,{className:f.form,validate:y.validate,onSubmit:function(o){return n.onSubmit(o,r)},slots:n.getFormSlots(),onError:n.props.onSubmitError,children:[(null==i?void 0:i.contentBefore)&&(null==i?void 0:i.contentBefore),null==y?void 0:y.contentBefore,F.mapContext(function(o){var r=n.configMerged.hiddenFields,t=o.modelState||{},l="function"==typeof r?r(t,a):r||{};return s(c,{container:!0,spacing:2,children:y.configs.map(function(r,t){var i=!!l[r.key]||void 0;return s(d,i?{}:{children:s(c,e(e({item:!0,xs:12},r.sizes),{},{className:r.className,children:n.renderFormFieldElement(o,r)}))},r.key.toString()+t)})})}),null==y?void 0:y.contentAfter,(null==i?void 0:i.contentAfter)&&(null==i?void 0:i.contentAfter),F.mapContext(function(o){return s(m,{data:a,onBlur:o.onBlur,messageErrors:o.messageErrors,before:null==i?void 0:i.actionBefore})})]})}))})}},{key:"componentWillUnmount",value:function(){var o;null===(o=this.abortController)||void 0===o||o.abort()}}])}();return E};export{y as default};
|
|
2
2
|
//# sourceMappingURL=create.form-grid-layout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"create.form-grid-layout.js","sources":["../../../src/form/create.form-grid-layout.tsx"],"sourcesContent":["import { Component, Fragment } from 'react'\r\nimport { BoxProps, Grid, RegularBreakpoints, SxProps, Theme } from '@mui/material'\r\nimport type { ComponentType } from 'react'\r\nimport { cleanObject } from '../utils'\r\nimport { mapGlobalModalContext } from '../api-context'\r\nimport { IFormBase, IFormBaseContext, IFormInputBase } from './types'\r\nimport { FormGridLayoutStyled, CreateFormBottomBar, formGridLayoutClasses } from './create.form-grid-layout.units'\r\nimport FormValidator, { IPartialError } from './validator'\r\nimport createFormBase, { IFormBaseSlots } from './create.form-base'\r\nimport createInput from './create.input'\r\n\r\nexport interface IFormGridLayoutConfig<T> {\r\n key: keyof T\r\n label?: string\r\n placeholder?: string\r\n sizes?: RegularBreakpoints\r\n defaultValue?: any\r\n className?: string\r\n inputElement?: ComponentType<IFormInputBase<T>>\r\n}\r\n\r\nexport type IPreSubmitEvent<T> = (value: Partial<T>, oldValue?: T) => Partial<T>\r\n\r\nexport interface IFormGridLayoutMergedConfigs<T> {\r\n hiddenFields?: Partial<Record<keyof T, boolean>> | ((state: Partial<T>, model?: Partial<T>) => Partial<Record<keyof T, boolean>>)\r\n disabledFields?: Partial<Record<keyof T, boolean>> | ((state: Partial<T>, model?: Partial<T>) => Partial<Record<keyof T, boolean>>)\r\n}\r\n\r\nexport interface IFormGridLayoutSlots<T> extends IFormGridLayoutMergedConfigs<T> {\r\n action?: ComponentType<IFormBase<T>>\r\n actionBefore?: JSX.Element\r\n contentBefore?: JSX.Element\r\n contentAfter?: JSX.Element\r\n // getDisabledFields?: (value: Partial<T>) => Partial<Record<keyof T, boolean>>\r\n closeState?: { Success?: boolean; Fail?: boolean }\r\n rootProps?: BoxProps\r\n preSubmit?: IPreSubmitEvent<T>\r\n formSlots?: IFormBaseSlots\r\n}\r\n\r\nexport interface IFormGridLayoutParams<T> extends IFormGridLayoutSlots<T> {\r\n configs: IFormGridLayoutConfig<T>[]\r\n validate: FormValidator<Partial<T>>\r\n autoHeight?: boolean\r\n}\r\n\r\nexport interface IFormGridLayoutProps<T> {\r\n data?: T\r\n onSubmit: (value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n onError?: (error: any) => void\r\n onSubmitError?: (error: IPartialError<T>) => void\r\n onClose?: () => void\r\n sx?: SxProps<Theme>\r\n slots?: IFormGridLayoutSlots<T>\r\n autoHeight?: boolean\r\n}\r\n\r\nexport interface IFormGridLayoutState {\r\n loadding?: boolean\r\n}\r\n\r\nconst CreateFormGridLayout = function <T>(params: IFormGridLayoutParams<T>): ComponentType<IFormGridLayoutProps<T>> {\r\n const FormBaseInstance = createFormBase<T>()\r\n const BottomBarInstance = CreateFormBottomBar<T>()\r\n const InputBaseInstance = createInput<T>({ maxLength: 250 })\r\n\r\n class FormGridLayout extends Component<IFormGridLayoutProps<T>, IFormGridLayoutState> {\r\n private abortController?: AbortController\r\n constructor(props: IFormGridLayoutProps<T>) {\r\n super(props)\r\n this.state = { loadding: false }\r\n }\r\n\r\n get configMerged() {\r\n const { slots = {} } = this.props\r\n return {\r\n hiddenFields: slots.hiddenFields ?? params.hiddenFields ?? (() => ({}) as Partial<Record<keyof T, boolean>>),\r\n disabledFields: slots.disabledFields ?? params.disabledFields ?? (() => ({}) as Partial<Record<keyof T, boolean>>)\r\n }\r\n }\r\n\r\n render() {\r\n const { slots, data, autoHeight } = this.props\r\n const BottomBar = params?.action ?? slots?.action ?? BottomBarInstance\r\n\r\n const rootClasses = [formGridLayoutClasses.root, slots?.rootProps?.className]\r\n if (autoHeight ?? params.autoHeight) rootClasses.push(formGridLayoutClasses.autoHeight)\r\n\r\n return mapGlobalModalContext(({ close }) => (\r\n <FormGridLayoutStyled {...slots?.rootProps} className={rootClasses.filter(Boolean).join(' ')}>\r\n <FormBaseInstance.Form\r\n className={formGridLayoutClasses.form}\r\n validate={params.validate}\r\n onSubmit={(v) => this.onSubmit(v, close)}\r\n slots={this.getFormSlots()}\r\n onError={this.props.onSubmitError}\r\n >\r\n {slots?.contentBefore && slots?.contentBefore}\r\n {params?.contentBefore}\r\n {FormBaseInstance.mapContext((context) => {\r\n const { hiddenFields } = this.configMerged\r\n const mState = context.modelState || {}\r\n const finalHiddenFields = typeof hiddenFields === 'function' ? hiddenFields(mState, data) : hiddenFields || {}\r\n return (\r\n <Grid container spacing={2}>\r\n {params.configs.map((config, index) => {\r\n const isHidden: boolean | undefined = finalHiddenFields[config.key] ? true : undefined\r\n if (isHidden) return <Fragment key={config.key.toString() + index} />\r\n return (\r\n <Fragment key={config.key.toString() + index}>\r\n <Grid item xs={12} {...config.sizes} className={config.className}>\r\n {this.renderFormFieldElement(context, config)}\r\n </Grid>\r\n </Fragment>\r\n )\r\n })}\r\n </Grid>\r\n )\r\n })}\r\n {params?.contentAfter}\r\n {slots?.contentAfter && slots?.contentAfter}\r\n {FormBaseInstance.mapContext((context) => (\r\n <BottomBar data={data} onBlur={context.onBlur} messageErrors={context.messageErrors} before={slots?.actionBefore} />\r\n ))}\r\n </FormBaseInstance.Form>\r\n </FormGridLayoutStyled>\r\n ))\r\n }\r\n\r\n renderFormFieldElement = (context: IFormBaseContext<T>, config: IFormGridLayoutConfig<T>) => {\r\n const { data } = this.props\r\n const ElementComponent = config.inputElement ?? InputBaseInstance\r\n const mState = context.modelState || {}\r\n const { disabledFields } = this.configMerged\r\n const finalDisabledFields = typeof disabledFields === 'function' ? disabledFields(mState, data) : disabledFields || {}\r\n const obj: IFormInputBase<T, any> = {\r\n data,\r\n onBlur: context.onBlur,\r\n messageErrors: context.messageErrors,\r\n name: config.key,\r\n label: config.label,\r\n placeholder: config.placeholder,\r\n disabled: finalDisabledFields[config.key] ? true : undefined,\r\n defaultValue: data?.[config.key] ?? config?.defaultValue,\r\n formContext: context\r\n }\r\n return <ElementComponent {...cleanObject(obj)} />\r\n }\r\n\r\n loading = () => this.setState({ loadding: true })\r\n\r\n unloading = () => this.setState({ loadding: false })\r\n\r\n componentWillUnmount(): void {\r\n this.abortController?.abort()\r\n }\r\n\r\n onSubmit = async (value: Partial<T>, close?: () => void) => {\r\n const { slots } = this.props\r\n const mapping = this.props.slots?.preSubmit ?? params.preSubmit ?? this.preSubmit\r\n const data = mapping(value, this.props.data)\r\n try {\r\n this.loading()\r\n this.abortController?.abort()\r\n this.abortController = new AbortController()\r\n await this.props.onSubmit(data, this.abortController?.signal)\r\n if (!slots?.closeState || slots.closeState.Success !== false) {\r\n close && close()\r\n this.props.onClose && this.props.onClose()\r\n }\r\n } catch (error) {\r\n if (slots?.closeState && slots.closeState.Fail === true) {\r\n close && close()\r\n this.props.onClose && this.props.onClose()\r\n }\r\n if (this.props.onError) this.props.onError(error)\r\n throw error\r\n } finally {\r\n this.unloading()\r\n }\r\n }\r\n\r\n preSubmit: IPreSubmitEvent<T> = (value) => value\r\n\r\n getFormSlots = (): IFormBaseSlots => {\r\n const isLoading = this.state.loadding\r\n const { formProps } = this.props.slots?.formSlots || {}\r\n return {\r\n formProps: {\r\n ...formProps,\r\n sx: {\r\n ...this.props.sx,\r\n opacity: isLoading ? 0.7 : 1,\r\n pointerEvents: isLoading ? 'none' : 'auto'\r\n }\r\n }\r\n }\r\n }\r\n }\r\n return FormGridLayout\r\n}\r\n\r\nexport default CreateFormGridLayout\r\n"],"names":["CreateFormGridLayout","params","FormBaseInstance","createFormBase","BottomBarInstance","CreateFormBottomBar","InputBaseInstance","createInput","maxLength","FormGridLayout","props","_this","_classCallCheck","_callSuper","_defineProperty","context","config","_config$inputElement","_data$config$key","data","ElementComponent","inputElement","mState","modelState","disabledFields","configMerged","finalDisabledFields","obj","onBlur","messageErrors","name","key","label","placeholder","disabled","undefined","defaultValue","formContext","_jsx","_objectSpread","cleanObject","setState","loadding","_ref","_asyncToGenerator","_regenerator","m","_callee","value","close","_ref2","_this$props$slots$pre","_this$props$slots","slots","mapping","_this$abortController","_this$abortController2","_t","w","_context","p","n","preSubmit","loading","abortController","abort","AbortController","onSubmit","signal","closeState","Success","onClose","v","Fail","onError","unloading","f","a","_x","_x2","apply","this","arguments","_this$props$slots2","isLoading","state","formProps","formSlots","sx","opacity","pointerEvents","_inherits","Component","_createClass","get","_ref4","_slots$hiddenFields","_ref5","_slots$disabledFields","_this$props$slots3","hiddenFields","_ref6","_params$action","_slots$rootProps","_this2","_this$props","autoHeight","BottomBar","action","rootClasses","formGridLayoutClasses","root","rootProps","className","push","mapGlobalModalContext","_ref7","FormGridLayoutStyled","filter","Boolean","join","children","_jsxs","Form","form","validate","getFormSlots","onSubmitError","contentBefore","mapContext","finalHiddenFields","Grid","container","spacing","configs","map","index","isHidden","Fragment","item","xs","sizes","renderFormFieldElement","toString","contentAfter","before","actionBefore","_this$abortController3"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"create.form-grid-layout.js","sources":["../../../src/form/create.form-grid-layout.tsx"],"sourcesContent":["import { Component, Fragment } from 'react'\r\nimport { BoxProps, Grid, RegularBreakpoints, SxProps, Theme } from '@mui/material'\r\nimport type { ComponentType } from 'react'\r\nimport { cleanObject } from '../utils'\r\nimport { mapGlobalModalContext } from '../api-context'\r\nimport { IFormBase, IFormBaseContext, IFormInputBase } from './types'\r\nimport { FormGridLayoutStyled, CreateFormBottomBar, formGridLayoutClasses } from './create.form-grid-layout.units'\r\nimport FormValidator, { IPartialError } from './validator'\r\nimport createFormBase, { IFormBaseSlots } from './create.form-base'\r\nimport createInput from './create.input'\r\n\r\nexport interface IFormGridLayoutConfig<T> {\r\n key: keyof T\r\n label?: string\r\n placeholder?: string\r\n sizes?: RegularBreakpoints\r\n defaultValue?: any\r\n className?: string\r\n inputElement?: ComponentType<IFormInputBase<T>>\r\n}\r\n\r\nexport type IPreSubmitEvent<T> = (value: Partial<T>, oldValue?: T) => Partial<T>\r\n\r\nexport interface IFormGridLayoutMergedConfigs<T> {\r\n hiddenFields?: Partial<Record<keyof T, boolean>> | ((state: Partial<T>, model?: Partial<T>) => Partial<Record<keyof T, boolean>>)\r\n disabledFields?: Partial<Record<keyof T, boolean>> | ((state: Partial<T>, model?: Partial<T>) => Partial<Record<keyof T, boolean>>)\r\n}\r\n\r\nexport interface IFormGridLayoutSlots<T> extends IFormGridLayoutMergedConfigs<T> {\r\n action?: ComponentType<IFormBase<T>>\r\n actionBefore?: JSX.Element\r\n contentBefore?: JSX.Element\r\n contentAfter?: JSX.Element\r\n // getDisabledFields?: (value: Partial<T>) => Partial<Record<keyof T, boolean>>\r\n closeState?: { Success?: boolean; Fail?: boolean }\r\n rootProps?: BoxProps\r\n preSubmit?: IPreSubmitEvent<T>\r\n formSlots?: IFormBaseSlots\r\n}\r\n\r\nexport interface IFormGridLayoutParams<T> extends IFormGridLayoutSlots<T> {\r\n configs: IFormGridLayoutConfig<T>[]\r\n validate: FormValidator<Partial<T>>\r\n autoHeight?: boolean\r\n}\r\n\r\nexport interface IFormGridLayoutProps<T> {\r\n data?: T\r\n onSubmit: (value: Partial<T>, signal?: AbortSignal) => Promise<void>\r\n onError?: (error: any) => void\r\n onSubmitError?: (error: IPartialError<T>) => void\r\n onClose?: () => void\r\n sx?: SxProps<Theme>\r\n slots?: IFormGridLayoutSlots<T>\r\n autoHeight?: boolean\r\n}\r\n\r\nexport interface IFormGridLayoutState {\r\n loadding?: boolean\r\n}\r\n\r\nconst CreateFormGridLayout = function <T>(params: IFormGridLayoutParams<T>): ComponentType<IFormGridLayoutProps<T>> {\r\n const FormBaseInstance = createFormBase<T>()\r\n const BottomBarInstance = CreateFormBottomBar<T>()\r\n const InputBaseInstance = createInput<T>({ maxLength: 250 })\r\n\r\n class FormGridLayout extends Component<IFormGridLayoutProps<T>, IFormGridLayoutState> {\r\n private abortController?: AbortController\r\n constructor(props: IFormGridLayoutProps<T>) {\r\n super(props)\r\n this.state = { loadding: false }\r\n }\r\n\r\n get configMerged() {\r\n const { slots = {} } = this.props\r\n return {\r\n hiddenFields: slots.hiddenFields ?? params.hiddenFields ?? (() => ({}) as Partial<Record<keyof T, boolean>>),\r\n disabledFields: slots.disabledFields ?? params.disabledFields ?? (() => ({}) as Partial<Record<keyof T, boolean>>)\r\n }\r\n }\r\n\r\n render() {\r\n const { slots, data, autoHeight } = this.props\r\n const BottomBar = params?.action ?? slots?.action ?? BottomBarInstance\r\n\r\n const rootClasses = [formGridLayoutClasses.root, slots?.rootProps?.className]\r\n if (autoHeight ?? params.autoHeight) rootClasses.push(formGridLayoutClasses.autoHeight)\r\n\r\n return mapGlobalModalContext(({ close }) => (\r\n <FormGridLayoutStyled {...slots?.rootProps} className={rootClasses.filter(Boolean).join(' ')}>\r\n <FormBaseInstance.Form\r\n className={formGridLayoutClasses.form}\r\n validate={params.validate}\r\n onSubmit={(v) => this.onSubmit(v, close)}\r\n slots={this.getFormSlots()}\r\n onError={this.props.onSubmitError}\r\n >\r\n {slots?.contentBefore && slots?.contentBefore}\r\n {params?.contentBefore}\r\n {FormBaseInstance.mapContext((context) => {\r\n const { hiddenFields } = this.configMerged\r\n const mState = context.modelState || {}\r\n const finalHiddenFields = typeof hiddenFields === 'function' ? hiddenFields(mState, data) : hiddenFields || {}\r\n return (\r\n <Grid container spacing={2}>\r\n {params.configs.map((config, index) => {\r\n const isHidden: boolean | undefined = finalHiddenFields[config.key] ? true : undefined\r\n if (isHidden) return <Fragment key={config.key.toString() + index} />\r\n return (\r\n <Fragment key={config.key.toString() + index}>\r\n <Grid item xs={12} {...config.sizes} className={config.className}>\r\n {this.renderFormFieldElement(context, config)}\r\n </Grid>\r\n </Fragment>\r\n )\r\n })}\r\n </Grid>\r\n )\r\n })}\r\n {params?.contentAfter}\r\n {slots?.contentAfter && slots?.contentAfter}\r\n {FormBaseInstance.mapContext((context) => (\r\n <BottomBar data={data} onBlur={context.onBlur} messageErrors={context.messageErrors} before={slots?.actionBefore} />\r\n ))}\r\n </FormBaseInstance.Form>\r\n </FormGridLayoutStyled>\r\n ))\r\n }\r\n\r\n renderFormFieldElement = (context: IFormBaseContext<T>, config: IFormGridLayoutConfig<T>) => {\r\n const { data } = this.props\r\n const ElementComponent = config.inputElement ?? InputBaseInstance\r\n const mState = context.modelState || {}\r\n const { disabledFields } = this.configMerged\r\n const finalDisabledFields = typeof disabledFields === 'function' ? disabledFields(mState, data) : disabledFields || {}\r\n const obj: IFormInputBase<T, any> = {\r\n data,\r\n onBlur: context.onBlur,\r\n messageErrors: context.messageErrors,\r\n name: config.key,\r\n label: config.label,\r\n placeholder: config.placeholder,\r\n disabled: finalDisabledFields[config.key] ? true : undefined,\r\n defaultValue: data?.[config.key] ?? config?.defaultValue,\r\n formContext: context\r\n }\r\n return <ElementComponent {...cleanObject(obj)} />\r\n }\r\n\r\n loading = () => this.setState({ loadding: true })\r\n\r\n unloading = () => this.setState({ loadding: false })\r\n\r\n componentWillUnmount(): void {\r\n this.abortController?.abort()\r\n }\r\n\r\n onSubmit = async (value: Partial<T>, close?: () => void) => {\r\n const { slots } = this.props\r\n const mapping = this.props.slots?.preSubmit ?? params.preSubmit ?? this.preSubmit\r\n const data = mapping(value, this.props.data)\r\n try {\r\n this.loading()\r\n this.abortController?.abort()\r\n this.abortController = new AbortController()\r\n await this.props.onSubmit(data, this.abortController?.signal)\r\n if (!slots?.closeState || slots.closeState.Success !== false) {\r\n close && close()\r\n this.props.onClose && this.props.onClose()\r\n }\r\n } catch (error) {\r\n if (slots?.closeState && slots.closeState.Fail === true) {\r\n close && close()\r\n this.props.onClose && this.props.onClose()\r\n }\r\n if (this.props.onError) this.props.onError(error)\r\n throw error\r\n } finally {\r\n this.unloading()\r\n }\r\n }\r\n\r\n preSubmit: IPreSubmitEvent<T> = (value) => value\r\n\r\n getFormSlots = (): IFormBaseSlots => {\r\n const isLoading = this.state.loadding\r\n const { formProps } = this.props.slots?.formSlots || {}\r\n return {\r\n formProps: {\r\n ...formProps,\r\n sx: {\r\n ...this.props.sx,\r\n opacity: isLoading ? 0.7 : 1,\r\n pointerEvents: isLoading ? 'none' : 'auto'\r\n }\r\n }\r\n }\r\n }\r\n }\r\n return FormGridLayout\r\n}\r\n\r\nexport default CreateFormGridLayout\r\n"],"names":["CreateFormGridLayout","params","FormBaseInstance","createFormBase","BottomBarInstance","CreateFormBottomBar","InputBaseInstance","createInput","maxLength","FormGridLayout","props","_this","_classCallCheck","_callSuper","_defineProperty","context","config","_config$inputElement","_data$config$key","data","ElementComponent","inputElement","mState","modelState","disabledFields","configMerged","finalDisabledFields","obj","onBlur","messageErrors","name","key","label","placeholder","disabled","undefined","defaultValue","formContext","_jsx","_objectSpread","cleanObject","setState","loadding","_ref","_asyncToGenerator","_regenerator","m","_callee","value","close","_ref2","_this$props$slots$pre","_this$props$slots","slots","mapping","_this$abortController","_this$abortController2","_t","w","_context","p","n","preSubmit","loading","abortController","abort","AbortController","onSubmit","signal","closeState","Success","onClose","v","Fail","onError","unloading","f","a","_x","_x2","apply","this","arguments","_this$props$slots2","isLoading","state","formProps","formSlots","sx","opacity","pointerEvents","_inherits","Component","_createClass","get","_ref4","_slots$hiddenFields","_ref5","_slots$disabledFields","_this$props$slots3","hiddenFields","_ref6","_params$action","_slots$rootProps","_this2","_this$props","autoHeight","BottomBar","action","rootClasses","formGridLayoutClasses","root","rootProps","className","push","mapGlobalModalContext","_ref7","FormGridLayoutStyled","filter","Boolean","join","children","_jsxs","Form","form","validate","getFormSlots","onSubmitError","contentBefore","mapContext","finalHiddenFields","Grid","container","spacing","configs","map","index","isHidden","Fragment","item","xs","sizes","renderFormFieldElement","toString","contentAfter","before","actionBefore","_this$abortController3"],"mappings":"8sBA6DA,IAAMA,EAAuB,SAAaC,GACxC,IAAMC,EAAmBC,IACnBC,EAAoBC,IACpBC,EAAoBC,EAAe,CAAEC,UAAW,MAEhDC,aAEJ,SAAAA,EAAYC,GAA8B,IAAAC,EAER,OAFQC,OAAAH,GACxCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAAA,yBA4DW,SAACI,EAA8BC,GAAoC,IAAAC,EAAAC,EAClFC,EAASR,EAAKD,MAAdS,KACFC,EAAsC,QAAtBH,EAAGD,EAAOK,oBAAY,IAAAJ,EAAAA,EAAIX,EAC1CgB,EAASP,EAAQQ,YAAc,CAAE,EAC/BC,EAAmBb,EAAKc,aAAxBD,eACFE,EAAgD,mBAAnBF,EAAgCA,EAAeF,EAAQH,GAAQK,GAAkB,CAAE,EAChHG,EAA8B,CAClCR,KAAAA,EACAS,OAAQb,EAAQa,OAChBC,cAAed,EAAQc,cACvBC,KAAMd,EAAOe,IACbC,MAAOhB,EAAOgB,MACdC,YAAajB,EAAOiB,YACpBC,WAAUR,EAAoBV,EAAOe,WAAcI,EACnDC,aAAgClB,QAApBA,EAAEC,aAAAA,EAAAA,EAAOH,EAAOe,YAAIb,IAAAA,EAAAA,EAAIF,aAAM,EAANA,EAAQoB,aAC5CC,YAAatB,GAEf,OAAOuB,EAAClB,EAAgBmB,EAAKC,CAAAA,EAAAA,EAAYb,OAC1Cb,EAAAH,EAES,UAAA,WAAA,OAAMA,EAAK8B,SAAS,CAAEC,UAAU,GAAO,GAAA5B,EAAAH,EAErC,YAAA,WAAA,OAAMA,EAAK8B,SAAS,CAAEC,UAAU,GAAQ,GAAA5B,EAAAH,EAAA,WAAA,WAAA,IAAAgC,EAAAC,EAAAC,IAAAC,EAMzC,SAAAC,EAAOC,EAAmBC,GAAkB,IAAAC,EAAAC,EAAAC,EAAAC,EAAAC,EAAAnC,EAAAoC,EAAAC,EAAAC,EAAA,OAAAZ,IAAAa,EAAA,SAAAC,GAAA,cAAAA,EAAAC,EAAAD,EAAAE,GAAA,KAAA,EAOP,OANtCR,EAAU1C,EAAKD,MAAf2C,MACFC,EAAyD,QAAlDJ,EAA8BC,QAA9BA,EAAmB,QAAnBC,EAAGzC,EAAKD,MAAM2C,aAAXD,IAAgBA,OAAhBA,EAAAA,EAAkBU,iBAASX,IAAAA,EAAAA,EAAIlD,EAAO6D,iBAASZ,IAAAA,EAAAA,EAAIvC,EAAKmD,UAClE3C,EAAOmC,EAAQN,EAAOrC,EAAKD,MAAMS,MAAKwC,EAAAC,EAAA,EAE1CjD,EAAKoD,UACe,QAApBR,EAAA5C,EAAKqD,uBAAe,IAAAT,GAApBA,EAAsBU,QACtBtD,EAAKqD,gBAAkB,IAAIE,gBAAiBP,EAAAE,EAAA,EACtClD,EAAKD,MAAMyD,SAAShD,EAA0BqC,QAAtBA,EAAE7C,EAAKqD,2BAAeR,SAApBA,EAAsBY,QAAO,KAAA,EACxDf,SAAAA,EAAOgB,aAA2C,IAA7BhB,EAAMgB,WAAWC,UACzCrB,GAASA,IACTtC,EAAKD,MAAM6D,SAAW5D,EAAKD,MAAM6D,WAClCZ,EAAAE,EAAA,EAAA,MAAA,KAAA,EAMgD,MANhDF,EAAAC,EAAA,EAAAH,EAAAE,EAAAa,EAEGnB,SAAAA,EAAOgB,aAAwC,IAA1BhB,EAAMgB,WAAWI,OACxCxB,GAASA,IACTtC,EAAKD,MAAM6D,SAAW5D,EAAKD,MAAM6D,WAE/B5D,EAAKD,MAAMgE,SAAS/D,EAAKD,MAAMgE,QAAOjB,GAAOA,EAAA,KAAA,EAGjC,OAHiCE,EAAAC,EAAA,EAGjDjD,EAAKgE,YAAWhB,EAAAiB,EAAA,GAAA,KAAA,EAAA,OAAAjB,EAAAkB,EAAA,GAAA,EAAA9B,EAAA,KAAA,CAAA,CAAA,EAAA,EAAA,EAAA,QAEnB,OAAA+B,SAAAA,EAAAC,GAAA,OAAApC,EAAAqC,MAAAC,KAAAC,UAAA,CAAA,CA7BmD,IA6BnDpE,EAAAH,EAE+B,YAAA,SAACqC,GAAK,OAAKA,CAAK,GAAAlC,EAAAH,EAAA,eAEjC,WAAqB,IAAAwE,EAC5BC,EAAYzE,EAAK0E,MAAM3C,SACrB4C,IAA8B,QAAhBH,EAAAxE,EAAKD,MAAM2C,aAAX8B,IAAgBA,OAAhBA,EAAAA,EAAkBI,YAAa,CAAE,GAA/CD,UACR,MAAO,CACLA,UAAS/C,EAAAA,KACJ+C,GAAS,CAAA,EAAA,CACZE,GAAEjD,EAAAA,KACG5B,EAAKD,MAAM8E,IAAE,GAAA,CAChBC,QAASL,EAAY,GAAM,EAC3BM,cAAeN,EAAY,OAAS,cA3H1CzE,EAAK0E,MAAQ,CAAE3C,UAAU,GAAO/B,CAClC,CAAC,OAAAgF,EAAAlF,EAL0BmF,GAK1BC,EAAApF,EAAA,CAAA,CAAAsB,IAAA,eAAA+D,IAED,WAAgB,IAAAC,EAAAC,EAAAC,EAAAC,EACdC,EAAuBlB,KAAKvE,MAApB2C,MAAAA,OAAK,IAAA8C,EAAG,CAAA,EAAEA,EAClB,MAAO,CACLC,qBAAYL,EAAoBC,QAApBA,EAAE3C,EAAM+C,wBAAYJ,EAAAA,EAAI/F,EAAOmG,oBAAY,IAAAL,EAAAA,EAAK,WAAA,MAAO,CAAE,CAAuC,EAC5GvE,uBAAcyE,EAAsBC,QAAtBA,EAAE7C,EAAM7B,0BAAc0E,EAAAA,EAAIjG,EAAOuB,sBAAc,IAAAyE,EAAAA,EAAK,WAAA,MAAO,CAAE,CAAA,EAE/E,GAAC,CAAAlE,IAAA,SAAAiB,MAED,WAAM,IAAAqD,EAAAC,EAAAC,EAAAC,EAAAvB,KACJwB,EAAoCxB,KAAKvE,MAAjC2C,EAAKoD,EAALpD,MAAOlC,EAAIsF,EAAJtF,KAAMuF,EAAUD,EAAVC,WACfC,EAA2CN,QAAlCA,EAAiBC,QAAjBA,EAAGrG,aAAM,EAANA,EAAQ2G,cAAMN,IAAAA,EAAAA,EAAIjD,aAAAA,EAAAA,EAAOuD,cAAMP,IAAAA,EAAAA,EAAIjG,EAE/CyG,EAAc,CAACC,EAAsBC,KAAM1D,SAAgB,QAAXkD,EAALlD,EAAO2D,iBAAPT,IAAgBA,OAAhBA,EAAAA,EAAkBU,WAGnE,OAFIP,QAAAA,EAAczG,EAAOyG,aAAYG,EAAYK,KAAKJ,EAAsBJ,YAErES,EAAsB,SAAAC,GAAA,IAAGnE,EAAKmE,EAALnE,MAAK,OACnCX,EAAC+E,EAAoB9E,EAAAA,EAAKc,CAAAA,EAAAA,aAAAA,EAAAA,EAAO2D,WAAS,CAAA,EAAA,CAAEC,UAAWJ,EAAYS,OAAOC,SAASC,KAAK,KACtFC,SAAAC,EAACxH,EAAiByH,KAAI,CACpBV,UAAWH,EAAsBc,KACjCC,SAAU5H,EAAO4H,SACjB1D,SAAU,SAACK,GAAC,OAAKgC,EAAKrC,SAASK,EAAGvB,EAAM,EACxCI,MAAOmD,EAAKsB,eACZpD,QAAS8B,EAAK9F,MAAMqH,cAEnBN,SAAA,EAAApE,aAAK,EAALA,EAAO2E,iBAAiB3E,aAAAA,EAAAA,EAAO2E,eAC/B/H,eAAAA,EAAQ+H,cACR9H,EAAiB+H,WAAW,SAAClH,GAC5B,IAAQqF,EAAiBI,EAAK/E,aAAtB2E,aACF9E,EAASP,EAAQQ,YAAc,CAAE,EACjC2G,EAA4C,mBAAjB9B,EAA8BA,EAAa9E,EAAQH,GAAQiF,GAAgB,CAAE,EAC9G,OACE9D,EAAC6F,EAAI,CAACC,WAAU,EAAAC,QAAS,EAACZ,SACvBxH,EAAOqI,QAAQC,IAAI,SAACvH,EAAQwH,GAC3B,IAAMC,IAAgCP,EAAkBlH,EAAOe,WAAcI,EAC7E,OAAqBG,EAACoG,EAAlBD,EAAgC,CAAA,YAGhCnG,EAAC6F,EAAI5F,EAAAA,EAAA,CAACoG,MAAI,EAACC,GAAI,IAAQ5H,EAAO6H,OAAK,GAAA,CAAE5B,UAAWjG,EAAOiG,UACpDQ,SAAAjB,EAAKsC,uBAAuB/H,EAASC,OAJRA,EAAOe,IAAIgH,WAAaP,EAQ7D,IAGN,GACAvI,aAAAA,EAAAA,EAAQ+I,cACR3F,aAAAA,EAAAA,EAAO2F,gBAAgB3F,eAAAA,EAAO2F,cAC9B9I,EAAiB+H,WAAW,SAAClH,GAAO,OACnCuB,EAACqE,EAAS,CAACxF,KAAMA,EAAMS,OAAQb,EAAQa,OAAQC,cAAed,EAAQc,cAAeoH,OAAQ5F,aAAK,EAALA,EAAO6F,cAAgB,QAGnG,EAE3B,GAAC,CAAAnH,IAAA,uBAAAiB,MA0BD,WAAoB,IAAAmG,EACE,QAApBA,EAAIlE,KAACjB,uBAAe,IAAAmF,GAApBA,EAAsBlF,OACxB,IAAC,IA4CH,OAAOxD,CACT"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as o,classCallCheck as r,callSuper as i,objectWithoutProperties as l,asyncToGenerator as a,regenerator as s}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as u,jsx as p}from"react/jsx-runtime";import{Component as d}from"react";import{styled as c,Box as f,Autocomplete as v,TextField as h}from"@mui/material";import{getErrorMessage as m}from"./helpers.js";import{
|
|
1
|
+
import{defineProperty as t,inherits as e,createClass as n,objectSpread2 as o,classCallCheck as r,callSuper as i,objectWithoutProperties as l,asyncToGenerator as a,regenerator as s}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as u,jsx as p}from"react/jsx-runtime";import{Component as d}from"react";import{styled as c,Box as f,Autocomplete as v,TextField as h}from"@mui/material";import{getErrorMessage as m}from"./helpers.js";import{RichTooltip as g,HelpOutlinePulseIcon as S}from"../components/rich-tooltip.js";import{ApiAlertContext as I}from"../api-context/alert-global.js";var C=["key"];function x(c){var f=function(){function f(e){var n,u,d;return r(this,f),u=i(this,f,[e]),t(u,"abortController",{signalController:new AbortController}),t(u,"refInput",null),t(u,"existedIds",[]),t(u,"renderTooltip",function(){var t=u.props.tooltip||(null==c?void 0:c.tooltip);return t?p("div",{className:b.tooltipWrap,children:p(g,{panel:t,children:p(S,{fontSize:"small"})})}):null}),t(u,"getRootClasses",function(){var t=[b.root];return(u.props.tooltip||(null==c?void 0:c.tooltip))&&t.push(b.tooltip),t.join(" ")}),t(u,"getFetchDataFunc",function(){var t,e;return null!==(t=null!==(e=u.props.fetchData)&&void 0!==e?e:null==c?void 0:c.fetchData)&&void 0!==t?t:function(){return Promise.resolve([])}}),t(u,"getWrappedRenderOption",function(){var t,e,n=null!==(t=null===(e=u.props.slots)||void 0===e?void 0:e.renderOption)&&void 0!==t?t:null==c?void 0:c.renderOption;if(n)return function(t,e,r){var i=t.key,a=l(t,C);return p("li",o(o({},a),{},{style:o({width:"100%",boxSizing:"border-box"},a.style),children:n(a,e,r)}),i)}}),t(u,"timer",{_timer:0,_second:500,callback:(d=a(s().m(function t(e){var n,o,r;return s().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,u.abortController.signalController=new AbortController,t.n=1,u.getFetchDataFunc()(e,u.abortController.signalController.signal);case 1:n=t.v,o=u.getOptionsFilter(n,u.existedIds),u.setState({options:o}),t.n=3;break;case 2:t.p=2,t.v,null===(r=I.ApiAlert)||void 0===r||r.PushError("Error from server!");case 3:return t.p=3,u.setState({statusText:"no items"}),t.f(3);case 4:return t.a(2)}},t,null,[[0,2,3,4]])})),function(t){return d.apply(this,arguments)}),start:function(t){u.timer.clear(),u.timer._timer=window.setTimeout(function(){return u.timer.callback(t)},u.timer._second)},clear:function(){u.abortController.signalController.abort(),clearTimeout(u.timer._timer)}}),t(u,"fetchData",a(s().m(function t(){var e,n,o,r,i,l;return s().w(function(t){for(;;)switch(t.p=t.n){case 0:return t.p=0,n=u.getDefaultValue(),t.n=1,u.getFetchDataFunc()(n,u.abortController.signalController.signal);case 1:if(o=t.v,Array.isArray(o)){t.n=2;break}return t.a(2);case 2:return r=u.getOptionsFilter(o,u.existedIds),i=null!==(e=r.find(function(t){return t.Id===n}))&&void 0!==e?e:null,u.setState({options:r,optionSelected:i,loading:!1}),t.a(2);case 3:t.p=3,t.v,null===(l=I.ApiAlert)||void 0===l||l.PushError("Error from server!");case 4:return t.p=4,u.setState({statusText:"no items",loading:!1}),t.f(4);case 5:return t.a(2)}},t,null,[[0,3,4,5]])}))),t(u,"handleChange",function(t,e){var n;u.setState({optionSelected:e}),u.refInput&&(u.refInput.value=null!==(n=null==e?void 0:e.Id)&&void 0!==n?n:""),u.props.onChange&&u.props.onChange(e)}),t(u,"handleInputChange",function(t,e){var n,o={inputValue:e};if(e!==(null===(n=u.state.optionSelected)||void 0===n?void 0:n.Name)){var r=e.trim().toLowerCase(),i=u.state.options.findIndex(function(t){var e;return null===(e=t.Name)||void 0===e?void 0:e.trim().toLowerCase().includes(r)});(i<0||""===r)&&(o.statusText="loading..."),u.setState(o,function(){(i<0||""===r)&&u.timer.start(r)})}else u.setState(o)}),t(u,"fillterOptions",function(t,e){return t.filter(function(t){var n,o=e.inputValue.toLowerCase();return t.Id.toLowerCase().includes(o)||(null===(n=t.Name)||void 0===n?void 0:n.toLowerCase().includes(o))})}),t(u,"getLabel",function(){var t,e;return null!==(t=u.props.label)&&void 0!==t?t:null===(e=u.props.name)||void 0===e?void 0:e.toString()}),t(u,"getDefaultValue",function(){var t,e,n;if(u.props.name)return null===(t=null!==(e=u.props.defaultValue)&&void 0!==e?e:null===(n=u.props.data)||void 0===n?void 0:n[u.props.name])||void 0===t?void 0:t.toString()}),t(u,"clear",function(){u.setState({optionSelected:null,inputValue:""}),u.refInput&&(u.refInput.value="")}),u.state={options:[],statusText:"no items",optionSelected:null,inputValue:"",loading:!0},u.existedIds=null!==(n=e.existedIds)&&void 0!==n?n:[],u}return e(f,d),n(f,[{key:"componentDidMount",value:function(){this.fetchData()}},{key:"componentWillUnmount",value:function(){this.timer.clear()}},{key:"componentDidUpdate",value:function(t){var e;JSON.stringify(t.existedIds)!==JSON.stringify(this.props.existedIds)&&(this.existedIds=null!==(e=this.props.existedIds)&&void 0!==e?e:[])}},{key:"render",value:function(){var t,e,n,r,i=this,l=this.getDefaultValue(),a=m(this.props.messageErrors,this.props.name),s=this.getWrappedRenderOption();return u(y,{className:this.getRootClasses(),children:[p(v,{disabled:this.state.loading||this.props.disabled,fullWidth:!0,noOptionsText:this.state.statusText,options:this.state.options,getOptionLabel:function(t){var e;return null!==(e=t.Name)&&void 0!==e?e:t.Id},getOptionKey:function(t){return JSON.stringify(t)},isOptionEqualToValue:function(t,e){return t.Id.toString()===e.Id.toString()&&t.Name===e.Name},filterOptions:this.fillterOptions,renderOption:s,value:this.state.optionSelected,onChange:this.handleChange,inputValue:this.state.inputValue,onInputChange:this.handleInputChange,renderInput:function(t){var e;return p(h,o(o({},t),{},{label:i.getLabel(),error:a.error,helperText:a.message,onBlur:function(){i.props.name&&i.props.onBlur&&i.props.onBlur(i.props.name)}},null===(e=i.props.slots)||void 0===e?void 0:e.textFieldProps))}}),p("input",{ref:function(t){return i.refInput=t},hidden:!0,name:null===(t=this.props.name)||void 0===t?void 0:t.toString(),defaultValue:l}),(null===(e=this.state.optionSelected)||void 0===e?void 0:e.Other)&&p("input",{hidden:!0,name:"".concat(null===(n=this.props.name)||void 0===n?void 0:n.toString(),"Other"),defaultValue:JSON.stringify(this.state.optionSelected.Other)},null!==(r=this.state.optionSelected.Id)&&void 0!==r?r:"key"),this.renderTooltip()]})}},{key:"getOptionsFilter",value:function(t){var e=new Set(arguments.length>1&&void 0!==arguments[1]?arguments[1]:[]);return t.reduce(function(t,n){return e.has(n.Id)||(t.push(n),e.add(n.Id)),t},[])}}])}();return f}var b={root:"SelectWithApi-root",tooltip:"SelectWithApi-tooltip",tooltipWrap:"SelectWithApi-tooltipWrap"},O=function(t,e){return"".concat((null==e?void 0:e.prefix)||"",".").concat(b[t]).concat((null==e?void 0:e.suffix)||"")},y=c(f)(function(e){var n=e.theme;return t(t(t({},O("root",{suffix:"&"}),{width:"100%",position:"relative"}),O("tooltipWrap"),{position:"absolute",top:n.spacing(2.25),right:n.spacing(1.5),display:"flex",alignItems:"center",gap:n.spacing(.5)}),O("tooltip",{suffix:"&"}),{".MuiInputBase-root .MuiAutocomplete-endAdornment":{right:n.spacing(4.5)}})});export{x as default};
|
|
2
2
|
//# sourceMappingURL=create.select-with-api.js.map
|