@servicetitan/form 32.2.0 → 32.4.0
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 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import { ComponentType, Component, SyntheticEvent } from 'react';\nimport {\n DateRangePicker as DateRangePickerKendo,\n DateRangePickerChangeEvent,\n CalendarHeaderTitleProps,\n MultiViewCalendarProps,\n CalendarCellProps,\n ActiveView,\n} from '@progress/kendo-react-dateinputs';\nimport { Icon, InputDateMask, Stack } from '@servicetitan/design-system';\nimport { DateRange } from '@servicetitan/form-state';\nimport { observable, action, makeObservable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport classnames from 'classnames';\nimport moment from 'moment';\nimport * as Styles from './date-range-picker.module.css';\nimport { FieldState } from 'formstate';\n\nexport interface DateRangePickerProps {\n field: FieldState<DateRange | undefined>;\n ['qa-testing']: string;\n placeHolder?: string;\n minDate?: Date;\n maxDate?: Date;\n calendarMinDate?: Date;\n calendarMaxDate?: Date;\n topView?: ActiveView;\n bottomView?: ActiveView;\n className?: string;\n calendarComponent?: ComponentType<MultiViewCalendarProps>;\n headerTitleComponent?: ComponentType<CalendarHeaderTitleProps>;\n cellComponent?: ComponentType<CalendarCellProps>;\n inputFormat?: string;\n horizontalAlign?: 'left' | 'center' | 'right';\n disabled?: boolean;\n small?: boolean;\n disableRangeValidation?: boolean;\n maskChar?: string;\n}\n\n@observer\nexport class DateRangePicker extends Component<DateRangePickerProps> {\n // `HTMLDivElement` leads to issues with Node/SSR\n @observable wrapElem?: any /* HTMLDivElement */;\n isFocused = false;\n @observable showDatePicker = false;\n isIconClicked = false;\n isDateRangePickerClicked = false;\n\n constructor(props: DateRangePickerProps) {\n super(props);\n makeObservable(this);\n }\n\n @action\n handleRef = (wrapElem: HTMLDivElement) => {\n this.wrapElem = wrapElem;\n };\n\n @action\n toggleShow(show?: boolean) {\n this.showDatePicker = show !== undefined ? show : !this.showDatePicker;\n }\n\n handleClickGlobal = (evt: Event) => {\n if (!(evt.target instanceof Node)) {\n return;\n }\n\n const isPrevFocused = this.isFocused;\n\n this.isFocused = this.isDateRangePickerClicked;\n\n if (!this.isFocused && isPrevFocused) {\n // click outside\n this.props.field.enableAutoValidationAndValidate();\n\n this.toggleShow(false);\n } else if (this.isFocused && !isPrevFocused && !this.isIconClicked) {\n // click inside but outside icons\n this.props.field.disableAutoValidation();\n }\n\n this.isIconClicked = false;\n this.isDateRangePickerClicked = false;\n };\n\n handleClickDateRangePicker = () => {\n this.isDateRangePickerClicked = true;\n };\n\n handleClickIcon = () => {\n this.isIconClicked = true;\n\n if (this.showDatePicker) {\n this.props.field.enableAutoValidationAndValidate();\n } else {\n this.props.field.disableAutoValidation();\n }\n\n this.toggleShow();\n };\n\n componentDidMount() {\n window.addEventListener('click', this.handleClickGlobal);\n }\n\n componentWillUnmount() {\n window.removeEventListener('click', this.handleClickGlobal);\n }\n\n handleChange = (event: DateRangePickerChangeEvent) => {\n const value = event.target.value;\n\n if (value.start && value.end && value.start > value.end) {\n [value.start, value.end] = [value.end, value.start];\n }\n\n this.props.field.onChange({ from: value.start ?? undefined, to: value.end ?? undefined });\n };\n\n handleFromChange = (from?: Date) => {\n const to = this.props.field.value ? this.props.field.value.to : undefined;\n\n if (from || to) {\n this.props.field.onChange({ from, to });\n } else {\n this.props.field.onChange(undefined);\n }\n };\n\n handleToChange = (to?: Date) => {\n const from = this.props.field.value ? this.props.field.value.from : undefined;\n\n if (from || to) {\n this.props.field.onChange({ from, to });\n } else {\n this.props.field.onChange(undefined);\n }\n };\n\n render() {\n const { hasError } = this.props.field;\n const {\n 'qa-testing': qaTestingLocator,\n placeHolder,\n inputFormat,\n className,\n calendarComponent,\n headerTitleComponent,\n cellComponent,\n minDate,\n maxDate,\n calendarMinDate,\n calendarMaxDate,\n topView,\n bottomView,\n horizontalAlign,\n disabled = false,\n small,\n maskChar,\n } = this.props;\n\n const value = this.props.field.value ? this.props.field.value : {};\n\n const horizontalAlignClass = classnames({\n [Styles.popupCenter]: horizontalAlign === 'center',\n [Styles.popupRight]: horizontalAlign === 'right',\n });\n\n return (\n <div\n className={classnames(Styles.dateRangePicker, className)}\n ref={this.handleRef}\n onClick={this.handleClickDateRangePicker}\n >\n <DateRangePickerKendo\n className={Styles.dateRangePickerKendo}\n calendarSettings={{\n min: minDate ?? calendarMinDate,\n max: maxDate ?? calendarMaxDate,\n topView,\n bottomView,\n disabled,\n mode: 'range',\n headerTitle: headerTitleComponent,\n cell: cellComponent,\n }}\n popupSettings={{\n appendTo: this.wrapElem,\n className: horizontalAlignClass,\n }}\n startDateInputSettings={{\n tabIndex: -1,\n }}\n endDateInputSettings={{\n tabIndex: -1,\n }}\n show={this.showDatePicker}\n value={{ start: value.from ?? null, end: value.to ?? null }}\n onChange={this.handleChange}\n min={minDate}\n max={maxDate}\n calendar={calendarComponent}\n />\n <Stack alignItems=\"center\" className=\"flex-grow-1\">\n <Stack.Item fill>\n <InputDateMask\n shortLabel={\n <Icon\n name=\"today\"\n className={classnames(\n Styles.icon,\n `${qaTestingLocator}-icon-from`\n )}\n onClick={this.handleClickIcon}\n />\n }\n placeholder={placeHolder}\n value={value.from}\n onChange={this.handleFromChange}\n onBlur={this.handleFromChange}\n error={hasError}\n disabled={disabled}\n qa-testing={`${qaTestingLocator}-from`}\n dateFormat={inputFormat}\n minDate={minDate}\n maxDate={this.maxFromDate}\n small={small}\n maskChar={maskChar}\n />\n </Stack.Item>\n <Icon name=\"arrow_forward\" className={Styles.endLabel} />\n <Stack.Item fill>\n <InputDateMask\n shortLabel={\n <Icon\n name=\"today\"\n className={classnames(\n Styles.icon,\n `${qaTestingLocator}-icon-to`\n )}\n onClick={this.handleClickIcon}\n />\n }\n placeholder={placeHolder}\n value={value.to}\n onChange={this.handleToChange}\n onBlur={this.handleToChange}\n error={hasError}\n disabled={disabled}\n qa-testing={`${qaTestingLocator}-to`}\n dateFormat={inputFormat}\n minDate={this.minToDate}\n maxDate={maxDate}\n small={small}\n maskChar={maskChar}\n />\n </Stack.Item>\n </Stack>\n <input\n hidden\n // eslint-disable-next-line react/no-unknown-property\n qa-testing={qaTestingLocator}\n onChange={this.handleHiddenInputChange}\n />\n </div>\n );\n }\n\n formatDate(date?: Date, inputFormat = 'L') {\n return date ? moment(date).format(inputFormat) : '';\n }\n\n handleHiddenInputChange = (ev: SyntheticEvent<HTMLInputElement>) => {\n const values = ev.currentTarget.value.split('-').map(v => new Date(v));\n this.props.field.onChange({ from: values[0] || undefined, to: values[1] || undefined });\n };\n\n get maxFromDate() {\n const { disableRangeValidation, maxDate, field } = this.props;\n if (disableRangeValidation) {\n return maxDate;\n }\n\n const to = field.value ? field.value.to : undefined;\n\n if (maxDate && to) {\n return maxDate > to ? to : maxDate;\n }\n\n return maxDate ?? to;\n }\n\n get minToDate() {\n const { disableRangeValidation, minDate, field } = this.props;\n if (disableRangeValidation) {\n return minDate;\n }\n\n const from = field.value ? field.value.from : undefined;\n if (minDate && from) {\n return minDate < from ? from : minDate;\n }\n\n return minDate ?? from;\n }\n}\n"],"names":["Component","DateRangePicker","DateRangePickerKendo","Icon","InputDateMask","Stack","observable","action","makeObservable","observer","classnames","moment","Styles","toggleShow","show","showDatePicker","undefined","componentDidMount","window","addEventListener","handleClickGlobal","componentWillUnmount","removeEventListener","render","hasError","props","field","qaTestingLocator","placeHolder","inputFormat","className","calendarComponent","headerTitleComponent","cellComponent","minDate","maxDate","calendarMinDate","calendarMaxDate","topView","bottomView","horizontalAlign","disabled","small","maskChar","value","horizontalAlignClass","popupCenter","popupRight","div","dateRangePicker","ref","handleRef","onClick","handleClickDateRangePicker","dateRangePickerKendo","calendarSettings","min","max","mode","headerTitle","cell","popupSettings","appendTo","wrapElem","startDateInputSettings","tabIndex","endDateInputSettings","start","from","end","to","onChange","handleChange","calendar","alignItems","Item","fill","shortLabel","name","icon","handleClickIcon","placeholder","handleFromChange","onBlur","error","qa-testing","dateFormat","maxFromDate","endLabel","handleToChange","minToDate","input","hidden","handleHiddenInputChange","formatDate","date","format","disableRangeValidation","constructor","isFocused","isIconClicked","isDateRangePickerClicked","evt","target","Node","isPrevFocused","enableAutoValidationAndValidate","disableAutoValidation","event","ev","values","currentTarget","split","map","v","Date"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import { ComponentType, Component, SyntheticEvent } from 'react';\nimport {\n DateRangePicker as DateRangePickerKendo,\n DateRangePickerChangeEvent,\n CalendarHeaderTitleProps,\n MultiViewCalendarProps,\n CalendarCellProps,\n ActiveView,\n} from '@progress/kendo-react-dateinputs';\nimport { Icon, InputDateMask, Stack } from '@servicetitan/design-system';\nimport { DateRange } from '@servicetitan/form-state';\nimport { observable, action, makeObservable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport classnames from 'classnames';\nimport moment from 'moment';\nimport * as Styles from './date-range-picker.module.css';\nimport { FieldState } from 'formstate';\n\nexport interface DateRangePickerProps {\n field: FieldState<DateRange | undefined>;\n ['qa-testing']: string;\n placeHolder?: string;\n minDate?: Date;\n maxDate?: Date;\n calendarMinDate?: Date;\n calendarMaxDate?: Date;\n topView?: ActiveView;\n bottomView?: ActiveView;\n className?: string;\n calendarComponent?: ComponentType<MultiViewCalendarProps>;\n headerTitleComponent?: ComponentType<CalendarHeaderTitleProps>;\n cellComponent?: ComponentType<CalendarCellProps>;\n inputFormat?: string;\n horizontalAlign?: 'left' | 'center' | 'right';\n disabled?: boolean;\n small?: boolean;\n disableRangeValidation?: boolean;\n maskChar?: string;\n}\n\n@observer\nexport class DateRangePicker extends Component<DateRangePickerProps> {\n // `HTMLDivElement` leads to issues with Node/SSR\n @observable wrapElem?: any /* HTMLDivElement */;\n isFocused = false;\n @observable showDatePicker = false;\n isIconClicked = false;\n isDateRangePickerClicked = false;\n\n constructor(props: DateRangePickerProps) {\n super(props);\n makeObservable(this);\n }\n\n @action\n handleRef = (wrapElem: HTMLDivElement) => {\n this.wrapElem = wrapElem;\n };\n\n @action\n toggleShow(show?: boolean) {\n this.showDatePicker = show !== undefined ? show : !this.showDatePicker;\n }\n\n handleClickGlobal = (evt: Event) => {\n if (!(evt.target instanceof Node)) {\n return;\n }\n\n const isPrevFocused = this.isFocused;\n\n this.isFocused = this.isDateRangePickerClicked;\n\n if (!this.isFocused && isPrevFocused) {\n // click outside\n this.props.field.enableAutoValidationAndValidate();\n\n this.toggleShow(false);\n } else if (this.isFocused && !isPrevFocused && !this.isIconClicked) {\n // click inside but outside icons\n this.props.field.disableAutoValidation();\n }\n\n this.isIconClicked = false;\n this.isDateRangePickerClicked = false;\n };\n\n handleClickDateRangePicker = () => {\n this.isDateRangePickerClicked = true;\n };\n\n handleClickIcon = () => {\n this.isIconClicked = true;\n\n if (this.showDatePicker) {\n this.props.field.enableAutoValidationAndValidate();\n } else {\n this.props.field.disableAutoValidation();\n }\n\n this.toggleShow();\n };\n\n componentDidMount() {\n window.addEventListener('click', this.handleClickGlobal);\n }\n\n componentWillUnmount() {\n window.removeEventListener('click', this.handleClickGlobal);\n }\n\n handleChange = (event: DateRangePickerChangeEvent) => {\n const value = event.target.value;\n\n if (value.start && value.end && value.start > value.end) {\n [value.start, value.end] = [value.end, value.start];\n }\n\n this.props.field.onChange({ from: value.start ?? undefined, to: value.end ?? undefined });\n };\n\n handleFromChange = (from?: Date) => {\n const to = this.props.field.value ? this.props.field.value.to : undefined;\n\n if (from || to) {\n this.props.field.onChange({ from, to });\n } else {\n this.props.field.onChange(undefined);\n }\n };\n\n handleToChange = (to?: Date) => {\n const from = this.props.field.value ? this.props.field.value.from : undefined;\n\n if (from || to) {\n this.props.field.onChange({ from, to });\n } else {\n this.props.field.onChange(undefined);\n }\n };\n\n render() {\n const { hasError } = this.props.field;\n const {\n 'qa-testing': qaTestingLocator,\n placeHolder,\n inputFormat,\n className,\n calendarComponent,\n headerTitleComponent,\n cellComponent,\n minDate,\n maxDate,\n calendarMinDate,\n calendarMaxDate,\n topView,\n bottomView,\n horizontalAlign,\n disabled = false,\n small,\n maskChar,\n } = this.props;\n\n const value = this.props.field.value ? this.props.field.value : {};\n\n const horizontalAlignClass = classnames({\n [Styles.popupCenter]: horizontalAlign === 'center',\n [Styles.popupRight]: horizontalAlign === 'right',\n });\n\n return (\n <div\n className={classnames(Styles.dateRangePicker, className)}\n ref={this.handleRef}\n onClick={this.handleClickDateRangePicker}\n >\n <DateRangePickerKendo\n className={Styles.dateRangePickerKendo}\n calendarSettings={{\n min: minDate ?? calendarMinDate,\n max: maxDate ?? calendarMaxDate,\n topView,\n bottomView,\n disabled,\n mode: 'range',\n headerTitle: headerTitleComponent,\n cell: cellComponent,\n }}\n popupSettings={{\n appendTo: this.wrapElem,\n className: horizontalAlignClass,\n }}\n startDateInputSettings={{\n tabIndex: -1,\n }}\n endDateInputSettings={{\n tabIndex: -1,\n }}\n show={this.showDatePicker}\n value={{ start: value.from ?? null, end: value.to ?? null }}\n onChange={this.handleChange}\n min={minDate}\n max={maxDate}\n calendar={calendarComponent}\n />\n <Stack alignItems=\"center\" className=\"flex-grow-1\">\n <Stack.Item fill>\n <InputDateMask\n shortLabel={\n <Icon\n name=\"today\"\n className={classnames(\n Styles.icon,\n `${qaTestingLocator}-icon-from`\n )}\n onClick={this.handleClickIcon}\n />\n }\n placeholder={placeHolder}\n value={value.from}\n onChange={this.handleFromChange}\n onBlur={this.handleFromChange}\n error={hasError}\n disabled={disabled}\n qa-testing={`${qaTestingLocator}-from`}\n dateFormat={inputFormat}\n minDate={minDate}\n maxDate={this.maxFromDate}\n small={small}\n maskChar={maskChar}\n />\n </Stack.Item>\n <Icon name=\"arrow_forward\" className={Styles.endLabel} />\n <Stack.Item fill>\n <InputDateMask\n shortLabel={\n <Icon\n name=\"today\"\n className={classnames(\n Styles.icon,\n `${qaTestingLocator}-icon-to`\n )}\n onClick={this.handleClickIcon}\n />\n }\n placeholder={placeHolder}\n value={value.to}\n onChange={this.handleToChange}\n onBlur={this.handleToChange}\n error={hasError}\n disabled={disabled}\n qa-testing={`${qaTestingLocator}-to`}\n dateFormat={inputFormat}\n minDate={this.minToDate}\n maxDate={maxDate}\n small={small}\n maskChar={maskChar}\n />\n </Stack.Item>\n </Stack>\n <input\n hidden\n // eslint-disable-next-line react/no-unknown-property\n qa-testing={qaTestingLocator}\n onChange={this.handleHiddenInputChange}\n />\n </div>\n );\n }\n\n formatDate(date?: Date, inputFormat = 'L') {\n return date ? moment(date).format(inputFormat) : '';\n }\n\n handleHiddenInputChange = (ev: SyntheticEvent<HTMLInputElement>) => {\n const values = ev.currentTarget.value.split('-').map(v => new Date(v));\n this.props.field.onChange({ from: values[0] || undefined, to: values[1] || undefined });\n };\n\n get maxFromDate() {\n const { disableRangeValidation, maxDate, field } = this.props;\n if (disableRangeValidation) {\n return maxDate;\n }\n\n const to = field.value ? field.value.to : undefined;\n\n if (maxDate && to) {\n return maxDate > to ? to : maxDate;\n }\n\n return maxDate ?? to;\n }\n\n get minToDate() {\n const { disableRangeValidation, minDate, field } = this.props;\n if (disableRangeValidation) {\n return minDate;\n }\n\n const from = field.value ? field.value.from : undefined;\n if (minDate && from) {\n return minDate < from ? from : minDate;\n }\n\n return minDate ?? from;\n }\n}\n"],"names":["Component","DateRangePicker","DateRangePickerKendo","Icon","InputDateMask","Stack","observable","action","makeObservable","observer","classnames","moment","Styles","toggleShow","show","showDatePicker","undefined","componentDidMount","window","addEventListener","handleClickGlobal","componentWillUnmount","removeEventListener","render","hasError","props","field","qaTestingLocator","placeHolder","inputFormat","className","calendarComponent","headerTitleComponent","cellComponent","minDate","maxDate","calendarMinDate","calendarMaxDate","topView","bottomView","horizontalAlign","disabled","small","maskChar","value","horizontalAlignClass","popupCenter","popupRight","div","dateRangePicker","ref","handleRef","onClick","handleClickDateRangePicker","dateRangePickerKendo","calendarSettings","min","max","mode","headerTitle","cell","popupSettings","appendTo","wrapElem","startDateInputSettings","tabIndex","endDateInputSettings","start","from","end","to","onChange","handleChange","calendar","alignItems","Item","fill","shortLabel","name","icon","handleClickIcon","placeholder","handleFromChange","onBlur","error","qa-testing","dateFormat","maxFromDate","endLabel","handleToChange","minToDate","input","hidden","handleHiddenInputChange","formatDate","date","format","disableRangeValidation","isFocused","isIconClicked","isDateRangePickerClicked","evt","target","Node","isPrevFocused","enableAutoValidationAndValidate","disableAutoValidation","event","ev","values","currentTarget","split","map","v","Date"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/file-uploader/file-uploader.tsx"],"sourcesContent":["import { Component, Fragment, FC } from 'react';\n\nimport { injectDependency, optional } from '@servicetitan/react-ioc';\n\nimport { observer } from 'mobx-react';\nimport { observable, action, makeObservable } from 'mobx';\n\nimport { FilePicker, FileDescriptor, Banner, FilePickerProps } from '@servicetitan/design-system';\nimport { Confirm } from '@servicetitan/confirm';\n\nimport { FileUploaderConfig, FILE_UPLOADER_CONFIGURATION_TOKEN } from './config';\nimport { Uploader } from './uploader';\n\nimport { v4 as uuid } from 'uuid';\n\nfunction immutableSplice<T>(arr: T[], start: number, deleteCount: number, ...items: T[]) {\n return [...arr.slice(0, start), ...items, ...arr.slice(start + deleteCount)];\n}\n\ninterface UploadError {\n id: string;\n file: File;\n message?: string;\n}\n\ninterface UploadErrorsProps {\n errors: UploadError[];\n multiple?: boolean;\n className?: string;\n onClose(): void;\n}\n\nconst UploadErrors: FC<UploadErrorsProps> = ({ errors, className, onClose, multiple }) => {\n const title = multiple\n ? 'One or more files could not be uploaded:'\n : 'Your file could not be uploaded';\n\n return (\n <Banner icon status=\"critical\" title={title} className={className} onClose={onClose}>\n <ul className=\"p-x-0-i\">\n {errors.map(({ id, file, message }) => (\n <li key={id} style={!multiple ? { listStyle: 'none' } : {}}>\n {multiple && file.name}\n {message && (multiple ? ` (${message})` : message)}\n </li>\n ))}\n </ul>\n </Banner>\n );\n};\n\ntype ExcludedFilePickerProps = 'onDelete' | 'onDownload' | 'onReplace' | 'onSelected' | 'value';\n\ninterface FileUploaderProps extends Omit<FilePickerProps, ExcludedFilePickerProps> {\n config?: FileUploaderConfig;\n value: FileDescriptor[];\n folderName?: string;\n hideReplace?: boolean;\n hideDownload?: boolean;\n onChange?(value: FileDescriptor[]): void;\n}\n\n@observer\nexport class FileUploader extends Component<FileUploaderProps> {\n static defaultProps = {\n folderName: 'temp',\n };\n\n @injectDependency(FILE_UPLOADER_CONFIGURATION_TOKEN)\n @optional()\n declare config?: FileUploaderConfig;\n\n @observable errors: UploadError[] = [];\n\n uploader!: Uploader;\n\n constructor(props: FileUploaderProps) {\n super(props);\n makeObservable(this);\n }\n\n @action\n addError(file: File, message?: string) {\n this.errors.push({\n file,\n message,\n id: uuid(),\n });\n }\n\n @action\n clearErrors() {\n this.errors = [];\n }\n\n @action\n handleUploadProgress = (file: File, progress: number) => {\n if (!this.props.onChange) {\n return;\n }\n\n const index = this.props.value.findIndex(fileDescriptor => fileDescriptor.file === file);\n if (index !== -1) {\n this.props.onChange(\n immutableSplice(this.props.value, index, 1, {\n ...this.props.value[index],\n uploadProgress: progress,\n })\n );\n } else {\n this.uploader.cancel(file);\n }\n };\n\n @action\n handleUploadSuccess = (file: File, message?: string) => {\n if (!this.props.onChange) {\n return;\n }\n\n const index = this.props.value.findIndex(fileDescriptor => fileDescriptor.file === file);\n if (index !== -1) {\n this.props.onChange(\n immutableSplice(this.props.value, index, 1, {\n ...this.props.value[index],\n ...(message\n ? { file: message, displayName: file.name, downloadLink: message }\n : { file: file.name }),\n uploadProgress: undefined,\n })\n );\n }\n };\n\n @action\n handleUploadError = (file: File, message?: string) => {\n if (!this.props.onChange) {\n return;\n }\n\n this.addError(file, message);\n\n this.props.onChange(\n this.props.value.filter(fileDescriptor => fileDescriptor.file !== file)\n );\n };\n\n componentDidMount() {\n this.uploader = new Uploader(\n {\n ...this.config,\n ...this.props.config,\n },\n {\n progress: this.handleUploadProgress,\n success: this.handleUploadSuccess,\n error: this.handleUploadError,\n },\n this.props.folderName\n );\n }\n\n componentWillUnmount() {\n this.uploader.cancel();\n }\n\n handleDownload = (file: FileDescriptor) => {\n if (!file.downloadLink) {\n return;\n }\n\n const path =\n this.props.config?.downloadPath ??\n this.config?.downloadPath ??\n `/app/api/fileuploader/folders/${this.props.folderName}/files/`;\n\n window.open(path + file.downloadLink);\n };\n\n handleSelected = (files: FileList) => {\n if (!this.props.onChange) {\n return;\n }\n\n this.props.onChange([\n ...this.props.value,\n ...Array.from(files).map(file => ({\n file,\n uploadProgress: 0,\n })),\n ]);\n this.uploader.upload(files);\n };\n\n handleReplace = ({ file: { file }, newFile }: { file: FileDescriptor; newFile: File }) => {\n if (!this.props.onChange) {\n return;\n }\n\n const index = this.props.value.findIndex(fileDescriptor => fileDescriptor.file === file);\n if (index !== -1) {\n this.uploader.upload(newFile);\n\n this.props.onChange(\n immutableSplice(this.props.value, index, 1, {\n file: newFile,\n uploadProgress: 0,\n })\n );\n }\n };\n\n handleDelete = ({ file }: FileDescriptor) => {\n if (!this.props.onChange) {\n return;\n }\n\n this.props.onChange(\n this.props.value.filter(fileDescriptor => fileDescriptor.file !== file)\n );\n };\n\n handleErrorsClose = () => {\n this.clearErrors();\n };\n\n render() {\n const {\n value,\n onChange,\n hideReplace,\n hideDownload,\n limitReached,\n multiple,\n config,\n folderName,\n ...rest\n } = this.props;\n\n if (!onChange && !value.length) {\n return null;\n }\n\n const readonlyProps = onChange\n ? {}\n : {\n onReplace: undefined,\n onDelete: undefined,\n limitReached: true,\n };\n\n return (\n <Fragment>\n {!!this.errors.length && (\n <UploadErrors\n errors={this.errors}\n onClose={this.handleErrorsClose}\n className=\"m-b-2\"\n multiple={multiple}\n />\n )}\n <Confirm\n onConfirm={this.handleDelete}\n title=\"Are you sure you want to delete this file?\"\n >\n {onDelete => (\n <FilePicker\n value={value.length ? value : undefined}\n onReplace={!hideReplace ? this.handleReplace : undefined}\n onSelected={this.handleSelected}\n onDelete={onDelete}\n onDownload={!hideDownload ? this.handleDownload : undefined}\n limitReached={limitReached}\n multiple={multiple}\n {...rest}\n {...readonlyProps}\n />\n )}\n </Confirm>\n </Fragment>\n );\n }\n}\n"],"names":["Component","Fragment","injectDependency","optional","observer","observable","action","makeObservable","FilePicker","Banner","Confirm","FileUploaderConfig","FILE_UPLOADER_CONFIGURATION_TOKEN","Uploader","v4","uuid","immutableSplice","arr","start","deleteCount","items","slice","UploadErrors","errors","className","onClose","multiple","title","icon","status","ul","map","id","file","message","li","style","listStyle","name","FileUploader","addError","push","clearErrors","componentDidMount","uploader","config","props","progress","handleUploadProgress","success","handleUploadSuccess","error","handleUploadError","folderName","componentWillUnmount","cancel","render","value","onChange","hideReplace","hideDownload","limitReached","rest","length","readonlyProps","onReplace","undefined","onDelete","handleErrorsClose","onConfirm","handleDelete","handleReplace","onSelected","handleSelected","onDownload","handleDownload","constructor","index","findIndex","fileDescriptor","uploadProgress","displayName","downloadLink","filter","path","downloadPath","window","open","files","Array","from","upload","newFile","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAY,QAAQ;AAEhD,SAASC,gBAAgB,EAAEC,QAAQ,QAAQ,0BAA0B;AAErE,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAASC,UAAU,EAAEC,MAAM,EAAEC,cAAc,QAAQ,OAAO;AAE1D,SAASC,UAAU,EAAkBC,MAAM,QAAyB,8BAA8B;AAClG,SAASC,OAAO,QAAQ,wBAAwB;AAEhD,SAASC,kBAAkB,EAAEC,iCAAiC,QAAQ,WAAW;AACjF,SAASC,QAAQ,QAAQ,aAAa;AAEtC,SAASC,MAAMC,IAAI,QAAQ,OAAO;AAElC,SAASC,gBAAmBC,GAAQ,EAAEC,KAAa,EAAEC,WAAmB,EAAE,GAAGC,KAAU;IACnF,OAAO;WAAIH,IAAII,KAAK,CAAC,GAAGH;WAAWE;WAAUH,IAAII,KAAK,CAACH,QAAQC;KAAa;AAChF;AAeA,MAAMG,eAAsC,CAAC,EAAEC,MAAM,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,EAAE;IACjF,MAAMC,QAAQD,WACR,6CACA;IAEN,qBACI,KAACjB;QAAOmB,IAAI;QAACC,QAAO;QAAWF,OAAOA;QAAOH,WAAWA;QAAWC,SAASA;kBACxE,cAAA,KAACK;YAAGN,WAAU;sBACTD,OAAOQ,GAAG,CAAC,CAAC,EAAEC,EAAE,EAAEC,IAAI,EAAEC,OAAO,EAAE,iBAC9B,MAACC;oBAAYC,OAAO,CAACV,WAAW;wBAAEW,WAAW;oBAAO,IAAI,CAAC;;wBACpDX,YAAYO,KAAKK,IAAI;wBACrBJ,WAAYR,CAAAA,WAAW,CAAC,EAAE,EAAEQ,QAAQ,CAAC,CAAC,GAAGA,OAAM;;mBAF3CF;;;AAQ7B;AAcA,OAAO,MAAMO,qBAAqBvC;IAmB9BwC,SAASP,IAAU,EAAEC,OAAgB,EAAE;QACnC,IAAI,CAACX,MAAM,CAACkB,IAAI,CAAC;YACbR;YACAC;YACAF,IAAIjB;QACR;IACJ;IAGA2B,cAAc;QACV,IAAI,CAACnB,MAAM,GAAG,EAAE;IACpB;IAsDAoB,oBAAoB;QAChB,IAAI,CAACC,QAAQ,GAAG,IAAI/B,SAChB;YACI,GAAG,IAAI,CAACgC,MAAM;YACd,GAAG,IAAI,CAACC,KAAK,CAACD,MAAM;QACxB,GACA;YACIE,UAAU,IAAI,CAACC,oBAAoB;YACnCC,SAAS,IAAI,CAACC,mBAAmB;YACjCC,OAAO,IAAI,CAACC,iBAAiB;QACjC,GACA,IAAI,CAACN,KAAK,CAACO,UAAU;IAE7B;IAEAC,uBAAuB;QACnB,IAAI,CAACV,QAAQ,CAACW,MAAM;IACxB;IA8DAC,SAAS;QACL,MAAM,EACFC,KAAK,EACLC,QAAQ,EACRC,WAAW,EACXC,YAAY,EACZC,YAAY,EACZnC,QAAQ,EACRmB,MAAM,EACNQ,UAAU,EACV,GAAGS,MACN,GAAG,IAAI,CAAChB,KAAK;QAEd,IAAI,CAACY,YAAY,CAACD,MAAMM,MAAM,EAAE;YAC5B,OAAO;QACX;QAEA,MAAMC,gBAAgBN,WAChB,CAAC,IACD;YACIO,WAAWC;YACXC,UAAUD;YACVL,cAAc;QAClB;QAEN,qBACI,MAAC5D;;gBACI,CAAC,CAAC,IAAI,CAACsB,MAAM,CAACwC,MAAM,kBACjB,KAACzC;oBACGC,QAAQ,IAAI,CAACA,MAAM;oBACnBE,SAAS,IAAI,CAAC2C,iBAAiB;oBAC/B5C,WAAU;oBACVE,UAAUA;;8BAGlB,KAAChB;oBACG2D,WAAW,IAAI,CAACC,YAAY;oBAC5B3C,OAAM;8BAELwC,CAAAA,yBACG,KAAC3D;4BACGiD,OAAOA,MAAMM,MAAM,GAAGN,QAAQS;4BAC9BD,WAAW,CAACN,cAAc,IAAI,CAACY,aAAa,GAAGL;4BAC/CM,YAAY,IAAI,CAACC,cAAc;4BAC/BN,UAAUA;4BACVO,YAAY,CAACd,eAAe,IAAI,CAACe,cAAc,GAAGT;4BAClDL,cAAcA;4BACdnC,UAAUA;4BACT,GAAGoC,IAAI;4BACP,GAAGE,aAAa;;;;;IAMzC;IA7MAY,YAAY9B,KAAwB,CAAE;QAClC,KAAK,CAACA,QALV,uBAAYvB,UAAwB,EAAE,GAEtCqB,uBAAAA,YAAAA,KAAAA,IAqBA,uBACAI,wBAAuB,CAACf,MAAYc;YAChC,IAAI,CAAC,IAAI,CAACD,KAAK,CAACY,QAAQ,EAAE;gBACtB;YACJ;YAEA,MAAMmB,QAAQ,IAAI,CAAC/B,KAAK,CAACW,KAAK,CAACqB,SAAS,CAACC,CAAAA,iBAAkBA,eAAe9C,IAAI,KAAKA;YACnF,IAAI4C,UAAU,CAAC,GAAG;gBACd,IAAI,CAAC/B,KAAK,CAACY,QAAQ,CACf1C,gBAAgB,IAAI,CAAC8B,KAAK,CAACW,KAAK,EAAEoB,OAAO,GAAG;oBACxC,GAAG,IAAI,CAAC/B,KAAK,CAACW,KAAK,CAACoB,MAAM;oBAC1BG,gBAAgBjC;gBACpB;YAER,OAAO;gBACH,IAAI,CAACH,QAAQ,CAACW,MAAM,CAACtB;YACzB;QACJ,IAEA,uBACAiB,uBAAsB,CAACjB,MAAYC;YAC/B,IAAI,CAAC,IAAI,CAACY,KAAK,CAACY,QAAQ,EAAE;gBACtB;YACJ;YAEA,MAAMmB,QAAQ,IAAI,CAAC/B,KAAK,CAACW,KAAK,CAACqB,SAAS,CAACC,CAAAA,iBAAkBA,eAAe9C,IAAI,KAAKA;YACnF,IAAI4C,UAAU,CAAC,GAAG;gBACd,IAAI,CAAC/B,KAAK,CAACY,QAAQ,CACf1C,gBAAgB,IAAI,CAAC8B,KAAK,CAACW,KAAK,EAAEoB,OAAO,GAAG;oBACxC,GAAG,IAAI,CAAC/B,KAAK,CAACW,KAAK,CAACoB,MAAM;oBAC1B,GAAI3C,UACE;wBAAED,MAAMC;wBAAS+C,aAAahD,KAAKK,IAAI;wBAAE4C,cAAchD;oBAAQ,IAC/D;wBAAED,MAAMA,KAAKK,IAAI;oBAAC,CAAC;oBACzB0C,gBAAgBd;gBACpB;YAER;QACJ,IAEA,uBACAd,qBAAoB,CAACnB,MAAYC;YAC7B,IAAI,CAAC,IAAI,CAACY,KAAK,CAACY,QAAQ,EAAE;gBACtB;YACJ;YAEA,IAAI,CAAClB,QAAQ,CAACP,MAAMC;YAEpB,IAAI,CAACY,KAAK,CAACY,QAAQ,CACf,IAAI,CAACZ,KAAK,CAACW,KAAK,CAAC0B,MAAM,CAACJ,CAAAA,iBAAkBA,eAAe9C,IAAI,KAAKA;QAE1E,IAqBA0C,uBAAAA,kBAAiB,CAAC1C;gBAMV,oBACA;YANJ,IAAI,CAACA,KAAKiD,YAAY,EAAE;gBACpB;YACJ;gBAGI,iCAAA;YADJ,MAAME,OACF,CAAA,OAAA,CAAA,mCAAA,qBAAA,IAAI,CAACtC,KAAK,CAACD,MAAM,cAAjB,yCAAA,mBAAmBwC,YAAY,cAA/B,6CAAA,mCACA,eAAA,IAAI,CAACxC,MAAM,cAAX,mCAAA,aAAawC,YAAY,cADzB,kBAAA,OAEA,CAAC,8BAA8B,EAAE,IAAI,CAACvC,KAAK,CAACO,UAAU,CAAC,OAAO,CAAC;YAEnEiC,OAAOC,IAAI,CAACH,OAAOnD,KAAKiD,YAAY;QACxC,IAEAT,uBAAAA,kBAAiB,CAACe;YACd,IAAI,CAAC,IAAI,CAAC1C,KAAK,CAACY,QAAQ,EAAE;gBACtB;YACJ;YAEA,IAAI,CAACZ,KAAK,CAACY,QAAQ,CAAC;mBACb,IAAI,CAACZ,KAAK,CAACW,KAAK;mBAChBgC,MAAMC,IAAI,CAACF,OAAOzD,GAAG,CAACE,CAAAA,OAAS,CAAA;wBAC9BA;wBACA+C,gBAAgB;oBACpB,CAAA;aACH;YACD,IAAI,CAACpC,QAAQ,CAAC+C,MAAM,CAACH;QACzB,IAEAjB,uBAAAA,iBAAgB,CAAC,EAAEtC,MAAM,EAAEA,IAAI,EAAE,EAAE2D,OAAO,EAA2C;YACjF,IAAI,CAAC,IAAI,CAAC9C,KAAK,CAACY,QAAQ,EAAE;gBACtB;YACJ;YAEA,MAAMmB,QAAQ,IAAI,CAAC/B,KAAK,CAACW,KAAK,CAACqB,SAAS,CAACC,CAAAA,iBAAkBA,eAAe9C,IAAI,KAAKA;YACnF,IAAI4C,UAAU,CAAC,GAAG;gBACd,IAAI,CAACjC,QAAQ,CAAC+C,MAAM,CAACC;gBAErB,IAAI,CAAC9C,KAAK,CAACY,QAAQ,CACf1C,gBAAgB,IAAI,CAAC8B,KAAK,CAACW,KAAK,EAAEoB,OAAO,GAAG;oBACxC5C,MAAM2D;oBACNZ,gBAAgB;gBACpB;YAER;QACJ,IAEAV,uBAAAA,gBAAe,CAAC,EAAErC,IAAI,EAAkB;YACpC,IAAI,CAAC,IAAI,CAACa,KAAK,CAACY,QAAQ,EAAE;gBACtB;YACJ;YAEA,IAAI,CAACZ,KAAK,CAACY,QAAQ,CACf,IAAI,CAACZ,KAAK,CAACW,KAAK,CAAC0B,MAAM,CAACJ,CAAAA,iBAAkBA,eAAe9C,IAAI,KAAKA;QAE1E,IAEAmC,uBAAAA,qBAAoB;YAChB,IAAI,CAAC1B,WAAW;QACpB;QAlJInC,eAAe,IAAI;IACvB;AA2MJ;AA1NI,iBADSgC,cACFsD,gBAAe;IAClBxC,YAAY;AAChB"}
|
|
1
|
+
{"version":3,"sources":["../../src/file-uploader/file-uploader.tsx"],"sourcesContent":["import { Component, Fragment, FC } from 'react';\n\nimport { injectDependency, optional } from '@servicetitan/react-ioc';\n\nimport { observer } from 'mobx-react';\nimport { observable, action, makeObservable } from 'mobx';\n\nimport { FilePicker, FileDescriptor, Banner, FilePickerProps } from '@servicetitan/design-system';\nimport { Confirm } from '@servicetitan/confirm';\n\nimport { FileUploaderConfig, FILE_UPLOADER_CONFIGURATION_TOKEN } from './config';\nimport { Uploader } from './uploader';\n\nimport { v4 as uuid } from 'uuid';\n\nfunction immutableSplice<T>(arr: T[], start: number, deleteCount: number, ...items: T[]) {\n return [...arr.slice(0, start), ...items, ...arr.slice(start + deleteCount)];\n}\n\ninterface UploadError {\n id: string;\n file: File;\n message?: string;\n}\n\ninterface UploadErrorsProps {\n errors: UploadError[];\n multiple?: boolean;\n className?: string;\n onClose(): void;\n}\n\nconst UploadErrors: FC<UploadErrorsProps> = ({ errors, className, onClose, multiple }) => {\n const title = multiple\n ? 'One or more files could not be uploaded:'\n : 'Your file could not be uploaded';\n\n return (\n <Banner icon status=\"critical\" title={title} className={className} onClose={onClose}>\n <ul className=\"p-x-0-i\">\n {errors.map(({ id, file, message }) => (\n <li key={id} style={!multiple ? { listStyle: 'none' } : {}}>\n {multiple && file.name}\n {message && (multiple ? ` (${message})` : message)}\n </li>\n ))}\n </ul>\n </Banner>\n );\n};\n\ntype ExcludedFilePickerProps = 'onDelete' | 'onDownload' | 'onReplace' | 'onSelected' | 'value';\n\ninterface FileUploaderProps extends Omit<FilePickerProps, ExcludedFilePickerProps> {\n config?: FileUploaderConfig;\n value: FileDescriptor[];\n folderName?: string;\n hideReplace?: boolean;\n hideDownload?: boolean;\n onChange?(value: FileDescriptor[]): void;\n}\n\n@observer\nexport class FileUploader extends Component<FileUploaderProps> {\n static defaultProps = {\n folderName: 'temp',\n };\n\n @injectDependency(FILE_UPLOADER_CONFIGURATION_TOKEN)\n @optional()\n declare config?: FileUploaderConfig;\n\n @observable errors: UploadError[] = [];\n\n uploader!: Uploader;\n\n constructor(props: FileUploaderProps) {\n super(props);\n makeObservable(this);\n }\n\n @action\n addError(file: File, message?: string) {\n this.errors.push({\n file,\n message,\n id: uuid(),\n });\n }\n\n @action\n clearErrors() {\n this.errors = [];\n }\n\n @action\n handleUploadProgress = (file: File, progress: number) => {\n if (!this.props.onChange) {\n return;\n }\n\n const index = this.props.value.findIndex(fileDescriptor => fileDescriptor.file === file);\n if (index !== -1) {\n this.props.onChange(\n immutableSplice(this.props.value, index, 1, {\n ...this.props.value[index],\n uploadProgress: progress,\n })\n );\n } else {\n this.uploader.cancel(file);\n }\n };\n\n @action\n handleUploadSuccess = (file: File, message?: string) => {\n if (!this.props.onChange) {\n return;\n }\n\n const index = this.props.value.findIndex(fileDescriptor => fileDescriptor.file === file);\n if (index !== -1) {\n this.props.onChange(\n immutableSplice(this.props.value, index, 1, {\n ...this.props.value[index],\n ...(message\n ? { file: message, displayName: file.name, downloadLink: message }\n : { file: file.name }),\n uploadProgress: undefined,\n })\n );\n }\n };\n\n @action\n handleUploadError = (file: File, message?: string) => {\n if (!this.props.onChange) {\n return;\n }\n\n this.addError(file, message);\n\n this.props.onChange(\n this.props.value.filter(fileDescriptor => fileDescriptor.file !== file)\n );\n };\n\n componentDidMount() {\n this.uploader = new Uploader(\n {\n ...this.config,\n ...this.props.config,\n },\n {\n progress: this.handleUploadProgress,\n success: this.handleUploadSuccess,\n error: this.handleUploadError,\n },\n this.props.folderName\n );\n }\n\n componentWillUnmount() {\n this.uploader.cancel();\n }\n\n handleDownload = (file: FileDescriptor) => {\n if (!file.downloadLink) {\n return;\n }\n\n const path =\n this.props.config?.downloadPath ??\n this.config?.downloadPath ??\n `/app/api/fileuploader/folders/${this.props.folderName}/files/`;\n\n window.open(path + file.downloadLink);\n };\n\n handleSelected = (files: FileList) => {\n if (!this.props.onChange) {\n return;\n }\n\n this.props.onChange([\n ...this.props.value,\n ...Array.from(files).map(file => ({\n file,\n uploadProgress: 0,\n })),\n ]);\n this.uploader.upload(files);\n };\n\n handleReplace = ({ file: { file }, newFile }: { file: FileDescriptor; newFile: File }) => {\n if (!this.props.onChange) {\n return;\n }\n\n const index = this.props.value.findIndex(fileDescriptor => fileDescriptor.file === file);\n if (index !== -1) {\n this.uploader.upload(newFile);\n\n this.props.onChange(\n immutableSplice(this.props.value, index, 1, {\n file: newFile,\n uploadProgress: 0,\n })\n );\n }\n };\n\n handleDelete = ({ file }: FileDescriptor) => {\n if (!this.props.onChange) {\n return;\n }\n\n this.props.onChange(\n this.props.value.filter(fileDescriptor => fileDescriptor.file !== file)\n );\n };\n\n handleErrorsClose = () => {\n this.clearErrors();\n };\n\n render() {\n const {\n value,\n onChange,\n hideReplace,\n hideDownload,\n limitReached,\n multiple,\n config,\n folderName,\n ...rest\n } = this.props;\n\n if (!onChange && !value.length) {\n return null;\n }\n\n const readonlyProps = onChange\n ? {}\n : {\n onReplace: undefined,\n onDelete: undefined,\n limitReached: true,\n };\n\n return (\n <Fragment>\n {!!this.errors.length && (\n <UploadErrors\n errors={this.errors}\n onClose={this.handleErrorsClose}\n className=\"m-b-2\"\n multiple={multiple}\n />\n )}\n <Confirm\n onConfirm={this.handleDelete}\n title=\"Are you sure you want to delete this file?\"\n >\n {onDelete => (\n <FilePicker\n value={value.length ? value : undefined}\n onReplace={!hideReplace ? this.handleReplace : undefined}\n onSelected={this.handleSelected}\n onDelete={onDelete}\n onDownload={!hideDownload ? this.handleDownload : undefined}\n limitReached={limitReached}\n multiple={multiple}\n {...rest}\n {...readonlyProps}\n />\n )}\n </Confirm>\n </Fragment>\n );\n }\n}\n"],"names":["Component","Fragment","injectDependency","optional","observer","observable","action","makeObservable","FilePicker","Banner","Confirm","FileUploaderConfig","FILE_UPLOADER_CONFIGURATION_TOKEN","Uploader","v4","uuid","immutableSplice","arr","start","deleteCount","items","slice","UploadErrors","errors","className","onClose","multiple","title","icon","status","ul","map","id","file","message","li","style","listStyle","name","FileUploader","addError","push","clearErrors","componentDidMount","uploader","config","props","progress","handleUploadProgress","success","handleUploadSuccess","error","handleUploadError","folderName","componentWillUnmount","cancel","render","value","onChange","hideReplace","hideDownload","limitReached","rest","length","readonlyProps","onReplace","undefined","onDelete","handleErrorsClose","onConfirm","handleDelete","handleReplace","onSelected","handleSelected","onDownload","handleDownload","index","findIndex","fileDescriptor","uploadProgress","displayName","downloadLink","filter","path","downloadPath","window","open","files","Array","from","upload","newFile","defaultProps"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/file-uploader/uploader.ts"],"sourcesContent":["import { v4 as uuid } from 'uuid';\n\nimport { FileUploaderConfig } from './config';\n\nconst Resumable = require('resumablejs');\n\ninterface Resumable {\n files: ResumableFile[];\n on(event: 'fileAdded', callback: (file: ResumableFile, event: Event) => void): void;\n on(event: 'fileProgress', callback: (file: ResumableFile, message?: string) => void): void;\n on(event: 'fileSuccess', callback: (file: ResumableFile, message?: string) => void): void;\n on(event: 'fileError', callback: (file: ResumableFile, message?: string) => void): void;\n addFile(file: File): void;\n upload(): void;\n cancel(): void;\n}\n\ninterface ResumableFile {\n file: File;\n progress(relative?: boolean): number;\n isComplete(): boolean;\n cancel(): void;\n}\n\nexport class Uploader {\n private readonly resumable: Resumable;\n\n constructor(\n config: FileUploaderConfig = {},\n handlers: {\n progress?(file: File, progress: number): void;\n success?(file: File, message?: string): void;\n error?(file: File, message?: string): void;\n } = {},\n folderName = 'default'\n ) {\n const { errorParser, ...configuration } = config;\n\n const resumable: Resumable = new Resumable({\n target: `/app/api/fileuploader/folders/${folderName}/files`,\n testChunks: false,\n simultaneousUploads: 1,\n headers: { 'X-Requested-With': 'XMLHttpRequest' },\n permanentErrors: [302, 400, 404, 415, 500, 501],\n generateUniqueIdentifier: () => uuid(),\n fileTypeErrorCallback: (file: File) => {\n handlers.error?.(\n file,\n `File type not allowed. Please provide file of type ${configuration.fileType\n ?.map(ext => `.${ext}`)\n ?.join(', ')}.`\n );\n },\n ...configuration,\n });\n\n resumable.on('fileAdded', () => {\n resumable.upload();\n });\n\n resumable.on('fileProgress', resumableFile => {\n if (resumableFile.isComplete()) {\n return;\n }\n\n let progress = Math.floor(resumableFile.progress(false) * 100);\n if (progress > 99) {\n progress = 99;\n }\n\n if (handlers.progress) {\n handlers.progress(resumableFile.file, progress);\n }\n });\n\n resumable.on('fileSuccess', (resumableFile, message) => {\n if (handlers.success) {\n handlers.success(resumableFile.file, message);\n }\n\n resumableFile.cancel();\n });\n\n resumable.on('fileError', (resumableFile, message) => {\n if (handlers.error) {\n handlers.error(resumableFile.file, errorParser ? errorParser(message) : message);\n }\n\n resumableFile.cancel();\n });\n\n this.resumable = resumable;\n }\n\n upload(source: File | FileList) {\n if (source instanceof File) {\n this.resumable.addFile(source);\n } else {\n for (const file of Array.from(source)) {\n this.resumable.addFile(file);\n }\n }\n }\n\n cancel(file?: File) {\n if (file) {\n for (const resumableFile of this.resumable.files) {\n if (resumableFile.file === file) {\n resumableFile.cancel();\n break;\n }\n }\n } else {\n this.resumable.cancel();\n }\n }\n}\n"],"names":["v4","uuid","Resumable","require","Uploader","upload","source","File","resumable","addFile","file","Array","from","cancel","resumableFile","files","
|
|
1
|
+
{"version":3,"sources":["../../src/file-uploader/uploader.ts"],"sourcesContent":["import { v4 as uuid } from 'uuid';\n\nimport { FileUploaderConfig } from './config';\n\nconst Resumable = require('resumablejs');\n\ninterface Resumable {\n files: ResumableFile[];\n on(event: 'fileAdded', callback: (file: ResumableFile, event: Event) => void): void;\n on(event: 'fileProgress', callback: (file: ResumableFile, message?: string) => void): void;\n on(event: 'fileSuccess', callback: (file: ResumableFile, message?: string) => void): void;\n on(event: 'fileError', callback: (file: ResumableFile, message?: string) => void): void;\n addFile(file: File): void;\n upload(): void;\n cancel(): void;\n}\n\ninterface ResumableFile {\n file: File;\n progress(relative?: boolean): number;\n isComplete(): boolean;\n cancel(): void;\n}\n\nexport class Uploader {\n private readonly resumable: Resumable;\n\n constructor(\n config: FileUploaderConfig = {},\n handlers: {\n progress?(file: File, progress: number): void;\n success?(file: File, message?: string): void;\n error?(file: File, message?: string): void;\n } = {},\n folderName = 'default'\n ) {\n const { errorParser, ...configuration } = config;\n\n const resumable: Resumable = new Resumable({\n target: `/app/api/fileuploader/folders/${folderName}/files`,\n testChunks: false,\n simultaneousUploads: 1,\n headers: { 'X-Requested-With': 'XMLHttpRequest' },\n permanentErrors: [302, 400, 404, 415, 500, 501],\n generateUniqueIdentifier: () => uuid(),\n fileTypeErrorCallback: (file: File) => {\n handlers.error?.(\n file,\n `File type not allowed. Please provide file of type ${configuration.fileType\n ?.map(ext => `.${ext}`)\n ?.join(', ')}.`\n );\n },\n ...configuration,\n });\n\n resumable.on('fileAdded', () => {\n resumable.upload();\n });\n\n resumable.on('fileProgress', resumableFile => {\n if (resumableFile.isComplete()) {\n return;\n }\n\n let progress = Math.floor(resumableFile.progress(false) * 100);\n if (progress > 99) {\n progress = 99;\n }\n\n if (handlers.progress) {\n handlers.progress(resumableFile.file, progress);\n }\n });\n\n resumable.on('fileSuccess', (resumableFile, message) => {\n if (handlers.success) {\n handlers.success(resumableFile.file, message);\n }\n\n resumableFile.cancel();\n });\n\n resumable.on('fileError', (resumableFile, message) => {\n if (handlers.error) {\n handlers.error(resumableFile.file, errorParser ? errorParser(message) : message);\n }\n\n resumableFile.cancel();\n });\n\n this.resumable = resumable;\n }\n\n upload(source: File | FileList) {\n if (source instanceof File) {\n this.resumable.addFile(source);\n } else {\n for (const file of Array.from(source)) {\n this.resumable.addFile(file);\n }\n }\n }\n\n cancel(file?: File) {\n if (file) {\n for (const resumableFile of this.resumable.files) {\n if (resumableFile.file === file) {\n resumableFile.cancel();\n break;\n }\n }\n } else {\n this.resumable.cancel();\n }\n }\n}\n"],"names":["v4","uuid","Resumable","require","Uploader","upload","source","File","resumable","addFile","file","Array","from","cancel","resumableFile","files","config","handlers","folderName","errorParser","configuration","target","testChunks","simultaneousUploads","headers","permanentErrors","generateUniqueIdentifier","fileTypeErrorCallback","error","fileType","map","ext","join","on","isComplete","progress","Math","floor","message","success"],"mappings":";;;;;;;;;;;;;AAAA,SAASA,MAAMC,IAAI,QAAQ,OAAO;AAIlC,MAAMC,YAAYC,QAAQ;AAoB1B,OAAO,MAAMC;IAsETC,OAAOC,MAAuB,EAAE;QAC5B,IAAIA,kBAAkBC,MAAM;YACxB,IAAI,CAACC,SAAS,CAACC,OAAO,CAACH;QAC3B,OAAO;YACH,KAAK,MAAMI,QAAQC,MAAMC,IAAI,CAACN,QAAS;gBACnC,IAAI,CAACE,SAAS,CAACC,OAAO,CAACC;YAC3B;QACJ;IACJ;IAEAG,OAAOH,IAAW,EAAE;QAChB,IAAIA,MAAM;YACN,KAAK,MAAMI,iBAAiB,IAAI,CAACN,SAAS,CAACO,KAAK,CAAE;gBAC9C,IAAID,cAAcJ,IAAI,KAAKA,MAAM;oBAC7BI,cAAcD,MAAM;oBACpB;gBACJ;YACJ;QACJ,OAAO;YACH,IAAI,CAACL,SAAS,CAACK,MAAM;QACzB;IACJ;IAxFA,YACIG,SAA6B,CAAC,CAAC,EAC/BC,WAII,CAAC,CAAC,EACNC,aAAa,SAAS,CACxB;QAVF,uBAAiBV,aAAjB,KAAA;QAWI,MAAM,EAAEW,WAAW,EAAE,GAAGC,eAAe,GAAGJ;QAE1C,MAAMR,YAAuB,IAAIN,UAAU;YACvCmB,QAAQ,CAAC,8BAA8B,EAAEH,WAAW,MAAM,CAAC;YAC3DI,YAAY;YACZC,qBAAqB;YACrBC,SAAS;gBAAE,oBAAoB;YAAiB;YAChDC,iBAAiB;gBAAC;gBAAK;gBAAK;gBAAK;gBAAK;gBAAK;aAAI;YAC/CC,0BAA0B,IAAMzB;YAChC0B,uBAAuB,CAACjB;oBAGsCU,6BAAAA,yBAF1DH;iBAAAA,kBAAAA,SAASW,KAAK,cAAdX,sCAAAA,qBAAAA,UACIP,MACA,CAAC,mDAAmD,GAAEU,0BAAAA,cAAcS,QAAQ,cAAtBT,+CAAAA,8BAAAA,wBAChDU,GAAG,CAACC,CAAAA,MAAO,CAAC,CAAC,EAAEA,KAAK,eAD4BX,kDAAAA,4BAEhDY,IAAI,CAAC,MAAM,CAAC,CAAC;YAE3B;YACA,GAAGZ,aAAa;QACpB;QAEAZ,UAAUyB,EAAE,CAAC,aAAa;YACtBzB,UAAUH,MAAM;QACpB;QAEAG,UAAUyB,EAAE,CAAC,gBAAgBnB,CAAAA;YACzB,IAAIA,cAAcoB,UAAU,IAAI;gBAC5B;YACJ;YAEA,IAAIC,WAAWC,KAAKC,KAAK,CAACvB,cAAcqB,QAAQ,CAAC,SAAS;YAC1D,IAAIA,WAAW,IAAI;gBACfA,WAAW;YACf;YAEA,IAAIlB,SAASkB,QAAQ,EAAE;gBACnBlB,SAASkB,QAAQ,CAACrB,cAAcJ,IAAI,EAAEyB;YAC1C;QACJ;QAEA3B,UAAUyB,EAAE,CAAC,eAAe,CAACnB,eAAewB;YACxC,IAAIrB,SAASsB,OAAO,EAAE;gBAClBtB,SAASsB,OAAO,CAACzB,cAAcJ,IAAI,EAAE4B;YACzC;YAEAxB,cAAcD,MAAM;QACxB;QAEAL,UAAUyB,EAAE,CAAC,aAAa,CAACnB,eAAewB;YACtC,IAAIrB,SAASW,KAAK,EAAE;gBAChBX,SAASW,KAAK,CAACd,cAAcJ,IAAI,EAAES,cAAcA,YAAYmB,WAAWA;YAC5E;YAEAxB,cAAcD,MAAM;QACxB;QAEA,IAAI,CAACL,SAAS,GAAGA;IACrB;AAwBJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/original-number-input/ordinal-number-input.tsx"],"sourcesContent":["import { Input, InputProps } from '@servicetitan/design-system';\nimport { action, observable, makeObservable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport { Component, ChangeEvent } from 'react';\n\nexport interface OrdinalNumberInputProps extends Omit<InputProps, 'onChange'> {\n min: number;\n max: number;\n value?: number;\n onChange?(value?: number): void;\n}\n\n@observer\nexport class OrdinalNumberInput extends Component<OrdinalNumberInputProps> {\n @observable hasFocus = false;\n\n constructor(props: OrdinalNumberInputProps) {\n super(props);\n makeObservable(this);\n }\n\n render() {\n const { min, max, value, onChange, ...props } = this.props;\n\n return (\n <Input\n placeholder={this.getPlaceholder()}\n {...props}\n value={this.getDisplayValue()}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onChange={this.handleChange}\n />\n );\n }\n\n @action private handleFocus = () => (this.hasFocus = true);\n @action private handleBlur = () => (this.hasFocus = false);\n\n private handleChange = (e: ChangeEvent<HTMLInputElement>): void => {\n const parsed = parseIntIntoRange(e.currentTarget.value, this.props.min, this.props.max);\n if (this.props.onChange) {\n this.props.onChange(parsed);\n }\n };\n\n private getPlaceholder() {\n return `${this.props.min}‒${this.props.max}`;\n }\n\n private getDisplayValue() {\n const value = this.props.value;\n if (typeof value !== 'number') {\n return '';\n }\n return this.hasFocus ? value.toString() : ordinalString(value);\n }\n}\n\nexport function parseIntIntoRange(input: string, min: number, max: number) {\n let parsed = parseInt(input, 10);\n if (Number.isNaN(parsed)) {\n return undefined;\n }\n if (parsed < min) {\n parsed = min;\n } else if (parsed > max) {\n parsed = max;\n }\n return parsed;\n}\n\nexport function ordinalString(num: number): string {\n switch (num % 100) {\n case 11:\n case 12:\n case 13:\n return num.toString() + 'th';\n default:\n switch (num % 10) {\n case 1:\n return num.toString() + 'st';\n case 2:\n return num.toString() + 'nd';\n case 3:\n return num.toString() + 'rd';\n default:\n return num.toString() + 'th';\n }\n }\n}\n\nexport function ordinalSuffix(num: number): string {\n switch (num % 100) {\n case 11:\n case 12:\n case 13:\n return 'th';\n default:\n switch (num % 10) {\n case 1:\n return 'st';\n case 2:\n return 'nd';\n case 3:\n return 'rd';\n default:\n return 'th';\n }\n }\n}\n"],"names":["Input","action","observable","makeObservable","observer","Component","OrdinalNumberInput","render","min","max","value","onChange","props","placeholder","getPlaceholder","getDisplayValue","onFocus","handleFocus","onBlur","handleBlur","handleChange","hasFocus","toString","ordinalString","
|
|
1
|
+
{"version":3,"sources":["../../src/original-number-input/ordinal-number-input.tsx"],"sourcesContent":["import { Input, InputProps } from '@servicetitan/design-system';\nimport { action, observable, makeObservable } from 'mobx';\nimport { observer } from 'mobx-react';\nimport { Component, ChangeEvent } from 'react';\n\nexport interface OrdinalNumberInputProps extends Omit<InputProps, 'onChange'> {\n min: number;\n max: number;\n value?: number;\n onChange?(value?: number): void;\n}\n\n@observer\nexport class OrdinalNumberInput extends Component<OrdinalNumberInputProps> {\n @observable hasFocus = false;\n\n constructor(props: OrdinalNumberInputProps) {\n super(props);\n makeObservable(this);\n }\n\n render() {\n const { min, max, value, onChange, ...props } = this.props;\n\n return (\n <Input\n placeholder={this.getPlaceholder()}\n {...props}\n value={this.getDisplayValue()}\n onFocus={this.handleFocus}\n onBlur={this.handleBlur}\n onChange={this.handleChange}\n />\n );\n }\n\n @action private handleFocus = () => (this.hasFocus = true);\n @action private handleBlur = () => (this.hasFocus = false);\n\n private handleChange = (e: ChangeEvent<HTMLInputElement>): void => {\n const parsed = parseIntIntoRange(e.currentTarget.value, this.props.min, this.props.max);\n if (this.props.onChange) {\n this.props.onChange(parsed);\n }\n };\n\n private getPlaceholder() {\n return `${this.props.min}‒${this.props.max}`;\n }\n\n private getDisplayValue() {\n const value = this.props.value;\n if (typeof value !== 'number') {\n return '';\n }\n return this.hasFocus ? value.toString() : ordinalString(value);\n }\n}\n\nexport function parseIntIntoRange(input: string, min: number, max: number) {\n let parsed = parseInt(input, 10);\n if (Number.isNaN(parsed)) {\n return undefined;\n }\n if (parsed < min) {\n parsed = min;\n } else if (parsed > max) {\n parsed = max;\n }\n return parsed;\n}\n\nexport function ordinalString(num: number): string {\n switch (num % 100) {\n case 11:\n case 12:\n case 13:\n return num.toString() + 'th';\n default:\n switch (num % 10) {\n case 1:\n return num.toString() + 'st';\n case 2:\n return num.toString() + 'nd';\n case 3:\n return num.toString() + 'rd';\n default:\n return num.toString() + 'th';\n }\n }\n}\n\nexport function ordinalSuffix(num: number): string {\n switch (num % 100) {\n case 11:\n case 12:\n case 13:\n return 'th';\n default:\n switch (num % 10) {\n case 1:\n return 'st';\n case 2:\n return 'nd';\n case 3:\n return 'rd';\n default:\n return 'th';\n }\n }\n}\n"],"names":["Input","action","observable","makeObservable","observer","Component","OrdinalNumberInput","render","min","max","value","onChange","props","placeholder","getPlaceholder","getDisplayValue","onFocus","handleFocus","onBlur","handleBlur","handleChange","hasFocus","toString","ordinalString","e","parsed","parseIntIntoRange","currentTarget","input","parseInt","Number","isNaN","undefined","num","ordinalSuffix"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAAA,SAASA,KAAK,QAAoB,8BAA8B;AAChE,SAASC,MAAM,EAAEC,UAAU,EAAEC,cAAc,QAAQ,OAAO;AAC1D,SAASC,QAAQ,QAAQ,aAAa;AACtC,SAASC,SAAS,QAAqB,QAAQ;AAU/C,OAAO,MAAMC,2BAA2BD;IAQpCE,SAAS;QACL,MAAM,EAAEC,GAAG,EAAEC,GAAG,EAAEC,KAAK,EAAEC,QAAQ,EAAE,GAAGC,OAAO,GAAG,IAAI,CAACA,KAAK;QAE1D,qBACI,KAACZ;YACGa,aAAa,IAAI,CAACC,cAAc;YAC/B,GAAGF,KAAK;YACTF,OAAO,IAAI,CAACK,eAAe;YAC3BC,SAAS,IAAI,CAACC,WAAW;YACzBC,QAAQ,IAAI,CAACC,UAAU;YACvBR,UAAU,IAAI,CAACS,YAAY;;IAGvC;IAYQN,iBAAiB;QACrB,OAAO,GAAG,IAAI,CAACF,KAAK,CAACJ,GAAG,CAAC,CAAC,EAAE,IAAI,CAACI,KAAK,CAACH,GAAG,EAAE;IAChD;IAEQM,kBAAkB;QACtB,MAAML,QAAQ,IAAI,CAACE,KAAK,CAACF,KAAK;QAC9B,IAAI,OAAOA,UAAU,UAAU;YAC3B,OAAO;QACX;QACA,OAAO,IAAI,CAACW,QAAQ,GAAGX,MAAMY,QAAQ,KAAKC,cAAcb;IAC5D;IAxCA,YAAYE,KAA8B,CAAE;QACxC,KAAK,CAACA,QAHV,uBAAYS,YAAW,QAsBvB,uBAAgBJ,eAAc,IAAO,IAAI,CAACI,QAAQ,GAAG,OACrD,uBAAgBF,cAAa,IAAO,IAAI,CAACE,QAAQ,GAAG,QAEpD,uBAAQD,gBAAe,CAACI;YACpB,MAAMC,SAASC,kBAAkBF,EAAEG,aAAa,CAACjB,KAAK,EAAE,IAAI,CAACE,KAAK,CAACJ,GAAG,EAAE,IAAI,CAACI,KAAK,CAACH,GAAG;YACtF,IAAI,IAAI,CAACG,KAAK,CAACD,QAAQ,EAAE;gBACrB,IAAI,CAACC,KAAK,CAACD,QAAQ,CAACc;YACxB;QACJ;QA1BItB,eAAe,IAAI;IACvB;AAsCJ;;;;;;;;;;;;;;;;;AAEA,OAAO,SAASuB,kBAAkBE,KAAa,EAAEpB,GAAW,EAAEC,GAAW;IACrE,IAAIgB,SAASI,SAASD,OAAO;IAC7B,IAAIE,OAAOC,KAAK,CAACN,SAAS;QACtB,OAAOO;IACX;IACA,IAAIP,SAASjB,KAAK;QACdiB,SAASjB;IACb,OAAO,IAAIiB,SAAShB,KAAK;QACrBgB,SAAShB;IACb;IACA,OAAOgB;AACX;AAEA,OAAO,SAASF,cAAcU,GAAW;IACrC,OAAQA,MAAM;QACV,KAAK;QACL,KAAK;QACL,KAAK;YACD,OAAOA,IAAIX,QAAQ,KAAK;QAC5B;YACI,OAAQW,MAAM;gBACV,KAAK;oBACD,OAAOA,IAAIX,QAAQ,KAAK;gBAC5B,KAAK;oBACD,OAAOW,IAAIX,QAAQ,KAAK;gBAC5B,KAAK;oBACD,OAAOW,IAAIX,QAAQ,KAAK;gBAC5B;oBACI,OAAOW,IAAIX,QAAQ,KAAK;YAChC;IACR;AACJ;AAEA,OAAO,SAASY,cAAcD,GAAW;IACrC,OAAQA,MAAM;QACV,KAAK;QACL,KAAK;QACL,KAAK;YACD,OAAO;QACX;YACI,OAAQA,MAAM;gBACV,KAAK;oBACD,OAAO;gBACX,KAAK;oBACD,OAAO;gBACX,KAAK;oBACD,OAAO;gBACX;oBACI,OAAO;YACf;IACR;AACJ"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/form",
|
|
3
|
-
"version": "32.
|
|
3
|
+
"version": "32.4.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"homepage": "https://docs.st.dev/docs/frontend/form",
|
|
6
6
|
"repository": {
|
|
@@ -17,14 +17,14 @@
|
|
|
17
17
|
],
|
|
18
18
|
"devDependencies": {
|
|
19
19
|
"@progress/kendo-react-dateinputs": "~5.5.0",
|
|
20
|
-
"@servicetitan/confirm": "^32.
|
|
21
|
-
"@servicetitan/culture": "^32.
|
|
20
|
+
"@servicetitan/confirm": "^32.4.0",
|
|
21
|
+
"@servicetitan/culture": "^32.4.0",
|
|
22
22
|
"@servicetitan/design-system": "~14.5.1",
|
|
23
|
-
"@servicetitan/form-state": "^32.
|
|
24
|
-
"@servicetitan/hash-browser-router": "^31.
|
|
25
|
-
"@servicetitan/react-ioc": "^31.
|
|
23
|
+
"@servicetitan/form-state": "^32.4.0",
|
|
24
|
+
"@servicetitan/hash-browser-router": "^31.6.0",
|
|
25
|
+
"@servicetitan/react-ioc": "^31.6.0",
|
|
26
26
|
"@servicetitan/tokens": ">=12.2.1",
|
|
27
|
-
"@servicetitan/web-components": "^31.
|
|
27
|
+
"@servicetitan/web-components": "^31.6.0",
|
|
28
28
|
"@types/react": "~18.2.55",
|
|
29
29
|
"@types/react-input-mask": "~2.0.5",
|
|
30
30
|
"@types/uuid": "~8.3.4",
|
|
@@ -38,10 +38,10 @@
|
|
|
38
38
|
},
|
|
39
39
|
"peerDependencies": {
|
|
40
40
|
"@progress/kendo-react-dateinputs": "~5.5.0",
|
|
41
|
-
"@servicetitan/confirm": "^32.
|
|
42
|
-
"@servicetitan/culture": "^32.
|
|
41
|
+
"@servicetitan/confirm": "^32.4.0",
|
|
42
|
+
"@servicetitan/culture": "^32.4.0",
|
|
43
43
|
"@servicetitan/design-system": ">=13.2.1",
|
|
44
|
-
"@servicetitan/form-state": "^32.
|
|
44
|
+
"@servicetitan/form-state": "^32.4.0",
|
|
45
45
|
"@servicetitan/react-ioc": ">21.0.0",
|
|
46
46
|
"@servicetitan/tokens": ">=12.2.1",
|
|
47
47
|
"accounting": "~0.4.1",
|
|
@@ -65,5 +65,5 @@
|
|
|
65
65
|
"less": true,
|
|
66
66
|
"webpack": false
|
|
67
67
|
},
|
|
68
|
-
"gitHead": "
|
|
68
|
+
"gitHead": "3dab3310534a39aaacb0069e1d377579fe0a7fab"
|
|
69
69
|
}
|