= ({ errorMessage, classes: propClasses }) => {\r\n const i18n = useContext(I18nContext) as any;\r\n const classes = useStyles();\r\n const { state } = useWizardService();\r\n const currentStepId = getCurrentStepId(state);\r\n const isValid = getIsStepValid(state, currentStepId);\r\n const isSaveFailed = getIsStepSaveFailed(state, currentStepId);\r\n const showError = !isValid && isSaveFailed;\r\n\r\n if (!showError) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n \r\n {errorMessage || i18n.getString(_TL_('We\\'ve encountered an error saving your updates. Please review and try again.'))}\r\n \r\n \r\n );\r\n};\r\n\r\nexport const withErrorAbove = (\r\n Component: React.ComponentType
,\r\n): React.FC
=> (props: P & ErrorBarProps) => {\r\n const {\r\n errorMessage,\r\n classes,\r\n ...rest\r\n } = props;\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n );\r\n };\r\n","module.exports = __WEBPACK_EXTERNAL_MODULE__298__;","import _ from 'underscore';\r\nimport React, { useMemo, useCallback } from 'react';\r\nimport { useResponsiveSize } from '@bingads-webui-react/with-responsive-size';\r\nimport { StepProgressList, TopStepProgressBar } from '@bingads-webui-fluent-component/step-progress-indicator';\r\nimport {\r\n useWizardService,\r\n getCurrentStepId,\r\n getCurrentFlow,\r\n getIsStepVisited,\r\n getIsStepValid,\r\n getIsStepSaveFailed,\r\n WIZARD_EVENTS,\r\n} from '@bingads-webui-react/wizard-core';\r\n\r\ninterface StepperProps {\r\n config?: Array<{\r\n id: string;\r\n title?: string;\r\n detail?: string;\r\n steps?: Array<{\r\n id: string;\r\n title: string;\r\n detail?: string;\r\n isBehind?: boolean;\r\n }>;\r\n }>;\r\n getOnItemClickFn?: (step: any) => any;\r\n}\r\n\r\nconst getStepConfigWithStatus = (config, state) => {\r\n const returnConfig = [];\r\n _.each(config, (s) => {\r\n const isVisited = getIsStepVisited(state, s.id);\r\n const isValid = getIsStepValid(state, s.id);\r\n const isSaveFailed = getIsStepSaveFailed(state, s.id);\r\n const newStepConfig = {\r\n ...s,\r\n isVisited,\r\n hasError: !isValid && isSaveFailed,\r\n };\r\n if (!_.isEmpty(s.steps)) {\r\n newStepConfig.steps = getStepConfigWithStatus(s.steps, state);\r\n }\r\n returnConfig.push(newStepConfig);\r\n });\r\n return returnConfig;\r\n};\r\n\r\nconst withStepFlow = (Component) => {\r\n const HoC: React.FC = (props) => {\r\n const { config, getOnItemClickFn } = props;\r\n const { state, send } = useWizardService();\r\n const currentStepId = getCurrentStepId(state);\r\n const currentFlow = getCurrentFlow(state);\r\n const displayMode = useResponsiveSize();\r\n const isTitleCollapsed = ['l', 'xl'].includes(displayMode);\r\n\r\n const stepListConfig = useMemo(() => {\r\n if (!config) {\r\n return currentFlow.map((id) => ({ id, title: id }));\r\n }\r\n return getStepConfigWithStatus(config, state);\r\n }, [config, currentFlow, state]);\r\n\r\n const getDefaultOnItemClickFn = useCallback((step) => {\r\n let toStep;\r\n if (currentFlow.includes(step.id)) {\r\n toStep = step;\r\n } else if (!_.isEmpty(step.steps)) {\r\n const firstSubStep = _.find(step.steps, (s) => currentFlow.includes(s.id));\r\n if (firstSubStep) {\r\n toStep = firstSubStep;\r\n }\r\n }\r\n if (toStep && toStep.isBehind) {\r\n return () => {\r\n send(WIZARD_EVENTS.NAVIGATE_TO, {\r\n stepId: toStep.id,\r\n });\r\n };\r\n }\r\n return undefined;\r\n }, [currentFlow, send]);\r\n\r\n return (\r\n \r\n );\r\n };\r\n return HoC;\r\n};\r\n\r\nexport const StepList: React.FC = withStepFlow(StepProgressList);\r\nexport const StepBar: React.FC = withStepFlow(TopStepProgressBar);\r\n","module.exports = __WEBPACK_EXTERNAL_MODULE__300__;","import React, { useCallback } from 'react';\r\nimport { useResponsiveSize } from '@bingads-webui-react/with-responsive-size';\r\nimport {\r\n useWizardService,\r\n WIZARD_EVENTS,\r\n} from '@bingads-webui-react/wizard-core';\r\nimport { Dismiss20Regular } from '@fluentui/react-icons';\r\nimport {\r\n Button,\r\n mergeClasses,\r\n makeStyles,\r\n shorthands,\r\n tokens,\r\n} from '@fluentui/react-components';\r\n\r\nconst useBasicTopBarStyles = makeStyles({\r\n stack: {\r\n display: 'flex',\r\n flexDirection: 'row',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n backgroundColor: tokens.colorNeutralBackground4,\r\n ...shorthands.borderBottom('1px', 'solid', tokens.colorNeutralStroke2),\r\n ...shorthands.padding('14px', '24px'),\r\n ...shorthands.gap('8px'),\r\n },\r\n title: {\r\n fontSize: tokens.fontSizeBase500,\r\n fontWeight: tokens.fontWeightBold,\r\n lineHeight: tokens.lineHeightBase500,\r\n },\r\n 'title-s': {\r\n fontSize: tokens.fontSizeBase400,\r\n lineHeight: tokens.lineHeightBase400,\r\n },\r\n 'title-m': {\r\n fontSize: tokens.fontSizeBase400,\r\n lineHeight: tokens.lineHeightBase400,\r\n },\r\n});\r\n\r\ninterface BasicTopBarProps {\r\n classes?: {\r\n root?: string;\r\n };\r\n title: string | React.ReactNode;\r\n hideCloseButton?: boolean;\r\n}\r\n\r\nexport const BasicTopBar: React.FC = (props) => {\r\n const classes = useBasicTopBarStyles();\r\n const displayMode = useResponsiveSize();\r\n const { send } = useWizardService();\r\n const onCancelClicked = useCallback(() => {\r\n send(WIZARD_EVENTS.CANCEL);\r\n }, [send]);\r\n\r\n if (!props.title) {\r\n return null;\r\n }\r\n\r\n return (\r\n \r\n
{props.title}
\r\n {!props.hideCloseButton\r\n && (\r\n
}\r\n onClick={onCancelClicked}\r\n />\r\n )}\r\n
\r\n {TopBar &&
}\r\n
\r\n \r\n {Stepper\r\n && (\r\n
\r\n \r\n
\r\n )}\r\n
\r\n \r\n {LoadingShimmer && }\r\n \r\n
\r\n {Footer\r\n && (\r\n \r\n \r\n
\r\n )}\r\n \r\n
\r\n \r\n
\r\n
\r\n {LoadingShimmer && }\r\n \r\n
\r\n {CardFooter\r\n && (\r\n
\r\n \r\n
\r\n )}\r\n {CardTail\r\n && (\r\n
\r\n \r\n
\r\n )}\r\n
\r\n
\r\n {CancelDialog &&
}\r\n {ConfirmDialog &&
}\r\n
\r\n {toolbar}\r\n this.renderHeaderCheckbox(checkBoxProps.checked)}\r\n styles={subColumnProps.showSubColumns && { root: { minHeight: 85 }, cellSizer: { height: '100%' } }}\r\n />\r\n
\r\n );\r\n };\r\n\r\n renderRow = (props) => {\r\n const {\r\n onRenderRow, selectionMode, freezingColumnCount, freezingColumnRTLCount,\r\n enableSegmentation, onRenderRowWithSegmentation,\r\n } = this.props;\r\n if (enableSegmentation) {\r\n return onRenderRowWithSegmentation({ ...props, freezingColumnCount, selectionMode });\r\n }\r\n\r\n const defaultRender = renderProps => ();\r\n\r\n const finalRender = onRenderRow ? composeRenderFunction(onRenderRow, defaultRender) : defaultRender;\r\n\r\n return finalRender(props);\r\n };\r\n\r\n renderCheckbox = (props) => {\r\n if (this.props.onRenderCheckbox) {\r\n return this.props.onRenderCheckbox(props);\r\n }\r\n return (\r\n \r\n );\r\n };\r\n\r\n\r\n render() {\r\n const {\r\n props, state, handleSort, handleColumnResize, renderInlineEditPanel, dismissInlineEditPanel,\r\n } = this;\r\n const {\r\n Renderer, placeholder, items, enableShimmer, pager, stickyHeader, stickyTop, freezingColumnCount, sortedColumn, classes,\r\n onColumnResize = _.noop, isSortedDescendingByDefault, columnProcessors,\r\n } = props;\r\n const { inlineEditPanel } = state;\r\n\r\n const columns = processColumns({\r\n columns: props.columns, sortedColumn, handleSort, renderInlineEditPanel, dismissInlineEditPanel, isSortedDescendingByDefault, columnProcessors, headerContainerRef: props.headerContainerRef,\r\n });\r\n\r\n const finalOnColumnResize = (...params) => {\r\n onColumnResize(...params);\r\n handleColumnResize(...params);\r\n };\r\n\r\n const fixHeaderClass = mergeStyles({\r\n '.ms-DetailsList-headerWrapper': {\r\n position: 'sticky',\r\n top: stickyTop || 0,\r\n background: '#fff',\r\n zIndex: 10,\r\n },\r\n });\r\n\r\n return (\r\n \r\n
0 ? ' has-freeze-column' : ''}`}\r\n componentRef={this.detailsListRef}\r\n constrainMode={0}\r\n layoutMode={DetailsListLayoutMode.justified}\r\n selectionPreservedOnEmptyClick\r\n enterModalSelectionOnTouch\r\n ariaLabelForSelectionColumn=\"Toggle selection\"\r\n ariaLabelForSelectAllCheckbox=\"Toggle selection for all items\"\r\n selectionZoneProps={{\r\n disableAutoSelectOnInputElements: true,\r\n }}\r\n checkButtonAriaLabel=\"select row\"\r\n {...props}\r\n columns={columns}\r\n onRenderDetailsHeader={this.renderHeader}\r\n onRenderRow={this.renderRow}\r\n onRenderCheckbox={this.renderCheckbox}\r\n // disable virtualize when total count less than 200 to increase performance\r\n onShouldVirtualize={() => items.length > 210}\r\n onColumnResize={finalOnColumnResize}\r\n onColumnAdjusted={this.handleColumnResize}\r\n />\r\n this.handleScroll(e)} ref={this.scrollBarFixedRef}>\r\n
\r\n
this.handleScroll(e)} ref={this.scrollBarRef}>\r\n
\r\n
{placeholder}
}\r\n {pager && items.length > 0 && }\r\n {inlineEditPanel}\r\n \r\n {freezingColumns.length > 0 &&
{freezingColumns.map(renderCell)}
}\r\n
{otherColumns.map(renderCell)}
\r\n {frezzingColumnsRTL.length > 0 &&
{frezzingColumnsRTL.map(renderCell)}
}\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 {i18n.getString(_TL_('Show rows:'))}\r\n onPageSizeChange(item.key)}\r\n disabled={disablePageSizeControl}\r\n />\r\n
\r\n );\r\n }\r\n\r\n function renderPageControl() {\r\n const totalPage = Math.ceil(total / pageSize);\r\n const textFieldStyles = {\r\n root: {\r\n width: 75,\r\n marginRight: 10,\r\n },\r\n };\r\n return hidePageControlForSinglePage && totalPage <= 1 ?\r\n null :\r\n (\r\n \r\n
onPageChange(pageNumber - 1, e)} />\r\n \r\n \r\n {i18n.getString(_TL_('of'))}\r\n {` ${totalPage}`}\r\n
\r\n onPageChange(pageNumber + 1, e)} />\r\n \r\n {renderPageSizeControl()}\r\n {renderPageControl()}\r\n
\r\n );\r\n}\r\n\r\nPagination.propTypes = {\r\n classes: PropTypes.shape({}).isRequired,\r\n pageNumber: PropTypes.number,\r\n pageSize: PropTypes.number,\r\n total: PropTypes.number.isRequired,\r\n availablePageSizes: PropTypes.oneOfType([\r\n PropTypes.array,\r\n ]),\r\n onPageChange: PropTypes.func,\r\n onPageSizeChange: PropTypes.func,\r\n hidePageControlForSinglePage: PropTypes.bool,\r\n disablePageSizeControl: PropTypes.bool,\r\n};\r\n\r\n\r\nPagination.defaultProps = {\r\n pageNumber: 1,\r\n pageSize: 20,\r\n onPageChange: () => {},\r\n onPageSizeChange: () => {},\r\n availablePageSizes: [20, 50, 100, 200],\r\n hidePageControlForSinglePage: false,\r\n disablePageSizeControl: false,\r\n};\r\n\r\nconst Wrapped = withDefaultStyles(Pagination, paginationStyle);\r\n\r\nexport { Wrapped as Pagination };\r\n","export default () => ({\r\n Pagination: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n margin: '15px 0',\r\n },\r\n pageSizeControl: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n pageControl: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n marginLeft: 20,\r\n },\r\n pageNumber: {\r\n display: 'flex',\r\n alignItems: 'center',\r\n },\r\n});\r\n\r\n","import _ from 'underscore';\r\nimport React from 'react';\r\nimport { IconButton } from '@fluentui/react';\r\nimport { DefaultSortDirection } from './constants';\r\nimport { WithAutoResizeIcon } from '../autoResizeHeader';\r\n\r\nfunction processSorted(sortedColumn, isSortedDescendingByDefault = true) {\r\n return (col) => {\r\n if (col.key && col.key === sortedColumn.key) {\r\n return {\r\n ...col,\r\n isSorted: true,\r\n isSortedDescending: sortedColumn.isSortedDescending,\r\n };\r\n }\r\n\r\n const { defaultSortDirection } = col;\r\n\r\n return {\r\n ...col,\r\n isSorted: false,\r\n isSortedDescending: defaultSortDirection ? defaultSortDirection === DefaultSortDirection.Ascending : isSortedDescendingByDefault,\r\n };\r\n };\r\n}\r\n\r\nfunction processSortable(handleSort) {\r\n return (col) => {\r\n if (col.sortable) {\r\n const originalOnClick = col.onColumnClick || _.noop;\r\n return {\r\n ...col,\r\n onColumnClick: (...args) => {\r\n originalOnClick(...args);\r\n handleSort(...args);\r\n },\r\n };\r\n }\r\n return col;\r\n };\r\n}\r\n\r\nfunction processInlineEdit(renderInlineEditPanel, dismissInlineEditPanel) {\r\n return col => ({\r\n ...col,\r\n onRender: (item, index, column) => {\r\n const onRender = col.onRender || (row => row[col.fieldName]);\r\n const { inlineEdit } = col;\r\n if ((typeof inlineEdit === 'boolean' && inlineEdit) || (typeof inlineEdit === 'function' && inlineEdit(item, index))) {\r\n return (\r\n \r\n {onRender(item, index, column)}\r\n {\r\n if (typeof col.onInlineEditClick === 'function') {\r\n col.onInlineEditClick(e, item, col);\r\n return;\r\n }\r\n if (typeof col.onRenderInlineEdit === 'function') {\r\n const cellEl = e.target.closest('.ms-DetailsRow-cell');\r\n const selector = `.ms-List-cell[data-list-index=\"${index}\"] .ms-DetailsRow-cell[aria-colindex=\"${cellEl.getAttribute('aria-colindex')}\"]`;\r\n renderInlineEditPanel(col.onRenderInlineEdit(e, item, dismissInlineEditPanel, cellEl.getBoundingClientRect(), selector));\r\n }\r\n }}\r\n />\r\n \r\n );\r\n }\r\n return onRender(item, index, column);\r\n },\r\n });\r\n}\r\n\r\nfunction processAutoResize(headerContainerRef) {\r\n return (col) => {\r\n if (!col.parentName) {\r\n const originalOnRenderHeader = col.onRenderHeader;\r\n return {\r\n ...col,\r\n onRenderHeader: props => (\r\n {originalOnRenderHeader ? originalOnRenderHeader(props) : <>{col.name}}\r\n ),\r\n };\r\n }\r\n return col;\r\n };\r\n}\r\n\r\nexport function processColumns({\r\n columns, sortedColumn, handleSort, renderInlineEditPanel, dismissInlineEditPanel, isSortedDescendingByDefault, columnProcessors = [], headerContainerRef,\r\n}) {\r\n if (!(columns instanceof Array)) {\r\n throw new Error('columns must be an array');\r\n }\r\n\r\n const processors = [\r\n processSorted(sortedColumn, isSortedDescendingByDefault),\r\n processSortable(handleSort),\r\n processInlineEdit(renderInlineEditPanel, dismissInlineEditPanel),\r\n processAutoResize(headerContainerRef),\r\n ];\r\n\r\n const processColumn = _.compose(...processors, ...columnProcessors);\r\n return columns.map(processColumn);\r\n}\r\n\r\n","export default () => ({\r\n CampaignDetailsList: {\r\n '&.fix-header .ms-DetailsList-headerWrapper': {\r\n position: 'sticky',\r\n top: 0,\r\n background: '#fff',\r\n zIndex: 10,\r\n },\r\n '&.has-freeze-column': {\r\n '& .ms-DetailsRow-cellCheck, & .ms-DetailsHeader-cellIsCheck': {\r\n position: 'sticky',\r\n zIndex: 3,\r\n background: '#fff',\r\n left: 0,\r\n marginTop: 1,\r\n height: 'auto',\r\n },\r\n },\r\n '& .ms-DetailsRow-check': {\r\n opacity: 1,\r\n '& .ms-Checkbox-checkbox': {\r\n cursor: 'pointer',\r\n },\r\n '& .ms-Checkbox.is-disabled': {\r\n '& .ms-Checkbox-checkbox': {\r\n borderColor: 'rgb(50, 49, 48)',\r\n '&:after': {\r\n borderColor: 'rgb(0, 120, 212)',\r\n },\r\n },\r\n '&.is-checked .ms-Checkbox-checkbox': {\r\n borderColor: 'rgb(0, 120, 212)',\r\n background: 'rgb(0, 120, 212)',\r\n },\r\n },\r\n },\r\n '& .ms-DetailsHeader': {\r\n borderTop: '2px solid #81868B',\r\n borderBottom: '2px solid #81868B',\r\n paddingTop: 0,\r\n overflow: 'hidden',\r\n minWidth: 'initial !important',\r\n width: '100%',\r\n },\r\n '& .ms-DetailsHeader-cell:hover': {\r\n background: 'transparent',\r\n },\r\n '& .ms-DetailsList-contentWrapper': {\r\n overflow: 'hidden',\r\n '& > .ms-SelectionZone': {\r\n fontSize: 0,\r\n },\r\n },\r\n '& .ms-DetailsRow': {\r\n '&:hover': {\r\n '& .campaign-details-list-cell-edit': {\r\n visibility: 'visible',\r\n },\r\n '& .freeze-columns-group, & .ms-DetailsRow-cellCheck': {\r\n background: 'rgb(243, 242, 241)',\r\n },\r\n },\r\n '&.is-selected': {\r\n '& .freeze-columns-group, & .ms-DetailsRow-cellCheck': {\r\n background: 'rgb(237, 235, 233)',\r\n },\r\n '&:hover': {\r\n '& .freeze-columns-group, & .ms-DetailsRow-cellCheck': {\r\n background: 'rgb(225, 223, 221)',\r\n },\r\n },\r\n },\r\n '& .freeze-columns-group': {\r\n background: '#fff',\r\n position: 'sticky',\r\n zIndex: 3,\r\n left: 0,\r\n boxShadow: '-7.2px 0px 7.2px 7.2px rgb(0 0 0 / 13%)',\r\n clipPath: 'inset(1px -15px 0px 0px)',\r\n borderTop: '1px solid #fff',\r\n '&.has-checkbox': {\r\n left: 48,\r\n },\r\n '&.right': {\r\n left: 'auto',\r\n right: 0,\r\n boxShadow: '7.2px 0px 7.2px 7.2px rgb(0 0 0 / 13%)',\r\n clipPath: 'inset(0px 0px 1px -15px )',\r\n },\r\n },\r\n },\r\n '& .ms-DetailsHeader-cell, & .ms-DetailsRow-cell': {\r\n borderRight: '1px solid #EDEBE9',\r\n height: '100%',\r\n '&.ms-DetailsRow-cellCheck, &.ms-DetailsHeader-cellIsCheck': {\r\n borderRight: 'none',\r\n },\r\n '&.freeze-column-cell': {\r\n background: '#fff',\r\n position: 'sticky',\r\n zIndex: 5,\r\n left: 48,\r\n '&.has-shadow': {\r\n boxShadow: '-7.2px 0px 7.2px 7.2px rgb(0 0 0 / 13%)',\r\n clipPath: 'inset(0px -15px 0px 0px)',\r\n },\r\n '&.has-left-shadow': {\r\n boxShadow: '7.2px 0px 7.2px 7.2px rgb(0 0 0 / 13%)',\r\n clipPath: 'inset(0px 0px 1px -15px)',\r\n },\r\n },\r\n '&:last-child': {\r\n borderRight: 'none',\r\n },\r\n '&.ms-DetailsHeader-cell:nth-last-child(2)': {\r\n borderRight: 'none',\r\n },\r\n '& .campaign-details-list-cell-content, & .campaign-details-list-cell-edit': {\r\n verticalAlign: 'middle',\r\n '&.campaign-details-list-cell-content': {\r\n maxWidth: 'calc(100% - 35px)',\r\n display: 'inline-block',\r\n textOverflow: 'ellipsis',\r\n overflow: 'hidden',\r\n },\r\n '&.campaign-details-list-cell-edit': {\r\n visibility: 'hidden',\r\n marginLeft: 3,\r\n height: 18,\r\n '&:hover': {\r\n background: 'transparent',\r\n },\r\n },\r\n },\r\n },\r\n '& .ms-DetailsHeader-cellSizer': {\r\n cursor: 'col-resize',\r\n zIndex: 3,\r\n '&:after': {\r\n display: 'none',\r\n },\r\n },\r\n '& .segmentation-row .ms-DetailsRow-cellCheck .ms-DetailsRow-check': {\r\n visibility: 'hidden',\r\n },\r\n '.ms-DetailsHeader-cellTitle[role=\"button\"]': {\r\n cursor: 'pointer',\r\n },\r\n },\r\n scrollBar: {\r\n height: 17,\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n background: 'transparent',\r\n '& .scroll-bar-child': {\r\n height: 17,\r\n },\r\n '&.invisible': {\r\n visibility: 'hidden',\r\n },\r\n },\r\n scrollBarFixed: {\r\n position: 'fixed',\r\n bottom: 0,\r\n height: 17,\r\n overflowX: 'auto',\r\n overflowY: 'hidden',\r\n background: 'transparent',\r\n '& .scroll-bar-child': {\r\n height: 17,\r\n },\r\n '&.invisible': {\r\n visibility: 'hidden',\r\n },\r\n },\r\n placeholder: {\r\n fontSize: 24,\r\n },\r\n});\r\n","export * from './src/index';\r\n\r\nexport { middlewares } from './src/middlewares';\r\nexport { extendReducers as reducers } from './src/reducers';\r\nexport { ContextualDetailsList } from './src/contextual-details-list';\r\nexport { usePreservedSelection, useClientSortingPaging } from './src/hooks';\r\n","/* eslint-disable react/no-unused-prop-types */\r\nimport React, { useCallback } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { defaultReducers, combineReducers } from './reducers';\r\n\r\nexport const GridContext = React.createContext();\r\n\r\nexport function GridContextProvider(props) {\r\n const {\r\n middlewares, reducers,\r\n } = props;\r\n\r\n\r\n const allReducers = [...defaultReducers, ...reducers];\r\n\r\n const { reducer, getInitialState } = combineReducers(allReducers);\r\n\r\n const [state, _dispatch] = React.useReducer(reducer, getInitialState(props));\r\n\r\n const dispatch = useCallback((action) => {\r\n middlewares.forEach((middleware) => {\r\n middleware(action, state);\r\n });\r\n _dispatch(action);\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [middlewares]);\r\n\r\n const context = {\r\n state,\r\n dispatch,\r\n };\r\n\r\n return (\r\n \r\n {props.children}\r\n \r\n );\r\n}\r\n\r\n\r\nGridContextProvider.propTypes = {\r\n middlewares: PropTypes.arrayOf(PropTypes.func),\r\n allColumns: PropTypes.arrayOf(PropTypes.shape({})),\r\n selectedColumns: PropTypes.arrayOf(PropTypes.shape({})),\r\n sortedColumn: PropTypes.shape({}),\r\n segmentation: PropTypes.shape({}),\r\n pagination: PropTypes.shape({}),\r\n filter: PropTypes.oneOfType([\r\n PropTypes.arrayOf(PropTypes.shape({})),\r\n PropTypes.shape({}),\r\n ]),\r\n children: PropTypes.node.isRequired,\r\n reducers: PropTypes.arrayOf(PropTypes.shape({})),\r\n};\r\n\r\nGridContextProvider.defaultProps = {\r\n middlewares: [],\r\n allColumns: [],\r\n selectedColumns: [],\r\n sortedColumn: {},\r\n segmentation: {},\r\n filter: [],\r\n pagination: {\r\n pageNumber: 1,\r\n pageSize: 20,\r\n },\r\n reducers: [],\r\n};\r\n","import basicReducer from './basic-reducer';\r\nimport selectionReducer from './selection-reducer';\r\nimport aggregatedRowReducer from './aggregated-row-reducer';\r\n\r\nexport const defaultReducers = [\r\n basicReducer,\r\n selectionReducer,\r\n];\r\n\r\nexport const extendReducers = {\r\n aggregatedRowReducer,\r\n};\r\n\r\nexport { combineReducers } from './combine-reducers';\r\n","function reducer(state, action) {\r\n const { type, payload } = action;\r\n switch (type) {\r\n case 'START_LOAD_DATA':\r\n return {\r\n ...state,\r\n items: null,\r\n totalCount: null,\r\n };\r\n case 'FINISH_LOAD_DATA':\r\n return {\r\n ...state,\r\n items: payload.items,\r\n totalCount: payload.totalCount,\r\n };\r\n case 'SET_EDITABLE_FILTER':\r\n return {\r\n ...state,\r\n editableFilter: payload,\r\n pagination: { pageNumber: 1, pageSize: state.pagination.pageSize },\r\n };\r\n case 'UPDATE_SELECTED_COLUMNS':\r\n return {\r\n ...state,\r\n selectedColumns: payload,\r\n };\r\n case 'UPDATE_ALL_COLUMNS':\r\n return {\r\n ...state,\r\n allColumns: payload,\r\n };\r\n case 'UPDATE_SORTED_COLUMN':\r\n return {\r\n ...state,\r\n sortedColumn: payload,\r\n };\r\n case 'UPDATE_PAGINATION':\r\n return {\r\n ...state,\r\n pagination: payload,\r\n };\r\n case 'UPDATE_SEGMENTATION':\r\n return {\r\n ...state,\r\n segmentation: payload,\r\n };\r\n case 'REFRESH_GRID_DATA':\r\n return {\r\n ...state,\r\n dataRefreshId: (state.dataRefreshId + 1) % Number.MAX_SAFE_INTEGER,\r\n };\r\n case 'TABLE_DID_MOUNT':\r\n return state;\r\n case 'TABLE_DID_UPDATE':\r\n return state;\r\n case 'SET_ITEMS_IN_ALL_PAGES':\r\n return {\r\n ...state,\r\n sourceItemsInAllPages: payload,\r\n };\r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nconst getInitialState = (props) => {\r\n const {\r\n allColumns, selectedColumns, sortedColumn, segmentation, pagination, filter, initAllItems,\r\n } = props;\r\n return {\r\n allColumns: allColumns || [],\r\n items: [],\r\n selectedItems: [],\r\n selectedColumns: selectedColumns || [],\r\n sortedColumn: sortedColumn || {},\r\n segmentation: segmentation || {},\r\n editableFilter: filter || [],\r\n pagination: pagination || {\r\n pageNumber: 1,\r\n pageSize: 20,\r\n },\r\n dataRefreshId: 0,\r\n sourceItemsInAllPages: initAllItems || [], // for client side sorting/paging/filtering\r\n };\r\n};\r\n\r\nexport default {\r\n reducer,\r\n getInitialState,\r\n};\r\n","import { SelectionMode, Selection } from '@fluentui/react';\r\n\r\nfunction reducer(state, action) {\r\n const { type, payload } = action;\r\n switch (type) {\r\n case 'SET_SELECTED_ITEMS':\r\n return {\r\n ...state,\r\n selectedItems: payload,\r\n isAllSelected: payload.length === (state.items && state.items.length),\r\n hasItemSelected: payload.length > 0,\r\n };\r\n case 'SET_ALL_SELECTED':\r\n state.selection.setAllSelected(payload);\r\n return {\r\n ...state,\r\n isAllSelected: payload,\r\n hasItemSelected: payload,\r\n };\r\n case 'SET_CROSS_PAGE_ALL_SELECTED':\r\n {\r\n if (payload) {\r\n state.selection.setAllSelected(true);\r\n }\r\n return {\r\n ...state,\r\n isCrossPageAllSelected: payload,\r\n };\r\n }\r\n case 'SET_SELECTION_MODE':\r\n {\r\n state.selection.setAllSelected(false);\r\n return {\r\n ...state,\r\n selectedItems: [],\r\n isAllSelected: false,\r\n hasItemSelected: false,\r\n selectionMode: payload,\r\n };\r\n }\r\n case 'TABLE_DID_UPDATE':\r\n if (payload.items !== state.items && state.isCrossPageAllSelected) {\r\n state.selection.setAllSelected(true);\r\n }\r\n return state;\r\n case 'SET_SELECTION':\r\n state.selection.setChangeEvents(false);\r\n payload.forEach((item) => {\r\n state.selection.setKeySelected(item.key, true, false);\r\n });\r\n state.selection.setChangeEvents(true);\r\n return state;\r\n case 'SET_SELECTED_ITEMS_IN_ALL_PAGES':\r\n return {\r\n ...state,\r\n selectedItemsInAllPages: payload,\r\n };\r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nconst getInitialState = ({ selectionMode, initSelectedItems }) => {\r\n const state = {\r\n selectionMode: selectionMode || SelectionMode.none,\r\n hasItemSelected: false,\r\n isAllSelected: false,\r\n isCrossPageAllSelected: false,\r\n selection: new Selection(),\r\n selectedItemsInAllPages: initSelectedItems || [],\r\n };\r\n return state;\r\n};\r\n\r\nexport default {\r\n reducer,\r\n getInitialState,\r\n};\r\n","import React from 'react';\r\nimport { result, isArray } from 'underscore';\r\nimport { Selection } from '@fluentui/react';\r\n\r\nfunction reducer(state, action) {\r\n const { type, payload } = action;\r\n\r\n switch (type) {\r\n case 'FINISH_LOAD_DATA': {\r\n if (state.items.length > 0) {\r\n const aggregatedItems = state.formatResponse(payload.response, state.aggregatedRowConfig);\r\n return {\r\n ...state,\r\n aggregatedItems,\r\n isAggregatedItemsVisible: true,\r\n items: [...state.items, ...aggregatedItems],\r\n };\r\n }\r\n return state;\r\n }\r\n case 'SHOW_AGGREGATED_ITEMS':\r\n if (state.isAggregatedItemsVisible) {\r\n return state;\r\n }\r\n return {\r\n ...state,\r\n isAggregatedItemsVisible: true,\r\n items: [...state.items, ...state.aggregatedItems],\r\n };\r\n case 'HIDE_AGGREGATED_ITEMS':\r\n if (!state.isAggregatedItemsVisible) {\r\n return state;\r\n }\r\n return {\r\n ...state,\r\n isAggregatedItemsVisible: false,\r\n items: state.items.filter(item => !item.isAggregatedRow),\r\n };\r\n default:\r\n return state;\r\n }\r\n}\r\n\r\nconst columnProcessor = column => ({\r\n ...column,\r\n onRender: (item, ...args) => {\r\n if (item.isAggregatedRow) {\r\n if (column.onRenderAggregatedRow) {\r\n return column.onRenderAggregatedRow(item, ...args);\r\n }\r\n return (-);\r\n }\r\n return column.onRender(item, ...args);\r\n },\r\n});\r\n\r\nconst getInitialState = props => ({\r\n aggregatedRowConfig: props.aggregatedRowConfig,\r\n aggregatedItems: [],\r\n isAggregatedItemsVisible: false,\r\n selection: new Selection({\r\n canSelectItem: item => (!item.isAggregatedRow),\r\n }),\r\n formatResponse: (response, aggregatedRowConfig) => (isArray(aggregatedRowConfig) ?\r\n aggregatedRowConfig.map(row => ({\r\n ...row,\r\n ...(result(response, row.dataKey, {})),\r\n ...(row.number ? { count: result(response, row.number, '') } : {}),\r\n isAggregatedRow: true,\r\n disableCheckbox: true,\r\n })) : []),\r\n columnProcessors: [...(result(props, 'columnProcessors', [])), columnProcessor],\r\n});\r\n\r\n\r\nexport default {\r\n reducer,\r\n getInitialState,\r\n};\r\n","export function combineReducers(reducers) {\r\n function combinedGetInitialState(props) {\r\n return reducers.reduce((state, { getInitialState }) => ({\r\n ...state,\r\n ...getInitialState(props),\r\n }), {});\r\n }\r\n\r\n function combinedReducer(state, action) {\r\n return reducers.reduce(\r\n (newState, { reducer }) => reducer(newState, action),\r\n state\r\n );\r\n }\r\n\r\n return { reducer: combinedReducer, getInitialState: combinedGetInitialState };\r\n}\r\n","import { preferenceFactory } from './preference-middleware';\r\nimport { campaignPreferenceFactory } from './campaign-preference-middleware';\r\n\r\nexport const middlewares = {\r\n preferenceFactory,\r\n campaignPreferenceFactory,\r\n};\r\n","function preferenceMiddlewareFactory(gridName, preferenceSetCallback) {\r\n return function preferenceMiddleware(action) {\r\n const { type, payload } = action;\r\n if (type === 'SET_EDITABLE_FILTER') {\r\n preferenceSetCallback({ Name: `${gridName}_Filter`, Data: payload });\r\n } else if (type === 'UPDATE_SORTED_COLUMN') {\r\n preferenceSetCallback({ Name: `${gridName}_Sorting`, Data: payload });\r\n } else if (type === 'UPDATE_SEGMENTATION') {\r\n preferenceSetCallback({ Name: `${gridName}_Segmentation`, Data: payload });\r\n } else if (type === 'UPDATE_PAGINATION') {\r\n preferenceSetCallback({ Name: `${gridName}_Pagination`, Data: payload });\r\n }\r\n };\r\n}\r\n\r\nfunction getGridPreferenceFactory(gridName, preferenceGetCallback) {\r\n return function getGridPreference() {\r\n const preferenceFilter = preferenceGetCallback({ Name: `${gridName}_Filter` });\r\n const preferenceSorting = preferenceGetCallback({ Name: `${gridName}_Sorting` });\r\n const preferenceSegmentation = preferenceGetCallback({ Name: `${gridName}_Segmentation` });\r\n const preferencePagination = preferenceGetCallback({ Name: `${gridName}_Pagination` });\r\n return {\r\n ...(preferenceFilter ? { filter: preferenceFilter } : {}),\r\n ...(preferenceSorting ? { sortedColumn: preferenceSorting } : {}),\r\n ...(preferenceSegmentation ? { segmentation: preferenceSegmentation } : {}),\r\n ...(preferencePagination ? { pagination: preferencePagination } : {}),\r\n };\r\n };\r\n}\r\n\r\nexport function preferenceFactory(gridName, preferenceSetCallback, preferenceGetCallback) {\r\n return {\r\n getGridPreference: getGridPreferenceFactory(gridName, preferenceGetCallback),\r\n preferenceMiddleware: preferenceMiddlewareFactory(gridName, preferenceSetCallback),\r\n };\r\n}\r\n","import { result } from 'underscore';\r\nimport { preferenceFactory } from './preference-middleware';\r\n\r\n\r\nfunction preferenceSetCallbackFactory(preferenceService) {\r\n return function preferenceSetCallback({ Name, Data }) {\r\n preferenceService.setAtAccountLevel({ Name, Data });\r\n };\r\n}\r\n\r\nfunction preferenceGetCallbackFactory(preferenceService) {\r\n return function preferenceGetCallback({ Name }) {\r\n const preference = preferenceService.findByNameAtAccountLevel(Name);\r\n return result(preference, 'Data');\r\n };\r\n}\r\n\r\nexport function campaignPreferenceFactory(gridName, preferenceService) {\r\n return preferenceFactory(gridName, preferenceSetCallbackFactory(preferenceService), preferenceGetCallbackFactory(preferenceService));\r\n}\r\n\r\n","import React, { useContext } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport { CampaignShimmeredDetailsList } from '@bingads-webui-grid/campaign-details-list';\r\nimport { GridContext } from './';\r\n\r\nexport function ContextualDetailsList(props) {\r\n const gridContext = useContext(GridContext);\r\n\r\n const {\r\n dispatch,\r\n state: {\r\n items, totalCount, selectedColumns, sortedColumn, pagination, selectionMode, selection, columnProcessors,\r\n },\r\n } = gridContext;\r\n const { pageNumber, pageSize } = pagination;\r\n const {\r\n showPagination,\r\n availablePageSizes,\r\n } = props;\r\n\r\n if (selection) {\r\n // eslint-disable-next-line no-underscore-dangle\r\n selection._onSelectionChanged = () => {\r\n dispatch({ type: 'SET_SELECTED_ITEMS', payload: selection.getSelection() });\r\n };\r\n }\r\n\r\n function pageChange(v) {\r\n dispatch({ type: 'UPDATE_PAGINATION', payload: { pageNumber: v, pageSize } });\r\n }\r\n\r\n function pageSizeChange(v) {\r\n dispatch({ type: 'UPDATE_PAGINATION', payload: { pageNumber: 1, pageSize: v } });\r\n }\r\n\r\n function handleSort(column) {\r\n dispatch({ type: 'UPDATE_SORTED_COLUMN', payload: column });\r\n dispatch({ type: 'UPDATE_PAGINATION', payload: { pageNumber: 1, pageSize } });\r\n }\r\n\r\n return (\r\n handleSort(col)}\r\n sortedColumn={sortedColumn}\r\n selectionMode={selectionMode}\r\n selection={selection}\r\n didMount={() => dispatch({ type: 'TABLE_DID_MOUNT' })}\r\n didUpdate={(prev) => {\r\n dispatch({ type: 'TABLE_DID_UPDATE', payload: prev });\r\n }}\r\n pager={\r\n showPagination\r\n ? {\r\n pageNumber: pageNumber || 1,\r\n pageSize,\r\n total: totalCount || 0,\r\n availablePageSizes,\r\n onPageChange: pageChange,\r\n onPageSizeChange: pageSizeChange,\r\n }\r\n : undefined\r\n }\r\n listProps={{ ignoreScrollingState: true }}\r\n columnProcessors={columnProcessors}\r\n // eslint-disable-next-line react/jsx-props-no-spreading\r\n {...props}\r\n />\r\n );\r\n}\r\n\r\nContextualDetailsList.propTypes = {\r\n showPagination: PropTypes.bool,\r\n availablePageSizes: PropTypes.arrayOf(PropTypes.number),\r\n};\r\n\r\nContextualDetailsList.defaultProps = {\r\n showPagination: true,\r\n availablePageSizes: undefined,\r\n};\r\n","module.exports = __WEBPACK_EXTERNAL_MODULE__58__;","export { useClientSortingPaging } from './useClientSortingPaging';\r\nexport { usePreservedSelection } from './usePreservedSelection';\r\n","import { useContext, useEffect } from 'react';\r\nimport { isEmpty } from 'lodash';\r\nimport { GridContext } from '../index';\r\n\r\nexport const useClientSortingPaging = ({\r\n sortFunction,\r\n}) => {\r\n const { state, dispatch } = useContext(GridContext);\r\n const { sortedColumn, pagination, sourceItemsInAllPages } = state;\r\n const { pageNumber, pageSize } = pagination;\r\n\r\n useEffect(() => {\r\n if (sourceItemsInAllPages && sortFunction && !isEmpty(sortedColumn)) {\r\n const newSourceItems = [...sourceItemsInAllPages].sort(sortFunction);\r\n dispatch({ type: 'SET_ITEMS_IN_ALL_PAGES', payload: newSourceItems });\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [dispatch, sortFunction, sortedColumn]);\r\n\r\n useEffect(() => {\r\n if (sourceItemsInAllPages) {\r\n const newItems = sourceItemsInAllPages.slice((pageNumber - 1) * pageSize, (pageNumber) * pageSize);\r\n dispatch({ type: 'FINISH_LOAD_DATA', payload: { items: newItems, totalCount: sourceItemsInAllPages.length } });\r\n }\r\n }, [dispatch, pageNumber, pageSize, sourceItemsInAllPages]);\r\n};\r\n","import { useContext, useEffect } from 'react';\r\nimport { intersectionBy, unionBy, reject, find } from 'lodash';\r\nimport { GridContext } from '../';\r\n\r\nexport const usePreservedSelection = () => {\r\n const { state, dispatch } = useContext(GridContext);\r\n const { items, selectedItems, selectedItemsInAllPages } = state;\r\n\r\n useEffect(() => {\r\n const newSelectedItems = intersectionBy(items, selectedItemsInAllPages, 'key');\r\n dispatch({ type: 'SET_SELECTION', payload: newSelectedItems });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [items]);\r\n\r\n useEffect(() => {\r\n const unselected = reject(items, item => find(selectedItems, item));\r\n let newSelectedItems = reject(selectedItemsInAllPages, item => find(unselected, item)); // remove unselected items\r\n newSelectedItems = unionBy(selectedItems, newSelectedItems, 'key'); // add new selected items\r\n dispatch({ type: 'SET_SELECTED_ITEMS_IN_ALL_PAGES', payload: newSelectedItems });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [selectedItems]);\r\n};\r\n","module.exports = __WEBPACK_EXTERNAL_MODULE__11__;","module.exports = __WEBPACK_EXTERNAL_MODULE__48__;","module.exports = __WEBPACK_EXTERNAL_MODULE__60__;","export * from './src/index';\r\n","export * from './bing-maps-context/index';\r\nexport * from './util/index';\r\nexport * from './use-bing-maps-search/index';\r\nexport * from './bing-maps-search-box/index';\r\nexport * from './bing-maps-view/index';\r\nexport * from './location-targets-grid/index';\r\nexport * from './location-targets-editor/index';\r\n","export * from './bing-maps-context';\r\nexport * from './bing-maps-context-provider';\r\n","import { createContext } from 'react';\r\n\r\nexport const BingMapsContext = createContext({});\r\n","import Promise from 'bluebird';\r\nimport React, { useCallback, useMemo, useState } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport _ from 'underscore';\r\n\r\nimport { BingMapsContext } from './bing-maps-context';\r\nimport { pollForBingMapsSdk } from '../util/poll-for-bing-maps-sdk';\r\nimport { BingMapsApiHelper } from '../util/bing-maps-api-helper';\r\n\r\nfunction injectScript(userRegion, locale) {\r\n return new Promise((resolve, reject) => {\r\n const script = document.createElement('script');\r\n script.type = 'text/javascript';\r\n script.async = true;\r\n\r\n const url = new URL('https://www.bing.com/api/maps/mapcontrol');\r\n if (userRegion) {\r\n url.searchParams.append('UR', userRegion);\r\n }\r\n if (locale) {\r\n url.searchParams.append('setLang', locale);\r\n }\r\n script.src = url.toString();\r\n script.onload = resolve;\r\n script.onerror = (e) => {\r\n reject(e);\r\n };\r\n\r\n // inject new