\r\n \r\n \r\n
\r\n
\r\n
\r\n setPropertValue('firstName', e.target.value)}\r\n />\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n setPropertValue('lastName', e.target.value)}\r\n />\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n setPropertValue('email', e.target.value)}\r\n />\r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n \r\n setPropertValue(\r\n 'requestType',\r\n ContactSalesRequestType[e.target.value as keyof typeof ContactSalesRequestType]\r\n )\r\n }\r\n >\r\n \r\n {contactSalesRequestTypes.map(x => )}\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n
\r\n
\r\n setPropertValue('description', e.target.value)}\r\n />\r\n \r\n
\r\n
\r\n
\r\n By clicking “Submit”, I acknowledge receipt of the BWIC Privacy Policy.\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n );\r\n}\r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { contactsSaveViews, routes } from '../../constants';\r\nimport { contactsSaveActions as actions } from '../../actions';\r\nimport { ContactsGrid, Conflicts } from '.';\r\nimport { Preloader } from '../common';\r\n\r\nclass ContactsSave extends Component {\r\n componentDidMount = () => {\r\n const { location, dispatch } = this.props;\r\n const isEdit = location.pathname === routes.editContacts;\r\n\r\n dispatch(actions.init(isEdit));\r\n }\r\n\r\n componentWillUnmount = () => this.props.dispatch(actions.reset());\r\n\r\n render = () => {\r\n const { isLoading, view } = this.props;\r\n\r\n return (\r\n \r\n {\r\n !isLoading &&\r\n <>\r\n {\r\n view === contactsSaveViews.grid\r\n ? \r\n : \r\n }\r\n \r\n }\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapStateToProps = ({ contactsSave }) => ({\r\n isLoading: contactsSave.isLoading,\r\n view: contactsSave.view\r\n});\r\n\r\nconst connectedContactsSave = connect(mapStateToProps)(ContactsSave);\r\nexport { connectedContactsSave as ContactsSave }; \r\n","import React, { Component } from 'react';\r\nimport { connect } from 'react-redux';\r\nimport { contactsSaveActions as actions } from '../../actions';\r\nimport { Grid } from '../grid';\r\nimport { routes, uploadStatus } from '../../constants';\r\nimport { history } from '../../history';\r\nimport { RouteLeavingGuard } from '../routing';\r\nimport { contactsComparer } from '../../utils';\r\nimport { Breadcrumbs } from '../controls/breadcrumbs/Breadcrumbs';\r\nimport { BreadcrumbsItem } from '../controls/breadcrumbs/BreadcrumbsItem';\r\nimport { DownloadTemplateButton } from '../common/download-template/DownloadTemplateButton';\r\nimport { DeleteRowsWithErrorButton } from '../grid/DeleteRowsWithErrorButton';\r\n\r\nclass ContactsGrid extends Component {\r\n render = () => {\r\n const { dataItems, isSaved, isEdit, isGridUploading, dispatch } = this.props;\r\n const contacts = dataItems.filter(i => !i.draft);\r\n const canSave = !isSaved && (isEdit || contacts.length);\r\n\r\n return (\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n
{isEdit ? 'Edit All' : 'Import Contacts'}
\r\n
\r\n \r\n \r\n history.push(routes.dealers)}\r\n >\r\n Cancel\r\n \r\n dispatch(actions.save())}\r\n >\r\n Save\r\n \r\n
\r\n
\r\n
\r\n
dispatch(actions.uploadContacts(file))}\r\n onDataItemsPaste={clipboardText => dispatch(actions.handleClipboardData(clipboardText))}\r\n onRowDeleted={contact => dispatch(actions.deleteContact(contact.id))}\r\n onFileSelected={file => dispatch(actions.uploadContacts(file))}\r\n helpPopoverTitle=\"You can add your contacts in the following ways\"\r\n />\r\n history.push(pathname)}\r\n shouldBlockNavigation={this.handleBlockNavigation}\r\n />\r\n \r\n
\r\n
\r\n
\r\n \r\n \r\n
Conflicts
\r\n
\r\n \r\n \r\n
\r\n
\r\n
\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n | | \r\n Name | \r\n Email | \r\n Broker-Dealer | \r\n Title | \r\n Phone | \r\n | \r\n
\r\n \r\n
\r\n
\r\n {conflicts.map((c, i) => )}\r\n
\r\n
history.push(pathname)}\r\n shouldBlockNavigation={() => !isSaved}\r\n />\r\n \r\n | \r\n {c.id ? '' : 'NEW'}\r\n | \r\n {nameUtils.getFullName(c.firstName, c.lastName)} | \r\n {c.email} | \r\n {c.company || this.props.companies.find(company => company.id === c.companyId).name} | \r\n {c.role} | \r\n {c.phone} | \r\n \r\n {\r\n unresolved.length > 1 &&\r\n this.props.dispatch(actions.deleteDuplicate(c))}>\r\n Delete\r\n \r\n }\r\n | \r\n
\r\n );\r\n }\r\n\r\n render = () => {\r\n const { conflict } = this.props;\r\n const unresolved = conflict.duplicates.filter(d => !d.isDeleted);\r\n\r\n return (\r\n <>\r\n {\r\n conflict.conflictType === contactConflictTypes.duplicateName &&\r\n unresolved.length > 1 &&\r\n \r\n These contacts have the same first and last name.\r\n You may leave all of them, but one of them is probably outdated\r\n
\r\n }\r\n {\r\n conflict.conflictType === contactConflictTypes.duplicateEmail &&\r\n unresolved.length > 1 &&\r\n \r\n These contacts have the same email. Please delete one of them.\r\n
\r\n }\r\n {\r\n unresolved.length === 1 &&\r\n \r\n This conflict was resolved\r\n
\r\n }\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {this.renderDuplicates(unresolved)}\r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nconst mapStateToProps = ({ contactsSave }) => ({\r\n companies: contactsSave.companies\r\n});\r\n\r\nconst connectedConflict = connect(mapStateToProps)(Conflict);\r\nexport { connectedConflict as Conflict }; \r\n","import * as React from 'react';\r\nimport classNames from 'classnames';\r\n\r\ninterface Props {\r\n value?: string;\r\n className?: string;\r\n backgroundClassName?: string;\r\n msAnimationTime?: number;\r\n msAnimationStep?: number;\r\n disabled?: boolean;\r\n children?: React.ReactNode;\r\n}\r\n\r\nexport function AnimatedValueUpdate({\r\n value,\r\n className,\r\n backgroundClassName,\r\n msAnimationTime = 7000,\r\n msAnimationStep = 200,\r\n disabled = false,\r\n children }: Props) {\r\n const refInterval = React.useRef(0);\r\n const [timeLeft, setTimeLeft] = React.useState(0);\r\n const opacity = refInterval.current\r\n ? Math.max(timeLeft, 0) / msAnimationTime\r\n : 0;\r\n\r\n const stopAnimation = () => {\r\n if (refInterval.current) {\r\n clearInterval(refInterval.current);\r\n refInterval.current = 0;\r\n }\r\n }\r\n React.useEffect(() => {\r\n if (refInterval.current && timeLeft <= 0) {\r\n stopAnimation();\r\n }\r\n // eslint-disable-next-line\r\n }, [timeLeft])\r\n\r\n React.useEffect(() => {\r\n if (!disabled) {\r\n stopAnimation();\r\n setTimeLeft(msAnimationTime);\r\n refInterval.current = setInterval(() => {\r\n setTimeLeft(timeLeft => timeLeft - msAnimationStep);\r\n }, msAnimationStep);\r\n }\r\n // eslint-disable-next-line\r\n }, [value, disabled]);\r\n\r\n const animationClassName = classNames('animated-value-update-bg', backgroundClassName, {\r\n 'animated-value-update-default-bg': !backgroundClassName,\r\n });\r\n\r\n return (\r\n \r\n
\r\n
{children || value}
\r\n
\r\n {children}\r\n
\r\n );\r\n}\r\n\r\ninterface CloseButtonProps {\r\n onClick: (e: React.MouseEvent) => void;\r\n}\r\n\r\nexport function BottomPanelCloseButton({ onClick }: CloseButtonProps) {\r\n return (\r\n \r\n );\r\n}\r\n\r\n","import React, { useRef, PropsWithChildren } from 'react';\r\nimport cn from 'classnames';\r\nimport { v4 as uuid } from 'uuid';\r\nimport { BlockedFeatureContext } from '../access/BlockedFeatureContext';\r\n\r\ninterface Props {\r\n className?: string;\r\n checked?: boolean;\r\n partially?: boolean;\r\n label?: React.ReactNode;\r\n onChange?: (e: React.ChangeEvent) => void;\r\n disabled?: boolean;\r\n name?: string;\r\n}\r\n\r\nexport const Checkbox: React.FC> = (\r\n {\r\n className,\r\n checked,\r\n partially,\r\n label,\r\n onChange,\r\n disabled,\r\n children,\r\n name\r\n }\r\n) => {\r\n const id = useRef(uuid());\r\n\r\n const isFeatureBlocked = React.useContext(BlockedFeatureContext);\r\n\r\n return (\r\n e.stopPropagation()}\r\n >\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nCheckbox.defaultProps = {\r\n onChange: () => { },\r\n checked: false,\r\n partially: false,\r\n disabled: false,\r\n};\r\n","import React, { Component } from 'react';\r\nimport cn from 'classnames';\r\nimport { ClickOutside } from '../common/ClickOutside';\r\nimport IconSVG from '../../styles/svg-icons';\r\nimport { ContextMenuItem } from './ContextMenuItem';\r\n\r\nexport default class ContextMenu extends Component {\r\n state = {\r\n visible: false,\r\n showAbove: false,\r\n bottom: 0,\r\n };\r\n\r\n componentDidUpdate() {\r\n if (this.state.visible && this.adjustMenuDirection) {\r\n this.adjustMenuDirection = false;\r\n const iconHeight = (this._refIcon && this._refIcon.clientHeight) || 0;\r\n const distance = window.innerHeight - this.state.bottom - iconHeight;\r\n if (this._refList && this._refList.clientHeight > distance) {\r\n this.setState({ showAbove: true });\r\n }\r\n }\r\n }\r\n\r\n show = e => {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n this.adjustMenuDirection = true;\r\n const boundingClientRect = e.target.getBoundingClientRect();\r\n this.setState({ visible: true, bottom: boundingClientRect.bottom + (this.props.bottomMargin || 0) });\r\n this.props.onShow && this.props.onShow();\r\n };\r\n\r\n hide = () => {\r\n this.setState({ visible: false, showAbove: false });\r\n this.props.onHide && this.props.onHide();\r\n }\r\n\r\n handleMenuClick = e => {\r\n e.preventDefault();\r\n e.stopPropagation();\r\n this.hide();\r\n }\r\n\r\n handleMenuItemClick = (item, e) => {\r\n if (typeof item.action === 'function') {\r\n item.action(e);\r\n }\r\n };\r\n\r\n renderMenu = items =>\r\n \r\n this._refList = node}\r\n className={cn(\"context-menu-dropdown\", this.state.showAbove ? 'show-above' : null)}\r\n onClick={this.handleMenuClick}\r\n >\r\n {\r\n this.props.children || items?.map((item, index) =>\r\n this.handleMenuItemClick(item, e)}\r\n >\r\n {item.textComponent && }\r\n {item.text}\r\n \r\n )\r\n }\r\n \r\n \r\n\r\n renderTargetComponent = () =>\r\n this.props.customTargetComponent ||\r\n {this.props.text};\r\n\r\n render = () => {\r\n const { className, menuItems, disabled } = this.props;\r\n\r\n if (!menuItems && !this.props.children) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n
this._refIcon = node}\r\n >\r\n {this.renderTargetComponent()}\r\n \r\n
setShowDayPicker(true)}\r\n disabled={disabled}\r\n onBlur={onBlur}\r\n />\r\n {showDayPicker ?\r\n \r\n {withCustomView ? (\r\n \r\n ) : (\r\n \r\n )}\r\n
: null}\r\n \r\n {title}\r\n \r\n
\r\n {expanded && children}\r\n \r\n );\r\n}\r\n","import React, { useState } from 'react';\r\nimport classNames from 'classnames';\r\nimport { ClickOutside } from '../common/ClickOutside';\r\nimport { arrayUtils } from '../../utils/array.utils';\r\nimport { DropDownButton } from './DropDownButton';\r\n\r\ninterface Props {\r\n className?: string;\r\n items: DropDownListItem[];\r\n showLoadingProgress?: boolean;\r\n disabled?: boolean;\r\n defaultSortingEnabled?: boolean;\r\n placeholder?: string;\r\n renderSelectedItemCallback?: (item: DropDownListItem) => React.ReactNode;\r\n renderItemContentCallback?: (item: DropDownListItem, hovered: boolean) => React.ReactNode;\r\n render?: (items: JSX.Element[], freezedItems: JSX.Element[]) => React.ReactNode;\r\n onChange?: (item: DropDownListItem, e: React.MouseEvent) => void;\r\n prefix?: string;\r\n}\r\n\r\nexport interface DropDownListItem {\r\n value: string | number;\r\n text: string;\r\n selected?: boolean;\r\n groupKey?: number;\r\n payload?: any;\r\n disabled?: boolean;\r\n freezed?: boolean;\r\n}\r\n\r\nexport function DropDownList({\r\n className = '',\r\n showLoadingProgress = false,\r\n disabled = false,\r\n items,\r\n placeholder,\r\n defaultSortingEnabled = true,\r\n render,\r\n renderSelectedItemCallback,\r\n renderItemContentCallback,\r\n onChange,\r\n prefix,\r\n}: Props) {\r\n const [hoveredItem, setHoveredItem] = useState();\r\n const [expanded, setExpanded] = useState(false);\r\n const [focused, setFocused] = useState(false);\r\n const selected = items.find(i => i.selected ?? false);\r\n const defaultItem = items.find(i => !i.value);\r\n\r\n let sortedItems = defaultSortingEnabled\r\n ? [...items]\r\n .filter(i => i.value)\r\n .sort((a, b) => (b.groupKey || 0) - (a.groupKey || 0) || a.text.localeCompare(b.text))\r\n : items;\r\n\r\n if (defaultItem) {\r\n sortedItems = [defaultItem, ...sortedItems];\r\n }\r\n\r\n const excludedFreezed = sortedItems.filter(item => !expanded || !item.freezed);\r\n\r\n const groups: Map = arrayUtils.groupBy(excludedFreezed, (item: DropDownListItem) => item.groupKey);\r\n\r\n const closeDropDown = () => {\r\n setFocused(false);\r\n setExpanded(false);\r\n }\r\n\r\n const renderGroup = (groupKey: number | undefined, items: DropDownListItem[]) => {\r\n const key = groupKey || 0;\r\n return (\r\n \r\n {items.map(i => renderItem(key, i))}\r\n
\r\n );\r\n }\r\n\r\n const renderItem = (parentKey: number, item: DropDownListItem) => {\r\n const handleItemClick = (e: React.MouseEvent) => {\r\n e.stopPropagation();\r\n if (!item.disabled) {\r\n closeDropDown();\r\n onChange && onChange(item, e);\r\n }\r\n }\r\n\r\n return (\r\n setHoveredItem(item.value)}\r\n onMouseLeave={() => setHoveredItem(undefined)}\r\n >\r\n {renderItemContentCallback ? renderItemContentCallback(item, hoveredItem === item.value) : item.text}
\r\n \r\n );\r\n }\r\n\r\n const renderedItems = [...groups.entries()]\r\n .map(([key, items]) => renderGroup(key, items));\r\n\r\n const renderedFreezedItems = sortedItems\r\n .filter(el => el.freezed)\r\n .map((item, i) => renderItem(i, item));\r\n\r\n const renderContent = () => {\r\n return (\r\n {selected ? `${prefix ? prefix : ''}${selected.text}` : placeholder}\r\n }\r\n className={className}\r\n disabled={disabled}\r\n loading={showLoadingProgress}\r\n onClick={() => {\r\n setExpanded(prev => !prev);\r\n setFocused(prev => !prev);\r\n }}\r\n >\r\n \r\n {render?.(renderedItems, renderedFreezedItems) ?? renderedItems}\r\n
\r\n \r\n );\r\n }\r\n\r\n if (focused) {\r\n return (\r\n \r\n {renderContent()}\r\n \r\n );\r\n }\r\n\r\n return renderContent();\r\n}","import React, { Component } from 'react';\r\nconst imageTypes = '.cdi,.csv,.doc,.docx,.pdf,.ppt,.pptx,.xls,.xlsx'\r\n\r\nexport default class FileIcon extends Component {\r\n render = () => {\r\n const { filename, isNew = false } = this.props;\r\n\r\n let fileIcon;\r\n if (isNew) {\r\n fileIcon = 'add-file';\r\n } else {\r\n const supportedFileTypes = imageTypes.split(',');\r\n const extension = filename.substr(filename.lastIndexOf('.'));\r\n const supported =\r\n extension &&\r\n supportedFileTypes.find(e =>\r\n e.localeCompare(extension, undefined, { sensitivity: 'accent' }) === 0);\r\n\r\n fileIcon = supported ? supported.replace('.', '') : 'unknown-file';\r\n }\r\n\r\n return \r\n }\r\n}\r\n","import React from 'react';\r\nimport cn from 'classnames';\r\n\r\nexport function FormError({ message, right=false }) {\r\n if (!message) {\r\n return null;\r\n }\r\n return {message}
;\r\n}\r\n","import * as React from 'react';\r\nimport { Link as RouterLink } from 'react-router-dom';\r\n\r\ninterface Props {\r\n to: string\r\n disabled?: boolean\r\n className?: string\r\n children?: React.ReactNode\r\n [extraProps: string]: any\r\n}\r\n\r\nexport function Link({ to, disabled = false, className, children, ...rest }: Props) {\r\n if (disabled) {\r\n return \r\n {children}\r\n \r\n }\r\n\r\n return {children}\r\n}\r\n","import * as React from 'react';\r\nimport classNames from 'classnames';\r\nimport { ClickOutside } from '../common';\r\nimport { isIE } from '../../utils/isIE.utils';\r\nimport { Checkbox } from './Checkbox';\r\n\r\nexport interface MultiSelectDataItem {\r\n text: string;\r\n value: string | number;\r\n disabled?: boolean;\r\n selected?: boolean;\r\n}\r\n\r\ninterface Props {\r\n name?: string\r\n required?: boolean\r\n className?: string\r\n placeholder?: string\r\n disabled?: boolean\r\n sourceItems: MultiSelectDataItem[]\r\n onItemSelect: (item: MultiSelectDataItem, selected: boolean) => void\r\n generateSelectedText?: (selectedItems: MultiSelectDataItem[]) => React.ReactNode\r\n showAddButton: boolean,\r\n onResetAll?: (e: React.MouseEvent) => void ,\r\n onSelectAll?: (e: React.MouseEvent) => void,\r\n showResetButton?: boolean,\r\n showSelectAllButton?: boolean,\r\n selectButtonText?: string,\r\n resetButtonText?: string,\r\n}\r\n\r\nexport function MultiSelect(\r\n {\r\n name,\r\n required = false,\r\n placeholder = '',\r\n disabled = false,\r\n sourceItems,\r\n onItemSelect,\r\n showAddButton = true,\r\n generateSelectedText,\r\n className = '',\r\n onResetAll,\r\n onSelectAll,\r\n showResetButton = false,\r\n showSelectAllButton = false,\r\n selectButtonText = 'Select All',\r\n resetButtonText = 'Reset'\r\n }: Props) {\r\n const [expanded, setExpanded] = React.useState(false);\r\n const selectedItems = sourceItems.filter(i => i.selected);\r\n\r\n const getText = (): React.ReactNode => {\r\n if (selectedItems.length) {\r\n return generateSelectedText == null\r\n ? selectedItems.map(s => s.text).join(', ')\r\n : generateSelectedText(selectedItems);\r\n }\r\n\r\n return {placeholder};\r\n };\r\n\r\n const renderItem = (item: MultiSelectDataItem) => {\r\n return (\r\n \r\n onItemSelect(item, e.target.checked)}\r\n checked={!!item.selected}\r\n disabled={!!item.disabled}\r\n label={item.text}\r\n />\r\n \r\n );\r\n };\r\n\r\n const multiselectCssClasses = classNames(className, {\r\n 'form-control form-select multiselect': true,\r\n show: expanded,\r\n disabled: disabled,\r\n selected: sourceItems.filter(i => i.selected).length > 0,\r\n multiselected: sourceItems.filter(i => i.selected).length > 1\r\n });\r\n\r\n const renderResetSelectButtons = () => {\r\n if (showSelectAllButton) {\r\n return (\r\n \r\n \r\n \r\n );\r\n }\r\n\r\n if (showResetButton) {\r\n return (\r\n \r\n \r\n \r\n );\r\n }\r\n }\r\n\r\n return (\r\n \r\n
true}\r\n className=\"invisible\"\r\n />\r\n setExpanded(true)}\r\n >\r\n {getText()}\r\n \r\n {renderResetSelectButtons()}\r\n {sourceItems.map(i => renderItem(i))}\r\n
\r\n {\r\n showAddButton && (\r\n \r\n \r\n
)\r\n }\r\n \r\n }\r\n \r\n );\r\n}\r\n","import React from 'react';\r\nimport cn from 'classnames';\r\nimport IconSVG from '../../styles/svg-icons';\r\nimport { DocumentBodyPortal } from '../common/DocumentBodyPortal';\r\n\r\ninterface Props {\r\n title?: React.ReactNode;\r\n renderTitle?: React.ReactNode;\r\n subTitle?: React.ReactNode;\r\n onClose?: (e: MouseEvent) => void;\r\n modalClass?: string;\r\n disabled?: boolean;\r\n renderInBody?: boolean;\r\n children: React.ReactNode;\r\n}\r\n\r\nconst Popup: React.FC = (\r\n { children, title, renderTitle, subTitle, onClose, modalClass, disabled, renderInBody }\r\n) => {\r\n const content = (\r\n e.stopPropagation()}>\r\n
e.stopPropagation()}>\r\n
e.stopPropagation()}>\r\n {title &&
{title}
}\r\n {renderTitle && <>{renderTitle}}\r\n {subTitle && {subTitle}
}\r\n disabled ? undefined : onClose && onClose(e)}\r\n >\r\n \r\n \r\n \r\n {children}\r\n
\r\n
\r\n {options.map(option => (\r\n handleChange(option.value)}\r\n disabled={disabled}\r\n />\r\n ))}\r\n
\r\n )\r\n}\r\n\r\nRadioButtonGroup.defaultProps = {\r\n options: [],\r\n value: '',\r\n onChange: () => false,\r\n}\r\n","import * as React from 'react';\r\nimport classNames from 'classnames';\r\nimport IconSVG from '../../styles/svg-icons';\r\n\r\ninterface RightSidePanelProps {\r\n title: React.ReactNode;\r\n className?: string;\r\n children: React.ReactNode;\r\n closeButton?: React.ReactNode;\r\n onClose?: (e: React.MouseEvent) => void;\r\n}\r\n\r\ninterface CloseButtonProps {\r\n onClick: (e: React.MouseEvent) => void;\r\n}\r\n\r\nfunction RightSidePanelCloseButton({ onClick }: CloseButtonProps) {\r\n const handleClick = (e: React.MouseEvent) => {\r\n onClick(e);\r\n (e.target as HTMLElement).getBoundingClientRect();\r\n }\r\n\r\n return (\r\n \r\n );\r\n}\r\n\r\nexport function RightSidePanel({ title, className, closeButton, onClose, children }: RightSidePanelProps) {\r\n return (\r\n \r\n
\r\n
{title}
\r\n
\r\n {closeButton ?? (onClose && )}\r\n
\r\n
\r\n
\r\n
\r\n {children}\r\n
\r\n
\r\n
e.stopPropagation()}>\r\n No search results found.\r\n
\r\n )}\r\n \r\n )\r\n }\r\n />\r\n \r\n );\r\n}\r\n\r\n","import React, { Component } from 'react';\r\nimport moment from 'moment';\r\nimport TimePicker from 'rc-time-picker';\r\nimport { dateTimeUtils } from '../../utils';\r\nimport 'rc-time-picker/assets/index.css';\r\nimport { constants } from '../../constants';\r\n\r\n\r\nexport default class TimePickerControl extends Component {\r\n render = () => {\r\n const { id = 'timePickerControl', emptyEnabled, time, className = '', disabledHours = [], disabledMinutes = [], placeholder } = this.props;\r\n\r\n return (\r\n \r\n disabledHours}\r\n disabledMinutes={() => disabledMinutes}\r\n />\r\n
\r\n );\r\n };\r\n\r\n handleClose = () => {\r\n const { emptyEnabled, time, defaultTime, onTimeChange } = this.props\r\n\r\n if (!time && !emptyEnabled) {\r\n onTimeChange(defaultTime || dateTimeUtils.timestampToUtcString('00:00 AM'));\r\n }\r\n }\r\n\r\n handleTimeChange = time => {\r\n const { onTimeChange, disabledHours } = this.props;\r\n\r\n if(time && Array.isArray(disabledHours) && disabledHours.indexOf(time.get('hours') + 1) > -1){\r\n time.set('minute', '00');\r\n }\r\n\r\n if (!time) {\r\n onTimeChange('');\r\n } else if (time.isUTC()) {\r\n onTimeChange(time.utc().format());\r\n } else {\r\n const timestamp = time.format(constants.timeFormat);\r\n onTimeChange(dateTimeUtils.timestampToUtcString(timestamp));\r\n }\r\n }\r\n}\r\n","import { Fragment } from \"react/jsx-runtime\";\r\nimport { TimeSpan as TimeSpanType } from \"../../types/primitives/TimeSpan\";\r\nimport { dateTimeUtils } from \"../../utils\";\r\nimport { Pluralize } from \"../common/Pluralize\";\r\n\r\ninterface Props {\r\n value: TimeSpanType;\r\n}\r\nexport function TimeSpan({ value }: Props) {\r\n const time = dateTimeUtils.parseTimeSpan(value);\r\n\r\n if (!time) return null;\r\n\r\n const hours = time.hours ? : null\r\n const minutes = time.minutes ? : null\r\n const seconds = time.seconds ? : null\r\n\r\n return (\r\n <>\r\n {[hours, minutes, seconds]\r\n .filter(x => x !== null)\r\n .map((e, i) => ({i > 0 && \" \"}{e}))}\r\n \r\n );\r\n}","import React, { useMemo, useState } from \"react\";\r\nimport { flatten, kebabCase, sum, uniq } from 'lodash';\r\nimport { EmptyPlaceholder, ClickOutside, SearchInput } from \"../common\";\r\nimport { Checkbox } from \"./Checkbox\";\r\nimport classNames from 'classnames';\r\nimport { FilterDropDown } from '../common/filters/FilterDropDown';\r\nimport { DropDownButton } from './DropDownButton';\r\n\r\nexport interface TreeSelectOption {\r\n text: string;\r\n value: T;\r\n meta?: any;\r\n children?: TreeSelectOption[];\r\n}\r\n\r\ninterface TreeSelectProps {\r\n defaultExpanded?: boolean;\r\n options: TreeSelectOption[];\r\n value: T[];\r\n title: string | React.ReactNode;\r\n withSearch?: boolean;\r\n className?: string;\r\n disabled?: boolean;\r\n renderMeta?: (option: TreeSelectOption) => React.ReactNode;\r\n titleFormatter?: (items: TreeSelectOption[]) => React.ReactNode;\r\n onChange: (items: T[]) => void;\r\n}\r\n\r\nfunction getLowestLevelChildren(item: TreeSelectOption): T[] {\r\n if (!item.children || !item.children.length) {\r\n return [item.value];\r\n }\r\n\r\n const children = item.children.map(x => getLowestLevelChildren(x));\r\n\r\n return flatten(children);\r\n}\r\n\r\nfunction filterOptions(searchTerm: string, options: TreeSelectOption[]) {\r\n if (!searchTerm.length) {\r\n return options;\r\n }\r\n\r\n const searchTermLowerCase = searchTerm.trim().toLowerCase();\r\n return options.filter((option) => {\r\n const topLevelItemMatches = option.text.toLowerCase().includes(searchTermLowerCase);\r\n const lowLevelItemsMatch = (option.children || []).some(child =>\r\n child.text.toLocaleLowerCase().includes(searchTermLowerCase)\r\n );\r\n\r\n return topLevelItemMatches || lowLevelItemsMatch;\r\n });\r\n}\r\n\r\nexport function TreeSelect({\r\n options,\r\n value,\r\n title,\r\n withSearch,\r\n className,\r\n disabled = false,\r\n renderMeta,\r\n titleFormatter,\r\n onChange,\r\n}: TreeSelectProps) {\r\n const [expanded, setExpanded] = useState(false);\r\n const [searchTerm, setSearchTerm] = useState('');\r\n const selectedOptions = flatten(options.map(option => (option.children || []).filter(childOption => value.includes(childOption.value))));\r\n\r\n const childrenCount = useMemo(() => sum(options.map(x => getLowestLevelChildren(x).length)), [options]);\r\n const filteredOptions = useMemo(() => filterOptions(searchTerm, options), [searchTerm, options]);\r\n\r\n function handleSearchTermChange(value: string) {\r\n setSearchTerm(value);\r\n }\r\n\r\n function handleSelectAll() {\r\n onChange(flatten(options.map(getLowestLevelChildren)));\r\n }\r\n\r\n function handleResetToDefault() {\r\n onChange([]);\r\n }\r\n\r\n function handleClearSearch() {\r\n setSearchTerm('');\r\n }\r\n\r\n function handleItemClick(item: TreeSelectOption) {\r\n // Top-level item clicked\r\n if (item.children && item.children.length) {\r\n const lowestLevelValues = getLowestLevelChildren(item);\r\n\r\n // All were checked — uncheck all\r\n if (lowestLevelValues.every(item => value.includes(item))) {\r\n return onChange(value.filter(item => !lowestLevelValues.includes(item)));\r\n }\r\n\r\n // All were unchecked, or some checked, some unchecked - check all\r\n onChange(uniq([...value, ...lowestLevelValues]));\r\n } else { // Low-level item clicked\r\n // Item is unchecked\r\n if (value.includes(item.value)) {\r\n return onChange(value.filter(x => x !== item.value));\r\n }\r\n\r\n onChange([...value, item.value]);\r\n }\r\n }\r\n\r\n function renderTitle() {\r\n if (titleFormatter) {\r\n return titleFormatter(selectedOptions);\r\n }\r\n\r\n const optionsCount = selectedOptions.length;\r\n\r\n if (optionsCount === 1) {\r\n const [firstOption] = selectedOptions;\r\n return (<>{title}: {firstOption.text});\r\n }\r\n\r\n if (!optionsCount || optionsCount === childrenCount) {\r\n return `${title}: All`;\r\n }\r\n\r\n return (<>{title}: {optionsCount} selected);\r\n }\r\n\r\n function renderLookup() {\r\n if (!filteredOptions.length) {\r\n return ;\r\n }\r\n\r\n return (\r\n \r\n {filteredOptions.map((option) => {\r\n const allChildrenSelected = (option.children || []).every(x => value.includes(x.value));\r\n const someChildrenSelected = (option.children || []).some(x => value.includes(x.value));\r\n\r\n return (\r\n - \r\n handleItemClick(option)}\r\n partially={!allChildrenSelected && someChildrenSelected}\r\n />\r\n
\r\n {option.children && option.children.map((childOption) => (\r\n - \r\n handleItemClick(childOption)}\r\n />\r\n {renderMeta && renderMeta(childOption)}\r\n
\r\n ))}\r\n
\r\n \r\n );\r\n })}\r\n
\r\n );\r\n }\r\n\r\n function renderSelectAllClear() {\r\n if (!filteredOptions.length) {\r\n return null;\r\n }\r\n\r\n if (!selectedOptions.length) {\r\n return (\r\n \r\n Select All\r\n \r\n );\r\n }\r\n\r\n return (\r\n \r\n Reset to default\r\n \r\n );\r\n }\r\n\r\n function renderSelectedItems() {\r\n if (!selectedOptions.length) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n \r\n {options.map(option => {\r\n const selectedOptions = (option.children || []).filter(x => value.includes(x.value));\r\n\r\n if (!selectedOptions.length) {\r\n return null;\r\n }\r\n\r\n return (\r\n - \r\n handleItemClick(option)}\r\n partially={selectedOptions.length !== option.children?.length}\r\n />\r\n
\r\n {selectedOptions.map((childOption) => (\r\n - \r\n handleItemClick(childOption)}\r\n />\r\n {renderMeta && renderMeta(childOption)}\r\n
\r\n ))}\r\n
\r\n \r\n );\r\n })}\r\n
\r\n
\r\n \r\n );\r\n }\r\n\r\n return (\r\n setExpanded(false)}\r\n >\r\n setExpanded(expanded)}\r\n className=\"custom-drop-down-ghost\"\r\n >\r\n \r\n {withSearch ? (\r\n <>\r\n \r\n {renderSelectAllClear()}\r\n {renderSelectedItems()}\r\n \r\n ) : (\r\n renderSelectAllClear()\r\n )}\r\n\r\n {renderLookup()}\r\n \r\n \r\n \r\n );\r\n}\r\n","import { useState } from \"react\";\r\nimport cn from \"classnames\";\r\nimport { ClickOutside } from \"../common\";\r\nimport IconSVG from \"../../styles/svg-icons\";\r\nimport { constants } from '../../constants';\r\nimport { isNil } from 'lodash';\r\n\r\ninterface Props {\r\n years: number[];\r\n selectedYear?: number;\r\n onChange: (year?: number) => void;\r\n currentYearPrefix?: string;\r\n prefix?: string;\r\n disabled?: boolean\r\n showAllOption?: boolean;\r\n}\r\n\r\nexport function YearSelector({\r\n years,\r\n selectedYear,\r\n onChange,\r\n currentYearPrefix,\r\n prefix,\r\n disabled = false,\r\n showAllOption = false,\r\n}: Props) {\r\n const [displaying, setDisplaying] = useState(false);\r\n const currentYear = new Date().getFullYear();\r\n\r\n const handleClick = (year?: number) => {\r\n onChange(year);\r\n setDisplaying(false);\r\n };\r\n\r\n const returnPrefix = (year: number) =>\r\n currentYearPrefix && year === currentYear\r\n ? currentYearPrefix + \" \"\r\n : \"\";\r\n\r\n const renderButtonText = () => {\r\n if (!selectedYear) {\r\n return (<>{prefix} All);\r\n }\r\n\r\n return (\r\n <>\r\n {prefix}\r\n {selectedYear ? returnPrefix(selectedYear) : 'All'}\r\n {selectedYear}\r\n \r\n );\r\n }\r\n const renderButton = () => (\r\n setDisplaying((prevState) => !prevState)}\r\n >\r\n {renderButtonText()}\r\n \r\n \r\n );\r\n\r\n return (\r\n \r\n {displaying && !disabled ? (\r\n
setDisplaying(false)}>\r\n {renderButton()}\r\n \r\n {showAllOption && (\r\n handleClick(undefined)}\r\n className={cn(\"year-item\", {\r\n selected: isNil(selectedYear),\r\n })}\r\n >\r\n All\r\n \r\n )}\r\n {years.map((year) => (\r\n handleClick(year)}\r\n className={cn(\"year-item\", {\r\n selected: selectedYear === year,\r\n })}\r\n >\r\n {returnPrefix(year)}\r\n {year}\r\n \r\n ))}\r\n
\r\n \r\n ) : (\r\n renderButton()\r\n )}\r\n
\r\n
{title}
\r\n {\r\n editMode && !!size(items) && (\r\n onToggleAll(keys(onToggleAll).map(key => Number(key)))}\r\n disabled={disabled}\r\n >\r\n {exclude ? 'Include All' : 'Exclude All'}\r\n \r\n )\r\n }\r\n \r\n )\r\n };\r\n\r\n const renderContent = () => {\r\n return (\r\n <>\r\n {\r\n (editMode || itemsEmpty) &&\r\n \r\n {columnTitle}\r\n
\r\n }\r\n \r\n \r\n )\r\n };\r\n\r\n return (\r\n \r\n {renderTitle()}\r\n {renderContent()}\r\n
\r\n )\r\n};\r\n","import React from 'react';\r\nimport { ExcludeListItemType } from './ExcludeListItemType';\r\nimport { ExcludeListSection } from './ExcludeListSection';\r\n\r\ninterface Props {\r\n editMode: boolean;\r\n excludeTitle: string;\r\n includeTitle: string;\r\n includeColumnTitle: string;\r\n excludeColumnTitle: string;\r\n includeList: ExcludeListItemType;\r\n excludeList: ExcludeListItemType;\r\n onInclude: (key: number) => void;\r\n onExclude: (key: number) => void;\r\n onIncludeAll: () => void;\r\n onExcludeAll: () => void;\r\n disabled?: boolean;\r\n}\r\n\r\nexport const ExcludeList: React.FC = (\r\n {\r\n includeList,\r\n excludeList,\r\n editMode,\r\n includeTitle,\r\n excludeTitle,\r\n onIncludeAll,\r\n onExcludeAll,\r\n includeColumnTitle,\r\n excludeColumnTitle,\r\n onInclude,\r\n onExclude,\r\n disabled\r\n }\r\n) => {\r\n return (\r\n \r\n \r\n \r\n
\r\n )\r\n};\r\n","import React, { Component } from 'react';\r\nimport { numericUtils } from '../../utils';\r\nimport IconSVG from \"../../styles/svg-icons\";\r\nimport { OnHoverTooltip } from \"../common\";\r\n\r\nclass Counter extends Component {\r\n render = () => {\r\n const { name, required = false, min = 0, max = 255, value = min, className = '' } = this.props;\r\n\r\n return (\r\n \r\n