dinocollab-core 2.1.11 → 2.1.12

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.
@@ -1,2 +1,2 @@
1
- import{objectSpread2 as e,inherits as r,createClass as n,classCallCheck as t,callSuper as o,defineProperty as i,asyncToGenerator as a,regenerator as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as d,Typography as g,Box as f,TextField as m}from"@mui/material";import c from"@mui/icons-material/Download";import{getErrorMessage as h}from"./helpers.js";import{tryParseCsvFileToArray as v}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";function C(d){var C=function(){function C(r){var n;return t(this,C),n=o(this,C,[r]),i(n,"mergeConfigsCache",{name:"",onBlur:function(){},messageErrors:{}}),i(n,"refInput",null),i(n,"refTextFiled",null),i(n,"getTextFieldProps",(function(){var r=n.props.label,t=h(n.mergeConfigs.messageErrors,n.mergeConfigs.name);return e({label:r,error:t.error,helperText:t.message,type:"file",variant:"outlined",fullWidth:!0,onChange:n.handleChange,inputProps:{accept:"text/csv"},InputLabelProps:{shrink:n.mergeConfigs.labelShrink}},n.mergeConfigs.textFieldProps)})),i(n,"upgradeMergeConfigs",(function(e){var r,n,t,o,i,a,l,s,u=e.name,p=e.label,g=e.onBlur,f=e.messageErrors;return{textFieldProps:Object.assign({},null==d?void 0:d.textFieldProps,null===(r=e.slots)||void 0===r?void 0:r.textFieldProps),wrapProps:Object.assign({},null==d?void 0:d.wrapProps,null===(n=e.slots)||void 0===n?void 0:n.wrapProps),name:u,onBlur:g||function(){},messageErrors:f||{},downloadSampleUrl:null!==(t=null===(o=e.slots)||void 0===o?void 0:o.downloadSampleUrl)&&void 0!==t?t:null==d?void 0:d.downloadSampleUrl,instructionalText:null!==(i=null===(a=e.slots)||void 0===a?void 0:a.instructionalText)&&void 0!==i?i:null==d?void 0:d.instructionalText,labelShrink:!1!==(null!==(l=null===(s=e.slots)||void 0===s?void 0:s.labelShrink)&&void 0!==l?l:null==d?void 0:d.labelShrink)&&!!p}})),i(n,"handleChange",function(){var e=a(l().m((function e(r){var t,o,i,a;return l().w((function(e){for(;;)switch(e.n){case 0:if(o=null===(t=r.target.files)||void 0===t?void 0:t[0]){e.n=1;break}return e.a(2);case 1:return e.p=1,e.n=2,v(o);case 2:i=e.v,n.refInput&&(n.refInput.value=JSON.stringify(i)),n.setState({parsedData:i},(function(){n.props.onChange&&n.props.onChange(i),n.mergeConfigs.onBlur(n.mergeConfigs.name)})),e.n=4;break;case 3:e.p=3,a=e.v,console.error("Error parsing CSV:",a),n.mergeConfigs.onBlur(n.mergeConfigs.name);case 4:return e.a(2)}}),e,null,[[1,3]])})));return function(r){return e.apply(this,arguments)}}()),n.mergeConfigsCache=n.upgradeMergeConfigs(r),n.state={parsedData:[]},n}return r(C,p),n(C,[{key:"mergeConfigs",get:function(){return this.mergeConfigsCache}},{key:"inputValue",get:function(){return this.state.parsedData.length>0?JSON.stringify(this.state.parsedData):""}},{key:"shouldComponentUpdate",value:function(e){return e!==this.props&&(this.mergeConfigsCache=this.upgradeMergeConfigs(e)),!0}},{key:"render",value:function(){var r,n,t=this;return u(f,e(e({},this.mergeConfigs.wrapProps),{},{children:[this.mergeConfigs.downloadSampleUrl&&u(f,{sx:{display:"flex",alignItems:"center",mb:"10px"},children:[s(g,{variant:"subtitle2",component:"span",children:null!==(r=this.mergeConfigs.instructionalText)&&void 0!==r?r:"Metadata file, please fill out the form we provide."}),u(x,{href:this.mergeConfigs.downloadSampleUrl,children:[s("span",{children:" Download sample"}),s(c,{fontSize:"small"})]})]}),s("input",{hidden:!0,name:null===(n=this.props.name)||void 0===n?void 0:n.toString(),type:"text",ref:function(e){return t.refInput=e},defaultValue:""}),s(m,e(e({},this.getTextFieldProps()),{},{inputRef:function(e){return t.refTextFiled=e}}))]}))}}])}();return C}var x=d((function(r){return s(g,e({variant:"subtitle2",component:"a",target:"_blank",download:!0},r))}))({display:"flex",alignItems:"center",color:"var(--color-blue)",cursor:"pointer",fontWeight:600,marginLeft:"6px",gap:"4px","&:hover":{textDecoration:"underline"}});export{C as createInputFileCsvLocalParser};
1
+ import{objectSpread2 as e,inherits as r,createClass as n,classCallCheck as t,callSuper as o,defineProperty as i,asyncToGenerator as a,regenerator as l}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsx as s,jsxs as u}from"react/jsx-runtime";import{Component as p}from"react";import{styled as d,Typography as g,Box as f,TextField as m}from"@mui/material";import c from"@mui/icons-material/Download";import{getErrorMessage as h}from"./helpers.js";import{tryParseCsvFileToArray as v}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";function C(d){var C=function(){function C(r){var n;return t(this,C),n=o(this,C,[r]),i(n,"mergeConfigsCache",{name:"",onBlur:function(){},messageErrors:{}}),i(n,"refInput",null),i(n,"refTextFiled",null),i(n,"getTextFieldProps",(function(){var r=n.props.label,t=h(n.mergeConfigs.messageErrors,n.mergeConfigs.name);return e({label:r,error:t.error,helperText:t.message,type:"file",variant:"outlined",fullWidth:!0,onChange:n.handleChange,inputProps:{accept:"text/csv"},InputLabelProps:{shrink:n.mergeConfigs.labelShrink}},n.mergeConfigs.textFieldProps)})),i(n,"upgradeMergeConfigs",(function(e){var r,n,t,o,i,a,l,s,u=e.name,p=e.label,g=e.onBlur,f=e.messageErrors;return{textFieldProps:Object.assign({},null==d?void 0:d.textFieldProps,null===(r=e.slots)||void 0===r?void 0:r.textFieldProps),wrapProps:Object.assign({},null==d?void 0:d.wrapProps,null===(n=e.slots)||void 0===n?void 0:n.wrapProps),name:u,onBlur:g||function(){},messageErrors:f||{},downloadSampleUrl:null!==(t=null===(o=e.slots)||void 0===o?void 0:o.downloadSampleUrl)&&void 0!==t?t:null==d?void 0:d.downloadSampleUrl,instructionalText:null!==(i=null===(a=e.slots)||void 0===a?void 0:a.instructionalText)&&void 0!==i?i:null==d?void 0:d.instructionalText,labelShrink:!1!==(null!==(l=null===(s=e.slots)||void 0===s?void 0:s.labelShrink)&&void 0!==l?l:null==d?void 0:d.labelShrink)&&!!p}})),i(n,"handleChange",function(){var e=a(l().m((function e(r){var t,o,i,a;return l().w((function(e){for(;;)switch(e.n){case 0:if(o=null===(t=r.target.files)||void 0===t?void 0:t[0]){e.n=1;break}return e.a(2);case 1:return e.p=1,e.n=2,v(o);case 2:i=e.v,n.refInput&&(n.refInput.value=JSON.stringify(i)),n.setState({parsedData:i},(function(){n.props.onChange&&n.props.onChange(i),n.mergeConfigs.onBlur(n.mergeConfigs.name)})),e.n=4;break;case 3:e.p=3,a=e.v,console.error("Error parsing CSV:",a),n.mergeConfigs.onBlur(n.mergeConfigs.name);case 4:return e.a(2)}}),e,null,[[1,3]])})));return function(r){return e.apply(this,arguments)}}()),n.mergeConfigsCache=n.upgradeMergeConfigs(r),n.state={parsedData:[]},n}return r(C,p),n(C,[{key:"mergeConfigs",get:function(){return this.mergeConfigsCache}},{key:"inputValue",get:function(){return this.state.parsedData.length>0?JSON.stringify(this.state.parsedData):""}},{key:"shouldComponentUpdate",value:function(e){return e!==this.props&&(this.mergeConfigsCache=this.upgradeMergeConfigs(e)),!0}},{key:"render",value:function(){var r,n,t=this;return u(f,e(e({},this.mergeConfigs.wrapProps),{},{children:[this.mergeConfigs.downloadSampleUrl&&u(f,{sx:{display:"flex",alignItems:"center",mb:"10px"},children:[s(g,{variant:"subtitle2",component:"span",children:null!==(r=this.mergeConfigs.instructionalText)&&void 0!==r?r:"Metadata file, please fill out the form we provide."}),u(x,{href:this.mergeConfigs.downloadSampleUrl,children:[s("span",{children:" Download sample"}),s(c,{fontSize:"small"})]})]}),s("input",{hidden:!0,name:null===(n=this.props.name)||void 0===n?void 0:n.toString(),type:"text",ref:function(e){return t.refInput=e},defaultValue:""}),s(m,e(e({},this.getTextFieldProps()),{},{inputRef:function(e){return t.refTextFiled=e}}))]}))}}])}();return C}var x=d((function(r){return s(g,e({variant:"subtitle2",component:"a",target:"_blank",download:!0},r))}))((function(e){var r=e.theme;return{display:"flex",alignItems:"center",color:r.palette.primary.light,cursor:"pointer",fontWeight:600,marginLeft:"6px",gap:"4px","&:hover":{textDecoration:"underline",color:r.palette.primary.dark}}}));export{C as createInputFileCsvLocalParser};
2
2
  //# sourceMappingURL=create.input-file.csv-local-parser.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.input-file.csv-local-parser.js","sources":["../../src/form/create.input-file.csv-local-parser.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, styled, TextField, TextFieldProps, Typography, TypographyProps } from '@mui/material'\r\nimport DownloadIcon from '@mui/icons-material/Download'\r\nimport { getErrorMessage } from './helpers'\r\nimport { tryParseCsvFileToArray } from '../utils'\r\nimport { IFormBase, IFormInputBase } from './types'\r\n\r\nexport interface IInputFileCsvLocalParserSlots {\r\n /**\r\n * The URL of the sample CSV file that users can download.\r\n * If provided, a \"Download sample\" link will be displayed.\r\n * Example: '/sample.csv' or 'https://example.com/sample.csv'\r\n */\r\n downloadSampleUrl?: string\r\n /**\r\n * Instructional text displayed alongside the download link or file input.\r\n * Useful for guiding users on how to use or fill out the CSV file.\r\n */\r\n instructionalText?: string\r\n /**\r\n * Props to customize the TextField used for uploading the CSV file.\r\n * Allows customization of appearance and behavior (e.g., placeholder, onChange, disabled).\r\n */\r\n textFieldProps?: TextFieldProps\r\n /**\r\n * Props passed to the wrapper element (typically a Box).\r\n * Useful for customizing layout styles such as margin, padding, or display.\r\n */\r\n wrapProps?: BoxProps\r\n /**\r\n * Whether the label should shrink when displayed.\r\n * Defaults to `true` if a label is present to prevent overlap.\r\n * @default true\r\n */\r\n labelShrink?: boolean\r\n}\r\n\r\nexport interface IInputFileCsvLocalParserParams extends IInputFileCsvLocalParserSlots {}\r\n\r\nexport interface IInputFileCsvLocalParserProps<T, C> extends IFormInputBase<T, IInputFileCsvLocalParserSlots> {\r\n onChange?: (value: C[]) => void\r\n}\r\n\r\nexport interface IInputFileCsvLocalParserState<C> {\r\n parsedData: C[]\r\n}\r\n\r\ntype IPickConfigs<T> = Required<Pick<IFormBase<T>, 'onBlur' | 'messageErrors'>>\r\n\r\ninterface IMergeConfigs<T> extends IPickConfigs<T>, IInputFileCsvLocalParserSlots {\r\n name: keyof T\r\n}\r\n\r\n/**\r\n * Creates a React component that renders a file input specifically for CSV files,\r\n * parses the selected file locally into a structured array, and integrates with a form system.\r\n *\r\n * @template T - The main data model used in the form. Represents the shape of the overall form data.\r\n * @template C - The type of each individual item parsed from the CSV file.\r\n *\r\n * @param params - Optional slot parameters to customize the appearance or behavior of the text field.\r\n * @returns A React component configured for uploading and parsing local CSV files.\r\n */\r\nexport function createInputFileCsvLocalParser<T, C>(params?: IInputFileCsvLocalParserParams): ComponentType<IInputFileCsvLocalParserProps<T, C>> {\r\n class InputFileCsvLocalParser extends Component<IInputFileCsvLocalParserProps<T, C>, IInputFileCsvLocalParserState<C>> {\r\n private mergeConfigsCache: IMergeConfigs<T> = { name: '' as keyof T, onBlur: () => {}, messageErrors: {} }\r\n constructor(props: IInputFileCsvLocalParserProps<T, C>) {\r\n super(props)\r\n this.mergeConfigsCache = this.upgradeMergeConfigs(props)\r\n this.state = { parsedData: [] }\r\n }\r\n\r\n get mergeConfigs(): IMergeConfigs<T> {\r\n return this.mergeConfigsCache\r\n }\r\n\r\n get inputValue() {\r\n return this.state.parsedData.length > 0 ? JSON.stringify(this.state.parsedData) : ''\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IInputFileCsvLocalParserProps<T, C>>): boolean {\r\n if (nextProps !== this.props) this.mergeConfigsCache = this.upgradeMergeConfigs(nextProps)\r\n return true\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n refTextFiled: HTMLInputElement | null = null\r\n render() {\r\n return (\r\n <Box {...this.mergeConfigs.wrapProps}>\r\n {this.mergeConfigs.downloadSampleUrl && (\r\n <Box sx={{ display: 'flex', alignItems: 'center', mb: '10px' }}>\r\n <Typography variant='subtitle2' component='span'>\r\n {this.mergeConfigs.instructionalText ?? 'Metadata file, please fill out the form we provide.'}\r\n </Typography>\r\n <DownloadButton href={this.mergeConfigs.downloadSampleUrl}>\r\n <span> Download sample</span>\r\n <DownloadIcon fontSize='small' />\r\n </DownloadButton>\r\n </Box>\r\n )}\r\n <input hidden name={this.props.name?.toString()} type='text' ref={(ref) => (this.refInput = ref)} defaultValue='' />\r\n <TextField {...this.getTextFieldProps()} inputRef={(ref) => (this.refTextFiled = ref)} />\r\n </Box>\r\n )\r\n }\r\n\r\n getTextFieldProps = (): TextFieldProps => {\r\n const { label } = this.props\r\n const eMessage = getErrorMessage(this.mergeConfigs.messageErrors, this.mergeConfigs.name)\r\n const mergedProps: TextFieldProps = {\r\n label,\r\n error: eMessage.error,\r\n helperText: eMessage.message,\r\n type: 'file',\r\n variant: 'outlined',\r\n fullWidth: true,\r\n onChange: this.handleChange,\r\n inputProps: { accept: 'text/csv' },\r\n InputLabelProps: { shrink: this.mergeConfigs.labelShrink },\r\n ...this.mergeConfigs.textFieldProps\r\n }\r\n return mergedProps\r\n }\r\n\r\n upgradeMergeConfigs = (currentProps: IInputFileCsvLocalParserProps<T, C>): IMergeConfigs<T> => {\r\n const { name, label, onBlur, messageErrors } = currentProps\r\n return {\r\n textFieldProps: Object.assign({}, params?.textFieldProps, currentProps.slots?.textFieldProps),\r\n wrapProps: Object.assign({}, params?.wrapProps, currentProps.slots?.wrapProps),\r\n name: name as keyof T,\r\n onBlur: onBlur || (() => {}),\r\n messageErrors: messageErrors || {},\r\n downloadSampleUrl: currentProps.slots?.downloadSampleUrl ?? params?.downloadSampleUrl,\r\n instructionalText: currentProps.slots?.instructionalText ?? params?.instructionalText,\r\n labelShrink: (currentProps.slots?.labelShrink ?? params?.labelShrink) !== false && !!label\r\n }\r\n }\r\n\r\n handleChange = async (e: React.ChangeEvent<HTMLInputElement>) => {\r\n const file = e.target.files?.[0]\r\n if (!file) return\r\n try {\r\n const result = await tryParseCsvFileToArray(file)\r\n if (this.refInput) this.refInput.value = JSON.stringify(result)\r\n this.setState({ parsedData: result as C[] }, () => {\r\n this.props.onChange && this.props.onChange(result as C[])\r\n this.mergeConfigs.onBlur(this.mergeConfigs.name)\r\n })\r\n } catch (err) {\r\n console.error('Error parsing CSV:', err)\r\n this.mergeConfigs.onBlur(this.mergeConfigs.name)\r\n }\r\n }\r\n }\r\n return InputFileCsvLocalParser\r\n}\r\n\r\nconst DownloadButton = styled((p: TypographyProps & { href: string }) => (\r\n <Typography variant='subtitle2' component='a' target='_blank' download {...p} />\r\n))({\r\n display: 'flex',\r\n alignItems: 'center',\r\n color: 'var(--color-blue)',\r\n cursor: 'pointer',\r\n fontWeight: 600,\r\n marginLeft: '6px',\r\n gap: '4px',\r\n '&:hover': {\r\n textDecoration: 'underline'\r\n }\r\n})\r\n"],"names":["createInputFileCsvLocalParser","params","InputFileCsvLocalParser","props","_this","_classCallCheck","_callSuper","_defineProperty","name","onBlur","messageErrors","label","eMessage","getErrorMessage","mergeConfigs","_objectSpread","error","helperText","message","type","variant","fullWidth","onChange","handleChange","inputProps","accept","InputLabelProps","shrink","labelShrink","textFieldProps","currentProps","_currentProps$slots","_currentProps$slots2","_currentProps$slots$d","_currentProps$slots3","_currentProps$slots$i","_currentProps$slots4","_currentProps$slots$l","_currentProps$slots5","Object","assign","slots","wrapProps","downloadSampleUrl","instructionalText","_ref","_asyncToGenerator","_regenerator","m","_callee","e","_e$target$files","file","result","_t","w","_context","n","target","files","a","p","tryParseCsvFileToArray","v","refInput","value","JSON","stringify","setState","parsedData","console","_x","apply","this","arguments","mergeConfigsCache","upgradeMergeConfigs","state","_inherits","Component","_createClass","key","get","length","nextProps","_this$mergeConfigs$in","_this$props$name","_this2","_jsxs","Box","children","sx","display","alignItems","mb","_jsx","Typography","component","DownloadButton","href","DownloadIcon","fontSize","hidden","toString","ref","defaultValue","TextField","getTextFieldProps","inputRef","refTextFiled","styled","download","color","cursor","fontWeight","marginLeft","gap","textDecoration"],"mappings":"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"}
1
+ {"version":3,"file":"create.input-file.csv-local-parser.js","sources":["../../src/form/create.input-file.csv-local-parser.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, styled, TextField, TextFieldProps, Typography, TypographyProps } from '@mui/material'\r\nimport DownloadIcon from '@mui/icons-material/Download'\r\nimport { getErrorMessage } from './helpers'\r\nimport { tryParseCsvFileToArray } from '../utils'\r\nimport { IFormBase, IFormInputBase } from './types'\r\n\r\nexport interface IInputFileCsvLocalParserSlots {\r\n /**\r\n * The URL of the sample CSV file that users can download.\r\n * If provided, a \"Download sample\" link will be displayed.\r\n * Example: '/sample.csv' or 'https://example.com/sample.csv'\r\n */\r\n downloadSampleUrl?: string\r\n /**\r\n * Instructional text displayed alongside the download link or file input.\r\n * Useful for guiding users on how to use or fill out the CSV file.\r\n */\r\n instructionalText?: string\r\n /**\r\n * Props to customize the TextField used for uploading the CSV file.\r\n * Allows customization of appearance and behavior (e.g., placeholder, onChange, disabled).\r\n */\r\n textFieldProps?: TextFieldProps\r\n /**\r\n * Props passed to the wrapper element (typically a Box).\r\n * Useful for customizing layout styles such as margin, padding, or display.\r\n */\r\n wrapProps?: BoxProps\r\n /**\r\n * Whether the label should shrink when displayed.\r\n * Defaults to `true` if a label is present to prevent overlap.\r\n * @default true\r\n */\r\n labelShrink?: boolean\r\n}\r\n\r\nexport interface IInputFileCsvLocalParserParams extends IInputFileCsvLocalParserSlots {}\r\n\r\nexport interface IInputFileCsvLocalParserProps<T, C> extends IFormInputBase<T, IInputFileCsvLocalParserSlots> {\r\n onChange?: (value: C[]) => void\r\n}\r\n\r\nexport interface IInputFileCsvLocalParserState<C> {\r\n parsedData: C[]\r\n}\r\n\r\ntype IPickConfigs<T> = Required<Pick<IFormBase<T>, 'onBlur' | 'messageErrors'>>\r\n\r\ninterface IMergeConfigs<T> extends IPickConfigs<T>, IInputFileCsvLocalParserSlots {\r\n name: keyof T\r\n}\r\n\r\n/**\r\n * Creates a React component that renders a file input specifically for CSV files,\r\n * parses the selected file locally into a structured array, and integrates with a form system.\r\n *\r\n * @template T - The main data model used in the form. Represents the shape of the overall form data.\r\n * @template C - The type of each individual item parsed from the CSV file.\r\n *\r\n * @param params - Optional slot parameters to customize the appearance or behavior of the text field.\r\n * @returns A React component configured for uploading and parsing local CSV files.\r\n */\r\nexport function createInputFileCsvLocalParser<T, C>(params?: IInputFileCsvLocalParserParams): ComponentType<IInputFileCsvLocalParserProps<T, C>> {\r\n class InputFileCsvLocalParser extends Component<IInputFileCsvLocalParserProps<T, C>, IInputFileCsvLocalParserState<C>> {\r\n private mergeConfigsCache: IMergeConfigs<T> = { name: '' as keyof T, onBlur: () => {}, messageErrors: {} }\r\n constructor(props: IInputFileCsvLocalParserProps<T, C>) {\r\n super(props)\r\n this.mergeConfigsCache = this.upgradeMergeConfigs(props)\r\n this.state = { parsedData: [] }\r\n }\r\n\r\n get mergeConfigs(): IMergeConfigs<T> {\r\n return this.mergeConfigsCache\r\n }\r\n\r\n get inputValue() {\r\n return this.state.parsedData.length > 0 ? JSON.stringify(this.state.parsedData) : ''\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IInputFileCsvLocalParserProps<T, C>>): boolean {\r\n if (nextProps !== this.props) this.mergeConfigsCache = this.upgradeMergeConfigs(nextProps)\r\n return true\r\n }\r\n\r\n refInput: HTMLInputElement | null = null\r\n refTextFiled: HTMLInputElement | null = null\r\n render() {\r\n return (\r\n <Box {...this.mergeConfigs.wrapProps}>\r\n {this.mergeConfigs.downloadSampleUrl && (\r\n <Box sx={{ display: 'flex', alignItems: 'center', mb: '10px' }}>\r\n <Typography variant='subtitle2' component='span'>\r\n {this.mergeConfigs.instructionalText ?? 'Metadata file, please fill out the form we provide.'}\r\n </Typography>\r\n <DownloadButton href={this.mergeConfigs.downloadSampleUrl}>\r\n <span> Download sample</span>\r\n <DownloadIcon fontSize='small' />\r\n </DownloadButton>\r\n </Box>\r\n )}\r\n <input hidden name={this.props.name?.toString()} type='text' ref={(ref) => (this.refInput = ref)} defaultValue='' />\r\n <TextField {...this.getTextFieldProps()} inputRef={(ref) => (this.refTextFiled = ref)} />\r\n </Box>\r\n )\r\n }\r\n\r\n getTextFieldProps = (): TextFieldProps => {\r\n const { label } = this.props\r\n const eMessage = getErrorMessage(this.mergeConfigs.messageErrors, this.mergeConfigs.name)\r\n const mergedProps: TextFieldProps = {\r\n label,\r\n error: eMessage.error,\r\n helperText: eMessage.message,\r\n type: 'file',\r\n variant: 'outlined',\r\n fullWidth: true,\r\n onChange: this.handleChange,\r\n inputProps: { accept: 'text/csv' },\r\n InputLabelProps: { shrink: this.mergeConfigs.labelShrink },\r\n ...this.mergeConfigs.textFieldProps\r\n }\r\n return mergedProps\r\n }\r\n\r\n upgradeMergeConfigs = (currentProps: IInputFileCsvLocalParserProps<T, C>): IMergeConfigs<T> => {\r\n const { name, label, onBlur, messageErrors } = currentProps\r\n return {\r\n textFieldProps: Object.assign({}, params?.textFieldProps, currentProps.slots?.textFieldProps),\r\n wrapProps: Object.assign({}, params?.wrapProps, currentProps.slots?.wrapProps),\r\n name: name as keyof T,\r\n onBlur: onBlur || (() => {}),\r\n messageErrors: messageErrors || {},\r\n downloadSampleUrl: currentProps.slots?.downloadSampleUrl ?? params?.downloadSampleUrl,\r\n instructionalText: currentProps.slots?.instructionalText ?? params?.instructionalText,\r\n labelShrink: (currentProps.slots?.labelShrink ?? params?.labelShrink) !== false && !!label\r\n }\r\n }\r\n\r\n handleChange = async (e: React.ChangeEvent<HTMLInputElement>) => {\r\n const file = e.target.files?.[0]\r\n if (!file) return\r\n try {\r\n const result = await tryParseCsvFileToArray(file)\r\n if (this.refInput) this.refInput.value = JSON.stringify(result)\r\n this.setState({ parsedData: result as C[] }, () => {\r\n this.props.onChange && this.props.onChange(result as C[])\r\n this.mergeConfigs.onBlur(this.mergeConfigs.name)\r\n })\r\n } catch (err) {\r\n console.error('Error parsing CSV:', err)\r\n this.mergeConfigs.onBlur(this.mergeConfigs.name)\r\n }\r\n }\r\n }\r\n return InputFileCsvLocalParser\r\n}\r\n\r\nconst DownloadButton = styled((p: TypographyProps & { href: string }) => (\r\n <Typography variant='subtitle2' component='a' target='_blank' download {...p} />\r\n))(({ theme }) => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n color: theme.palette.primary.light,\r\n cursor: 'pointer',\r\n fontWeight: 600,\r\n marginLeft: '6px',\r\n gap: '4px',\r\n '&:hover': {\r\n textDecoration: 'underline',\r\n color: theme.palette.primary.dark\r\n }\r\n}))\r\n"],"names":["createInputFileCsvLocalParser","params","InputFileCsvLocalParser","props","_this","_classCallCheck","_callSuper","_defineProperty","name","onBlur","messageErrors","label","eMessage","getErrorMessage","mergeConfigs","_objectSpread","error","helperText","message","type","variant","fullWidth","onChange","handleChange","inputProps","accept","InputLabelProps","shrink","labelShrink","textFieldProps","currentProps","_currentProps$slots","_currentProps$slots2","_currentProps$slots$d","_currentProps$slots3","_currentProps$slots$i","_currentProps$slots4","_currentProps$slots$l","_currentProps$slots5","Object","assign","slots","wrapProps","downloadSampleUrl","instructionalText","_ref","_asyncToGenerator","_regenerator","m","_callee","e","_e$target$files","file","result","_t","w","_context","n","target","files","a","p","tryParseCsvFileToArray","v","refInput","value","JSON","stringify","setState","parsedData","console","_x","apply","this","arguments","mergeConfigsCache","upgradeMergeConfigs","state","_inherits","Component","_createClass","key","get","length","nextProps","_this$mergeConfigs$in","_this$props$name","_this2","_jsxs","Box","children","sx","display","alignItems","mb","_jsx","Typography","component","DownloadButton","href","DownloadIcon","fontSize","hidden","toString","ref","defaultValue","TextField","getTextFieldProps","inputRef","refTextFiled","styled","download","_ref3","theme","color","palette","primary","light","cursor","fontWeight","marginLeft","gap","textDecoration","dark"],"mappings":"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"}
@@ -1,2 +1,2 @@
1
- import{inherits as r,createClass as e,objectSpread2 as t,classCallCheck as i,callSuper as o,defineProperty as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as a,jsx as s}from"react/jsx-runtime";import{Component as l}from"react";import{styled as p,Box as u,TextField as m,Collapse as h}from"@mui/material";import{getErrorMessage as d}from"./helpers.js";function c(p){return function(){function c(r){var e;return i(this,c),e=o(this,c,[r]),n(e,"handleChange",(function(r){var t,i=null===(t=r.target.files)||void 0===t?void 0:t[0];if(i){var o=URL.createObjectURL(i);e.setState({imageUrl:o},(function(){e.props.name&&e.props.onBlur&&e.props.onBlur(e.props.name)}))}})),n(e,"getImageUrl",(function(){var r=e.props.data,t=null!=p&&p.imageGetter?p.imageGetter(r):void 0;return e.state.imageUrl||t||""})),e.state={},e}return r(c,l),e(c,[{key:"render",value:function(){var r,e,i=this,o=this.props.name,n=d(this.props.messageErrors,this.props.name),l=this.getImageUrl();return a(g,t(t({},null===(r=this.props.slots)||void 0===r?void 0:r.wrapProps),{},{children:[s(u,{sx:{flex:1},children:s(m,t({name:null==o?void 0:o.toString(),error:n.error,helperText:n.message,variant:"outlined",type:"file",fullWidth:!0,inputProps:t({},{accept:"image/*",multiple:!1}),onBlur:function(){o&&i.props.onBlur&&i.props.onBlur(o)},onChange:this.handleChange},null===(e=this.props.slots)||void 0===e?void 0:e.inputProps))}),s(h,{in:!!l,orientation:"horizontal",unmountOnExit:!0,children:s(f,{children:s("img",{src:l,alt:"berlintomek-image"})})})]}))}}])}()}var g=p(u)({display:"flex",gap:"9px",alignItems:"center"}),f=p(u)({height:"56px",width:"56px",marginRight:"6px",borderRadius:"4px",overflow:"hidden",border:"1px solid rgba(145, 158, 171, .16)","& > img":{width:"100%",height:"100%",objectFit:"cover"}});export{c as default};
1
+ import{inherits as t,createClass as e,objectSpread2 as r,classCallCheck as o,callSuper as i,defineProperty as n}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as s}from"react/jsx-runtime";import{Component as a}from"react";import{styled as p,Box as u,TextField as m,Collapse as d,InputAdornment as c}from"@mui/material";import{getErrorMessage as h}from"./helpers.js";import{RichTooltip as g,HelpOutlinePulseIcon as f}from"../components/rich-tooltip.js";function v(p){return function(){function v(t){var e;return o(this,v),e=i(this,v,[t]),n(e,"getTextFieldProps",(function(){var t=e.props,o=t.name,i=t.messageErrors,n=t.slots,l=t.onBlur,a=h(i,o),p=r(r({name:null==o?void 0:o.toString(),error:a.error,helperText:a.message},null==n?void 0:n.inputProps),{},{onBlur:function(){o&&l&&l(o)},onChange:e.handleChange});return p.InputProps||(p.InputProps={}),e.slots.tooltip&&(p.InputProps.endAdornment=s(c,{position:"end",children:e.slots.tooltip&&s(g,{panel:e.slots.tooltip,children:s(f,{fontSize:"small"})})})),p})),n(e,"handleChange",(function(t){var r,o=null===(r=t.target.files)||void 0===r?void 0:r[0];if(o){var i=URL.createObjectURL(o);e.setState({imageUrl:i},(function(){e.props.name&&e.props.onBlur&&e.props.onBlur(e.props.name)}))}})),n(e,"getImageUrl",(function(){var t=e.props.data,r=null!=p&&p.imageGetter?p.imageGetter(t):void 0;return e.state.imageUrl||r||""})),e.state={},e}return t(v,a),e(v,[{key:"slots",get:function(){return{tooltip:this.props.tooltip||(null==p?void 0:p.tooltip)}}},{key:"render",value:function(){var t,e=this.getImageUrl();return l(x,r(r({},null===(t=this.props.slots)||void 0===t?void 0:t.wrapProps),{},{children:[s(u,{sx:{flex:1},children:s(m,r({variant:"outlined",type:"file",fullWidth:!0,inputProps:{accept:"image/*",multiple:!1}},this.getTextFieldProps()))}),s(d,{in:!!e,orientation:"horizontal",unmountOnExit:!0,children:s(P,{children:s("img",{src:e,alt:"berlintomek-image"})})})]}))}}])}()}var x=p(u)({display:"flex",gap:"9px",alignItems:"start"}),P=p(u)({height:"56px",width:"56px",marginRight:"6px",borderRadius:"4px",overflow:"hidden",border:"1px solid rgba(145, 158, 171, .16)","& > img":{width:"100%",height:"100%",objectFit:"cover"}});export{v as default};
2
2
  //# sourceMappingURL=create.input.image-file.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.input.image-file.js","sources":["../../src/form/create.input.image-file.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, Collapse, styled, TextField, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\n\r\nexport interface IInputImageFileSlots {\r\n wrapProps?: BoxProps\r\n inputProps?: TextFieldProps\r\n}\r\n\r\nexport interface IInputImageFileProps<T> extends IFormInputBase<T, IInputImageFileSlots> {}\r\n\r\nexport interface IInputImageFileState {\r\n imageUrl?: string\r\n}\r\n\r\nexport interface IInputImageFileParams<T> {\r\n imageGetter?: (data?: Partial<T>) => string | undefined\r\n}\r\n\r\nfunction createInputImageFile<T>(params?: IInputImageFileParams<T>): ComponentType<IInputImageFileProps<T>> {\r\n class InputImageFile extends Component<IInputImageFileProps<T>, IInputImageFileState> {\r\n constructor(props: IInputImageFileProps<T>) {\r\n super(props)\r\n this.state = {}\r\n }\r\n render() {\r\n const { name } = this.props\r\n const eMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n const url = this.getImageUrl()\r\n return (\r\n <Wrap {...this.props.slots?.wrapProps}>\r\n <Box sx={{ flex: 1 }}>\r\n <TextField\r\n name={name?.toString()}\r\n error={eMessage.error}\r\n helperText={eMessage.message}\r\n variant='outlined'\r\n type='file'\r\n fullWidth\r\n inputProps={{ ...{ accept: 'image/*', multiple: false } }}\r\n onBlur={() => {\r\n if (!name) return\r\n this.props.onBlur && this.props.onBlur(name)\r\n }}\r\n onChange={this.handleChange}\r\n {...this.props.slots?.inputProps}\r\n />\r\n </Box>\r\n <Collapse in={!!url} orientation='horizontal' unmountOnExit>\r\n <ImageWrap>\r\n <img src={url} alt='berlintomek-image' />\r\n </ImageWrap>\r\n </Collapse>\r\n </Wrap>\r\n )\r\n }\r\n\r\n handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\r\n const file = event.target.files?.[0]\r\n if (file) {\r\n const imageUrl = URL.createObjectURL(file)\r\n this.setState({ imageUrl }, () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n })\r\n }\r\n }\r\n\r\n getImageUrl = () => {\r\n const { data } = this.props\r\n const value = params?.imageGetter ? params.imageGetter(data) : undefined\r\n return this.state.imageUrl || value || ''\r\n }\r\n }\r\n return InputImageFile\r\n}\r\nexport default createInputImageFile\r\n\r\nconst Wrap = styled(Box)({\r\n display: 'flex',\r\n gap: '9px',\r\n alignItems: 'center'\r\n})\r\n\r\nconst ImageWrap = styled(Box)({\r\n height: '56px',\r\n width: '56px',\r\n marginRight: '6px',\r\n borderRadius: '4px',\r\n overflow: 'hidden',\r\n border: '1px solid rgba(145, 158, 171, .16)',\r\n '& > img': {\r\n width: '100%',\r\n height: '100%',\r\n objectFit: 'cover'\r\n }\r\n})\r\n"],"names":["createInputImageFile","params","InputImageFile","props","_this","_classCallCheck","_callSuper","_defineProperty","event","_event$target$files","file","target","files","imageUrl","URL","createObjectURL","setState","name","onBlur","data","value","imageGetter","undefined","state","_inherits","Component","_createClass","key","_this$props$slots","_this$props$slots2","_this2","this","eMessage","getErrorMessage","messageErrors","url","getImageUrl","_jsxs","Wrap","_objectSpread","slots","wrapProps","children","_jsx","Box","sx","flex","TextField","toString","error","helperText","message","variant","type","fullWidth","inputProps","accept","multiple","onChange","handleChange","Collapse","in","orientation","unmountOnExit","ImageWrap","src","alt","styled","display","gap","alignItems","height","width","marginRight","borderRadius","overflow","border","objectFit"],"mappings":"+WAoBA,SAASA,EAAwBC,GAuD/B,kBArDE,SAAAC,EAAYC,GAA8B,IAAAC,EAEzB,OAFyBC,OAAAH,GACxCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAmC6C,gBAAA,SAACI,GAAS,IAAAC,EAC7DC,UAAID,EAAGD,EAAMG,OAAOC,aAAK,IAAAH,OAAA,EAAlBA,EAAqB,GAClC,GAAIC,EAAM,CACR,IAAMG,EAAWC,IAAIC,gBAAgBL,GACrCN,EAAKY,SAAS,CAAEH,SAAAA,IAAY,WACrBT,EAAKD,MAAMc,MAChBb,EAAKD,MAAMe,QAAUd,EAAKD,MAAMe,OAAOd,EAAKD,MAAMc,KACpD,GACD,KACFV,EAAAH,EAAA,eAEa,WACZ,IAAQe,EAASf,EAAKD,MAAdgB,KACFC,EAAQnB,SAAAA,EAAQoB,YAAcpB,EAAOoB,YAAYF,QAAQG,EAC/D,OAAOlB,EAAKmB,MAAMV,UAAYO,GAAS,MAhDvChB,EAAKmB,MAAQ,CAAE,EAAAnB,CACjB,CAAC,OAAAoB,EAAAtB,EAJ0BuB,GAI1BC,EAAAxB,EAAA,CAAA,CAAAyB,IAAA,SAAAP,MACD,WAAM,IAAAQ,EAAAC,EAAAC,EAAAC,KACId,EAASc,KAAK5B,MAAdc,KACFe,EAAWC,EAAgBF,KAAK5B,MAAM+B,cAAeH,KAAK5B,MAAMc,MAChEkB,EAAMJ,KAAKK,cACjB,OACEC,EAACC,EAAIC,EAAAA,KAAqB,QAArBX,EAAKG,KAAK5B,MAAMqC,aAAXZ,IAAgBA,OAAhBA,EAAAA,EAAkBa,WAAS,GAAA,CAAAC,SAAA,CACnCC,EAACC,GAAIC,GAAI,CAAEC,KAAM,GAAGJ,SAClBC,EAACI,EAASR,EAAA,CACRtB,KAAMA,eAAAA,EAAM+B,WACZC,MAAOjB,EAASiB,MAChBC,WAAYlB,EAASmB,QACrBC,QAAQ,WACRC,KAAK,OACLC,WAAS,EACTC,WAAUhB,EAAO,GAAA,CAAEiB,OAAQ,UAAWC,UAAU,IAChDvC,OAAQ,WACDD,GACLa,EAAK3B,MAAMe,QAAUY,EAAK3B,MAAMe,OAAOD,EACxC,EACDyC,SAAU3B,KAAK4B,cACK,QADO9B,EACvBE,KAAK5B,MAAMqC,aAAK,IAAAX,OAAA,EAAhBA,EAAkB0B,eAG1BZ,EAACiB,EAAQ,CAACC,KAAM1B,EAAK2B,YAAY,aAAaC,eAC5C,EAAArB,SAAAC,EAACqB,EAAS,CAAAtB,SACRC,EAAK,MAAA,CAAAsB,IAAK9B,EAAK+B,IAAI,6BAK7B,IAAC,GAoBL,CAGA,IAAM5B,EAAO6B,EAAOvB,EAAPuB,CAAY,CACvBC,QAAS,OACTC,IAAK,MACLC,WAAY,WAGRN,EAAYG,EAAOvB,EAAPuB,CAAY,CAC5BI,OAAQ,OACRC,MAAO,OACPC,YAAa,MACbC,aAAc,MACdC,SAAU,SACVC,OAAQ,qCACR,UAAW,CACTJ,MAAO,OACPD,OAAQ,OACRM,UAAW"}
1
+ {"version":3,"file":"create.input.image-file.js","sources":["../../src/form/create.input.image-file.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, Collapse, InputAdornment, styled, TextField, TextFieldProps } from '@mui/material'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { IRichTooltipPanelConfig, RichTooltip, HelpOutlinePulseIcon } from '../components/rich-tooltip'\r\n\r\nexport interface IInputImageFileSlots {\r\n wrapProps?: BoxProps\r\n inputProps?: TextFieldProps\r\n}\r\n\r\nexport interface IInputImageFileProps<T> extends IFormInputBase<T, IInputImageFileSlots> {\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nexport interface IInputImageFileState {\r\n imageUrl?: string\r\n}\r\n\r\nexport interface IInputImageFileParams<T> {\r\n imageGetter?: (data?: Partial<T>) => string | undefined\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nfunction createInputImageFile<T>(params?: IInputImageFileParams<T>): ComponentType<IInputImageFileProps<T>> {\r\n class InputImageFile extends Component<IInputImageFileProps<T>, IInputImageFileState> {\r\n constructor(props: IInputImageFileProps<T>) {\r\n super(props)\r\n this.state = {}\r\n }\r\n\r\n private get slots() {\r\n return {\r\n tooltip: this.props.tooltip || params?.tooltip\r\n }\r\n }\r\n\r\n render() {\r\n const url = this.getImageUrl()\r\n return (\r\n <Wrap {...this.props.slots?.wrapProps}>\r\n <Box sx={{ flex: 1 }}>\r\n <TextField variant='outlined' type='file' fullWidth inputProps={{ accept: 'image/*', multiple: false }} {...this.getTextFieldProps()} />\r\n </Box>\r\n <Collapse in={!!url} orientation='horizontal' unmountOnExit>\r\n <ImageWrap>\r\n <img src={url} alt='berlintomek-image' />\r\n </ImageWrap>\r\n </Collapse>\r\n </Wrap>\r\n )\r\n }\r\n\r\n getTextFieldProps = (): TextFieldProps => {\r\n const { name, messageErrors, slots, onBlur } = this.props\r\n const errorMessage = getErrorMessage(messageErrors, name)\r\n const tfp: TextFieldProps = {\r\n name: name?.toString(),\r\n error: errorMessage.error,\r\n helperText: errorMessage.message,\r\n ...slots?.inputProps,\r\n onBlur: () => {\r\n if (!name || !onBlur) return\r\n onBlur(name)\r\n },\r\n onChange: this.handleChange\r\n }\r\n if (!tfp.InputProps) tfp.InputProps = {}\r\n if (this.slots.tooltip) {\r\n tfp.InputProps.endAdornment = (\r\n <InputAdornment position='end'>\r\n {this.slots.tooltip && (\r\n <RichTooltip panel={this.slots.tooltip}>\r\n <HelpOutlinePulseIcon fontSize='small' />\r\n </RichTooltip>\r\n )}\r\n </InputAdornment>\r\n )\r\n }\r\n return tfp\r\n }\r\n\r\n handleChange: React.ChangeEventHandler<HTMLInputElement> = (event) => {\r\n const file = event.target.files?.[0]\r\n if (file) {\r\n const imageUrl = URL.createObjectURL(file)\r\n this.setState({ imageUrl }, () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n })\r\n }\r\n }\r\n\r\n getImageUrl = () => {\r\n const { data } = this.props\r\n const value = params?.imageGetter ? params.imageGetter(data) : undefined\r\n return this.state.imageUrl || value || ''\r\n }\r\n }\r\n return InputImageFile\r\n}\r\nexport default createInputImageFile\r\n\r\nconst Wrap = styled(Box)({\r\n display: 'flex',\r\n gap: '9px',\r\n alignItems: 'start'\r\n})\r\n\r\nconst ImageWrap = styled(Box)({\r\n height: '56px',\r\n width: '56px',\r\n marginRight: '6px',\r\n borderRadius: '4px',\r\n overflow: 'hidden',\r\n border: '1px solid rgba(145, 158, 171, .16)',\r\n '& > img': {\r\n width: '100%',\r\n height: '100%',\r\n objectFit: 'cover'\r\n }\r\n})\r\n"],"names":["createInputImageFile","params","InputImageFile","props","_this","_classCallCheck","_callSuper","_defineProperty","_this$props","name","messageErrors","slots","onBlur","errorMessage","getErrorMessage","tfp","_objectSpread","toString","error","helperText","message","inputProps","onChange","handleChange","InputProps","tooltip","endAdornment","_jsx","InputAdornment","position","RichTooltip","panel","children","HelpOutlinePulseIcon","fontSize","event","_event$target$files","file","target","files","imageUrl","URL","createObjectURL","setState","data","value","imageGetter","undefined","state","_inherits","Component","_createClass","key","get","this","_this$props$slots","url","getImageUrl","_jsxs","Wrap","wrapProps","Box","sx","flex","TextField","variant","type","fullWidth","accept","multiple","getTextFieldProps","Collapse","in","orientation","unmountOnExit","ImageWrap","src","alt","styled","display","gap","alignItems","height","width","marginRight","borderRadius","overflow","border","objectFit"],"mappings":"ydAwBA,SAASA,EAAwBC,GA2E/B,kBAzEE,SAAAC,EAAYC,GAA8B,IAAAC,EAEzB,OAFyBC,OAAAH,GACxCE,EAAAE,EAAAJ,KAAAA,GAAMC,IAAMI,EAAAH,EAAA,qBA0BM,WAClB,IAAAI,EAA+CJ,EAAKD,MAA5CM,EAAID,EAAJC,KAAMC,EAAaF,EAAbE,cAAeC,EAAKH,EAALG,MAAOC,EAAMJ,EAANI,OAC9BC,EAAeC,EAAgBJ,EAAeD,GAC9CM,EAAGC,EAAAA,EAAA,CACPP,KAAMA,eAAAA,EAAMQ,WACZC,MAAOL,EAAaK,MACpBC,WAAYN,EAAaO,SACtBT,aAAAA,EAAAA,EAAOU,YAAU,GAAA,CACpBT,OAAQ,WACDH,GAASG,GACdA,EAAOH,EACR,EACDa,SAAUlB,EAAKmB,eAcjB,OAZKR,EAAIS,aAAYT,EAAIS,WAAa,CAAE,GACpCpB,EAAKO,MAAMc,UACbV,EAAIS,WAAWE,aACbC,EAACC,EAAc,CAACC,SAAS,eACtBzB,EAAKO,MAAMc,SACVE,EAACG,EAAW,CAACC,MAAO3B,EAAKO,MAAMc,QAC7BO,SAAAL,EAACM,EAAqB,CAAAC,SAAS,eAMlCnB,KACRR,EAAAH,EAE0D,gBAAA,SAAC+B,GAAS,IAAAC,EAC7DC,UAAID,EAAGD,EAAMG,OAAOC,aAAK,IAAAH,OAAA,EAAlBA,EAAqB,GAClC,GAAIC,EAAM,CACR,IAAMG,EAAWC,IAAIC,gBAAgBL,GACrCjC,EAAKuC,SAAS,CAAEH,SAAAA,IAAY,WACrBpC,EAAKD,MAAMM,MAChBL,EAAKD,MAAMS,QAAUR,EAAKD,MAAMS,OAAOR,EAAKD,MAAMM,KACpD,GACD,KACFF,EAAAH,EAAA,eAEa,WACZ,IAAQwC,EAASxC,EAAKD,MAAdyC,KACFC,EAAQ5C,SAAAA,EAAQ6C,YAAc7C,EAAO6C,YAAYF,QAAQG,EAC/D,OAAO3C,EAAK4C,MAAMR,UAAYK,GAAS,MApEvCzC,EAAK4C,MAAQ,CAAE,EAAA5C,CACjB,CAAC,OAAA6C,EAAA/C,EAJ0BgD,GAI1BC,EAAAjD,EAAA,CAAA,CAAAkD,IAAA,QAAAC,IAED,WACE,MAAO,CACL5B,QAAS6B,KAAKnD,MAAMsB,UAAWxB,aAAAA,EAAAA,EAAQwB,SAE3C,GAAC,CAAA2B,IAAA,SAAAP,MAED,WAAM,IAAAU,EACEC,EAAMF,KAAKG,cACjB,OACEC,EAACC,EAAI3C,EAAAA,KAAqB,QAArBuC,EAAKD,KAAKnD,MAAMQ,aAAX4C,IAAgBA,OAAhBA,EAAAA,EAAkBK,WAAS,GAAA,WACnCjC,EAACkC,GAAIC,GAAI,CAAEC,KAAM,YACfpC,EAACqC,EAAShD,EAAA,CAACiD,QAAQ,WAAWC,KAAK,OAAOC,WAAU,EAAA9C,WAAY,CAAE+C,OAAQ,UAAWC,UAAU,IAAaf,KAAKgB,wBAEnH3C,EAAC4C,EAAS,CAAAC,KAAMhB,EAAKiB,YAAY,aAAaC,eAAa,EAAA1C,SACzDL,EAACgD,EAAS,CAAA3C,SACRL,SAAKiD,IAAKpB,EAAKqB,IAAI,6BAK7B,IAAC,GAiDL,CAGA,IAAMlB,EAAOmB,EAAOjB,EAAPiB,CAAY,CACvBC,QAAS,OACTC,IAAK,MACLC,WAAY,UAGRN,EAAYG,EAAOjB,EAAPiB,CAAY,CAC5BI,OAAQ,OACRC,MAAO,OACPC,YAAa,MACbC,aAAc,MACdC,SAAU,SACVC,OAAQ,qCACR,UAAW,CACTJ,MAAO,OACPD,OAAQ,OACRM,UAAW"}
@@ -1,2 +1,2 @@
1
- import{inherits as e,createClass as t,objectSpread2 as r,classCallCheck as o,callSuper as a,defineProperty as i,objectWithoutProperties as l,asyncToGenerator as n,regenerator as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as u,jsx as p,Fragment as d}from"react/jsx-runtime";import{Component as c}from"react";import{styled as m,Box as h,TextField as v,InputAdornment as f,IconButton as g,Collapse as b,CircularProgress as x}from"@mui/material";import S from"@mui/icons-material/ContentPaste";import{mergeObjects as k}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{getErrorMessage as y}from"./helpers.js";import{RichTooltip as P,HelpOutlinePulseIcon as j}from"../components/rich-tooltip.js";import{ImageWithFallback as L}from"../components/image-with-fallback.js";var C=["srcGetter","element","alt","fallbackSrc","debounceDelay"],I=function(m){return function(){function x(e){var t,c;return o(this,x),c=a(this,x,[e]),i(c,"_cachedSlots",{}),i(c,"mapTextFieldProps",(function(){var e,t,o,a,i=y(c.props.messageErrors,c.props.name),l={fullWidth:!0,variant:"outlined",name:null===(e=c.props.name)||void 0===e?void 0:e.toString(),error:i.error,helperText:i.message,disabled:c.props.disabled,onBlur:function(){c.props.name&&c.props.onBlur&&c.props.onBlur(c.props.name)},label:c.getLabel(),placeholder:c.props.placeholder,InputLabelProps:c.state.value?{shrink:!0}:{},value:null!==(t=c.state.value)&&void 0!==t?t:"",onChange:c.handleChange};return l.InputProps||(l.InputProps={}),l.InputProps.endAdornment=u(f,{position:"end",children:[c.slots.pastenable&&p(g,{onClick:c.handlePaste,edge:"end",children:p(S,{})}),c.slots.tooltip&&p(P,{panel:c.slots.tooltip,children:p(j,{fontSize:"small"})})]}),null!==(o=c.slots)&&void 0!==o&&o.maxLength&&(l.inputProps=r(r({},l.inputProps),{},{maxLength:c.slots.maxLength})),k({},l,null===(a=c.slots)||void 0===a?void 0:a.textFieldProps)})),i(c,"renderImageSide",(function(e){var t,o="left"===e?c.slots.imageLeft:c.slots.imageRight;if(!o)return p(d,{});var a=o.srcGetter,i=o.element,n=o.alt,s=void 0===n?"input-image":n,u=o.fallbackSrc,m=void 0===u?"":u,h=o.debounceDelay,v=void 0===h?700:h,f=l(o,C);if(i)return p(z,{children:p(i,{value:c.state.value,model:c.props.data})});var g=a?a(c.state.value,c.props.data):null!==(t=f.src)&&void 0!==t?t:c.state.value,x={src:g,alt:s,fallbackSrc:m,debounceDelay:v};return p(b,{sx:{mx:"10px"},in:!!g,unmountOnExit:!0,orientation:"horizontal",children:p(z,{children:p(L,r(r(r({},f),x),{},{loading:p(w,{})}))})})})),i(c,"mergeSlots",(function(e){var t=k({},m,e),o=t.imageLeft,a=t.imageRight;return null!=o&&o.mirror&&!a?(t.imageRight=r({},o),delete t.imageRight.mirror):null!=a&&a.mirror&&!o&&(t.imageLeft=r({},a),delete t.imageLeft.mirror),t})),i(c,"getLabel",(function(){var e,t,r;if(c.props.label)return null!==(e=c.slots)&&void 0!==e&&e.maxLength?"".concat(c.props.label," (").concat(null!==(t=null===(r=c.state.value)||void 0===r?void 0:r.length)&&void 0!==t?t:0,"/").concat(c.slots.maxLength,")"):c.props.label})),i(c,"handleChange",(function(e){c.setState({value:e.target.value})})),i(c,"handlePaste",n(s().m((function e(){var t,r;return s().w((function(e){for(;;)switch(e.n){case 0:return e.p=0,e.n=1,navigator.clipboard.readText();case 1:t=e.v,c.setState({value:t}),e.n=3;break;case 2:e.p=2,r=e.v,console.error("Error clipboard:",r);case 3:return e.a(2)}}),e,null,[[0,2]])})))),c._cachedSlots=null!==(t=c.mergeSlots(e.slots))&&void 0!==t?t:{},c.state={value:c.defaulValue},c}return e(x,c),t(x,[{key:"slots",get:function(){return this._cachedSlots}},{key:"defaulValue",get:function(){var e,t,r=this.props,o=r.data,a=r.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:o&&a?null===(t=o[a])||void 0===t?void 0:t.toString():void 0}},{key:"componentDidUpdate",value:function(e){e.slots!==this.props.slots&&(this._cachedSlots=this.mergeSlots(this.props.slots))}},{key:"shouldComponentUpdate",value:function(e){var t=this.props,r=t.name;t.slots;if(r){var o,a,i,l,n=null!==(o=null===(a=this.props.data)||void 0===a||null===(a=a[r])||void 0===a?void 0:a.toString())&&void 0!==o?o:"",s=null!==(i=null===(l=e.data)||void 0===l||null===(l=l[r])||void 0===l?void 0:l.toString())&&void 0!==i?i:"";if(n!==s)return this.setState({value:s}),!1}return e.slots,!0}},{key:"render",value:function(){var e;return u(h,{sx:{display:"flex",alignItems:"center"},children:[!!this.props.disabled&&p("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaulValue}),this.renderImageSide("left"),p(v,r({},this.mapTextFieldProps())),this.renderImageSide("right")]})}}])}()},w=function(){return p("div",{children:p(x,{size:24})})},z=m(h)({fontSize:"1rem",height:"var(--input-base-image-size, 54px)",width:"var(--input-base-image-size, 54px)",position:"relative",borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.16) 0px 1px 4px",overflow:"hidden","& > img":{position:"absolute",top:0,left:0,backgroundRepeat:"no-repeat",height:"100%",width:"100%",backgroundSize:"contain"},"& > div":{position:"absolute",top:0,left:0,height:"100%",width:"100%",background:"#fafafa",zIndex:1,display:"flex",alignItems:"center",justifyContent:"center"}});export{I as default};
1
+ import{inherits as e,createClass as t,objectSpread2 as r,classCallCheck as o,callSuper as a,defineProperty as l,objectWithoutProperties as i,asyncToGenerator as n,regenerator as s}from"../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as u,jsx as p,Fragment as d}from"react/jsx-runtime";import{Component as c}from"react";import{styled as m,Box as h,TextField as v,InputAdornment as f,IconButton as g,Collapse as b,CircularProgress as x}from"@mui/material";import S from"@mui/icons-material/ContentPaste";import{mergeObjects as k}from"../utils/helpers.js";import"../utils/dayjs-config.js";import"../utils/query-param.js";import{getErrorMessage as y}from"./helpers.js";import{ImageWithFallback as P}from"../components/image-with-fallback.js";import{RichTooltip as j,HelpOutlinePulseIcon as L}from"../components/rich-tooltip.js";var C=["srcGetter","element","alt","fallbackSrc","debounceDelay"],I=function(m){return function(){function x(e){var t,c;return o(this,x),c=a(this,x,[e]),l(c,"_cachedSlots",{}),l(c,"mapTextFieldProps",(function(){var e,t,o,a,l=y(c.props.messageErrors,c.props.name),i={fullWidth:!0,variant:"outlined",name:null===(e=c.props.name)||void 0===e?void 0:e.toString(),error:l.error,helperText:l.message,disabled:c.props.disabled,onBlur:function(){c.props.name&&c.props.onBlur&&c.props.onBlur(c.props.name)},label:c.getLabel(),placeholder:c.props.placeholder,InputLabelProps:c.state.value?{shrink:!0}:{},value:null!==(t=c.state.value)&&void 0!==t?t:"",onChange:c.handleChange};return i.InputProps||(i.InputProps={}),i.InputProps.endAdornment=u(f,{position:"end",children:[c.slots.pastenable&&p(g,{onClick:c.handlePaste,edge:"end",children:p(S,{})}),c.slots.tooltip&&p(j,{panel:c.slots.tooltip,children:p(L,{fontSize:"small"})})]}),null!==(o=c.slots)&&void 0!==o&&o.maxLength&&(i.inputProps=r(r({},i.inputProps),{},{maxLength:c.slots.maxLength})),k({},i,null===(a=c.slots)||void 0===a?void 0:a.textFieldProps)})),l(c,"renderImageSide",(function(e){var t,o="left"===e?c.slots.imageLeft:c.slots.imageRight;if(!o)return p(d,{});var a=o.srcGetter,l=o.element,n=o.alt,s=void 0===n?"input-image":n,u=o.fallbackSrc,m=void 0===u?"":u,h=o.debounceDelay,v=void 0===h?700:h,f=i(o,C);if(l)return p(z,{children:p(l,{value:c.state.value,model:c.props.data})});var g=a?a(c.state.value,c.props.data):null!==(t=f.src)&&void 0!==t?t:c.state.value,x={src:g,alt:s,fallbackSrc:m,debounceDelay:v};return p(b,{sx:{mx:"10px"},in:!!g,unmountOnExit:!0,orientation:"horizontal",children:p(z,{children:p(P,r(r(r({},f),x),{},{loading:p(w,{})}))})})})),l(c,"mergeSlots",(function(e){var t=k({},m,e),o=t.imageLeft,a=t.imageRight;return null!=o&&o.mirror&&!a?(t.imageRight=r({},o),delete t.imageRight.mirror):null!=a&&a.mirror&&!o&&(t.imageLeft=r({},a),delete t.imageLeft.mirror),t})),l(c,"getLabel",(function(){var e,t,r;if(c.props.label)return null!==(e=c.slots)&&void 0!==e&&e.maxLength?"".concat(c.props.label," (").concat(null!==(t=null===(r=c.state.value)||void 0===r?void 0:r.length)&&void 0!==t?t:0,"/").concat(c.slots.maxLength,")"):c.props.label})),l(c,"handleChange",(function(e){c.setState({value:e.target.value})})),l(c,"handlePaste",n(s().m((function e(){var t,r;return s().w((function(e){for(;;)switch(e.n){case 0:return e.p=0,e.n=1,navigator.clipboard.readText();case 1:t=e.v,c.setState({value:t}),e.n=3;break;case 2:e.p=2,r=e.v,console.error("Error clipboard:",r);case 3:return e.a(2)}}),e,null,[[0,2]])})))),c._cachedSlots=null!==(t=c.mergeSlots(e.slots))&&void 0!==t?t:{},c.state={value:c.defaulValue},c}return e(x,c),t(x,[{key:"slots",get:function(){return this._cachedSlots}},{key:"defaulValue",get:function(){var e,t,r=this.props,o=r.data,a=r.name;return null!==(e=this.props.defaultValue)&&void 0!==e?e:o&&a?null===(t=o[a])||void 0===t?void 0:t.toString():void 0}},{key:"componentDidUpdate",value:function(e){e.slots!==this.props.slots&&(this._cachedSlots=this.mergeSlots(this.props.slots))}},{key:"shouldComponentUpdate",value:function(e){var t=this.props,r=t.name;t.slots;if(r){var o,a,l,i,n=null!==(o=null===(a=this.props.data)||void 0===a||null===(a=a[r])||void 0===a?void 0:a.toString())&&void 0!==o?o:"",s=null!==(l=null===(i=e.data)||void 0===i||null===(i=i[r])||void 0===i?void 0:i.toString())&&void 0!==l?l:"";if(n!==s)return this.setState({value:s}),!1}return e.slots,!0}},{key:"render",value:function(){var e;return u(h,{sx:{display:"flex",alignItems:"flex-start"},children:[!!this.props.disabled&&p("input",{hidden:!0,name:null===(e=this.props.name)||void 0===e?void 0:e.toString(),defaultValue:this.defaulValue}),this.renderImageSide("left"),p(v,r({},this.mapTextFieldProps())),this.renderImageSide("right")]})}}])}()},w=function(){return p("div",{children:p(x,{size:24})})},z=m(h)({fontSize:"1rem",height:"var(--input-base-image-size, 54px)",width:"var(--input-base-image-size, 54px)",position:"relative",borderRadius:"8px",boxShadow:"rgba(0, 0, 0, 0.16) 0px 1px 4px",overflow:"hidden","& > img":{position:"absolute",top:0,left:0,backgroundRepeat:"no-repeat",height:"100%",width:"100%",backgroundSize:"contain"},"& > div":{position:"absolute",top:0,left:0,height:"100%",width:"100%",background:"#fafafa",zIndex:1,display:"flex",alignItems:"center",justifyContent:"center"}});export{I as default};
2
2
  //# sourceMappingURL=create.input.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"create.input.js","sources":["../../src/form/create.input.tsx"],"sourcesContent":["import React, { Component, ComponentType, FC } from 'react'\r\nimport { Box, CircularProgress, Collapse, IconButton, InputAdornment, styled, TextField, TextFieldProps } from '@mui/material'\r\nimport ContentPasteIcon from '@mui/icons-material/ContentPaste'\r\nimport { mergeObjects } from '../utils'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { ImageWithFallback, IImageWithFallbackPropsOwner, IRichTooltipPanelConfig, RichTooltip, HelpOutlinePulseIcon } from '../components'\r\n\r\nexport interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {\r\n srcGetter?: (value: any, model?: Partial<T>) => string\r\n element?: React.ComponentType<{ value: any; model?: Partial<T> }>\r\n mirror?: boolean\r\n}\r\n\r\nexport interface IInputSlots<T> {\r\n maxLength?: number\r\n textFieldProps?: TextFieldProps\r\n pastenable?: boolean\r\n imageLeft?: InputBaseImage<T>\r\n imageRight?: InputBaseImage<T>\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nexport interface IInputProps<T> extends IFormInputBase<T, IInputSlots<T>> {}\r\n\r\nexport interface IInputState {\r\n value?: string\r\n}\r\n\r\nexport interface IInputParams<T> extends IInputSlots<T> {}\r\n\r\nconst CreateInput = function <T>(params?: IInputParams<T>): ComponentType<IInputProps<T>> {\r\n class InputBase extends Component<IInputProps<T>, IInputState> {\r\n private _cachedSlots: IInputSlots<T> = {}\r\n constructor(props: IInputProps<T>) {\r\n super(props)\r\n this._cachedSlots = this.mergeSlots(props.slots) ?? {}\r\n this.state = { value: this.defaulValue }\r\n }\r\n\r\n get slots() {\r\n return this._cachedSlots\r\n }\r\n\r\n get defaulValue(): string {\r\n const { data, name } = this.props\r\n return this.props.defaultValue ?? (!!data && !!name ? data[name]?.toString() : undefined)\r\n }\r\n\r\n componentDidUpdate(prevProps: IInputProps<T>) {\r\n if (prevProps.slots !== this.props.slots) {\r\n this._cachedSlots = this.mergeSlots(this.props.slots)\r\n }\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IInputProps<T>>): boolean {\r\n const { name, slots } = this.props\r\n if (!!name) {\r\n const currentDataValue = this.props.data?.[name]?.toString() ?? ''\r\n const nextDataValue = nextProps.data?.[name]?.toString() ?? ''\r\n if (currentDataValue !== nextDataValue) {\r\n this.setState({ value: nextDataValue })\r\n return false\r\n }\r\n }\r\n\r\n if (slots !== nextProps.slots) {\r\n return true\r\n }\r\n return true\r\n }\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const errorMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n const tfp: TextFieldProps = {\r\n fullWidth: true,\r\n variant: 'outlined',\r\n name: this.props.name?.toString(),\r\n error: errorMessage.error,\r\n helperText: errorMessage.message,\r\n disabled: this.props.disabled,\r\n onBlur: () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n },\r\n label: this.getLabel(),\r\n placeholder: this.props.placeholder,\r\n InputLabelProps: !!this.state.value ? { shrink: true } : {},\r\n value: this.state.value ?? '',\r\n onChange: this.handleChange\r\n }\r\n if (!tfp.InputProps) tfp.InputProps = {}\r\n tfp.InputProps.endAdornment = (\r\n <InputAdornment position='end'>\r\n {this.slots.pastenable && (\r\n <IconButton onClick={this.handlePaste} edge='end'>\r\n <ContentPasteIcon />\r\n </IconButton>\r\n )}\r\n {this.slots.tooltip && (\r\n <RichTooltip panel={this.slots.tooltip}>\r\n <HelpOutlinePulseIcon fontSize='small' />\r\n </RichTooltip>\r\n )}\r\n </InputAdornment>\r\n )\r\n if (this.slots?.maxLength) tfp.inputProps = { ...tfp.inputProps, maxLength: this.slots.maxLength }\r\n return mergeObjects<TextFieldProps>({}, tfp, this.slots?.textFieldProps)\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\r\n {!!this.props.disabled && <input hidden name={this.props.name?.toString()} defaultValue={this.defaulValue} />}\r\n {this.renderImageSide('left')}\r\n <TextField {...this.mapTextFieldProps()} />\r\n {this.renderImageSide('right')}\r\n </Box>\r\n )\r\n }\r\n\r\n renderImageSide = (side: 'left' | 'right') => {\r\n const image = side === 'left' ? this.slots.imageLeft : this.slots.imageRight\r\n if (!image) return <></>\r\n const { srcGetter, element, alt = 'input-image', fallbackSrc = '', debounceDelay = 700, ...imageOther } = image\r\n if (element) {\r\n const Element = element\r\n return (\r\n <WrapImage>\r\n <Element value={this.state.value} model={this.props.data} />\r\n </WrapImage>\r\n )\r\n }\r\n const src = srcGetter ? srcGetter(this.state.value, this.props.data) : imageOther.src ?? this.state.value\r\n const imageProps: IImageWithFallbackPropsOwner = { src, alt, fallbackSrc, debounceDelay }\r\n return (\r\n <Collapse sx={{ mx: '10px' }} in={!!src} unmountOnExit orientation='horizontal'>\r\n <WrapImage>\r\n <ImageWithFallback {...imageOther} {...imageProps} loading={<LoadingCircularProgress />} />\r\n </WrapImage>\r\n </Collapse>\r\n )\r\n }\r\n //#endregion\r\n\r\n private mergeSlots = (currentSlots?: IInputSlots<T>): IInputSlots<T> => {\r\n const base = mergeObjects<IInputSlots<T>>({}, params, currentSlots)\r\n const { imageLeft, imageRight } = base\r\n\r\n // mirror from left to right\r\n if (imageLeft?.mirror && !imageRight) {\r\n base.imageRight = { ...imageLeft }\r\n delete base.imageRight.mirror\r\n }\r\n // mirror from right to left\r\n else if (imageRight?.mirror && !imageLeft) {\r\n base.imageLeft = { ...imageRight }\r\n delete base.imageLeft.mirror\r\n }\r\n\r\n return base\r\n }\r\n\r\n getLabel = () => {\r\n if (!this.props.label) return\r\n if (!this.slots?.maxLength) return this.props.label\r\n return `${this.props.label} (${this.state.value?.length ?? 0}/${this.slots.maxLength})`\r\n }\r\n\r\n handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n this.setState({ value: event.target.value })\r\n }\r\n\r\n handlePaste = async () => {\r\n try {\r\n const clipboardText = await navigator.clipboard.readText()\r\n this.setState({ value: clipboardText })\r\n } catch (error) {\r\n console.error('Error clipboard:', error)\r\n }\r\n }\r\n }\r\n return InputBase\r\n}\r\n\r\nexport default CreateInput\r\n\r\n// export type InputTextType<T> = ReturnType<typeof CreateInputBase<T>>\r\n\r\nconst LoadingCircularProgress: FC = () => (\r\n <div>\r\n <CircularProgress size={24} />\r\n </div>\r\n)\r\n\r\nconst WrapImage = styled(Box)({\r\n fontSize: '1rem',\r\n height: 'var(--input-base-image-size, 54px)',\r\n width: 'var(--input-base-image-size, 54px)',\r\n position: 'relative',\r\n borderRadius: '8px',\r\n boxShadow: 'rgba(0, 0, 0, 0.16) 0px 1px 4px',\r\n overflow: 'hidden',\r\n '& > img': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n backgroundRepeat: 'no-repeat',\r\n height: '100%',\r\n width: '100%',\r\n backgroundSize: 'contain'\r\n },\r\n '& > div': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n height: '100%',\r\n width: '100%',\r\n background: '#fafafa',\r\n zIndex: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center'\r\n }\r\n})\r\n"],"names":["CreateInput","params","InputBase","props","_this$mergeSlots","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$name","_this$state$value","_this$slots","_this$slots2","errorMessage","getErrorMessage","messageErrors","name","tfp","fullWidth","variant","toString","error","helperText","message","disabled","onBlur","label","getLabel","placeholder","InputLabelProps","state","value","shrink","onChange","handleChange","InputProps","endAdornment","_jsxs","InputAdornment","position","children","slots","pastenable","_jsx","IconButton","onClick","handlePaste","edge","ContentPasteIcon","tooltip","RichTooltip","panel","HelpOutlinePulseIcon","fontSize","maxLength","inputProps","_objectSpread","mergeObjects","textFieldProps","side","_imageOther$src","image","imageLeft","imageRight","srcGetter","element","_image$alt","alt","_image$fallbackSrc","fallbackSrc","_image$debounceDelay","debounceDelay","imageOther","_objectWithoutProperties","_excluded","WrapImage","model","data","src","imageProps","Collapse","sx","mx","in","unmountOnExit","orientation","ImageWithFallback","loading","LoadingCircularProgress","currentSlots","base","mirror","_this$slots3","_this$state$value$len","_this$state$value2","concat","length","event","setState","target","_asyncToGenerator","_regenerator","m","_callee","clipboardText","_t","w","_context","n","p","navigator","clipboard","readText","v","console","a","_cachedSlots","mergeSlots","defaulValue","_inherits","Component","_createClass","key","get","this","_this$props$defaultVa","_data$name","_this$props","defaultValue","undefined","prevProps","nextProps","_this$props2","_this$props$data$name","_this$props$data","_nextProps$data$name$","_nextProps$data","currentDataValue","nextDataValue","_this$props$name2","Box","display","alignItems","hidden","renderImageSide","TextField","mapTextFieldProps","CircularProgress","size","styled","height","width","borderRadius","boxShadow","overflow","top","left","backgroundRepeat","backgroundSize","background","zIndex","justifyContent"],"mappings":"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"}
1
+ {"version":3,"file":"create.input.js","sources":["../../src/form/create.input.tsx"],"sourcesContent":["import React, { Component, ComponentType, FC } from 'react'\r\nimport { Box, CircularProgress, Collapse, IconButton, InputAdornment, styled, TextField, TextFieldProps } from '@mui/material'\r\nimport ContentPasteIcon from '@mui/icons-material/ContentPaste'\r\nimport { mergeObjects } from '../utils'\r\nimport { IFormInputBase } from './types'\r\nimport { getErrorMessage } from './helpers'\r\nimport { ImageWithFallback, IImageWithFallbackPropsOwner } from '../components/image-with-fallback'\r\nimport { IRichTooltipPanelConfig, RichTooltip, HelpOutlinePulseIcon } from '../components/rich-tooltip'\r\n\r\nexport interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {\r\n srcGetter?: (value: any, model?: Partial<T>) => string\r\n element?: React.ComponentType<{ value: any; model?: Partial<T> }>\r\n mirror?: boolean\r\n}\r\n\r\nexport interface IInputSlots<T> {\r\n maxLength?: number\r\n textFieldProps?: TextFieldProps\r\n pastenable?: boolean\r\n imageLeft?: InputBaseImage<T>\r\n imageRight?: InputBaseImage<T>\r\n tooltip?: IRichTooltipPanelConfig\r\n}\r\n\r\nexport interface IInputProps<T> extends IFormInputBase<T, IInputSlots<T>> {}\r\n\r\nexport interface IInputState {\r\n value?: string\r\n}\r\n\r\nexport interface IInputParams<T> extends IInputSlots<T> {}\r\n\r\nconst CreateInput = function <T>(params?: IInputParams<T>): ComponentType<IInputProps<T>> {\r\n class InputBase extends Component<IInputProps<T>, IInputState> {\r\n private _cachedSlots: IInputSlots<T> = {}\r\n constructor(props: IInputProps<T>) {\r\n super(props)\r\n this._cachedSlots = this.mergeSlots(props.slots) ?? {}\r\n this.state = { value: this.defaulValue }\r\n }\r\n\r\n get slots() {\r\n return this._cachedSlots\r\n }\r\n\r\n get defaulValue(): string {\r\n const { data, name } = this.props\r\n return this.props.defaultValue ?? (!!data && !!name ? data[name]?.toString() : undefined)\r\n }\r\n\r\n componentDidUpdate(prevProps: IInputProps<T>) {\r\n if (prevProps.slots !== this.props.slots) {\r\n this._cachedSlots = this.mergeSlots(this.props.slots)\r\n }\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IInputProps<T>>): boolean {\r\n const { name, slots } = this.props\r\n if (!!name) {\r\n const currentDataValue = this.props.data?.[name]?.toString() ?? ''\r\n const nextDataValue = nextProps.data?.[name]?.toString() ?? ''\r\n if (currentDataValue !== nextDataValue) {\r\n this.setState({ value: nextDataValue })\r\n return false\r\n }\r\n }\r\n\r\n if (slots !== nextProps.slots) {\r\n return true\r\n }\r\n return true\r\n }\r\n\r\n mapTextFieldProps = (): TextFieldProps => {\r\n const errorMessage = getErrorMessage(this.props.messageErrors, this.props.name)\r\n const tfp: TextFieldProps = {\r\n fullWidth: true,\r\n variant: 'outlined',\r\n name: this.props.name?.toString(),\r\n error: errorMessage.error,\r\n helperText: errorMessage.message,\r\n disabled: this.props.disabled,\r\n onBlur: () => {\r\n if (!this.props.name) return\r\n this.props.onBlur && this.props.onBlur(this.props.name)\r\n },\r\n label: this.getLabel(),\r\n placeholder: this.props.placeholder,\r\n InputLabelProps: !!this.state.value ? { shrink: true } : {},\r\n value: this.state.value ?? '',\r\n onChange: this.handleChange\r\n }\r\n if (!tfp.InputProps) tfp.InputProps = {}\r\n tfp.InputProps.endAdornment = (\r\n <InputAdornment position='end'>\r\n {this.slots.pastenable && (\r\n <IconButton onClick={this.handlePaste} edge='end'>\r\n <ContentPasteIcon />\r\n </IconButton>\r\n )}\r\n {this.slots.tooltip && (\r\n <RichTooltip panel={this.slots.tooltip}>\r\n <HelpOutlinePulseIcon fontSize='small' />\r\n </RichTooltip>\r\n )}\r\n </InputAdornment>\r\n )\r\n if (this.slots?.maxLength) tfp.inputProps = { ...tfp.inputProps, maxLength: this.slots.maxLength }\r\n return mergeObjects<TextFieldProps>({}, tfp, this.slots?.textFieldProps)\r\n }\r\n\r\n //#region Render\r\n render() {\r\n return (\r\n <Box sx={{ display: 'flex', alignItems: 'flex-start' }}>\r\n {!!this.props.disabled && <input hidden name={this.props.name?.toString()} defaultValue={this.defaulValue} />}\r\n {this.renderImageSide('left')}\r\n <TextField {...this.mapTextFieldProps()} />\r\n {this.renderImageSide('right')}\r\n </Box>\r\n )\r\n }\r\n\r\n renderImageSide = (side: 'left' | 'right') => {\r\n const image = side === 'left' ? this.slots.imageLeft : this.slots.imageRight\r\n if (!image) return <></>\r\n const { srcGetter, element, alt = 'input-image', fallbackSrc = '', debounceDelay = 700, ...imageOther } = image\r\n if (element) {\r\n const Element = element\r\n return (\r\n <WrapImage>\r\n <Element value={this.state.value} model={this.props.data} />\r\n </WrapImage>\r\n )\r\n }\r\n const src = srcGetter ? srcGetter(this.state.value, this.props.data) : imageOther.src ?? this.state.value\r\n const imageProps: IImageWithFallbackPropsOwner = { src, alt, fallbackSrc, debounceDelay }\r\n return (\r\n <Collapse sx={{ mx: '10px' }} in={!!src} unmountOnExit orientation='horizontal'>\r\n <WrapImage>\r\n <ImageWithFallback {...imageOther} {...imageProps} loading={<LoadingCircularProgress />} />\r\n </WrapImage>\r\n </Collapse>\r\n )\r\n }\r\n //#endregion\r\n\r\n private mergeSlots = (currentSlots?: IInputSlots<T>): IInputSlots<T> => {\r\n const base = mergeObjects<IInputSlots<T>>({}, params, currentSlots)\r\n const { imageLeft, imageRight } = base\r\n\r\n // mirror from left to right\r\n if (imageLeft?.mirror && !imageRight) {\r\n base.imageRight = { ...imageLeft }\r\n delete base.imageRight.mirror\r\n }\r\n // mirror from right to left\r\n else if (imageRight?.mirror && !imageLeft) {\r\n base.imageLeft = { ...imageRight }\r\n delete base.imageLeft.mirror\r\n }\r\n\r\n return base\r\n }\r\n\r\n getLabel = () => {\r\n if (!this.props.label) return\r\n if (!this.slots?.maxLength) return this.props.label\r\n return `${this.props.label} (${this.state.value?.length ?? 0}/${this.slots.maxLength})`\r\n }\r\n\r\n handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\r\n this.setState({ value: event.target.value })\r\n }\r\n\r\n handlePaste = async () => {\r\n try {\r\n const clipboardText = await navigator.clipboard.readText()\r\n this.setState({ value: clipboardText })\r\n } catch (error) {\r\n console.error('Error clipboard:', error)\r\n }\r\n }\r\n }\r\n return InputBase\r\n}\r\n\r\nexport default CreateInput\r\n\r\n// export type InputTextType<T> = ReturnType<typeof CreateInputBase<T>>\r\n\r\nconst LoadingCircularProgress: FC = () => (\r\n <div>\r\n <CircularProgress size={24} />\r\n </div>\r\n)\r\n\r\nconst WrapImage = styled(Box)({\r\n fontSize: '1rem',\r\n height: 'var(--input-base-image-size, 54px)',\r\n width: 'var(--input-base-image-size, 54px)',\r\n position: 'relative',\r\n borderRadius: '8px',\r\n boxShadow: 'rgba(0, 0, 0, 0.16) 0px 1px 4px',\r\n overflow: 'hidden',\r\n '& > img': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n backgroundRepeat: 'no-repeat',\r\n height: '100%',\r\n width: '100%',\r\n backgroundSize: 'contain'\r\n },\r\n '& > div': {\r\n position: 'absolute',\r\n top: 0,\r\n left: 0,\r\n height: '100%',\r\n width: '100%',\r\n background: '#fafafa',\r\n zIndex: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'center'\r\n }\r\n})\r\n"],"names":["CreateInput","params","InputBase","props","_this$mergeSlots","_this","_classCallCheck","_callSuper","_defineProperty","_this$props$name","_this$state$value","_this$slots","_this$slots2","errorMessage","getErrorMessage","messageErrors","name","tfp","fullWidth","variant","toString","error","helperText","message","disabled","onBlur","label","getLabel","placeholder","InputLabelProps","state","value","shrink","onChange","handleChange","InputProps","endAdornment","_jsxs","InputAdornment","position","children","slots","pastenable","_jsx","IconButton","onClick","handlePaste","edge","ContentPasteIcon","tooltip","RichTooltip","panel","HelpOutlinePulseIcon","fontSize","maxLength","inputProps","_objectSpread","mergeObjects","textFieldProps","side","_imageOther$src","image","imageLeft","imageRight","srcGetter","element","_image$alt","alt","_image$fallbackSrc","fallbackSrc","_image$debounceDelay","debounceDelay","imageOther","_objectWithoutProperties","_excluded","WrapImage","model","data","src","imageProps","Collapse","sx","mx","in","unmountOnExit","orientation","ImageWithFallback","loading","LoadingCircularProgress","currentSlots","base","mirror","_this$slots3","_this$state$value$len","_this$state$value2","concat","length","event","setState","target","_asyncToGenerator","_regenerator","m","_callee","clipboardText","_t","w","_context","n","p","navigator","clipboard","readText","v","console","a","_cachedSlots","mergeSlots","defaulValue","_inherits","Component","_createClass","key","get","this","_this$props$defaultVa","_data$name","_this$props","defaultValue","undefined","prevProps","nextProps","_this$props2","_this$props$data$name","_this$props$data","_nextProps$data$name$","_nextProps$data","currentDataValue","nextDataValue","_this$props$name2","Box","display","alignItems","hidden","renderImageSide","TextField","mapTextFieldProps","CircularProgress","size","styled","height","width","borderRadius","boxShadow","overflow","top","left","backgroundRepeat","backgroundSize","background","zIndex","justifyContent"],"mappings":"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"}
@@ -1,7 +1,8 @@
1
1
  import React, { ComponentType } from 'react';
2
2
  import { TextFieldProps } from '@mui/material';
3
3
  import { IFormInputBase } from './types';
4
- import { IImageWithFallbackPropsOwner, IRichTooltipPanelConfig } from '../components';
4
+ import { IImageWithFallbackPropsOwner } from '../components/image-with-fallback';
5
+ import { IRichTooltipPanelConfig } from '../components/rich-tooltip';
5
6
  export interface InputBaseImage<T> extends Partial<IImageWithFallbackPropsOwner> {
6
7
  srcGetter?: (value: any, model?: Partial<T>) => string;
7
8
  element?: React.ComponentType<{
@@ -1,17 +1,20 @@
1
1
  import { ComponentType } from 'react';
2
2
  import { BoxProps, TextFieldProps } from '@mui/material';
3
3
  import { IFormInputBase } from './types';
4
+ import { IRichTooltipPanelConfig } from '../components/rich-tooltip';
4
5
  export interface IInputImageFileSlots {
5
6
  wrapProps?: BoxProps;
6
7
  inputProps?: TextFieldProps;
7
8
  }
8
9
  export interface IInputImageFileProps<T> extends IFormInputBase<T, IInputImageFileSlots> {
10
+ tooltip?: IRichTooltipPanelConfig;
9
11
  }
10
12
  export interface IInputImageFileState {
11
13
  imageUrl?: string;
12
14
  }
13
15
  export interface IInputImageFileParams<T> {
14
16
  imageGetter?: (data?: Partial<T>) => string | undefined;
17
+ tooltip?: IRichTooltipPanelConfig;
15
18
  }
16
19
  declare function createInputImageFile<T>(params?: IInputImageFileParams<T>): ComponentType<IInputImageFileProps<T>>;
17
20
  export default createInputImageFile;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dinocollab-core",
3
- "version": "2.1.11",
3
+ "version": "2.1.12",
4
4
  "description": "Dinocollab core - libraries for building collaborative applications with React 18",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",