npm - dinocollab-core - Versions diffs - 2.1.28 → 2.1.30 - Mend

dinocollab-core 2.1.28 → 2.1.30

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.

Files changed (192) hide show

package/dist/src/data-view/create.data-view.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create.data-view.js","sources":["../../../src/data-view/create.data-view.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, Stack, styled } from '@mui/material'\r\nimport { SortButton } from './ui.units'\r\nimport { createViewMode } from './create.view-mode'\r\nimport { defaultViewMode, ViewModeButtons } from './view-mode.units'\r\nimport { getViewModeFromURL, syncViewModeToURL } from './query-param-url'\r\nimport { EViewMode, IViewModeConfigs, IViewModeValidModel } from './view-mode.types'\r\nimport { IFilterBarConfigs, IFilterState, IFilterStateChangeHandler, IPositionElement, IViewData } from './types'\r\nimport { defaultFilterBarState, DataViewContext, IDataViewState, IDataViewContext, OnPanelValueChange } from './context'\r\nimport createFilterBar, { IFilterBarSlots } from './create.filter-bar'\r\nimport ScrollTracking, { IScrollTrackingData, IScrollTrackingOptions } from './scroll-tracking'\r\nimport createPaginationBar, { IPaginationBarConfigs } from './create.pagination-bar'\r\nimport createPopperPanel from './create.popper-panel'\r\nimport createActiveFiltersPanel from './create.active-filters-panel'\r\n\r\nexport const filterBarClasses = {\r\n root: 'FilterBar-root',\r\n content: 'FilterBar-content',\r\n input: 'FilterBar-input',\r\n inputWrap: 'FilterBar-inputWrap',\r\n label: 'FilterBar-label',\r\n button: 'FilterBar-button',\r\n spacing: 'FilterBar-spacing',\r\n panel: 'FilterBar-panel',\r\n sticky: 'FilterBar-sticky',\r\n shadow: 'FilterBar-shadow'\r\n}\r\n\r\nexport interface IDataViewSlots<T extends IViewModeValidModel> {\r\n filterWrapProps?: BoxProps\r\n filterSlots?: IPositionElement\r\n activeFiltersPanelSlots?: IPositionElement\r\n primaryInputSlots?: IFilterBarSlots\r\n filterBarConfigs?: IFilterBarConfigs<T>\r\n viewModeConfigs?: IViewModeConfigs<T>\r\n paginationBarConfigs?: IPaginationBarConfigs\r\n scrollTracking?: IScrollTrackingOptions\r\n footerProps?: {\r\n wrapProps?: BoxProps\r\n enablePagination?: boolean\r\n }\r\n}\r\n\r\nexport interface IDataViewProps<T extends IViewModeValidModel> {\r\n loading?: boolean\r\n error?: string\r\n data?: IViewData<T>\r\n filter?: IFilterState<T>\r\n onFilterChange?: (value: IFilterState<T>) => void\r\n viewMode?: EViewMode\r\n onViewModeChange?: (value: EViewMode) => void\r\n syncViewModeToURL?: boolean\r\n autoHeight?: boolean\r\n slots?: IDataViewSlots<T>\r\n}\r\n\r\nexport interface IDataViewConfigs<T extends IViewModeValidModel> {\r\n autoHeight?: boolean\r\n filterBar?: IFilterBarConfigs<T>\r\n viewMode?: IViewModeConfigs<T>\r\n paginationBar?: IPaginationBarConfigs\r\n scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\ninterface IInternalConfigs<T extends IViewModeValidModel> extends IDataViewConfigs<T> {\r\n enablePaginationTop?: boolean\r\n scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\nfunction createDataView<T extends IViewModeValidModel>(configs: IDataViewConfigs<T>): ComponentType<IDataViewProps<T>> {\r\n const FilterBarInstance = createFilterBar<T>()\r\n const PopperPanelInstance = createPopperPanel<T>()\r\n const ActiveFiltersPanelInstance = createActiveFiltersPanel<T>()\r\n const ViewModeInstance = createViewMode<T>(configs.viewMode)\r\n const PaginationBarInstance = createPaginationBar<T>()\r\n\r\n class DataView extends Component<IDataViewProps<T>, IDataViewState<T>> {\r\n constructor(props: IDataViewProps<T>) {\r\n super(props)\r\n this.mergeConfig(props)\r\n this.state = this.getDefaultState(props)\r\n }\r\n\r\n private getDefaultState(currentProps: IDataViewProps<T>): IDataViewState<T> {\r\n const defaultValue = currentProps.slots?.viewModeConfigs?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n const viewMode = currentProps.syncViewModeToURL ? getViewModeFromURL<T>({ defaultViewMode: defaultValue }) : defaultValue\r\n return {\r\n ...defaultFilterBarState,\r\n filterState: this.internalConfig.filterBar?.defaultValue ?? {},\r\n viewMode\r\n }\r\n }\r\n\r\n get filterState(): IFilterState<T> {\r\n return this.props.filter ?? this.state.filterState\r\n }\r\n\r\n get viewMode(): EViewMode \| undefined {\r\n return this.props.viewMode ?? this.state.viewMode\r\n }\r\n\r\n private mergeConfig = (currentProps: IDataViewProps<T>) => {\r\n const { slots } = currentProps\r\n this.configCache = {\r\n filterBar: Object.assign({}, configs.filterBar, slots?.filterBarConfigs),\r\n viewMode: slots?.viewModeConfigs,\r\n paginationBar: Object.assign({}, configs.paginationBar, slots?.paginationBarConfigs),\r\n enablePaginationTop: slots?.paginationBarConfigs?.enablePaginationTop ?? configs.paginationBar?.enablePaginationTop ?? false,\r\n scrollTracking: Object.assign({}, configs.scrollTracking, slots?.scrollTracking),\r\n autoHeight: currentProps.autoHeight \|\| configs.autoHeight \|\| false\r\n }\r\n }\r\n\r\n private configCache: IInternalConfigs<T> = {}\r\n get internalConfig() {\r\n return this.configCache\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IDataViewProps<T>>): boolean {\r\n const filterDiff = JSON.stringify(nextProps.slots?.filterBarConfigs) !== JSON.stringify(this.props.slots?.filterBarConfigs)\r\n const viewModeDiff = JSON.stringify(nextProps.slots?.viewModeConfigs) !== JSON.stringify(this.props.slots?.viewModeConfigs)\r\n if (filterDiff \|\| viewModeDiff) this.mergeConfig(nextProps)\r\n return true\r\n }\r\n\r\n refFilterButton: HTMLButtonElement \| null = null\r\n refSortButton: HTMLButtonElement \| null = null\r\n render() {\r\n const mapContext: IDataViewContext<T> = {\r\n keyword: this.state.keyword.trim(),\r\n filterBarConfigs: this.internalConfig.filterBar ?? {},\r\n filterState: this.filterState,\r\n anchorEl: this.state.anchorEl,\r\n area: this.state.area,\r\n viewMode: this.state.viewMode,\r\n scrolled: this.state.scrolled,\r\n onFilterStateChange: this.onFilterStateChangeHandler,\r\n onKeywordChange: this.onKeywordChangeHandler,\r\n onPopperPanelChange: this.onPopperPanelChangeHandler,\r\n onPanelClose: this.onPanelCloseHandler,\r\n onClear: this.onClearHandler\r\n }\r\n\r\n return (\r\n <DataViewContext.Provider value={mapContext}>\r\n <Stack sx={{ height: '100%', flex: 1 }}>\r\n {this.internalConfig.filterBar?.enableSticky && (\r\n <ScrollTracking onChange={this.onScrollChangeHandler} {...this.internalConfig.scrollTracking} />\r\n )}\r\n {this.props.slots?.filterSlots?.above}\r\n <FilterBarInstance\r\n id={this.internalConfig.scrollTracking?.elementId}\r\n slots={{\r\n ...this.props.slots?.primaryInputSlots,\r\n right: (\r\n <>\r\n {this.internalConfig.filterBar?.enableSort && <SortButton />}\r\n {this.props.slots?.primaryInputSlots?.right}\r\n </>\r\n )\r\n }}\r\n >\r\n <PopperPanelInstance />\r\n </FilterBarInstance>\r\n {this.props.slots?.filterSlots?.below}\r\n {this.props.slots?.activeFiltersPanelSlots?.above}\r\n <FilterBarPanel>\r\n <ViewModeButtons value={this.state.viewMode} onChange={this.onViewModeChangeHandler} />\r\n {this.props.slots?.activeFiltersPanelSlots?.left}\r\n <Stack flexDirection={'row'} sx={{ flexWrap: 'wrap', alignItems: 'center', gap: 1, flexGrow: 1 }}>\r\n <ActiveFiltersPanelInstance loading={this.props.loading} />\r\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 1, flexGrow: 1, justifyContent: 'end' }}>\r\n {this.internalConfig.enablePaginationTop && (\r\n <PaginationBarInstance\r\n count={this.props.data?.totalItems ?? 0}\r\n defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n filter={this.filterState}\r\n onChange={this.onFilterStateChangeHandler}\r\n {...this.internalConfig.paginationBar}\r\n />\r\n )}\r\n </Box>\r\n </Stack>\r\n {this.props.slots?.activeFiltersPanelSlots?.right}\r\n </FilterBarPanel>\r\n {this.props.slots?.activeFiltersPanelSlots?.below}\r\n <ViewModeInstance\r\n data={this.props.data?.items ?? []}\r\n viewMode={this.viewMode}\r\n loading={this.props.loading}\r\n error={this.props.error}\r\n autoHeight={this.internalConfig.autoHeight}\r\n slots={this.internalConfig.viewMode}\r\n />\r\n {this.renderFooter()}\r\n </Stack>\r\n </DataViewContext.Provider>\r\n )\r\n }\r\n\r\n renderFooter = () => {\r\n const temp = this.props.slots?.footerProps \|\| {}\r\n return (\r\n <FooterWrap {...temp.wrapProps}>\r\n {temp.enablePagination !== false && (\r\n <PaginationBarInstance\r\n count={this.props.data?.totalItems ?? 0}\r\n defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n filter={this.filterState}\r\n onChange={this.onFilterStateChangeHandler}\r\n {...this.internalConfig.paginationBar}\r\n />\r\n )}\r\n </FooterWrap>\r\n )\r\n }\r\n\r\n onViewModeChangeHandler = (value: EViewMode) => {\r\n this.setState({ viewMode: value }, () => {\r\n if (this.props.syncViewModeToURL) {\r\n const dViewMode = this.internalConfig.viewMode?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n syncViewModeToURL({ viewMode: value, defaultViewMode: dViewMode })\r\n }\r\n this.props.onViewModeChange?.(value)\r\n })\r\n }\r\n\r\n onKeywordChangeHandler = (keyword: string) => this.setState({ keyword })\r\n\r\n onScrollChangeHandler = (data: IScrollTrackingData) => this.setState({ scrolled: data.isScrolled })\r\n\r\n onPopperPanelChangeHandler: OnPanelValueChange = (anchorEl, area) => this.setState({ anchorEl, area })\r\n\r\n onClearHandler = () => this.setState(defaultFilterBarState)\r\n\r\n onPanelCloseHandler = () => {\r\n this.setState({ anchorEl: null, area: undefined, keyword: '' })\r\n }\r\n\r\n onFilterStateChangeHandler: IFilterStateChangeHandler<T> = (filterState: IFilterState<T>) => {\r\n if (!this.props.filter) this.setState({ ...defaultFilterBarState, filterState })\r\n this.props.onFilterChange && this.props.onFilterChange(filterState)\r\n if (!!this.props.filter) this.setState(defaultFilterBarState)\r\n }\r\n }\r\n\r\n return DataView\r\n}\r\n\r\nexport default createDataView\r\n\r\nconst FilterBarPanel = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n flexWrap: 'wrap',\r\n gap: '8px',\r\n marginBottom: '8px',\r\n minHeight: 'var(--filter-bar-height, 40px)'\r\n})\r\n\r\nconst FooterWrap = styled(Box)({\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n width: '100%'\r\n})\r\n"],"names":["createDataView","configs","FilterBarInstance","createFilterBar","PopperPanelInstance","createPopperPanel","ActiveFiltersPanelInstance","createActiveFiltersPanel","ViewModeInstance","createViewMode","viewMode","PaginationBarInstance","createPaginationBar","DataView","props","_this","_classCallCheck","_callSuper","_defineProperty","currentProps","_ref","_slots$paginationBarC","_slots$paginationBarC2","_configs$paginationBa","slots","configCache","filterBar","Object","assign","filterBarConfigs","viewModeConfigs","paginationBar","paginationBarConfigs","enablePaginationTop","scrollTracking","autoHeight","_this$props$slots","_this$props$data$tota","_this$props$data","_this$internalConfig$","temp","footerProps","_jsx","FooterWrap","_objectSpread","wrapProps","children","enablePagination","count","data","totalItems","defaultFilter","internalConfig","defaultValue","filter","filterState","onChange","onFilterStateChangeHandler","value","setState","_this$props$onViewMod","_this$props","syncViewModeToURL","_ref2","_this$internalConfig$2","_this$internalConfig$3","_configs$viewMode","dViewMode","defaultViewMode","onViewModeChange","call","keyword","scrolled","isScrolled","anchorEl","area","defaultFilterBarState","undefined","onFilterChange","mergeConfig","state","getDefaultState","_inherits","Component","_createClass","key","_ref3","_currentProps$slots$v","_currentProps$slots","_configs$viewMode2","_this$internalConfig$4","_this$internalConfig$5","getViewModeFromURL","this","get","_this$props$filter","_this$props$viewMode","nextProps","_nextProps$slots","_this$props$slots2","_nextProps$slots2","_this$props$slots3","filterDiff","JSON","stringify","viewModeDiff","_this$internalConfig$6","_this$internalConfig$7","_this$props$slots4","_this$internalConfig$8","_this$props$slots5","_this$internalConfig$9","_this$props$slots6","_this$props$slots7","_this$props$slots8","_this$props$slots9","_this$props$data$tota2","_this$props$data2","_this$internalConfig$0","_this$props$slots0","_this$props$slots1","_this$props$data$item","_this$props$data3","mapContext","trim","onFilterStateChange","onKeywordChange","onKeywordChangeHandler","onPopperPanelChange","onPopperPanelChangeHandler","onPanelClose","onPanelCloseHandler","onClear","onClearHandler","DataViewContext","Provider","_jsxs","Stack","sx","height","flex","enableSticky","ScrollTracking","onScrollChangeHandler","filterSlots","above","id","elementId","primaryInputSlots","right","_Fragment","enableSort","SortButton","below","activeFiltersPanelSlots","FilterBarPanel","ViewModeButtons","onViewModeChangeHandler","left","flexDirection","flexWrap","alignItems","gap","flexGrow","loading","Box","display","justifyContent","items","error","renderFooter","styled","marginBottom","minHeight","width"],"mappings":"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"}
1	+ {"version":3,"file":"create.data-view.js","sources":["../../../src/data-view/create.data-view.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Box, BoxProps, Stack, styled } from '@mui/material'\r\nimport { SortButton } from './ui.units'\r\nimport { createViewMode } from './create.view-mode'\r\nimport { defaultViewMode, ViewModeButtons } from './view-mode.units'\r\nimport { getViewModeFromURL, syncViewModeToURL } from './query-param-url'\r\nimport { EViewMode, IViewModeConfigs, IViewModeValidModel } from './view-mode.types'\r\nimport { IFilterBarConfigs, IFilterState, IFilterStateChangeHandler, IPositionElement, IViewData } from './types'\r\nimport { defaultFilterBarState, DataViewContext, IDataViewState, IDataViewContext, OnPanelValueChange } from './context'\r\nimport createFilterBar, { IFilterBarSlots } from './create.filter-bar'\r\nimport ScrollTracking, { IScrollTrackingData, IScrollTrackingOptions } from './scroll-tracking'\r\nimport createPaginationBar, { IPaginationBarConfigs } from './create.pagination-bar'\r\nimport createPopperPanel from './create.popper-panel'\r\nimport createActiveFiltersPanel from './create.active-filters-panel'\r\n\r\nexport const filterBarClasses = {\r\n root: 'FilterBar-root',\r\n content: 'FilterBar-content',\r\n input: 'FilterBar-input',\r\n inputWrap: 'FilterBar-inputWrap',\r\n label: 'FilterBar-label',\r\n button: 'FilterBar-button',\r\n spacing: 'FilterBar-spacing',\r\n panel: 'FilterBar-panel',\r\n sticky: 'FilterBar-sticky',\r\n shadow: 'FilterBar-shadow'\r\n}\r\n\r\nexport interface IDataViewSlots<T extends IViewModeValidModel> {\r\n filterWrapProps?: BoxProps\r\n filterSlots?: IPositionElement\r\n activeFiltersPanelSlots?: IPositionElement\r\n primaryInputSlots?: IFilterBarSlots\r\n filterBarConfigs?: IFilterBarConfigs<T>\r\n viewModeConfigs?: IViewModeConfigs<T>\r\n paginationBarConfigs?: IPaginationBarConfigs\r\n scrollTracking?: IScrollTrackingOptions\r\n footerProps?: {\r\n wrapProps?: BoxProps\r\n enablePagination?: boolean\r\n }\r\n}\r\n\r\nexport interface IDataViewProps<T extends IViewModeValidModel> {\r\n loading?: boolean\r\n error?: string\r\n data?: IViewData<T>\r\n filter?: IFilterState<T>\r\n onFilterChange?: (value: IFilterState<T>) => void\r\n viewMode?: EViewMode\r\n onViewModeChange?: (value: EViewMode) => void\r\n syncViewModeToURL?: boolean\r\n autoHeight?: boolean\r\n slots?: IDataViewSlots<T>\r\n}\r\n\r\nexport interface IDataViewConfigs<T extends IViewModeValidModel> {\r\n autoHeight?: boolean\r\n filterBar?: IFilterBarConfigs<T>\r\n viewMode?: IViewModeConfigs<T>\r\n paginationBar?: IPaginationBarConfigs\r\n scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\ninterface IInternalConfigs<T extends IViewModeValidModel> extends IDataViewConfigs<T> {\r\n enablePaginationTop?: boolean\r\n scrollTracking?: IScrollTrackingOptions\r\n}\r\n\r\nfunction createDataView<T extends IViewModeValidModel>(configs: IDataViewConfigs<T>): ComponentType<IDataViewProps<T>> {\r\n const FilterBarInstance = createFilterBar<T>()\r\n const PopperPanelInstance = createPopperPanel<T>()\r\n const ActiveFiltersPanelInstance = createActiveFiltersPanel<T>()\r\n const ViewModeInstance = createViewMode<T>(configs.viewMode)\r\n const PaginationBarInstance = createPaginationBar<T>()\r\n\r\n class DataView extends Component<IDataViewProps<T>, IDataViewState<T>> {\r\n constructor(props: IDataViewProps<T>) {\r\n super(props)\r\n this.mergeConfig(props)\r\n this.state = this.getDefaultState(props)\r\n }\r\n\r\n private getDefaultState(currentProps: IDataViewProps<T>): IDataViewState<T> {\r\n const defaultValue = currentProps.slots?.viewModeConfigs?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n const viewMode = currentProps.syncViewModeToURL ? getViewModeFromURL<T>({ defaultViewMode: defaultValue }) : defaultValue\r\n return {\r\n ...defaultFilterBarState,\r\n filterState: this.internalConfig.filterBar?.defaultValue ?? {},\r\n viewMode\r\n }\r\n }\r\n\r\n get filterState(): IFilterState<T> {\r\n return this.props.filter ?? this.state.filterState\r\n }\r\n\r\n get viewMode(): EViewMode \| undefined {\r\n return this.props.viewMode ?? this.state.viewMode\r\n }\r\n\r\n private mergeConfig = (currentProps: IDataViewProps<T>) => {\r\n const { slots } = currentProps\r\n this.configCache = {\r\n filterBar: Object.assign({}, configs.filterBar, slots?.filterBarConfigs),\r\n viewMode: slots?.viewModeConfigs,\r\n paginationBar: Object.assign({}, configs.paginationBar, slots?.paginationBarConfigs),\r\n enablePaginationTop: slots?.paginationBarConfigs?.enablePaginationTop ?? configs.paginationBar?.enablePaginationTop ?? false,\r\n scrollTracking: Object.assign({}, configs.scrollTracking, slots?.scrollTracking),\r\n autoHeight: currentProps.autoHeight \|\| configs.autoHeight \|\| false\r\n }\r\n }\r\n\r\n private configCache: IInternalConfigs<T> = {}\r\n get internalConfig() {\r\n return this.configCache\r\n }\r\n\r\n shouldComponentUpdate(nextProps: Readonly<IDataViewProps<T>>): boolean {\r\n const filterDiff = JSON.stringify(nextProps.slots?.filterBarConfigs) !== JSON.stringify(this.props.slots?.filterBarConfigs)\r\n const viewModeDiff = JSON.stringify(nextProps.slots?.viewModeConfigs) !== JSON.stringify(this.props.slots?.viewModeConfigs)\r\n if (filterDiff \|\| viewModeDiff) this.mergeConfig(nextProps)\r\n return true\r\n }\r\n\r\n refFilterButton: HTMLButtonElement \| null = null\r\n refSortButton: HTMLButtonElement \| null = null\r\n render() {\r\n const mapContext: IDataViewContext<T> = {\r\n keyword: this.state.keyword.trim(),\r\n filterBarConfigs: this.internalConfig.filterBar ?? {},\r\n filterState: this.filterState,\r\n anchorEl: this.state.anchorEl,\r\n area: this.state.area,\r\n viewMode: this.state.viewMode,\r\n scrolled: this.state.scrolled,\r\n onFilterStateChange: this.onFilterStateChangeHandler,\r\n onKeywordChange: this.onKeywordChangeHandler,\r\n onPopperPanelChange: this.onPopperPanelChangeHandler,\r\n onPanelClose: this.onPanelCloseHandler,\r\n onClear: this.onClearHandler\r\n }\r\n\r\n return (\r\n <DataViewContext.Provider value={mapContext}>\r\n <Stack sx={{ height: '100%', flex: 1 }}>\r\n {this.internalConfig.filterBar?.enableSticky && (\r\n <ScrollTracking onChange={this.onScrollChangeHandler} {...this.internalConfig.scrollTracking} />\r\n )}\r\n {this.props.slots?.filterSlots?.above}\r\n <FilterBarInstance\r\n id={this.internalConfig.scrollTracking?.elementId}\r\n slots={{\r\n ...this.props.slots?.primaryInputSlots,\r\n right: (\r\n <>\r\n {this.internalConfig.filterBar?.enableSort && <SortButton />}\r\n {this.props.slots?.primaryInputSlots?.right}\r\n </>\r\n )\r\n }}\r\n >\r\n <PopperPanelInstance />\r\n </FilterBarInstance>\r\n {this.props.slots?.filterSlots?.below}\r\n {this.props.slots?.activeFiltersPanelSlots?.above}\r\n <FilterBarPanel>\r\n <ViewModeButtons value={this.state.viewMode} onChange={this.onViewModeChangeHandler} />\r\n {this.props.slots?.activeFiltersPanelSlots?.left}\r\n <Stack flexDirection={'row'} sx={{ flexWrap: 'wrap', alignItems: 'center', gap: 1, flexGrow: 1 }}>\r\n <ActiveFiltersPanelInstance loading={this.props.loading} />\r\n <Box sx={{ display: 'flex', alignItems: 'center', gap: 1, flexGrow: 1, justifyContent: 'end' }}>\r\n {this.internalConfig.enablePaginationTop && (\r\n <PaginationBarInstance\r\n count={this.props.data?.totalItems ?? 0}\r\n defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n filter={this.filterState}\r\n onChange={this.onFilterStateChangeHandler}\r\n {...this.internalConfig.paginationBar}\r\n />\r\n )}\r\n </Box>\r\n </Stack>\r\n {this.props.slots?.activeFiltersPanelSlots?.right}\r\n </FilterBarPanel>\r\n {this.props.slots?.activeFiltersPanelSlots?.below}\r\n <ViewModeInstance\r\n data={this.props.data?.items ?? []}\r\n viewMode={this.viewMode}\r\n loading={this.props.loading}\r\n error={this.props.error}\r\n autoHeight={this.internalConfig.autoHeight}\r\n slots={this.internalConfig.viewMode}\r\n />\r\n {this.renderFooter()}\r\n </Stack>\r\n </DataViewContext.Provider>\r\n )\r\n }\r\n\r\n renderFooter = () => {\r\n const temp = this.props.slots?.footerProps \|\| {}\r\n return (\r\n <FooterWrap {...temp.wrapProps}>\r\n {temp.enablePagination !== false && (\r\n <PaginationBarInstance\r\n count={this.props.data?.totalItems ?? 0}\r\n defaultFilter={this.internalConfig.filterBar?.defaultValue}\r\n filter={this.filterState}\r\n onChange={this.onFilterStateChangeHandler}\r\n {...this.internalConfig.paginationBar}\r\n />\r\n )}\r\n </FooterWrap>\r\n )\r\n }\r\n\r\n onViewModeChangeHandler = (value: EViewMode) => {\r\n this.setState({ viewMode: value }, () => {\r\n if (this.props.syncViewModeToURL) {\r\n const dViewMode = this.internalConfig.viewMode?.defaultValue ?? configs.viewMode?.defaultValue ?? defaultViewMode\r\n syncViewModeToURL({ viewMode: value, defaultViewMode: dViewMode })\r\n }\r\n this.props.onViewModeChange?.(value)\r\n })\r\n }\r\n\r\n onKeywordChangeHandler = (keyword: string) => this.setState({ keyword })\r\n\r\n onScrollChangeHandler = (data: IScrollTrackingData) => this.setState({ scrolled: data.isScrolled })\r\n\r\n onPopperPanelChangeHandler: OnPanelValueChange = (anchorEl, area) => this.setState({ anchorEl, area })\r\n\r\n onClearHandler = () => this.setState(defaultFilterBarState)\r\n\r\n onPanelCloseHandler = () => {\r\n this.setState({ anchorEl: null, area: undefined, keyword: '' })\r\n }\r\n\r\n onFilterStateChangeHandler: IFilterStateChangeHandler<T> = (filterState: IFilterState<T>) => {\r\n if (!this.props.filter) this.setState({ ...defaultFilterBarState, filterState })\r\n this.props.onFilterChange && this.props.onFilterChange(filterState)\r\n if (!!this.props.filter) this.setState(defaultFilterBarState)\r\n }\r\n }\r\n\r\n return DataView\r\n}\r\n\r\nexport default createDataView\r\n\r\nconst FilterBarPanel = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n flexWrap: 'wrap',\r\n gap: '8px',\r\n marginBottom: '8px',\r\n minHeight: 'var(--filter-bar-height, 40px)'\r\n})\r\n\r\nconst FooterWrap = styled(Box)({\r\n display: 'flex',\r\n justifyContent: 'flex-end',\r\n width: '100%'\r\n})\r\n"],"names":["createDataView","configs","FilterBarInstance","createFilterBar","PopperPanelInstance","createPopperPanel","ActiveFiltersPanelInstance","createActiveFiltersPanel","ViewModeInstance","createViewMode","viewMode","PaginationBarInstance","createPaginationBar","DataView","props","_this","_classCallCheck","_callSuper","_defineProperty","currentProps","_ref","_slots$paginationBarC","_slots$paginationBarC2","_configs$paginationBa","slots","configCache","filterBar","Object","assign","filterBarConfigs","viewModeConfigs","paginationBar","paginationBarConfigs","enablePaginationTop","scrollTracking","autoHeight","_this$props$slots","_this$props$data$tota","_this$props$data","_this$internalConfig$","temp","footerProps","_jsx","FooterWrap","_objectSpread","wrapProps","children","enablePagination","count","data","totalItems","defaultFilter","internalConfig","defaultValue","filter","filterState","onChange","onFilterStateChangeHandler","value","setState","_this$props$onViewMod","_this$props","syncViewModeToURL","_ref2","_this$internalConfig$2","_this$internalConfig$3","_configs$viewMode","dViewMode","defaultViewMode","onViewModeChange","call","keyword","scrolled","isScrolled","anchorEl","area","defaultFilterBarState","undefined","onFilterChange","mergeConfig","state","getDefaultState","_inherits","Component","_createClass","key","_ref3","_currentProps$slots$v","_currentProps$slots","_configs$viewMode2","_this$internalConfig$4","_this$internalConfig$5","getViewModeFromURL","this","get","_this$props$filter","_this$props$viewMode","nextProps","_nextProps$slots","_this$props$slots2","_nextProps$slots2","_this$props$slots3","filterDiff","JSON","stringify","viewModeDiff","_this$internalConfig$6","_this$internalConfig$7","_this$props$slots4","_this$internalConfig$8","_this$props$slots5","_this$internalConfig$9","_this$props$slots6","_this$props$slots7","_this$props$slots8","_this$props$slots9","_this$props$data$tota2","_this$props$data2","_this$internalConfig$0","_this$props$slots0","_this$props$slots1","_this$props$data$item","_this$props$data3","mapContext","trim","onFilterStateChange","onKeywordChange","onKeywordChangeHandler","onPopperPanelChange","onPopperPanelChangeHandler","onPanelClose","onPanelCloseHandler","onClear","onClearHandler","DataViewContext","Provider","_jsxs","Stack","sx","height","flex","enableSticky","ScrollTracking","onScrollChangeHandler","filterSlots","above","id","elementId","primaryInputSlots","right","_Fragment","enableSort","SortButton","below","activeFiltersPanelSlots","FilterBarPanel","ViewModeButtons","onViewModeChangeHandler","left","flexDirection","flexWrap","alignItems","gap","flexGrow","loading","Box","display","justifyContent","items","error","renderFooter","styled","marginBottom","minHeight","width"],"mappings":"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"}

package/dist/src/data-view/create.filter-bar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e,inherits as t,createClass as a,classCallCheck as r,callSuper as n,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as l}from"react/jsx-runtime";import{Component as p}from"react";import{styled as s,Box as c,colors as d}from"@mui/material";import u from"@mui/material/ClickAwayListener";import{createFilterStore as f}from"./filter-store.js";import{FilterButton as g,FilterInput as h,FilterInputAdornment as m}from"./ui.units.js";import{mapDataViewContext as b,defaultDataViewContext as v}from"./context.js";var C={root:"FilterBar-root",content:"FilterBar-content",input:"FilterBar-input",inputWrap:"FilterBar-inputWrap",label:"FilterBar-label",button:"FilterBar-button",spacing:"FilterBar-spacing",sticky:"FilterBar-sticky",shadow:"FilterBar-shadow"};function k(){var s=function(){function s(){var t;r(this,s);for(var a=arguments.length,o=new Array(a),i=0;i<a;i++)o[i]=arguments[i];return t=n(this,s,[].concat(o)),e(t,"dataViewContext",v),e(t,"refInput",null),e(t,"refBeforeInput",null),e(t,"getRootClasses",(function(){var e,a=null!==(e=t.dataViewContext.filterBarConfigs.enableSticky)&&void 0!==e&&e,r=[C.root];return a&&r.push(C.sticky),t.dataViewContext.scrolled&&r.push(C.shadow),r.join(" ")})),e(t,"handleKeyDown",(function(e){var a=e.keyCode;if(13===a)e.stopPropagation(),e.preventDefault(),t.handleEnterSearch();else if(27===a){var r;e.stopPropagation(),e.preventDefault(),null===(r=t.refInput)||void 0===r||r.blur(),t.dataViewContext.onPanelClose()}})),e(t,"handleEnterSearch",(function(){var e;if(t.dataViewContext.keyword){var a=f(t.dataViewContext.filterState);a.addQuickSearch(t.dataViewContext.keyword,{reason:"quickSearch",area:"input"});var r,n=a.build();if(null!==(e=n.details)&&void 0!==e&&e.isChanged)null===(r=t.refInput)||void 0===r||r.blur(),t.dataViewContext.onFilterStateChange(n)}})),e(t,"handleClear",(function(){var e;null===(e=t.refInput)||void 0===e||e.blur(),t.dataViewContext.onClear()})),t}return t(s,p),a(s,[{key:"render",value:function(){var e=this;return b((function(t){var a,r,n,p=t.filterBarConfigs,s=p.id;return e.dataViewContext=t,i(u,{onClickAway:function(){return t.onPopperPanelChange(null)},children:l(x,o(o({id:e.props.id,className:e.getRootClasses()},null===(a=e.props.slots)||void 0===a?void 0:a.wrapProps),{},{children:[l("div",{className:C.content,children:[null===(r=e.props.slots)||void 0===r?void 0:r.left,l("div",{className:C.inputWrap,children:[i(g,{className:C.button,onClick:function(e){t.onPopperPanelChange(e.currentTarget,"filterButton")}}),l(c,{component:"label",htmlFor:s,className:C.label,children:[i(c,{ref:function(t){e.refBeforeInput=t}}),i(h,{ref:function(t){e.refInput=t},id:s,className:C.input,placeholder:p.placeholder,onChange:function(e){return t.onKeywordChange(e.target.value)},value:t.keyword,onFocus:function(){e.refBeforeInput&&t.onPopperPanelChange(e.refBeforeInput,"input")},onKeyDown:e.handleKeyDown,endAdornment:i(m,{notes:p.notes,keyword:t.keyword,onEnterSearch:e.handleEnterSearch,onClear:e.handleClear})})]})]}),null===(n=e.props.slots)||void 0===n?void 0:n.right]}),e.props.children]}))})}))}}])}();return s}var x=s(c)((function(t){var a=t.theme;return e(e(e(e(e(e(e({marginBottom:"4px",marginLeft:a.spacing(-1),marginRight:a.spacing(-1),paddingLeft:a.spacing(.5),paddingRight:a.spacing(.5)},"&.".concat(C.sticky),{position:"sticky",top:"var(--height-header, 0)",zIndex:a.zIndex.appBar-1}),".".concat(C.content),{display:"flex",gap:"8px",alignItems:"center",flexWrap:"wrap",padding:a.spacing(1.5,0,.75),position:"relative",backgroundColor:a.palette.background.paper,"&::after":{content:'""',position:"absolute",top:"100%",left:0,width:"100%",height:"6px",pointerEvents:"none",background:"linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent)",maskImage:"linear-gradient(to right, transparent, black 20%, black 80%, transparent)",WebkitMaskImage:"linear-gradient(to right, transparent, black 20%, black 80%, transparent)",opacity:0}}),"&.".concat(C.shadow," .").concat(C.content),{"&::after":{transition:"opacity 0.2s ease-in-out",transitionDelay:"0.2s",opacity:1}}),".".concat(C.input),{input:{padding:"4px 0 5px"}}),".".concat(C.inputWrap),{flex:1,display:"flex",alignItems:"center",minHeight:"var(--filter-bar-height, 40px)",gap:"8px",borderRadius:"6px",transition:"all linear 0.2s",padding:"0 8px",backgroundColor:a.palette.background.paper,border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))","&:hover":{backgroundColor:"dark"===a.palette.mode?a.palette.grey[900]:d.grey[50],borderColor:"dark"===a.palette.mode?d.blue[300]:d.blue[200]},"&:focus-within":{backgroundColor:"dark"===a.palette.mode?a.palette.grey[900]:d.grey[50],borderColor:"dark"===a.palette.mode?d.blue[300]:d.blue[400],boxShadow:"dark"===a.palette.mode?"0 0 0 2px ".concat(d.blue[200]):"0 0 0 2px ".concat(d.blue[100])}}),".".concat(C.label),{flex:1,display:"flex",alignItems:"flex-end"}),".".concat(C.spacing),{flex:1,height:"var(--filter-bar-height, 40px)"})}));export{k as createFilterBar,k as default,C as filterBarClasses};
+import{defineProperty as e,inherits as t,createClass as a,classCallCheck as r,callSuper as n,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i,jsxs as l}from"react/jsx-runtime";import{Component as p}from"react";import{styled as s,Box as c,colors as d}from"@mui/material";import u from"@mui/material/ClickAwayListener";import{createFilterStore as f}from"./filter-store.js";import{FilterButton as g,FilterInput as h,FilterInputAdornment as m}from"./ui.units.js";import{mapDataViewContext as b,defaultDataViewContext as v}from"./context.js";var C={root:"FilterBar-root",content:"FilterBar-content",input:"FilterBar-input",inputWrap:"FilterBar-inputWrap",label:"FilterBar-label",button:"FilterBar-button",spacing:"FilterBar-spacing",sticky:"FilterBar-sticky",shadow:"FilterBar-shadow"};function k(){var s=function(){function s(){var t;r(this,s);for(var a=arguments.length,o=new Array(a),i=0;i<a;i++)o[i]=arguments[i];return t=n(this,s,[].concat(o)),e(t,"dataViewContext",v),e(t,"refInput",null),e(t,"refBeforeInput",null),e(t,"getRootClasses",function(){var e,a=null!==(e=t.dataViewContext.filterBarConfigs.enableSticky)&&void 0!==e&&e,r=[C.root];return a&&r.push(C.sticky),t.dataViewContext.scrolled&&r.push(C.shadow),r.join(" ")}),e(t,"handleKeyDown",function(e){var a=e.keyCode;if(13===a)e.stopPropagation(),e.preventDefault(),t.handleEnterSearch();else if(27===a){var r;e.stopPropagation(),e.preventDefault(),null===(r=t.refInput)||void 0===r||r.blur(),t.dataViewContext.onPanelClose()}}),e(t,"handleEnterSearch",function(){var e;if(t.dataViewContext.keyword){var a=f(t.dataViewContext.filterState);a.addQuickSearch(t.dataViewContext.keyword,{reason:"quickSearch",area:"input"});var r,n=a.build();if(null!==(e=n.details)&&void 0!==e&&e.isChanged)null===(r=t.refInput)||void 0===r||r.blur(),t.dataViewContext.onFilterStateChange(n)}}),e(t,"handleClear",function(){var e;null===(e=t.refInput)||void 0===e||e.blur(),t.dataViewContext.onClear()}),t}return t(s,p),a(s,[{key:"render",value:function(){var e=this;return b(function(t){var a,r,n,p=t.filterBarConfigs,s=p.id;return e.dataViewContext=t,i(u,{onClickAway:function(){return t.onPopperPanelChange(null)},children:l(x,o(o({id:e.props.id,className:e.getRootClasses()},null===(a=e.props.slots)||void 0===a?void 0:a.wrapProps),{},{children:[l("div",{className:C.content,children:[null===(r=e.props.slots)||void 0===r?void 0:r.left,l("div",{className:C.inputWrap,children:[i(g,{className:C.button,onClick:function(e){t.onPopperPanelChange(e.currentTarget,"filterButton")}}),l(c,{component:"label",htmlFor:s,className:C.label,children:[i(c,{ref:function(t){e.refBeforeInput=t}}),i(h,{ref:function(t){e.refInput=t},id:s,className:C.input,placeholder:p.placeholder,onChange:function(e){return t.onKeywordChange(e.target.value)},value:t.keyword,onFocus:function(){e.refBeforeInput&&t.onPopperPanelChange(e.refBeforeInput,"input")},onKeyDown:e.handleKeyDown,endAdornment:i(m,{notes:p.notes,keyword:t.keyword,onEnterSearch:e.handleEnterSearch,onClear:e.handleClear})})]})]}),null===(n=e.props.slots)||void 0===n?void 0:n.right]}),e.props.children]}))})})}}])}();return s}var x=s(c)(function(t){var a=t.theme;return e(e(e(e(e(e(e({marginBottom:"4px",marginLeft:a.spacing(-1),marginRight:a.spacing(-1),paddingLeft:a.spacing(.5),paddingRight:a.spacing(.5)},"&.".concat(C.sticky),{position:"sticky",top:"var(--height-header, 0)",zIndex:a.zIndex.appBar-1}),".".concat(C.content),{display:"flex",gap:"8px",alignItems:"center",flexWrap:"wrap",padding:a.spacing(1.5,0,.75),position:"relative",backgroundColor:a.palette.background.paper,"&::after":{content:'""',position:"absolute",top:"100%",left:0,width:"100%",height:"6px",pointerEvents:"none",background:"linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent)",maskImage:"linear-gradient(to right, transparent, black 20%, black 80%, transparent)",WebkitMaskImage:"linear-gradient(to right, transparent, black 20%, black 80%, transparent)",opacity:0}}),"&.".concat(C.shadow," .").concat(C.content),{"&::after":{transition:"opacity 0.2s ease-in-out",transitionDelay:"0.2s",opacity:1}}),".".concat(C.input),{input:{padding:"4px 0 5px"}}),".".concat(C.inputWrap),{flex:1,display:"flex",alignItems:"center",minHeight:"var(--filter-bar-height, 40px)",gap:"8px",borderRadius:"6px",transition:"all linear 0.2s",padding:"0 8px",backgroundColor:a.palette.background.paper,border:"1px solid var(--color-divider, rgba(145 158 171 / 20%))","&:hover":{backgroundColor:"dark"===a.palette.mode?a.palette.grey[900]:d.grey[50],borderColor:"dark"===a.palette.mode?d.blue[300]:d.blue[200]},"&:focus-within":{backgroundColor:"dark"===a.palette.mode?a.palette.grey[900]:d.grey[50],borderColor:"dark"===a.palette.mode?d.blue[300]:d.blue[400],boxShadow:"dark"===a.palette.mode?"0 0 0 2px ".concat(d.blue[200]):"0 0 0 2px ".concat(d.blue[100])}}),".".concat(C.label),{flex:1,display:"flex",alignItems:"flex-end"}),".".concat(C.spacing),{flex:1,height:"var(--filter-bar-height, 40px)"})});export{k as createFilterBar,k as default,C as filterBarClasses};
 //# sourceMappingURL=create.filter-bar.js.map

package/dist/src/data-view/create.filter-bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create.filter-bar.js","sources":["../../../src/data-view/create.filter-bar.tsx"],"sourcesContent":["import React, { Component, PropsWithChildren } from 'react'\r\nimport { Box, BoxProps, colors, styled } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { IPositionElement } from './types'\r\nimport { createFilterStore } from './filter-store'\r\nimport { FilterButton, FilterInput, FilterInputAdornment } from './ui.units'\r\nimport { defaultDataViewContext, IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport const filterBarClasses = {\r\n root: 'FilterBar-root',\r\n content: 'FilterBar-content',\r\n input: 'FilterBar-input',\r\n inputWrap: 'FilterBar-inputWrap',\r\n label: 'FilterBar-label',\r\n button: 'FilterBar-button',\r\n spacing: 'FilterBar-spacing',\r\n panel: 'FilterBar-panel',\r\n sticky: 'FilterBar-sticky',\r\n shadow: 'FilterBar-shadow',\r\n helpText: 'FilterBar-helpText'\r\n}\r\n\r\nexport interface IFilterBarSlots extends IPositionElement<'left' \| 'right'> {\r\n wrapProps?: BoxProps\r\n}\r\n\r\nexport interface IFilterBarProps extends PropsWithChildren {\r\n id?: string\r\n slots?: IFilterBarSlots\r\n}\r\n\r\nexport function createFilterBar<T>() {\r\n class FilterBar extends Component<IFilterBarProps> {\r\n dataViewContext: IDataViewContext<T> = defaultDataViewContext\r\n\r\n refInput: HTMLInputElement \| null = null\r\n refBeforeInput: HTMLElement \| null = null\r\n render() {\r\n return mapDataViewContext((context) => {\r\n const configs = context.filterBarConfigs\r\n const id = configs.id\r\n this.dataViewContext = context\r\n return (\r\n <ClickAwayListener onClickAway={() => context.onPopperPanelChange(null)}>\r\n <FilterBarStyled id={this.props.id} className={this.getRootClasses()} {...this.props.slots?.wrapProps}>\r\n <div className={filterBarClasses.content}>\r\n {this.props.slots?.left}\r\n <div className={filterBarClasses.inputWrap}>\r\n <FilterButton\r\n className={filterBarClasses.button}\r\n onClick={(e) => {\r\n context.onPopperPanelChange(e.currentTarget, 'filterButton')\r\n }}\r\n />\r\n <Box component='label' htmlFor={id} className={filterBarClasses.label}>\r\n <Box\r\n ref={(ref: HTMLElement) => {\r\n this.refBeforeInput = ref\r\n }}\r\n />\r\n <FilterInput\r\n ref={(ref: HTMLInputElement) => {\r\n this.refInput = ref\r\n }}\r\n id={id}\r\n className={filterBarClasses.input}\r\n placeholder={configs.placeholder}\r\n onChange={(e) => context.onKeywordChange(e.target.value)}\r\n value={context.keyword}\r\n onFocus={() => {\r\n if (!this.refBeforeInput) return\r\n context.onPopperPanelChange(this.refBeforeInput, 'input')\r\n }}\r\n onKeyDown={this.handleKeyDown}\r\n endAdornment={\r\n <FilterInputAdornment\r\n notes={configs.notes}\r\n keyword={context.keyword}\r\n onEnterSearch={this.handleEnterSearch}\r\n onClear={this.handleClear}\r\n />\r\n }\r\n />\r\n </Box>\r\n </div>\r\n {this.props.slots?.right}\r\n </div>\r\n {this.props.children}\r\n </FilterBarStyled>\r\n </ClickAwayListener>\r\n )\r\n })\r\n }\r\n\r\n getRootClasses = () => {\r\n const enableSticky = this.dataViewContext.filterBarConfigs.enableSticky ?? false\r\n const classes: string[] = [filterBarClasses.root]\r\n if (enableSticky) classes.push(filterBarClasses.sticky)\r\n if (this.dataViewContext.scrolled) classes.push(filterBarClasses.shadow)\r\n return classes.join(' ')\r\n }\r\n\r\n handleKeyDown: React.KeyboardEventHandler<HTMLInputElement \| HTMLTextAreaElement> = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n this.handleEnterSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n this.refInput?.blur()\r\n this.dataViewContext.onPanelClose()\r\n }\r\n }\r\n\r\n handleEnterSearch = () => {\r\n if (!this.dataViewContext.keyword) return\r\n const store = createFilterStore<T>(this.dataViewContext.filterState)\r\n store.addQuickSearch(this.dataViewContext.keyword, { reason: 'quickSearch', area: 'input' })\r\n const temp = store.build()\r\n if (!!temp.details?.isChanged) {\r\n this.refInput?.blur()\r\n this.dataViewContext.onFilterStateChange(temp)\r\n }\r\n }\r\n\r\n handleClear = () => {\r\n this.refInput?.blur()\r\n this.dataViewContext.onClear()\r\n }\r\n }\r\n return FilterBar\r\n}\r\nexport default createFilterBar\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n marginBottom: '4px',\r\n marginLeft: theme.spacing(-1),\r\n marginRight: theme.spacing(-1),\r\n paddingLeft: theme.spacing(0.5),\r\n paddingRight: theme.spacing(0.5),\r\n [`&.${filterBarClasses.sticky}`]: {\r\n position: 'sticky',\r\n top: 'var(--height-header, 0)',\r\n zIndex: theme.zIndex.appBar - 1\r\n },\r\n [`.${filterBarClasses.content}`]: {\r\n display: 'flex',\r\n gap: '8px',\r\n alignItems: 'center',\r\n flexWrap: 'wrap',\r\n padding: theme.spacing(1.5, 0, 0.75),\r\n position: 'relative',\r\n backgroundColor: theme.palette.background.paper,\r\n '&::after': {\r\n content: '\"\"',\r\n position: 'absolute',\r\n top: '100%',\r\n left: 0,\r\n width: '100%',\r\n height: '6px',\r\n pointerEvents: 'none',\r\n background: 'linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent)',\r\n maskImage: 'linear-gradient(to right, transparent, black 20%, black 80%, transparent)',\r\n WebkitMaskImage: 'linear-gradient(to right, transparent, black 20%, black 80%, transparent)',\r\n opacity: 0\r\n }\r\n },\r\n [`&.${filterBarClasses.shadow} .${filterBarClasses.content}`]: {\r\n '&::after': { transition: 'opacity 0.2s ease-in-out', transitionDelay: '0.2s', opacity: 1 }\r\n },\r\n [`.${filterBarClasses.input}`]: { input: { padding: '4px 0 5px' } },\r\n [`.${filterBarClasses.inputWrap}`]: {\r\n flex: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n minHeight: 'var(--filter-bar-height, 40px)',\r\n gap: '8px',\r\n borderRadius: '6px',\r\n transition: 'all linear 0.2s',\r\n padding: '0 8px',\r\n backgroundColor: theme.palette.background.paper,\r\n border: '1px solid var(--color-divider, rgba(145 158 171 / 20%))',\r\n '&:hover': {\r\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : colors.grey[50],\r\n borderColor: theme.palette.mode === 'dark' ? colors.blue[300] : colors.blue[200]\r\n },\r\n '&:focus-within': {\r\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : colors.grey[50],\r\n borderColor: theme.palette.mode === 'dark' ? colors.blue[300] : colors.blue[400],\r\n boxShadow: theme.palette.mode === 'dark' ? `0 0 0 2px ${colors.blue[200]}` : `0 0 0 2px ${colors.blue[100]}`\r\n }\r\n },\r\n [`.${filterBarClasses.label}`]: { flex: 1, display: 'flex', alignItems: 'flex-end' },\r\n [`.${filterBarClasses.spacing}`]: { flex: 1, height: 'var(--filter-bar-height, 40px)' }\r\n}))\r\n"],"names":["filterBarClasses","root","content","input","inputWrap","label","button","spacing","sticky","shadow","createFilterBar","FilterBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","defaultDataViewContext","_this$dataViewContext","enableSticky","dataViewContext","filterBarConfigs","classes","push","scrolled","join","event","keyCode","stopPropagation","preventDefault","handleEnterSearch","_this$refInput","refInput","blur","onPanelClose","_temp$details","keyword","store","createFilterStore","filterState","addQuickSearch","reason","area","_this$refInput2","temp","build","details","isChanged","onFilterStateChange","_this$refInput3","onClear","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","context","_this2$props$slots","_this2$props$slots2","_this2$props$slots3","configs","id","_jsx","ClickAwayListener","onClickAway","onPopperPanelChange","_jsxs","FilterBarStyled","_objectSpread","props","className","getRootClasses","slots","wrapProps","children","left","FilterButton","onClick","e","currentTarget","Box","component","htmlFor","ref","refBeforeInput","FilterInput","placeholder","onChange","onKeywordChange","target","onFocus","onKeyDown","handleKeyDown","endAdornment","FilterInputAdornment","notes","onEnterSearch","handleClear","right","styled","_ref3","theme","marginBottom","marginLeft","marginRight","paddingLeft","paddingRight","position","top","zIndex","appBar","display","gap","alignItems","flexWrap","padding","backgroundColor","palette","background","paper","width","height","pointerEvents","maskImage","WebkitMaskImage","opacity","transition","transitionDelay","flex","minHeight","borderRadius","border","mode","grey","colors","borderColor","blue","boxShadow"],"mappings":"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"}
1	+ {"version":3,"file":"create.filter-bar.js","sources":["../../../src/data-view/create.filter-bar.tsx"],"sourcesContent":["import React, { Component, PropsWithChildren } from 'react'\r\nimport { Box, BoxProps, colors, styled } from '@mui/material'\r\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\r\nimport { IPositionElement } from './types'\r\nimport { createFilterStore } from './filter-store'\r\nimport { FilterButton, FilterInput, FilterInputAdornment } from './ui.units'\r\nimport { defaultDataViewContext, IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport const filterBarClasses = {\r\n root: 'FilterBar-root',\r\n content: 'FilterBar-content',\r\n input: 'FilterBar-input',\r\n inputWrap: 'FilterBar-inputWrap',\r\n label: 'FilterBar-label',\r\n button: 'FilterBar-button',\r\n spacing: 'FilterBar-spacing',\r\n panel: 'FilterBar-panel',\r\n sticky: 'FilterBar-sticky',\r\n shadow: 'FilterBar-shadow',\r\n helpText: 'FilterBar-helpText'\r\n}\r\n\r\nexport interface IFilterBarSlots extends IPositionElement<'left' \| 'right'> {\r\n wrapProps?: BoxProps\r\n}\r\n\r\nexport interface IFilterBarProps extends PropsWithChildren {\r\n id?: string\r\n slots?: IFilterBarSlots\r\n}\r\n\r\nexport function createFilterBar<T>() {\r\n class FilterBar extends Component<IFilterBarProps> {\r\n dataViewContext: IDataViewContext<T> = defaultDataViewContext\r\n\r\n refInput: HTMLInputElement \| null = null\r\n refBeforeInput: HTMLElement \| null = null\r\n render() {\r\n return mapDataViewContext((context) => {\r\n const configs = context.filterBarConfigs\r\n const id = configs.id\r\n this.dataViewContext = context\r\n return (\r\n <ClickAwayListener onClickAway={() => context.onPopperPanelChange(null)}>\r\n <FilterBarStyled id={this.props.id} className={this.getRootClasses()} {...this.props.slots?.wrapProps}>\r\n <div className={filterBarClasses.content}>\r\n {this.props.slots?.left}\r\n <div className={filterBarClasses.inputWrap}>\r\n <FilterButton\r\n className={filterBarClasses.button}\r\n onClick={(e) => {\r\n context.onPopperPanelChange(e.currentTarget, 'filterButton')\r\n }}\r\n />\r\n <Box component='label' htmlFor={id} className={filterBarClasses.label}>\r\n <Box\r\n ref={(ref: HTMLElement) => {\r\n this.refBeforeInput = ref\r\n }}\r\n />\r\n <FilterInput\r\n ref={(ref: HTMLInputElement) => {\r\n this.refInput = ref\r\n }}\r\n id={id}\r\n className={filterBarClasses.input}\r\n placeholder={configs.placeholder}\r\n onChange={(e) => context.onKeywordChange(e.target.value)}\r\n value={context.keyword}\r\n onFocus={() => {\r\n if (!this.refBeforeInput) return\r\n context.onPopperPanelChange(this.refBeforeInput, 'input')\r\n }}\r\n onKeyDown={this.handleKeyDown}\r\n endAdornment={\r\n <FilterInputAdornment\r\n notes={configs.notes}\r\n keyword={context.keyword}\r\n onEnterSearch={this.handleEnterSearch}\r\n onClear={this.handleClear}\r\n />\r\n }\r\n />\r\n </Box>\r\n </div>\r\n {this.props.slots?.right}\r\n </div>\r\n {this.props.children}\r\n </FilterBarStyled>\r\n </ClickAwayListener>\r\n )\r\n })\r\n }\r\n\r\n getRootClasses = () => {\r\n const enableSticky = this.dataViewContext.filterBarConfigs.enableSticky ?? false\r\n const classes: string[] = [filterBarClasses.root]\r\n if (enableSticky) classes.push(filterBarClasses.sticky)\r\n if (this.dataViewContext.scrolled) classes.push(filterBarClasses.shadow)\r\n return classes.join(' ')\r\n }\r\n\r\n handleKeyDown: React.KeyboardEventHandler<HTMLInputElement \| HTMLTextAreaElement> = (event) => {\r\n const keyCode: number = event.keyCode\r\n if (keyCode === 13) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n this.handleEnterSearch()\r\n } else if (keyCode === 27) {\r\n event.stopPropagation()\r\n event.preventDefault()\r\n this.refInput?.blur()\r\n this.dataViewContext.onPanelClose()\r\n }\r\n }\r\n\r\n handleEnterSearch = () => {\r\n if (!this.dataViewContext.keyword) return\r\n const store = createFilterStore<T>(this.dataViewContext.filterState)\r\n store.addQuickSearch(this.dataViewContext.keyword, { reason: 'quickSearch', area: 'input' })\r\n const temp = store.build()\r\n if (!!temp.details?.isChanged) {\r\n this.refInput?.blur()\r\n this.dataViewContext.onFilterStateChange(temp)\r\n }\r\n }\r\n\r\n handleClear = () => {\r\n this.refInput?.blur()\r\n this.dataViewContext.onClear()\r\n }\r\n }\r\n return FilterBar\r\n}\r\nexport default createFilterBar\r\n\r\nconst FilterBarStyled = styled(Box)(({ theme }) => ({\r\n marginBottom: '4px',\r\n marginLeft: theme.spacing(-1),\r\n marginRight: theme.spacing(-1),\r\n paddingLeft: theme.spacing(0.5),\r\n paddingRight: theme.spacing(0.5),\r\n [`&.${filterBarClasses.sticky}`]: {\r\n position: 'sticky',\r\n top: 'var(--height-header, 0)',\r\n zIndex: theme.zIndex.appBar - 1\r\n },\r\n [`.${filterBarClasses.content}`]: {\r\n display: 'flex',\r\n gap: '8px',\r\n alignItems: 'center',\r\n flexWrap: 'wrap',\r\n padding: theme.spacing(1.5, 0, 0.75),\r\n position: 'relative',\r\n backgroundColor: theme.palette.background.paper,\r\n '&::after': {\r\n content: '\"\"',\r\n position: 'absolute',\r\n top: '100%',\r\n left: 0,\r\n width: '100%',\r\n height: '6px',\r\n pointerEvents: 'none',\r\n background: 'linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent)',\r\n maskImage: 'linear-gradient(to right, transparent, black 20%, black 80%, transparent)',\r\n WebkitMaskImage: 'linear-gradient(to right, transparent, black 20%, black 80%, transparent)',\r\n opacity: 0\r\n }\r\n },\r\n [`&.${filterBarClasses.shadow} .${filterBarClasses.content}`]: {\r\n '&::after': { transition: 'opacity 0.2s ease-in-out', transitionDelay: '0.2s', opacity: 1 }\r\n },\r\n [`.${filterBarClasses.input}`]: { input: { padding: '4px 0 5px' } },\r\n [`.${filterBarClasses.inputWrap}`]: {\r\n flex: 1,\r\n display: 'flex',\r\n alignItems: 'center',\r\n minHeight: 'var(--filter-bar-height, 40px)',\r\n gap: '8px',\r\n borderRadius: '6px',\r\n transition: 'all linear 0.2s',\r\n padding: '0 8px',\r\n backgroundColor: theme.palette.background.paper,\r\n border: '1px solid var(--color-divider, rgba(145 158 171 / 20%))',\r\n '&:hover': {\r\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : colors.grey[50],\r\n borderColor: theme.palette.mode === 'dark' ? colors.blue[300] : colors.blue[200]\r\n },\r\n '&:focus-within': {\r\n backgroundColor: theme.palette.mode === 'dark' ? theme.palette.grey[900] : colors.grey[50],\r\n borderColor: theme.palette.mode === 'dark' ? colors.blue[300] : colors.blue[400],\r\n boxShadow: theme.palette.mode === 'dark' ? `0 0 0 2px ${colors.blue[200]}` : `0 0 0 2px ${colors.blue[100]}`\r\n }\r\n },\r\n [`.${filterBarClasses.label}`]: { flex: 1, display: 'flex', alignItems: 'flex-end' },\r\n [`.${filterBarClasses.spacing}`]: { flex: 1, height: 'var(--filter-bar-height, 40px)' }\r\n}))\r\n"],"names":["filterBarClasses","root","content","input","inputWrap","label","button","spacing","sticky","shadow","createFilterBar","FilterBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","defaultDataViewContext","_this$dataViewContext","enableSticky","dataViewContext","filterBarConfigs","classes","push","scrolled","join","event","keyCode","stopPropagation","preventDefault","handleEnterSearch","_this$refInput","refInput","blur","onPanelClose","_temp$details","keyword","store","createFilterStore","filterState","addQuickSearch","reason","area","_this$refInput2","temp","build","details","isChanged","onFilterStateChange","_this$refInput3","onClear","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","context","_this2$props$slots","_this2$props$slots2","_this2$props$slots3","configs","id","_jsx","ClickAwayListener","onClickAway","onPopperPanelChange","_jsxs","FilterBarStyled","_objectSpread","props","className","getRootClasses","slots","wrapProps","children","left","FilterButton","onClick","e","currentTarget","Box","component","htmlFor","ref","refBeforeInput","FilterInput","placeholder","onChange","onKeywordChange","target","onFocus","onKeyDown","handleKeyDown","endAdornment","FilterInputAdornment","notes","onEnterSearch","handleClear","right","styled","_ref3","theme","marginBottom","marginLeft","marginRight","paddingLeft","paddingRight","position","top","zIndex","appBar","display","gap","alignItems","flexWrap","padding","backgroundColor","palette","background","paper","width","height","pointerEvents","maskImage","WebkitMaskImage","opacity","transition","transitionDelay","flex","minHeight","borderRadius","border","mode","grey","colors","borderColor","blue","boxShadow"],"mappings":"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"}

package/dist/src/data-view/create.filter-menu.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as t,inherits as e,createClass as i,classCallCheck as r,callSuper as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{Fragment as o,Component as d}from"react";import{styled as s,MenuList as u,Box as f,MenuItem as v,Button as c}from"@mui/material";import{createFilterStore as g}from"./filter-store.js";import{mapDataViewContext as m}from"./context.js";import{filterMenuClasses as p,getFieldsValidation as S,convertFormDataToJson as h,filterFieldValidated as y}from"./helpers.js";import{MenuWithTypeString as C,MenuWithTypeDateRange as b,MenuWithTypeDate as R,MenuWithTypeSelectMulti as x,MenuWithTypeSelect as F}from"./ui.units.js";function B(){return function(){function s(e){var i;return r(this,s),i=n(this,s,[e]),t(i,"renderForm",(function(t,e){return a("form",{onSubmit:function(r){return i.handleSubmit(r,t,e)},children:[i.renderWithMode(t,e),a(E,{children:[l(c,{size:"small",color:"inherit",onClick:t.onPanelClose,children:"Cancel"}),l(c,{size:"small",color:"primary",type:"submit",sx:{fontWeight:700},children:"Apply"})]})]})})),t(i,"renderWithMode",(function(t,e){var r,n=null===(r=t.filterBarConfigs.fields)||void 0===r?void 0:r[e];switch(null==n?void 0:n.type){case"select":return l(F,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult,onChange:function(){return i.setState({validationResult:void 0})}});case"select-multi":return l(x,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult,onChange:function(){return i.setState({validationResult:void 0})}});case"date":return l(R,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult});case"date-range":return l(b,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult});default:return l(C,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult})}})),t(i,"handleSubmit",(function(t,e,r){null==t||t.preventDefault(),null==t||t.stopPropagation();var n=new FormData(null==t?void 0:t.currentTarget),l=i.formValidate(n,r,e);l.hasError?i.setState({validationResult:l}):i.addFilter(n,e,r)})),t(i,"formValidate",(function(t,e,i){var r=h(t),n=S(i.filterBarConfigs.fields||{})[e];if("select-multi"===(null==n?void 0:n.type)){if(0===t.getAll(e.toString()).length)return{hasError:!0,message:"Please select at least one option"}}else if("date-range"===(null==n?void 0:n.type)){var l,a,o=null===(l=t.get("".concat(e.toString(),"_start")))||void 0===l?void 0:l.toString(),d=null===(a=t.get("".concat(e.toString(),"_end")))||void 0===a?void 0:a.toString();if(!o||!d)return{hasError:!0,message:"Please select both start and end dates"};if(new Date(o)>new Date(d))return{hasError:!0,message:"Start date must be before end date"}}else{var s,u=null===(s=r[e])||void 0===s?void 0:s.toString(),f=y(null!=u?u:"",e,n);if(f.error)return{hasError:!0,message:f.message}}return{hasError:!1}})),t(i,"addFilter",(function(t,e,i){var r,n,l=S(e.filterBarConfigs.fields||{})[i],a=g((null==e?void 0:e.filterState)||{}),o=h(t),d=(null===(r=t.get("filterLogic"))||void 0===r?void 0:r.toString())||"and",s=(null===(n=t.get("dateRangeLogic"))||void 0===n?void 0:n.toString())||"between";if("date-range"===(null==l?void 0:l.type)){var u,f,v=null===(u=t.get("".concat(i.toString(),"_start")))||void 0===u?void 0:u.toString(),c=null===(f=t.get("".concat(i.toString(),"_end")))||void 0===f?void 0:f.toString();if(v&&c){var m={type:"date-range",startDate:v,endDate:c,dateRangeLogic:s,label:"".concat(v," to ").concat(c)};a.addFilterItem(i,m,{reason:"filter",area:"filterButton"})}}else if("date"===(null==l?void 0:l.type)){var p,y=null===(p=o[i])||void 0===p?void 0:p.toString();if(y){var C,b={type:"date",value:y,dateLogic:(null===(C=t.get("dateLogic"))||void 0===C?void 0:C.toString())||"before"};a.removeFilterField(i,{reason:"filter"}),a.addFilterItem(i,b,{reason:"filter",area:"filterButton"})}}else{var R=[];if("select-multi"===(null==l?void 0:l.type)){var x=o[i];Array.isArray(x)?R=x.map((function(t){return t.toString()})):x&&(R=[x.toString()])}else{var F,B=null===(F=o[i])||void 0===F?void 0:F.toString();B&&(R=[B])}R.forEach((function(t){var e,r=void 0;"select"!==(null==l?void 0:l.type)&&"select-multi"!==(null==l?void 0:l.type)||(r=null===(e=l.options.find((function(e){return e.value===t})))||void 0===e?void 0:e.label);var n={type:(null==l?void 0:l.type)||"string",value:t,label:r};"string"!==(null==l?void 0:l.type)&&(n.type=null==l?void 0:l.type),"select-multi"===(null==l?void 0:l.type)&&(n.logic=d),a.addFilterItem(i,n,{reason:"filter",area:"filterButton"})}))}e.onFilterStateChange(a.build())})),i.state={fieldSelected:null},i}return e(s,d),i(s,[{key:"render",value:function(){var t=this;return m((function(e){var i=t.state.fieldSelected;if(i)return t.renderForm(e,i);var r=S(e.filterBarConfigs.fields||{}),n=Object.keys(r);return l(j,{className:p.list,sx:{minWidth:"200px"},children:n.map((function(i,r){var n,a,d=null===(n=e.filterBarConfigs.fields)||void 0===n?void 0:n[i];return d?l(v,{className:p.item,onClick:function(){return t.setState({fieldSelected:i,validationResult:void 0})},children:null!==(a=null==d?void 0:d.label)&&void 0!==a?a:i.toString()},i.toString()+r):l(o,{},i.toString()+r)}))})}))}}])}()}var j=s(u)(t({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"0 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}})),E=s(f)({display:"flex",alignItems:"center",justifyContent:"flex-end",padding:"8px"});export{B as default};
+import{defineProperty as t,inherits as e,createClass as i,classCallCheck as r,callSuper as n}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as l,jsxs as a}from"react/jsx-runtime";import{Fragment as o,Component as d}from"react";import{styled as s,MenuList as u,Box as f,MenuItem as v,Button as c}from"@mui/material";import{createFilterStore as g}from"./filter-store.js";import{mapDataViewContext as m}from"./context.js";import{filterMenuClasses as p,getFieldsValidation as S,convertFormDataToJson as h,filterFieldValidated as y}from"./helpers.js";import{MenuWithTypeString as C,MenuWithTypeDateRange as b,MenuWithTypeDate as R,MenuWithTypeSelectMulti as x,MenuWithTypeSelect as F}from"./ui.units.js";function B(){return function(){function s(e){var i;return r(this,s),i=n(this,s,[e]),t(i,"renderForm",function(t,e){return a("form",{onSubmit:function(r){return i.handleSubmit(r,t,e)},children:[i.renderWithMode(t,e),a(E,{children:[l(c,{size:"small",color:"inherit",onClick:t.onPanelClose,children:"Cancel"}),l(c,{size:"small",color:"primary",type:"submit",sx:{fontWeight:700},children:"Apply"})]})]})}),t(i,"renderWithMode",function(t,e){var r,n=null===(r=t.filterBarConfigs.fields)||void 0===r?void 0:r[e];switch(null==n?void 0:n.type){case"select":return l(F,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult,onChange:function(){return i.setState({validationResult:void 0})}});case"select-multi":return l(x,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult,onChange:function(){return i.setState({validationResult:void 0})}});case"date":return l(R,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult});case"date-range":return l(b,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult});default:return l(C,{name:e.toString(),fieldConfig:n,validationResult:i.state.validationResult})}}),t(i,"handleSubmit",function(t,e,r){null==t||t.preventDefault(),null==t||t.stopPropagation();var n=new FormData(null==t?void 0:t.currentTarget),l=i.formValidate(n,r,e);l.hasError?i.setState({validationResult:l}):i.addFilter(n,e,r)}),t(i,"formValidate",function(t,e,i){var r=h(t),n=S(i.filterBarConfigs.fields||{})[e];if("select-multi"===(null==n?void 0:n.type)){if(0===t.getAll(e.toString()).length)return{hasError:!0,message:"Please select at least one option"}}else if("date-range"===(null==n?void 0:n.type)){var l,a,o=null===(l=t.get("".concat(e.toString(),"_start")))||void 0===l?void 0:l.toString(),d=null===(a=t.get("".concat(e.toString(),"_end")))||void 0===a?void 0:a.toString();if(!o||!d)return{hasError:!0,message:"Please select both start and end dates"};if(new Date(o)>new Date(d))return{hasError:!0,message:"Start date must be before end date"}}else{var s,u=null===(s=r[e])||void 0===s?void 0:s.toString(),f=y(null!=u?u:"",e,n);if(f.error)return{hasError:!0,message:f.message}}return{hasError:!1}}),t(i,"addFilter",function(t,e,i){var r,n,l=S(e.filterBarConfigs.fields||{})[i],a=g((null==e?void 0:e.filterState)||{}),o=h(t),d=(null===(r=t.get("filterLogic"))||void 0===r?void 0:r.toString())||"and",s=(null===(n=t.get("dateRangeLogic"))||void 0===n?void 0:n.toString())||"between";if("date-range"===(null==l?void 0:l.type)){var u,f,v=null===(u=t.get("".concat(i.toString(),"_start")))||void 0===u?void 0:u.toString(),c=null===(f=t.get("".concat(i.toString(),"_end")))||void 0===f?void 0:f.toString();if(v&&c){var m={type:"date-range",startDate:v,endDate:c,dateRangeLogic:s,label:"".concat(v," to ").concat(c)};a.addFilterItem(i,m,{reason:"filter",area:"filterButton"})}}else if("date"===(null==l?void 0:l.type)){var p,y=null===(p=o[i])||void 0===p?void 0:p.toString();if(y){var C,b={type:"date",value:y,dateLogic:(null===(C=t.get("dateLogic"))||void 0===C?void 0:C.toString())||"before"};a.removeFilterField(i,{reason:"filter"}),a.addFilterItem(i,b,{reason:"filter",area:"filterButton"})}}else{var R=[];if("select-multi"===(null==l?void 0:l.type)){var x=o[i];Array.isArray(x)?R=x.map(function(t){return t.toString()}):x&&(R=[x.toString()])}else{var F,B=null===(F=o[i])||void 0===F?void 0:F.toString();B&&(R=[B])}R.forEach(function(t){var e,r=void 0;"select"!==(null==l?void 0:l.type)&&"select-multi"!==(null==l?void 0:l.type)||(r=null===(e=l.options.find(function(e){return e.value===t}))||void 0===e?void 0:e.label);var n={type:(null==l?void 0:l.type)||"string",value:t,label:r};"string"!==(null==l?void 0:l.type)&&(n.type=null==l?void 0:l.type),"select-multi"===(null==l?void 0:l.type)&&(n.logic=d),a.addFilterItem(i,n,{reason:"filter",area:"filterButton"})})}e.onFilterStateChange(a.build())}),i.state={fieldSelected:null},i}return e(s,d),i(s,[{key:"render",value:function(){var t=this;return m(function(e){var i=t.state.fieldSelected;if(i)return t.renderForm(e,i);var r=S(e.filterBarConfigs.fields||{}),n=Object.keys(r);return l(j,{className:p.list,sx:{minWidth:"200px"},children:n.map(function(i,r){var n,a,d=null===(n=e.filterBarConfigs.fields)||void 0===n?void 0:n[i];return d?l(v,{className:p.item,onClick:function(){return t.setState({fieldSelected:i,validationResult:void 0})},children:null!==(a=null==d?void 0:d.label)&&void 0!==a?a:i.toString()},i.toString()+r):l(o,{},i.toString()+r)})})})}}])}()}var j=s(u)(t({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"0 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}})),E=s(f)({display:"flex",alignItems:"center",justifyContent:"flex-end",padding:"8px"});export{B as default};
 //# sourceMappingURL=create.filter-menu.js.map

package/dist/src/data-view/create.filter-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create.filter-menu.js","sources":["../../../src/data-view/create.filter-menu.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Button, MenuItem, MenuList, styled } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { convertFormDataToJson, filterFieldValidated, filterMenuClasses, getFieldsValidation } from './helpers'\r\nimport { IFilterConfigs, IValidationResult, IFilterLogic, IFilterItem, IFilterDateLogic, IFilterDateRangeLogic } from './types'\r\nimport { MenuWithTypeSelect, MenuWithTypeSelectMulti, MenuWithTypeString, MenuWithTypeDate, MenuWithTypeDateRange } from './ui.units'\r\n\r\nexport interface IFilterMenuProps {}\r\n\r\nexport interface IFilterMenuState<T> {\r\n fieldSelected: keyof IFilterConfigs<T> \| null\r\n validationResult?: IValidationResult\r\n}\r\n\r\nfunction createFilterMenu<T>(): ComponentType<IFilterMenuProps> {\r\n class FilterMenu extends Component<IFilterMenuProps, IFilterMenuState<T>> {\r\n constructor(props: IFilterMenuProps) {\r\n super(props)\r\n this.state = {\r\n fieldSelected: null\r\n }\r\n }\r\n\r\n render() {\r\n return mapDataViewContext<T>((context) => {\r\n const { fieldSelected } = this.state\r\n if (!!fieldSelected) return this.renderForm(context, fieldSelected)\r\n const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields \|\| {})\r\n const keys = Object.keys(fieldsValidation) as (keyof T)[]\r\n return (\r\n <MenuListCustom className={filterMenuClasses.list} sx={{ minWidth: '200px' }}>\r\n {keys.map((x, i) => {\r\n const item = context.filterBarConfigs.fields?.[x]\r\n if (!item) return <Fragment key={x.toString() + i} />\r\n return (\r\n <MenuItem\r\n key={x.toString() + i}\r\n className={filterMenuClasses.item}\r\n onClick={() => this.setState({ fieldSelected: x, validationResult: undefined })}\r\n >\r\n {item?.label ?? x.toString()}\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuListCustom>\r\n )\r\n })\r\n }\r\n\r\n renderForm = (context: IDataViewContext<T>, fieldSelected: keyof T) => (\r\n <form onSubmit={(e) => this.handleSubmit(e, context, fieldSelected)}>\r\n {this.renderWithMode(context, fieldSelected)}\r\n <ActionWrapper>\r\n <Button size='small' color='inherit' onClick={context.onPanelClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' color='primary' type='submit' sx={{ fontWeight: 700 }}>\r\n Apply\r\n </Button>\r\n </ActionWrapper>\r\n </form>\r\n )\r\n\r\n renderWithMode = (context: IDataViewContext<T>, fieldSelected: keyof T) => {\r\n const fieldConfig = context.filterBarConfigs.fields?.[fieldSelected]\r\n switch (fieldConfig?.type) {\r\n case 'select':\r\n return (\r\n <MenuWithTypeSelect\r\n name={fieldSelected.toString()}\r\n fieldConfig={fieldConfig}\r\n validationResult={this.state.validationResult}\r\n onChange={() => this.setState({ validationResult: undefined })}\r\n />\r\n )\r\n case 'select-multi':\r\n return (\r\n <MenuWithTypeSelectMulti\r\n name={fieldSelected.toString()}\r\n fieldConfig={fieldConfig}\r\n validationResult={this.state.validationResult}\r\n onChange={() => this.setState({ validationResult: undefined })}\r\n />\r\n )\r\n case 'date':\r\n return <MenuWithTypeDate name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n case 'date-range':\r\n return <MenuWithTypeDateRange name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n case 'string':\r\n default:\r\n return <MenuWithTypeString name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n }\r\n }\r\n\r\n /*\r\n Handle form submission\r\n * @param event - The form submit event\r\n * @param context - The filter bar context\r\n * @param fieldSelected - The selected field to filter\r\n /\r\n handleSubmit = (event: React.FormEvent<HTMLFormElement>, context: IDataViewContext<T>, fieldSelected: keyof IFilterConfigs<T>) => {\r\n event?.preventDefault()\r\n event?.stopPropagation()\r\n\r\n const formData = new FormData(event?.currentTarget as HTMLFormElement)\r\n\r\n // Validate form data\r\n const validation = this.formValidate(formData, fieldSelected, context)\r\n if (validation.hasError) {\r\n this.setState({ validationResult: validation })\r\n return\r\n }\r\n\r\n // If validation passes, add filter\r\n this.addFilter(formData, context, fieldSelected)\r\n }\r\n\r\n /\r\n Validate form data based on field type and configuration\r\n * @param formData - The form data to validate\r\n * @param fieldSelected - The selected field to validate\r\n * @param context - The filter bar context\r\n * @returns Validation result with error status and message\r\n /\r\n formValidate = (formData: FormData, fieldSelected: keyof IFilterConfigs<T>, context: IDataViewContext<T>): IValidationResult => {\r\n const obj = convertFormDataToJson<T>(formData)\r\n const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields \|\| {})\r\n const fieldConfig = fieldsValidation[fieldSelected]\r\n\r\n if (fieldConfig?.type === 'select-multi') {\r\n const values = formData.getAll(fieldSelected.toString())\r\n if (values.length === 0) {\r\n return { hasError: true, message: 'Please select at least one option' }\r\n }\r\n } else if (fieldConfig?.type === 'date-range') {\r\n const startDate = formData.get(`${fieldSelected.toString()}_start`)?.toString()\r\n const endDate = formData.get(`${fieldSelected.toString()}_end`)?.toString()\r\n\r\n if (!startDate \|\| !endDate) {\r\n return { hasError: true, message: 'Please select both start and end dates' }\r\n }\r\n\r\n if (new Date(startDate) > new Date(endDate)) {\r\n return { hasError: true, message: 'Start date must be before end date' }\r\n }\r\n } else {\r\n const value = obj[fieldSelected as keyof T]?.toString()\r\n const validate = filterFieldValidated(value ?? '', fieldSelected, fieldConfig)\r\n if (validate.error) {\r\n return { hasError: true, message: validate.message }\r\n }\r\n }\r\n\r\n return { hasError: false }\r\n }\r\n\r\n /\r\n Add filter based on field type and form data\r\n * @param formData - The form data containing field values\r\n * @param context - The filter bar context\r\n * @param fieldSelected - The selected field to filter\r\n */\r\n addFilter = (formData: FormData, context: IDataViewContext<T>, fieldSelected: keyof IFilterConfigs<T>) => {\r\n const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields \|\| {})\r\n const fieldConfig = fieldsValidation[fieldSelected]\r\n const store = createFilterStore<T>(context?.filterState \|\| {})\r\n const formDataJson = convertFormDataToJson<T>(formData)\r\n\r\n // Get logic values from form data\r\n const filterLogic = (formData.get('filterLogic')?.toString() as IFilterLogic) \|\| 'and'\r\n const dateRangeLogic = (formData.get('dateRangeLogic')?.toString() as IFilterDateRangeLogic) \|\| 'between'\r\n\r\n // Handle date-range separately\r\n if (fieldConfig?.type === 'date-range') {\r\n const startDate = formData.get(`${fieldSelected.toString()}_start`)?.toString()\r\n const endDate = formData.get(`${fieldSelected.toString()}_end`)?.toString()\r\n\r\n if (startDate && endDate) {\r\n const filterItem: IFilterItem = {\r\n type: 'date-range',\r\n startDate,\r\n endDate,\r\n dateRangeLogic: dateRangeLogic,\r\n label: `${startDate} to ${endDate}`\r\n }\r\n\r\n store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n }\r\n } else if (fieldConfig?.type === 'date') {\r\n const value = formDataJson[fieldSelected as keyof T]?.toString()\r\n if (value) {\r\n const dateLogic: IFilterDateLogic = (formData.get('dateLogic')?.toString() as IFilterDateLogic) \|\| 'before'\r\n const filterItem: IFilterItem = { type: 'date', value, dateLogic }\r\n store.removeFilterField(fieldSelected as keyof T, { reason: 'filter' }) // Remove existing filter for this field\r\n store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n }\r\n } else {\r\n // Get all values based on field type\r\n let values: string[] = []\r\n\r\n if (fieldConfig?.type === 'select-multi') {\r\n // For multi-select, obj[fieldSelected] should be an array\r\n const fieldValue = formDataJson[fieldSelected]\r\n if (Array.isArray(fieldValue)) {\r\n values = fieldValue.map((v) => v.toString())\r\n } else if (fieldValue) {\r\n values = [fieldValue.toString()]\r\n }\r\n } else {\r\n // For single select and string\r\n const value = formDataJson[fieldSelected as keyof T]?.toString()\r\n if (value) {\r\n values = [value]\r\n }\r\n }\r\n\r\n // Add all values to store\r\n values.forEach((value) => {\r\n let label: string \| undefined = undefined\r\n\r\n if (fieldConfig?.type === 'select' \|\| fieldConfig?.type === 'select-multi') {\r\n label = fieldConfig.options.find((x) => x.value === value)?.label\r\n }\r\n\r\n // Create filter item with type and logic\r\n const filterItem: IFilterItem = { type: fieldConfig?.type \|\| 'string', value, label }\r\n if (fieldConfig?.type !== 'string') filterItem.type = fieldConfig?.type\r\n if (fieldConfig?.type === 'select-multi') filterItem.logic = filterLogic\r\n store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n })\r\n }\r\n\r\n context.onFilterStateChange(store.build())\r\n }\r\n }\r\n\r\n return FilterMenu\r\n}\r\n\r\nexport default createFilterMenu\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n padding: 0,\r\n [`.${filterMenuClasses.item}`]: {\r\n height: 'var(--filter-item-height, 40px)',\r\n padding: '0 16px',\r\n '&:not(:last-child)': {\r\n borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n }\r\n }\r\n})\r\n\r\nconst ActionWrapper = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'flex-end',\r\n padding: '8px'\r\n})\r\n"],"names":["createFilterMenu","FilterMenu","props","_this","_classCallCheck","_callSuper","_defineProperty","context","fieldSelected","_jsxs","onSubmit","e","handleSubmit","children","renderWithMode","ActionWrapper","_jsx","Button","size","color","onClick","onPanelClose","type","sx","fontWeight","_context$filterBarCon","fieldConfig","filterBarConfigs","fields","MenuWithTypeSelect","name","toString","validationResult","state","onChange","setState","undefined","MenuWithTypeSelectMulti","MenuWithTypeDate","MenuWithTypeDateRange","MenuWithTypeString","event","preventDefault","stopPropagation","formData","FormData","currentTarget","validation","formValidate","hasError","addFilter","obj","convertFormDataToJson","getFieldsValidation","getAll","length","message","_formData$get","_formData$get2","startDate","get","concat","endDate","Date","_obj$fieldSelected","value","validate","filterFieldValidated","error","_formData$get3","_formData$get4","store","createFilterStore","filterState","formDataJson","filterLogic","dateRangeLogic","_formData$get5","_formData$get6","filterItem","label","addFilterItem","reason","area","_formDataJson$fieldSe","_formData$get7","dateLogic","removeFilterField","values","fieldValue","Array","isArray","map","v","_formDataJson$fieldSe2","forEach","_fieldConfig$options$","options","find","x","logic","onFilterStateChange","build","_inherits","Component","_createClass","key","_this2","this","mapDataViewContext","renderForm","fieldsValidation","keys","Object","MenuListCustom","className","filterMenuClasses","list","minWidth","i","_context$filterBarCon2","_item$label","item","MenuItem","Fragment","styled","MenuList","padding","height","borderBottom","Box","display","alignItems","justifyContent"],"mappings":"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"}
1	+ {"version":3,"file":"create.filter-menu.js","sources":["../../../src/data-view/create.filter-menu.tsx"],"sourcesContent":["import React, { Component, ComponentType, Fragment } from 'react'\r\nimport { Box, Button, MenuItem, MenuList, styled } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport { convertFormDataToJson, filterFieldValidated, filterMenuClasses, getFieldsValidation } from './helpers'\r\nimport { IFilterConfigs, IValidationResult, IFilterLogic, IFilterItem, IFilterDateLogic, IFilterDateRangeLogic } from './types'\r\nimport { MenuWithTypeSelect, MenuWithTypeSelectMulti, MenuWithTypeString, MenuWithTypeDate, MenuWithTypeDateRange } from './ui.units'\r\n\r\nexport interface IFilterMenuProps {}\r\n\r\nexport interface IFilterMenuState<T> {\r\n fieldSelected: keyof IFilterConfigs<T> \| null\r\n validationResult?: IValidationResult\r\n}\r\n\r\nfunction createFilterMenu<T>(): ComponentType<IFilterMenuProps> {\r\n class FilterMenu extends Component<IFilterMenuProps, IFilterMenuState<T>> {\r\n constructor(props: IFilterMenuProps) {\r\n super(props)\r\n this.state = {\r\n fieldSelected: null\r\n }\r\n }\r\n\r\n render() {\r\n return mapDataViewContext<T>((context) => {\r\n const { fieldSelected } = this.state\r\n if (!!fieldSelected) return this.renderForm(context, fieldSelected)\r\n const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields \|\| {})\r\n const keys = Object.keys(fieldsValidation) as (keyof T)[]\r\n return (\r\n <MenuListCustom className={filterMenuClasses.list} sx={{ minWidth: '200px' }}>\r\n {keys.map((x, i) => {\r\n const item = context.filterBarConfigs.fields?.[x]\r\n if (!item) return <Fragment key={x.toString() + i} />\r\n return (\r\n <MenuItem\r\n key={x.toString() + i}\r\n className={filterMenuClasses.item}\r\n onClick={() => this.setState({ fieldSelected: x, validationResult: undefined })}\r\n >\r\n {item?.label ?? x.toString()}\r\n </MenuItem>\r\n )\r\n })}\r\n </MenuListCustom>\r\n )\r\n })\r\n }\r\n\r\n renderForm = (context: IDataViewContext<T>, fieldSelected: keyof T) => (\r\n <form onSubmit={(e) => this.handleSubmit(e, context, fieldSelected)}>\r\n {this.renderWithMode(context, fieldSelected)}\r\n <ActionWrapper>\r\n <Button size='small' color='inherit' onClick={context.onPanelClose}>\r\n Cancel\r\n </Button>\r\n <Button size='small' color='primary' type='submit' sx={{ fontWeight: 700 }}>\r\n Apply\r\n </Button>\r\n </ActionWrapper>\r\n </form>\r\n )\r\n\r\n renderWithMode = (context: IDataViewContext<T>, fieldSelected: keyof T) => {\r\n const fieldConfig = context.filterBarConfigs.fields?.[fieldSelected]\r\n switch (fieldConfig?.type) {\r\n case 'select':\r\n return (\r\n <MenuWithTypeSelect\r\n name={fieldSelected.toString()}\r\n fieldConfig={fieldConfig}\r\n validationResult={this.state.validationResult}\r\n onChange={() => this.setState({ validationResult: undefined })}\r\n />\r\n )\r\n case 'select-multi':\r\n return (\r\n <MenuWithTypeSelectMulti\r\n name={fieldSelected.toString()}\r\n fieldConfig={fieldConfig}\r\n validationResult={this.state.validationResult}\r\n onChange={() => this.setState({ validationResult: undefined })}\r\n />\r\n )\r\n case 'date':\r\n return <MenuWithTypeDate name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n case 'date-range':\r\n return <MenuWithTypeDateRange name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n case 'string':\r\n default:\r\n return <MenuWithTypeString name={fieldSelected.toString()} fieldConfig={fieldConfig} validationResult={this.state.validationResult} />\r\n }\r\n }\r\n\r\n /*\r\n Handle form submission\r\n * @param event - The form submit event\r\n * @param context - The filter bar context\r\n * @param fieldSelected - The selected field to filter\r\n /\r\n handleSubmit = (event: React.FormEvent<HTMLFormElement>, context: IDataViewContext<T>, fieldSelected: keyof IFilterConfigs<T>) => {\r\n event?.preventDefault()\r\n event?.stopPropagation()\r\n\r\n const formData = new FormData(event?.currentTarget as HTMLFormElement)\r\n\r\n // Validate form data\r\n const validation = this.formValidate(formData, fieldSelected, context)\r\n if (validation.hasError) {\r\n this.setState({ validationResult: validation })\r\n return\r\n }\r\n\r\n // If validation passes, add filter\r\n this.addFilter(formData, context, fieldSelected)\r\n }\r\n\r\n /\r\n Validate form data based on field type and configuration\r\n * @param formData - The form data to validate\r\n * @param fieldSelected - The selected field to validate\r\n * @param context - The filter bar context\r\n * @returns Validation result with error status and message\r\n /\r\n formValidate = (formData: FormData, fieldSelected: keyof IFilterConfigs<T>, context: IDataViewContext<T>): IValidationResult => {\r\n const obj = convertFormDataToJson<T>(formData)\r\n const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields \|\| {})\r\n const fieldConfig = fieldsValidation[fieldSelected]\r\n\r\n if (fieldConfig?.type === 'select-multi') {\r\n const values = formData.getAll(fieldSelected.toString())\r\n if (values.length === 0) {\r\n return { hasError: true, message: 'Please select at least one option' }\r\n }\r\n } else if (fieldConfig?.type === 'date-range') {\r\n const startDate = formData.get(`${fieldSelected.toString()}_start`)?.toString()\r\n const endDate = formData.get(`${fieldSelected.toString()}_end`)?.toString()\r\n\r\n if (!startDate \|\| !endDate) {\r\n return { hasError: true, message: 'Please select both start and end dates' }\r\n }\r\n\r\n if (new Date(startDate) > new Date(endDate)) {\r\n return { hasError: true, message: 'Start date must be before end date' }\r\n }\r\n } else {\r\n const value = obj[fieldSelected as keyof T]?.toString()\r\n const validate = filterFieldValidated(value ?? '', fieldSelected, fieldConfig)\r\n if (validate.error) {\r\n return { hasError: true, message: validate.message }\r\n }\r\n }\r\n\r\n return { hasError: false }\r\n }\r\n\r\n /\r\n Add filter based on field type and form data\r\n * @param formData - The form data containing field values\r\n * @param context - The filter bar context\r\n * @param fieldSelected - The selected field to filter\r\n */\r\n addFilter = (formData: FormData, context: IDataViewContext<T>, fieldSelected: keyof IFilterConfigs<T>) => {\r\n const fieldsValidation = getFieldsValidation<T>(context.filterBarConfigs.fields \|\| {})\r\n const fieldConfig = fieldsValidation[fieldSelected]\r\n const store = createFilterStore<T>(context?.filterState \|\| {})\r\n const formDataJson = convertFormDataToJson<T>(formData)\r\n\r\n // Get logic values from form data\r\n const filterLogic = (formData.get('filterLogic')?.toString() as IFilterLogic) \|\| 'and'\r\n const dateRangeLogic = (formData.get('dateRangeLogic')?.toString() as IFilterDateRangeLogic) \|\| 'between'\r\n\r\n // Handle date-range separately\r\n if (fieldConfig?.type === 'date-range') {\r\n const startDate = formData.get(`${fieldSelected.toString()}_start`)?.toString()\r\n const endDate = formData.get(`${fieldSelected.toString()}_end`)?.toString()\r\n\r\n if (startDate && endDate) {\r\n const filterItem: IFilterItem = {\r\n type: 'date-range',\r\n startDate,\r\n endDate,\r\n dateRangeLogic: dateRangeLogic,\r\n label: `${startDate} to ${endDate}`\r\n }\r\n\r\n store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n }\r\n } else if (fieldConfig?.type === 'date') {\r\n const value = formDataJson[fieldSelected as keyof T]?.toString()\r\n if (value) {\r\n const dateLogic: IFilterDateLogic = (formData.get('dateLogic')?.toString() as IFilterDateLogic) \|\| 'before'\r\n const filterItem: IFilterItem = { type: 'date', value, dateLogic }\r\n store.removeFilterField(fieldSelected as keyof T, { reason: 'filter' }) // Remove existing filter for this field\r\n store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n }\r\n } else {\r\n // Get all values based on field type\r\n let values: string[] = []\r\n\r\n if (fieldConfig?.type === 'select-multi') {\r\n // For multi-select, obj[fieldSelected] should be an array\r\n const fieldValue = formDataJson[fieldSelected]\r\n if (Array.isArray(fieldValue)) {\r\n values = fieldValue.map((v) => v.toString())\r\n } else if (fieldValue) {\r\n values = [fieldValue.toString()]\r\n }\r\n } else {\r\n // For single select and string\r\n const value = formDataJson[fieldSelected as keyof T]?.toString()\r\n if (value) {\r\n values = [value]\r\n }\r\n }\r\n\r\n // Add all values to store\r\n values.forEach((value) => {\r\n let label: string \| undefined = undefined\r\n\r\n if (fieldConfig?.type === 'select' \|\| fieldConfig?.type === 'select-multi') {\r\n label = fieldConfig.options.find((x) => x.value === value)?.label\r\n }\r\n\r\n // Create filter item with type and logic\r\n const filterItem: IFilterItem = { type: fieldConfig?.type \|\| 'string', value, label }\r\n if (fieldConfig?.type !== 'string') filterItem.type = fieldConfig?.type\r\n if (fieldConfig?.type === 'select-multi') filterItem.logic = filterLogic\r\n store.addFilterItem(fieldSelected as keyof T, filterItem, { reason: 'filter', area: 'filterButton' })\r\n })\r\n }\r\n\r\n context.onFilterStateChange(store.build())\r\n }\r\n }\r\n\r\n return FilterMenu\r\n}\r\n\r\nexport default createFilterMenu\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n padding: 0,\r\n [`.${filterMenuClasses.item}`]: {\r\n height: 'var(--filter-item-height, 40px)',\r\n padding: '0 16px',\r\n '&:not(:last-child)': {\r\n borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n }\r\n }\r\n})\r\n\r\nconst ActionWrapper = styled(Box)({\r\n display: 'flex',\r\n alignItems: 'center',\r\n justifyContent: 'flex-end',\r\n padding: '8px'\r\n})\r\n"],"names":["createFilterMenu","FilterMenu","props","_this","_classCallCheck","_callSuper","_defineProperty","context","fieldSelected","_jsxs","onSubmit","e","handleSubmit","children","renderWithMode","ActionWrapper","_jsx","Button","size","color","onClick","onPanelClose","type","sx","fontWeight","_context$filterBarCon","fieldConfig","filterBarConfigs","fields","MenuWithTypeSelect","name","toString","validationResult","state","onChange","setState","undefined","MenuWithTypeSelectMulti","MenuWithTypeDate","MenuWithTypeDateRange","MenuWithTypeString","event","preventDefault","stopPropagation","formData","FormData","currentTarget","validation","formValidate","hasError","addFilter","obj","convertFormDataToJson","getFieldsValidation","getAll","length","message","_formData$get","_formData$get2","startDate","get","concat","endDate","Date","_obj$fieldSelected","value","validate","filterFieldValidated","error","_formData$get3","_formData$get4","store","createFilterStore","filterState","formDataJson","filterLogic","dateRangeLogic","_formData$get5","_formData$get6","filterItem","label","addFilterItem","reason","area","_formDataJson$fieldSe","_formData$get7","dateLogic","removeFilterField","values","fieldValue","Array","isArray","map","v","_formDataJson$fieldSe2","forEach","_fieldConfig$options$","options","find","x","logic","onFilterStateChange","build","_inherits","Component","_createClass","key","_this2","this","mapDataViewContext","renderForm","fieldsValidation","keys","Object","MenuListCustom","className","filterMenuClasses","list","minWidth","i","_context$filterBarCon2","_item$label","item","MenuItem","Fragment","styled","MenuList","padding","height","borderBottom","Box","display","alignItems","justifyContent"],"mappings":"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"}

package/dist/src/data-view/create.pagination-bar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{objectSpread2 as e,defineProperty as n,inherits as t,createClass as a,classCallCheck as i,callSuper as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{Component as l}from"react";import{styled as s,TablePagination as p,Pagination as u,useTheme as g,useMediaQuery as c}from"@mui/material";import{createFilterStore as h}from"./filter-store.js";function d(){var e=function(){function e(){var t;i(this,e);for(var a=arguments.length,o=new Array(a),l=0;l<a;l++)o[l]=arguments[l];return t=r(this,e,[].concat(o)),n(t,"handleChangePage",(function(e,n){var a,i,r,o=h(null!==(a=t.props.filter)&&void 0!==a?a:{},t.defaultFilter),l={page:n,pageSize:t.pagination.pageSize};o.changePagination(l,{reason:"pagination"}),null===(i=(r=t.props).onChange)||void 0===i||i.call(r,o.build())})),n(t,"handleChangeRowsPerPage",(function(e){var n,a,i,r=parseInt(e.target.value,10),o=h(null!==(n=t.props.filter)&&void 0!==n?n:{},t.defaultFilter);o.changePagination({page:0,pageSize:r},{reason:"pagination"}),null===(a=(i=t.props).onChange)||void 0===a||a.call(i,o.build())})),t}return t(e,l),a(e,[{key:"defaultFilter",get:function(){return this.props.defaultFilter||{}}},{key:"defaultPagination",get:function(){var e;return(null===(e=this.defaultFilter)||void 0===e?void 0:e.pagination)||{page:0,pageSize:10}}},{key:"pagination",get:function(){var e;return(null===(e=this.props.filter)||void 0===e?void 0:e.pagination)||this.defaultPagination}},{key:"rowsPerPageOptions",get:function(){return this.props.rowsPerPageOptions||[10,25,50,100]}},{key:"render",value:function(){var e=this,n=this.pagination,t=n.page,a=n.pageSize,i=this.props.isMobile;return!this.props.count||1===Math.ceil(this.props.count/a)&&i?null:i?o(P,{siblingCount:0,page:t+1,count:Math.ceil(this.props.count/a),onChange:function(n,t){return e.handleChangePage(null,t-1)},size:"small",color:"primary",sx:{my:1}}):o(m,{size:"small",page:t,count:this.props.count||0,onPageChange:this.handleChangePage,rowsPerPage:a,onRowsPerPageChange:this.handleChangeRowsPerPage,rowsPerPageOptions:this.rowsPerPageOptions,slotProps:{actions:{nextButton:{size:"small"},previousButton:{size:"small"}},select:{MenuProps:{disableScrollLock:this.props.disableScrollLock}}}})}}])}();return e}function f(n){var t=d();return function(n){var a=g(),i=c(a.breakpoints.down("md"));return o(t,e(e({},n),{},{isMobile:i}))}}var m=s((function(n){return o(p,e({component:"div"},n))}))((function(e){var t=e.theme;return{marginLeft:"auto","@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}},".MuiTablePagination-selectLabel":n({},t.breakpoints.down("sm"),{display:"none"})}})),P=s((function(n){return o(u,e({},n))}))({marginLeft:"auto",".Mui-selected":{backgroundColor:"color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important"},"@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}}});export{f as createPaginationBar,d as createTablePagination,f as default};
+import{objectSpread2 as e,defineProperty as n,inherits as t,createClass as a,classCallCheck as i,callSuper as r}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as o}from"react/jsx-runtime";import{Component as l}from"react";import{styled as s,TablePagination as p,Pagination as u,useTheme as g,useMediaQuery as c}from"@mui/material";import{createFilterStore as h}from"./filter-store.js";function d(){var e=function(){function e(){var t;i(this,e);for(var a=arguments.length,o=new Array(a),l=0;l<a;l++)o[l]=arguments[l];return t=r(this,e,[].concat(o)),n(t,"handleChangePage",function(e,n){var a,i,r,o=h(null!==(a=t.props.filter)&&void 0!==a?a:{},t.defaultFilter),l={page:n,pageSize:t.pagination.pageSize};o.changePagination(l,{reason:"pagination"}),null===(i=(r=t.props).onChange)||void 0===i||i.call(r,o.build())}),n(t,"handleChangeRowsPerPage",function(e){var n,a,i,r=parseInt(e.target.value,10),o=h(null!==(n=t.props.filter)&&void 0!==n?n:{},t.defaultFilter);o.changePagination({page:0,pageSize:r},{reason:"pagination"}),null===(a=(i=t.props).onChange)||void 0===a||a.call(i,o.build())}),t}return t(e,l),a(e,[{key:"defaultFilter",get:function(){return this.props.defaultFilter||{}}},{key:"defaultPagination",get:function(){var e;return(null===(e=this.defaultFilter)||void 0===e?void 0:e.pagination)||{page:0,pageSize:10}}},{key:"pagination",get:function(){var e;return(null===(e=this.props.filter)||void 0===e?void 0:e.pagination)||this.defaultPagination}},{key:"rowsPerPageOptions",get:function(){return this.props.rowsPerPageOptions||[10,25,50,100]}},{key:"render",value:function(){var e=this,n=this.pagination,t=n.page,a=n.pageSize,i=this.props.isMobile;return!this.props.count||1===Math.ceil(this.props.count/a)&&i?null:i?o(P,{siblingCount:0,page:t+1,count:Math.ceil(this.props.count/a),onChange:function(n,t){return e.handleChangePage(null,t-1)},size:"small",color:"primary",sx:{my:1}}):o(m,{size:"small",page:t,count:this.props.count||0,onPageChange:this.handleChangePage,rowsPerPage:a,onRowsPerPageChange:this.handleChangeRowsPerPage,rowsPerPageOptions:this.rowsPerPageOptions,slotProps:{actions:{nextButton:{size:"small"},previousButton:{size:"small"}},select:{MenuProps:{disableScrollLock:this.props.disableScrollLock}}}})}}])}();return e}function f(n){var t=d();return function(n){var a=g(),i=c(a.breakpoints.down("md"));return o(t,e(e({},n),{},{isMobile:i}))}}var m=s(function(n){return o(p,e({component:"div"},n))})(function(e){var t=e.theme;return{marginLeft:"auto","@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}},".MuiTablePagination-selectLabel":n({},t.breakpoints.down("sm"),{display:"none"})}}),P=s(function(n){return o(u,e({},n))})({marginLeft:"auto",".Mui-selected":{backgroundColor:"color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important"},"@media (min-width: 600px)":{".MuiToolbar-root":{minHeight:"48px"}}});export{f as createPaginationBar,d as createTablePagination,f as default};
 //# sourceMappingURL=create.pagination-bar.js.map

package/dist/src/data-view/create.pagination-bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create.pagination-bar.js","sources":["../../../src/data-view/create.pagination-bar.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Pagination, PaginationProps, styled, TablePagination, TablePaginationProps, useMediaQuery, useTheme } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IFilterState, IPagination } from './types'\r\n\r\nexport interface IPaginationBarConfigs {\r\n rowsPerPageOptions?: number[]\r\n disableScrollLock?: boolean\r\n enablePaginationTop?: boolean\r\n}\r\n\r\nexport interface IPaginationBarProps<T> extends IPaginationBarConfigs {\r\n count?: number\r\n filter?: IFilterState<T>\r\n defaultFilter?: IFilterState<T>\r\n onChange?: (value: IFilterState<T>) => void\r\n isMobile?: boolean\r\n}\r\n\r\nexport type IPaginationBarParams<T> = Pick<IPaginationBarProps<T>, 'defaultFilter' \| 'rowsPerPageOptions'>\r\n\r\nexport function createTablePagination<T>(): ComponentType<IPaginationBarProps<T>> {\r\n class PaginationBar extends Component<IPaginationBarProps<T>> {\r\n get defaultFilter(): IFilterState<T> {\r\n return this.props.defaultFilter \|\| {}\r\n }\r\n\r\n get defaultPagination(): Required<IPagination> {\r\n return (this.defaultFilter?.pagination as any) \|\| { page: 0, pageSize: 10 }\r\n }\r\n\r\n get pagination(): Required<IPagination> {\r\n return (this.props.filter?.pagination as any) \|\| this.defaultPagination\r\n }\r\n\r\n get rowsPerPageOptions(): number[] {\r\n return this.props.rowsPerPageOptions \|\| [10, 25, 50, 100]\r\n }\r\n\r\n handleChangePage = (_: React.MouseEvent<HTMLButtonElement> \| null, newPage: number) => {\r\n const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n const { pageSize } = this.pagination\r\n const obj: IPagination = { page: newPage, pageSize }\r\n store.changePagination(obj, { reason: 'pagination' })\r\n this.props.onChange?.(store.build())\r\n }\r\n\r\n handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>) => {\r\n const newPageSize = parseInt(event.target.value, 10)\r\n const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n store.changePagination({ page: 0, pageSize: newPageSize }, { reason: 'pagination' })\r\n this.props.onChange?.(store.build())\r\n }\r\n\r\n render() {\r\n const { page, pageSize } = this.pagination\r\n const { isMobile } = this.props\r\n if (!this.props.count \|\| (Math.ceil(this.props.count / pageSize) === 1 && isMobile)) {\r\n return null // No pagination if there are no items\r\n }\r\n if (isMobile) {\r\n return (\r\n <PaginationCustom\r\n siblingCount={0}\r\n page={page + 1}\r\n count={Math.ceil(this.props.count / pageSize)}\r\n onChange={(_, value) => this.handleChangePage(null, value - 1)}\r\n size='small'\r\n color='primary'\r\n sx={{ my: 1 }}\r\n />\r\n )\r\n }\r\n return (\r\n <TablePaginationCustom\r\n size='small'\r\n page={page}\r\n count={this.props.count \|\| 0}\r\n onPageChange={this.handleChangePage}\r\n rowsPerPage={pageSize}\r\n onRowsPerPageChange={this.handleChangeRowsPerPage}\r\n rowsPerPageOptions={this.rowsPerPageOptions}\r\n slotProps={{\r\n actions: { nextButton: { size: 'small' }, previousButton: { size: 'small' } },\r\n select: { MenuProps: { disableScrollLock: this.props.disableScrollLock } }\r\n }}\r\n />\r\n )\r\n }\r\n }\r\n return PaginationBar\r\n}\r\n\r\nexport function createPaginationBar<T>(params?: IPaginationBarParams<T>) {\r\n const PaginationBar = createTablePagination<T>()\r\n return function ResponsivePaginationBar(props: IPaginationBarProps<T>) {\r\n const theme = useTheme()\r\n const isMobile = useMediaQuery(theme.breakpoints.down('md'))\r\n return <PaginationBar {...props} isMobile={isMobile} />\r\n }\r\n}\r\n\r\nexport default createPaginationBar\r\n\r\nconst TablePaginationCustom = styled((p: TablePaginationProps) => <TablePagination component='div' {...p} />)(({ theme }) => ({\r\n marginLeft: 'auto',\r\n '@media (min-width: 600px)': {\r\n '.MuiToolbar-root': {\r\n minHeight: '48px'\r\n }\r\n },\r\n '.MuiTablePagination-selectLabel': {\r\n [theme.breakpoints.down('sm')]: {\r\n display: 'none'\r\n }\r\n }\r\n}))\r\n\r\nconst PaginationCustom = styled((p: PaginationProps) => <Pagination {...p} />)({\r\n marginLeft: 'auto',\r\n '.Mui-selected': {\r\n backgroundColor: 'color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important'\r\n },\r\n '@media (min-width: 600px)': {\r\n '.MuiToolbar-root': {\r\n minHeight: '48px'\r\n }\r\n }\r\n})\r\n"],"names":["createTablePagination","PaginationBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_","newPage","_this$props$filter","_this$props$onChange","_this$props","store","createFilterStore","props","filter","defaultFilter","obj","page","pageSize","pagination","changePagination","reason","onChange","call","build","event","_this$props$filter2","_this$props$onChange2","_this$props2","newPageSize","parseInt","target","value","_inherits","Component","_createClass","key","get","_this$defaultFilter","_this$props$filter3","defaultPagination","rowsPerPageOptions","_this2","_this$pagination","isMobile","count","Math","ceil","_jsx","PaginationCustom","siblingCount","handleChangePage","size","color","sx","my","TablePaginationCustom","onPageChange","rowsPerPage","onRowsPerPageChange","handleChangeRowsPerPage","slotProps","actions","nextButton","previousButton","select","MenuProps","disableScrollLock","createPaginationBar","params","theme","useTheme","useMediaQuery","breakpoints","down","_objectSpread","styled","p","TablePagination","component","_ref","marginLeft","minHeight","display","Pagination","backgroundColor"],"mappings":"wZAqBgBA,IAAqB,IAC7BC,aAAc,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA8BjB,OA9BiBP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,~~oBAiBC~~,SAACY,EAA+CC,GAAmB,IAAAC,EAAAC,EAAAC,EAC9EC,EAAQC,UAAiBJ,EAAId,EAAKmB,MAAMC,cAAM,IAAAN,EAAAA,EAAI,CAAA,EAAId,EAAKqB,eAE3DC,EAAmB,CAAEC,KAAMV,EAASW,SADrBxB,EAAKyB,WAAlBD,UAERP,EAAMS,iBAAiBJ,EAAK,CAAEK,OAAQ,eACnBZ,QAAnBA,GAAAC,EAAAhB,EAAKmB,OAAMS,oBAAQb,GAAnBA,EAAAc,KAAAb,EAAsBC,EAAMa,~~YAC7BnB~~,EAAAX,EAEyB,~~2BAAA~~,SAAC+B,GAAoE,IAAAC,EAAAC,EAAAC,EACvFC,EAAcC,SAASL,EAAMM,OAAOC,MAAO,IAC3CrB,EAAQC,UAAiBc,EAAIhC,EAAKmB,MAAMC,cAAM,IAAAY,EAAAA,EAAI,CAAA,EAAIhC,EAAKqB,eACjEJ,EAAMS,iBAAiB,CAAEH,KAAM,EAAGC,SAAUW,GAAe,CAAER,OAAQ,eAClDM,QAAnBA,GAAAC,EAAAlC,EAAKmB,OAAMS,oBAAQK,GAAnBA,EAAAJ,KAAAK,EAAsBjB,EAAMa,~~YAC7B9B~~,CAAA,CAAA,OAAAuC,EAAAxC,EA9ByByC,GA8BzBC,EAAA1C,EAAA,CAAA,CAAA2C,IAAA,gBAAAC,IA7BD,WACE,OAAOlC,KAAKU,MAAME,eAAiB,CAAE,CACvC,GAAC,CAAAqB,IAAA,oBAAAC,IAED,WAAqB,IAAAC,EACnB,OAA0BA,QAAlBA,EAAAnC,KAAKY,qBAALuB,IAAkBA,OAAlBA,EAAAA,EAAoBnB,aAAsB,CAAEF,KAAM,EAAGC,SAAU,GACzE,GAAC,CAAAkB,IAAA,aAAAC,IAED,WAAc,IAAAE,EACZ,OAAyB,QAAjBA,EAAApC,KAAKU,MAAMC,cAAM,IAAAyB,OAAA,EAAjBA,EAAmBpB,aAAsBhB,KAAKqC,iBACxD,GAAC,CAAAJ,IAAA,qBAAAC,IAED,WACE,OAAOlC,KAAKU,MAAM4B,oBAAsB,CAAC,GAAI,GAAI,GAAI,IACvD,GAAC,CAAAL,IAAA,SAAAJ,MAiBD,WAAM,IAAAU,EAAAvC,KACJwC,EAA2BxC,KAAKgB,WAAxBF,EAAI0B,EAAJ1B,KAAMC,EAAQyB,EAARzB,SACN0B,EAAazC,KAAKU,MAAlB+B,SACR,OAAKzC,KAAKU,MAAMgC,OAAqD,IAA3CC,KAAKC,KAAK5C,KAAKU,MAAMgC,MAAQ3B,IAAmB0B,EACjE,KAELA,EAEAI,EAACC,EAAgB,CACfC,aAAc,EACdjC,KAAMA,EAAO,EACb4B,MAAOC,KAAKC,KAAK5C,KAAKU,MAAMgC,MAAQ3B,GACpCI,SAAU,SAAChB,EAAG0B,GAAK,OAAKU,EAAKS,iBAAiB,KAAMnB,EAAQ,EAAE,EAC9DoB,KAAK,QACLC,MAAM,UACNC,GAAI,CAAEC,GAAI,KAKdP,EAACQ,EAAqB,CACpBJ,KAAK,QACLnC,KAAMA,EACN4B,MAAO1C,KAAKU,MAAMgC,OAAS,EAC3BY,aAActD,KAAKgD,iBACnBO,YAAaxC,EACbyC,oBAAqBxD,KAAKyD,wBAC1BnB,mBAAoBtC,KAAKsC,mBACzBoB,UAAW,CACTC,QAAS,CAAEC,WAAY,CAAEX,KAAM,SAAWY,eAAgB,CAAEZ,KAAM,UAClEa,OAAQ,CAAEC,UAAW,CAAEC,kBAAmBhE,KAAKU,MAAMsD,sBAI7D,IAAC,IAEH,OAAO1E,CACT,CAEM,SAAU2E,EAAuBC,GACrC,IAAM5E,EAAgBD,IACtB,OAAO,SAAiCqB,GACtC,IAAMyD,EAAQC,IACR3B,EAAW4B,EAAcF,EAAMG,YAAYC,KAAK,OACtD,OAAO1B,EAACvD,EAAakF,EAAAA,KAAK9D,GAAK,GAAA,CAAE+B,SAAUA,IAC5C,CACH,CAIA,IAAMY,EAAwBoB,~~GAAO~~,SAACC,GAAuB,OAAK7B,EAAC8B,EAAeH,EAAA,CAACI,UAAU,OAAUF,GAAK,~~GAA9ED~~,~~EAAgF~~,SAAAI,GAAA,IAAGV,EAAKU,EAALV,MAAK,MAAQ,CAC5HW,WAAY,OACZ,4BAA6B,CAC3B,mBAAoB,CAClBC,UAAW,SAGf,kCAAiC7E,EAAA,GAC9BiE,EAAMG,YAAYC,KAAK,MAAQ,CAC9BS,QAAS,SAGd,~~IAEKlC~~,EAAmB2B,~~GAAO~~,SAACC,GAAkB,OAAK7B,EAACoC,EAAUT,EAAKE,CAAAA,EAAAA,GAAK,~~GAApDD~~,CAAsD,CAC7EK,WAAY,OACZ,gBAAiB,CACfI,gBAAiB,qEAEnB,4BAA6B,CAC3B,mBAAoB,CAClBH,UAAW"}
1	+ {"version":3,"file":"create.pagination-bar.js","sources":["../../../src/data-view/create.pagination-bar.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { Pagination, PaginationProps, styled, TablePagination, TablePaginationProps, useMediaQuery, useTheme } from '@mui/material'\r\nimport { createFilterStore } from './filter-store'\r\nimport { IFilterState, IPagination } from './types'\r\n\r\nexport interface IPaginationBarConfigs {\r\n rowsPerPageOptions?: number[]\r\n disableScrollLock?: boolean\r\n enablePaginationTop?: boolean\r\n}\r\n\r\nexport interface IPaginationBarProps<T> extends IPaginationBarConfigs {\r\n count?: number\r\n filter?: IFilterState<T>\r\n defaultFilter?: IFilterState<T>\r\n onChange?: (value: IFilterState<T>) => void\r\n isMobile?: boolean\r\n}\r\n\r\nexport type IPaginationBarParams<T> = Pick<IPaginationBarProps<T>, 'defaultFilter' \| 'rowsPerPageOptions'>\r\n\r\nexport function createTablePagination<T>(): ComponentType<IPaginationBarProps<T>> {\r\n class PaginationBar extends Component<IPaginationBarProps<T>> {\r\n get defaultFilter(): IFilterState<T> {\r\n return this.props.defaultFilter \|\| {}\r\n }\r\n\r\n get defaultPagination(): Required<IPagination> {\r\n return (this.defaultFilter?.pagination as any) \|\| { page: 0, pageSize: 10 }\r\n }\r\n\r\n get pagination(): Required<IPagination> {\r\n return (this.props.filter?.pagination as any) \|\| this.defaultPagination\r\n }\r\n\r\n get rowsPerPageOptions(): number[] {\r\n return this.props.rowsPerPageOptions \|\| [10, 25, 50, 100]\r\n }\r\n\r\n handleChangePage = (_: React.MouseEvent<HTMLButtonElement> \| null, newPage: number) => {\r\n const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n const { pageSize } = this.pagination\r\n const obj: IPagination = { page: newPage, pageSize }\r\n store.changePagination(obj, { reason: 'pagination' })\r\n this.props.onChange?.(store.build())\r\n }\r\n\r\n handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement \| HTMLTextAreaElement>) => {\r\n const newPageSize = parseInt(event.target.value, 10)\r\n const store = createFilterStore<T>(this.props.filter ?? {}, this.defaultFilter)\r\n store.changePagination({ page: 0, pageSize: newPageSize }, { reason: 'pagination' })\r\n this.props.onChange?.(store.build())\r\n }\r\n\r\n render() {\r\n const { page, pageSize } = this.pagination\r\n const { isMobile } = this.props\r\n if (!this.props.count \|\| (Math.ceil(this.props.count / pageSize) === 1 && isMobile)) {\r\n return null // No pagination if there are no items\r\n }\r\n if (isMobile) {\r\n return (\r\n <PaginationCustom\r\n siblingCount={0}\r\n page={page + 1}\r\n count={Math.ceil(this.props.count / pageSize)}\r\n onChange={(_, value) => this.handleChangePage(null, value - 1)}\r\n size='small'\r\n color='primary'\r\n sx={{ my: 1 }}\r\n />\r\n )\r\n }\r\n return (\r\n <TablePaginationCustom\r\n size='small'\r\n page={page}\r\n count={this.props.count \|\| 0}\r\n onPageChange={this.handleChangePage}\r\n rowsPerPage={pageSize}\r\n onRowsPerPageChange={this.handleChangeRowsPerPage}\r\n rowsPerPageOptions={this.rowsPerPageOptions}\r\n slotProps={{\r\n actions: { nextButton: { size: 'small' }, previousButton: { size: 'small' } },\r\n select: { MenuProps: { disableScrollLock: this.props.disableScrollLock } }\r\n }}\r\n />\r\n )\r\n }\r\n }\r\n return PaginationBar\r\n}\r\n\r\nexport function createPaginationBar<T>(params?: IPaginationBarParams<T>) {\r\n const PaginationBar = createTablePagination<T>()\r\n return function ResponsivePaginationBar(props: IPaginationBarProps<T>) {\r\n const theme = useTheme()\r\n const isMobile = useMediaQuery(theme.breakpoints.down('md'))\r\n return <PaginationBar {...props} isMobile={isMobile} />\r\n }\r\n}\r\n\r\nexport default createPaginationBar\r\n\r\nconst TablePaginationCustom = styled((p: TablePaginationProps) => <TablePagination component='div' {...p} />)(({ theme }) => ({\r\n marginLeft: 'auto',\r\n '@media (min-width: 600px)': {\r\n '.MuiToolbar-root': {\r\n minHeight: '48px'\r\n }\r\n },\r\n '.MuiTablePagination-selectLabel': {\r\n [theme.breakpoints.down('sm')]: {\r\n display: 'none'\r\n }\r\n }\r\n}))\r\n\r\nconst PaginationCustom = styled((p: PaginationProps) => <Pagination {...p} />)({\r\n marginLeft: 'auto',\r\n '.Mui-selected': {\r\n backgroundColor: 'color-mix(in srgb, rgb(232, 140, 63) 60%, transparent) !important'\r\n },\r\n '@media (min-width: 600px)': {\r\n '.MuiToolbar-root': {\r\n minHeight: '48px'\r\n }\r\n }\r\n})\r\n"],"names":["createTablePagination","PaginationBar","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","_","newPage","_this$props$filter","_this$props$onChange","_this$props","store","createFilterStore","props","filter","defaultFilter","obj","page","pageSize","pagination","changePagination","reason","onChange","call","build","event","_this$props$filter2","_this$props$onChange2","_this$props2","newPageSize","parseInt","target","value","_inherits","Component","_createClass","key","get","_this$defaultFilter","_this$props$filter3","defaultPagination","rowsPerPageOptions","_this2","_this$pagination","isMobile","count","Math","ceil","_jsx","PaginationCustom","siblingCount","handleChangePage","size","color","sx","my","TablePaginationCustom","onPageChange","rowsPerPage","onRowsPerPageChange","handleChangeRowsPerPage","slotProps","actions","nextButton","previousButton","select","MenuProps","disableScrollLock","createPaginationBar","params","theme","useTheme","useMediaQuery","breakpoints","down","_objectSpread","styled","p","TablePagination","component","_ref","marginLeft","minHeight","display","Pagination","backgroundColor"],"mappings":"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"}

package/dist/src/data-view/create.popper-panel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{inherits as r,createClass as t,classCallCheck as e,callSuper as n,defineProperty as a,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Component as u}from"react";import{styled as s,Box as c,Popper as p,Fade as l}from"@mui/material";import{PanelNotFound as m}from"./ui.units.js";import{mapDataViewContext as f}from"./context.js";import d from"./create.sort-menu.js";import h from"./create.filter-menu.js";import x from"./create.search-match.js";function b(){var s=x(),c=h(),b=d(),j=function(){function d(){var r;e(this,d);for(var t=arguments.length,o=new Array(t),u=0;u<t;u++)o[u]=arguments[u];return r=n(this,d,[].concat(o)),a(r,"renderPanelContent",(function(r){switch(r.area){case"input":return i(s,{});case"filterButton":return i(c,{});case"sortButton":return i(b,{});default:return i(m,{area:r.area})}})),r}return r(d,u),t(d,[{key:"render",value:function(){var r=this;return f((function(t){var e=t.keyword,n=t.anchorEl,a=t.area,u=Boolean(n)&&(!!e||"input"!==a);return i(p,{anchorEl:n,open:u,placement:"bottom-start",transition:!0,sx:{zIndex:1350,maxWidth:"100%"},children:function(e){var n=e.TransitionProps;return i(l,o(o({},n),{},{timeout:0,children:i(v,{children:r.renderPanelContent(t)})}))}})}))}}])}();return j}var v=s(c)((function(r){return{borderRadius:"4px",boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:r.theme.palette.background.paper}}));export{b as createPopperPanel,b as default};
+import{inherits as r,createClass as t,classCallCheck as e,callSuper as n,defineProperty as a,objectSpread2 as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsx as i}from"react/jsx-runtime";import{Component as u}from"react";import{styled as s,Box as c,Popper as p,Fade as l}from"@mui/material";import{PanelNotFound as m}from"./ui.units.js";import{mapDataViewContext as f}from"./context.js";import d from"./create.sort-menu.js";import h from"./create.filter-menu.js";import x from"./create.search-match.js";function b(){var s=x(),c=h(),b=d(),j=function(){function d(){var r;e(this,d);for(var t=arguments.length,o=new Array(t),u=0;u<t;u++)o[u]=arguments[u];return r=n(this,d,[].concat(o)),a(r,"renderPanelContent",function(r){switch(r.area){case"input":return i(s,{});case"filterButton":return i(c,{});case"sortButton":return i(b,{});default:return i(m,{area:r.area})}}),r}return r(d,u),t(d,[{key:"render",value:function(){var r=this;return f(function(t){var e=t.keyword,n=t.anchorEl,a=t.area,u=Boolean(n)&&(!!e||"input"!==a);return i(p,{anchorEl:n,open:u,placement:"bottom-start",transition:!0,sx:{zIndex:1350,maxWidth:"100%"},children:function(e){var n=e.TransitionProps;return i(l,o(o({},n),{},{timeout:0,children:i(v,{children:r.renderPanelContent(t)})}))}})})}}])}();return j}var v=s(c)(function(r){return{borderRadius:"4px",boxShadow:"rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px",backgroundColor:r.theme.palette.background.paper}});export{b as createPopperPanel,b as default};
 //# sourceMappingURL=create.popper-panel.js.map

package/dist/src/data-view/create.popper-panel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create.popper-panel.js","sources":["../../../src/data-view/create.popper-panel.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { Box, Fade, Popper, styled } from '@mui/material'\r\nimport { PanelNotFound } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport createSortMenu from './create.sort-menu'\r\nimport createFilterMenu from './create.filter-menu'\r\nimport createSearchMatch from './create.search-match'\r\n\r\nexport function createPopperPanel<T>() {\r\n const SearchMatchInstance = createSearchMatch<T>()\r\n const FilterMenuInstance = createFilterMenu<T>()\r\n const SortMenuInstance = createSortMenu<T>()\r\n\r\n class Panel extends Component {\r\n render() {\r\n return mapDataViewContext((context) => {\r\n const { keyword, anchorEl, area } = context\r\n const isOpen = Boolean(anchorEl) && (!!keyword \|\| area !== 'input')\r\n return (\r\n <Popper anchorEl={anchorEl} open={isOpen} placement='bottom-start' transition sx={{ zIndex: 1350, maxWidth: '100%' }}>\r\n {({ TransitionProps }) => (\r\n <Fade {...TransitionProps} timeout={0}>\r\n <PannelWrap>{this.renderPanelContent(context)}</PannelWrap>\r\n </Fade>\r\n )}\r\n </Popper>\r\n )\r\n })\r\n }\r\n\r\n renderPanelContent = (context: IDataViewContext<T>) => {\r\n switch (context.area) {\r\n case 'input':\r\n return <SearchMatchInstance />\r\n case 'filterButton':\r\n return <FilterMenuInstance />\r\n case 'sortButton':\r\n return <SortMenuInstance />\r\n default:\r\n return <PanelNotFound area={context.area} />\r\n }\r\n }\r\n }\r\n return Panel\r\n}\r\nexport default createPopperPanel\r\n\r\nconst PannelWrap = styled(Box)(({ theme }) => ({\r\n borderRadius: '4px',\r\n boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n backgroundColor: theme.palette.background.paper\r\n}))\r\n"],"names":["createPopperPanel","SearchMatchInstance","createSearchMatch","FilterMenuInstance","createFilterMenu","SortMenuInstance","createSortMenu","Panel","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","context","area","_jsx","PanelNotFound","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","keyword","anchorEl","isOpen","Boolean","Popper","open","placement","transition","sx","zIndex","maxWidth","children","_ref","TransitionProps","Fade","_objectSpread","timeout","PannelWrap","renderPanelContent","styled","Box","_ref2","borderRadius","boxShadow","backgroundColor","theme","palette","background","paper"],"mappings":"+gBAQgBA,IACd,IAAMC,EAAsBC,IACtBC,EAAqBC,IACrBC,EAAmBC,IAEnBC,aAAM,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA4BT,OA5BSP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAiBW,~~sBAAA~~,SAACY,GACpB,OAAQA,EAAQC,MACd,IAAK,QACH,OAAOC,EAACrB,EAAmB,IAC7B,IAAK,eACH,OAAOqB,EAACnB,EAAkB,IAC5B,IAAK,aACH,OAAOmB,EAACjB,EAAgB,IAC1B,QACE,OAAOiB,EAACC,EAAc,CAAAF,KAAMD,EAAQC,~~WAEzCb~~,CAAA,CAAA,OAAAgB,EAAAjB,EA5BiBkB,GA4BjBC,EAAAnB,EAAA,CAAA,CAAAoB,IAAA,SAAAC,MA3BD,WAAM,IAAAC,EAAAZ,KACJ,OAAOa,~~GAAmB~~,SAACV,GACzB,IAAQW,EAA4BX,EAA5BW,QAASC,EAAmBZ,EAAnBY,SAAUX,EAASD,EAATC,KACrBY,EAASC,QAAQF,OAAgBD,GAAoB,UAATV,GAClD,OACEC,EAACa,EAAM,CAACH,SAAUA,EAAUI,KAAMH,EAAQI,UAAU,eAAeC,YAAU,EAACC,GAAI,CAAEC,OAAQ,KAAMC,SAAU,QAAQC,SACjH,SADiHC,GAAA,IAC9GC,EAAeD,EAAfC,gBAAe,OACjBtB,EAACuB,EAAIC,EAAAA,KAAKF,GAAe,GAAA,CAAEG,QAAS,EAClCL,SAAApB,EAAC0B,EAAU,CAAAN,SAAEb,EAAKoB,mBAAmB7B,OAChC,GAIf,~~GACF~~,IAAC,IAeH,OAAOb,CACT,CAGA,IAAMyC,EAAaE,EAAOC,EAAPD,~~EAAY~~,SAAAE,GAAQ,MAAQ,CAC7CC,aAAc,MACdC,UAAW,0EACXC,gBAHqCH,EAALI,MAGTC,QAAQC,WAAWC,MAC3C"}
1	+ {"version":3,"file":"create.popper-panel.js","sources":["../../../src/data-view/create.popper-panel.tsx"],"sourcesContent":["import React, { Component } from 'react'\r\nimport { Box, Fade, Popper, styled } from '@mui/material'\r\nimport { PanelNotFound } from './ui.units'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\nimport createSortMenu from './create.sort-menu'\r\nimport createFilterMenu from './create.filter-menu'\r\nimport createSearchMatch from './create.search-match'\r\n\r\nexport function createPopperPanel<T>() {\r\n const SearchMatchInstance = createSearchMatch<T>()\r\n const FilterMenuInstance = createFilterMenu<T>()\r\n const SortMenuInstance = createSortMenu<T>()\r\n\r\n class Panel extends Component {\r\n render() {\r\n return mapDataViewContext((context) => {\r\n const { keyword, anchorEl, area } = context\r\n const isOpen = Boolean(anchorEl) && (!!keyword \|\| area !== 'input')\r\n return (\r\n <Popper anchorEl={anchorEl} open={isOpen} placement='bottom-start' transition sx={{ zIndex: 1350, maxWidth: '100%' }}>\r\n {({ TransitionProps }) => (\r\n <Fade {...TransitionProps} timeout={0}>\r\n <PannelWrap>{this.renderPanelContent(context)}</PannelWrap>\r\n </Fade>\r\n )}\r\n </Popper>\r\n )\r\n })\r\n }\r\n\r\n renderPanelContent = (context: IDataViewContext<T>) => {\r\n switch (context.area) {\r\n case 'input':\r\n return <SearchMatchInstance />\r\n case 'filterButton':\r\n return <FilterMenuInstance />\r\n case 'sortButton':\r\n return <SortMenuInstance />\r\n default:\r\n return <PanelNotFound area={context.area} />\r\n }\r\n }\r\n }\r\n return Panel\r\n}\r\nexport default createPopperPanel\r\n\r\nconst PannelWrap = styled(Box)(({ theme }) => ({\r\n borderRadius: '4px',\r\n boxShadow: 'rgba(0, 0, 0, 0.06) 0px 5px 22px, rgba(0, 0, 0, 0.04) 0px 0px 0px 0.5px',\r\n backgroundColor: theme.palette.background.paper\r\n}))\r\n"],"names":["createPopperPanel","SearchMatchInstance","createSearchMatch","FilterMenuInstance","createFilterMenu","SortMenuInstance","createSortMenu","Panel","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","context","area","_jsx","PanelNotFound","_inherits","Component","_createClass","key","value","_this2","mapDataViewContext","keyword","anchorEl","isOpen","Boolean","Popper","open","placement","transition","sx","zIndex","maxWidth","children","_ref","TransitionProps","Fade","_objectSpread","timeout","PannelWrap","renderPanelContent","styled","Box","_ref2","borderRadius","boxShadow","backgroundColor","theme","palette","background","paper"],"mappings":"+gBAQgBA,IACd,IAAMC,EAAsBC,IACtBC,EAAqBC,IACrBC,EAAmBC,IAEnBC,aAAM,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GA4BT,OA5BSP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAiBW,qBAAA,SAACY,GACpB,OAAQA,EAAQC,MACd,IAAK,QACH,OAAOC,EAACrB,EAAmB,IAC7B,IAAK,eACH,OAAOqB,EAACnB,EAAkB,IAC5B,IAAK,aACH,OAAOmB,EAACjB,EAAgB,IAC1B,QACE,OAAOiB,EAACC,EAAc,CAAAF,KAAMD,EAAQC,UAEzCb,CAAA,CAAA,OAAAgB,EAAAjB,EA5BiBkB,GA4BjBC,EAAAnB,EAAA,CAAA,CAAAoB,IAAA,SAAAC,MA3BD,WAAM,IAAAC,EAAAZ,KACJ,OAAOa,EAAmB,SAACV,GACzB,IAAQW,EAA4BX,EAA5BW,QAASC,EAAmBZ,EAAnBY,SAAUX,EAASD,EAATC,KACrBY,EAASC,QAAQF,OAAgBD,GAAoB,UAATV,GAClD,OACEC,EAACa,EAAM,CAACH,SAAUA,EAAUI,KAAMH,EAAQI,UAAU,eAAeC,YAAU,EAACC,GAAI,CAAEC,OAAQ,KAAMC,SAAU,QAAQC,SACjH,SADiHC,GAAA,IAC9GC,EAAeD,EAAfC,gBAAe,OACjBtB,EAACuB,EAAIC,EAAAA,KAAKF,GAAe,GAAA,CAAEG,QAAS,EAClCL,SAAApB,EAAC0B,EAAU,CAAAN,SAAEb,EAAKoB,mBAAmB7B,OAChC,GAIf,EACF,IAAC,IAeH,OAAOb,CACT,CAGA,IAAMyC,EAAaE,EAAOC,EAAPD,CAAY,SAAAE,GAAQ,MAAQ,CAC7CC,aAAc,MACdC,UAAW,0EACXC,gBAHqCH,EAALI,MAGTC,QAAQC,WAAWC,MAC3C"}

package/dist/src/data-view/create.search-match.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e,inherits as r,createClass as i,classCallCheck as t,callSuper as n,objectSpread2 as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as o}from"react/jsx-runtime";import{Component as c}from"react";import{styled as u,MenuList as s,MenuItem as d,Typography as h}from"@mui/material";import{FilterNotes as f}from"./ui.units.js";import{createFilterStore as m}from"./filter-store.js";import{filterMenuClasses as p,getFieldsMatches as v}from"./helpers.js";import{mapDataViewContext as k}from"./context.js";function S(){var u=function(){function u(){var r;t(this,u);for(var i=arguments.length,c=new Array(i),s=0;s<i;s++)c[s]=arguments[s];return r=n(this,u,[].concat(c)),e(r,"render",(function(){return k((function(e){var i,t=e.keyword,n=e.filterBarConfigs,c=n.fields,u=n.quickSearch,s=v(c,t),m=Object.keys(s).filter((function(e){return!!e})),k=null!==(i=null==u?void 0:u.label)&&void 0!==i?i:"Quick search";return l(b,{className:p.list,children:[m.map((function(i,n){var c,u,m=s[i],v=null!==(c=null==m?void 0:m.label)&&void 0!==c?c:i.toString(),k=null==m||null===(u=m.quickSearchMatch)||void 0===u?void 0:u.notes;return l(d,{className:p.item,onClick:function(){return r.handleClick(e,i)},children:[l(h,{noWrap:!0,variant:"body2",component:"span",sx:{flex:1},children:[v,' "',t,'"']}),k&&o(f,a({title:"The ".concat(v," includes"),disabledSize:!0},k))]},i.toString()+n)})),u&&l(d,{className:p.item,onClick:function(){return r.handleQuickSearchClick(e)},children:[l(h,{noWrap:!0,variant:"body2",component:"span",sx:{flex:1},children:[null!=k?k:"Quick search",' "',t,'"']}),u.notes&&o(f,a({title:"The ".concat(k.toLocaleLowerCase()," includes"),disabledSize:!0},u.notes))]})]})}))})),e(r,"handleClick",(function(e,r){var i,t=m(e.filterState);t.addFilterItem(r,{value:e.keyword},{reason:"quickSearch",area:"input"}),null===(i=e.onFilterStateChange)||void 0===i||i.call(e,t.build())})),e(r,"handleQuickSearchClick",(function(e){var r,i=m(e.filterState);i.addQuickSearch(e.keyword,{reason:"quickSearch",area:"input"}),null===(r=e.onFilterStateChange)||void 0===r||r.call(e,i.build())})),r}return r(u,c),i(u)}();return u}var b=u(s)(e({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"8px 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}}));export{S as default};
+import{defineProperty as e,inherits as r,createClass as i,classCallCheck as t,callSuper as n,objectSpread2 as a}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as l,jsx as o}from"react/jsx-runtime";import{Component as c}from"react";import{styled as u,MenuList as s,MenuItem as d,Typography as h}from"@mui/material";import{FilterNotes as f}from"./ui.units.js";import{createFilterStore as m}from"./filter-store.js";import{filterMenuClasses as p,getFieldsMatches as v}from"./helpers.js";import{mapDataViewContext as k}from"./context.js";function S(){var u=function(){function u(){var r;t(this,u);for(var i=arguments.length,c=new Array(i),s=0;s<i;s++)c[s]=arguments[s];return r=n(this,u,[].concat(c)),e(r,"render",function(){return k(function(e){var i,t=e.keyword,n=e.filterBarConfigs,c=n.fields,u=n.quickSearch,s=v(c,t),m=Object.keys(s).filter(function(e){return!!e}),k=null!==(i=null==u?void 0:u.label)&&void 0!==i?i:"Quick search";return l(b,{className:p.list,children:[m.map(function(i,n){var c,u,m=s[i],v=null!==(c=null==m?void 0:m.label)&&void 0!==c?c:i.toString(),k=null==m||null===(u=m.quickSearchMatch)||void 0===u?void 0:u.notes;return l(d,{className:p.item,onClick:function(){return r.handleClick(e,i)},children:[l(h,{noWrap:!0,variant:"body2",component:"span",sx:{flex:1},children:[v,' "',t,'"']}),k&&o(f,a({title:"The ".concat(v," includes"),disabledSize:!0},k))]},i.toString()+n)}),u&&l(d,{className:p.item,onClick:function(){return r.handleQuickSearchClick(e)},children:[l(h,{noWrap:!0,variant:"body2",component:"span",sx:{flex:1},children:[null!=k?k:"Quick search",' "',t,'"']}),u.notes&&o(f,a({title:"The ".concat(k.toLocaleLowerCase()," includes"),disabledSize:!0},u.notes))]})]})})}),e(r,"handleClick",function(e,r){var i,t=m(e.filterState);t.addFilterItem(r,{value:e.keyword},{reason:"quickSearch",area:"input"}),null===(i=e.onFilterStateChange)||void 0===i||i.call(e,t.build())}),e(r,"handleQuickSearchClick",function(e){var r,i=m(e.filterState);i.addQuickSearch(e.keyword,{reason:"quickSearch",area:"input"}),null===(r=e.onFilterStateChange)||void 0===r||r.call(e,i.build())}),r}return r(u,c),i(u)}();return u}var b=u(s)(e({padding:0},".".concat(p.item),{height:"var(--filter-item-height, 40px)",padding:"8px 16px","&:not(:last-child)":{borderBottom:"1px solid var(--color-divider, rgba(145 160 170 / 10%))"}}));export{S as default};
 //# sourceMappingURL=create.search-match.js.map

package/dist/src/data-view/create.search-match.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create.search-match.js","sources":["../../../src/data-view/create.search-match.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { MenuList, MenuItem, Typography, styled } from '@mui/material'\r\nimport { IFilterConfigs } from './types'\r\nimport { FilterNotes } from './ui.units'\r\nimport { createFilterStore } from './filter-store'\r\nimport { filterMenuClasses, getFieldsMatches } from './helpers'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport interface ISearchMatchProps {}\r\n\r\nfunction createSearchMatch<T>(): ComponentType<ISearchMatchProps> {\r\n class SearchMatch extends Component<ISearchMatchProps> {\r\n render = () => {\r\n return mapDataViewContext<T>((context) => {\r\n const { keyword } = context\r\n const { fields, quickSearch } = context.filterBarConfigs\r\n const fieldMatches = getFieldsMatches<T>(fields, keyword)\r\n const keys = Object.keys(fieldMatches).filter((x) => !!x) as (keyof IFilterConfigs<T>)[]\r\n const quickSearchLabel = quickSearch?.label ?? 'Quick search'\r\n\r\n return (\r\n <MenuListCustom className={filterMenuClasses.list}>\r\n {keys.map((key, i) => {\r\n const item = fieldMatches[key]\r\n const label = item?.label ?? key.toString()\r\n const notes = item?.quickSearchMatch?.notes\r\n return (\r\n <MenuItem key={key.toString() + i} className={filterMenuClasses.item} onClick={() => this.handleClick(context, key)}>\r\n <Typography noWrap variant='body2' component='span' sx={{ flex: 1 }}>\r\n {label} \"{keyword}\"\r\n </Typography>\r\n {notes && <FilterNotes title={`The ${label} includes`} disabledSize {...notes} />}\r\n </MenuItem>\r\n )\r\n })}\r\n {quickSearch && (\r\n <MenuItem className={filterMenuClasses.item} onClick={() => this.handleQuickSearchClick(context)}>\r\n <Typography noWrap variant='body2' component='span' sx={{ flex: 1 }}>\r\n {quickSearchLabel ?? 'Quick search'} "{keyword}"\r\n </Typography>\r\n {quickSearch.notes && (\r\n <FilterNotes title={`The ${quickSearchLabel.toLocaleLowerCase()} includes`} disabledSize {...quickSearch.notes} />\r\n )}\r\n </MenuItem>\r\n )}\r\n </MenuListCustom>\r\n )\r\n })\r\n }\r\n\r\n handleClick = (context: IDataViewContext<T>, field: keyof T) => {\r\n const store = createFilterStore(context.filterState)\r\n store.addFilterItem(field, { value: context.keyword }, { reason: 'quickSearch', area: 'input' })\r\n context.onFilterStateChange?.(store.build())\r\n }\r\n\r\n handleQuickSearchClick = (context: IDataViewContext<T>) => {\r\n const store = createFilterStore(context.filterState)\r\n store.addQuickSearch(context.keyword, { reason: 'quickSearch', area: 'input' })\r\n context.onFilterStateChange?.(store.build())\r\n }\r\n }\r\n return SearchMatch\r\n}\r\nexport default createSearchMatch\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n padding: 0,\r\n [`.${filterMenuClasses.item}`]: {\r\n height: 'var(--filter-item-height, 40px)',\r\n padding: '8px 16px',\r\n '&:not(:last-child)': {\r\n borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n }\r\n }\r\n})\r\n"],"names":["createSearchMatch","SearchMatch","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","mapDataViewContext","context","_quickSearch$label","keyword","_context$filterBarCon","filterBarConfigs","fields","quickSearch","fieldMatches","getFieldsMatches","keys","Object","filter","x","quickSearchLabel","label","_jsxs","MenuListCustom","className","filterMenuClasses","list","map","key","i","_item$label","_item$quickSearchMatc","item","toString","notes","quickSearchMatch","MenuItem","onClick","handleClick","children","Typography","noWrap","variant","component","sx","flex","_jsx","FilterNotes","_objectSpread","title","disabledSize","handleQuickSearchClick","toLocaleLowerCase","field","_context$onFilterStat","store","createFilterStore","filterState","addFilterItem","value","reason","area","onFilterStateChange","call","build","_context$onFilterStat2","addQuickSearch","_inherits","Component","_createClass","styled","MenuList","padding","height","borderBottom"],"mappings":"oiBAUA,SAASA,IAAiB,IAClBC,aAAY,SAAAA,IAAA,IAAAC,EAAAC,OAAAF,GAAA,IAAA,IAAAG,EAAAC,UAAAC,OAAAC,EAAAC,IAAAA,MAAAJ,GAAAK,EAAA,EAAAA,EAAAL,EAAAK,IAAAF,EAAAE,GAAAJ,UAAAI,GAiDf,OAjDeP,EAAAQ,EAAAC,KAAAV,EAAAW,GAAAA,OAAAL,IAAAM,EAAAX,EAAA,~~UACP~~,WACP,OAAOY,~~GAAsB~~,SAACC,GAAW,IAAAC,EAC/BC,EAAYF,EAAZE,QACRC,EAAgCH,EAAQI,iBAAhCC,EAAMF,EAANE,OAAQC,EAAWH,EAAXG,YACVC,EAAeC,EAAoBH,EAAQH,GAC3CO,EAAOC,OAAOD,KAAKF,GAAcI,~~QAAO~~,SAACC,GAAC,QAAOA,~~KACjDC~~,EAAqCZ,QAArBA,EAAGK,aAAW,EAAXA,EAAaQ,aAAKb,IAAAA,EAAAA,EAAI,eAE/C,OACEc,EAACC,GAAeC,UAAWC,EAAkBC,eAC1CV,EAAKW,~~KAAI~~,SAACC,EAAKC,GAAK,IAAAC,EAAAC,EACbC,EAAOlB,EAAac,GACpBP,EAAmBS,QAAdA,EAAGE,eAAAA,EAAMX,iBAAKS,EAAAA,EAAIF,EAAIK,WAC3BC,EAAQF,SAAsBD,QAAlBA,EAAJC,EAAMG,wBAANJ,IAAsBA,OAAtBA,EAAAA,EAAwBG,MACtC,OACEZ,EAACc,EAAQ,CAA0BZ,UAAWC,EAAkBO,KAAMK,QAAS,WAAF,OAAQ3C,EAAK4C,YAAY/B,EAASqB,EAAI,EAAAW,SAAA,CACjHjB,EAACkB,EAAU,CAACC,QAAM,EAACC,QAAQ,QAAQC,UAAU,OAAOC,GAAI,CAAEC,KAAM,GAC7DN,SAAA,CAAAlB,EAAS,KAAAZ,SAEXyB,GAASY,EAACC,EAAWC,EAAA,CAACC,MAAK7C,OAAAA,OAASiB,EAAgB,aAAE6B,cAAY,GAAKhB,MAJ3DN,EAAIK,WAAaJ,EAOpC,~~IACChB~~,GACCS,EAACc,EAAQ,CAACZ,UAAWC,EAAkBO,KAAMK,QAAS,WAAF,OAAQ3C,EAAKyD,uBAAuB5C,EAAQ,EAC9FgC,SAAA,CAAAjB,EAACkB,EAAW,CAAAC,QAAO,EAAAC,QAAQ,QAAQC,UAAU,OAAOC,GAAI,CAAEC,KAAM,GAC7DN,SAAA,CAAAnB,QAAAA,EAAoB,eAAc,KAASX,EAAO,OAEpDI,EAAYqB,OACXY,EAACC,EAAWC,EAAA,CAACC,MAAK,OAAA7C,OAASgB,EAAiBgC,oBAA8B,aAAEF,cAAY,GAAKrC,EAAYqB,aAMrH,~~OACD7B~~,EAAAX,EAAA,~~eAEa~~,SAACa,EAA8B8C,GAAkB,IAAAC,EACvDC,EAAQC,EAAkBjD,EAAQkD,aACxCF,EAAMG,cAAcL,EAAO,CAAEM,MAAOpD,EAAQE,SAAW,CAAEmD,OAAQ,cAAeC,KAAM,UAC3D,QAA3BP,EAAA/C,EAAQuD,2BAARR,IAA2BA,GAA3BA,EAAAS,KAAAxD,EAA8BgD,EAAMS,~~YACrC3D~~,EAAAX,EAEwB,~~0BAAA~~,SAACa,GAAgC,IAAA0D,EAClDV,EAAQC,EAAkBjD,EAAQkD,aACxCF,EAAMW,eAAe3D,EAAQE,QAAS,CAAEmD,OAAQ,cAAeC,KAAM,UAC1C,QAA3BI,EAAA1D,EAAQuD,2BAARG,IAA2BA,GAA3BA,EAAAF,KAAAxD,EAA8BgD,EAAMS,~~YACrCtE~~,CAAA,CAAA,OAAAyE,EAAA1E,EAjDuB2E,GAiDvBC,EAAA5E,EAAA,IAEH,OAAOA,CACT,CAGA,IAAM8B,EAAiB+C,EAAOC,EAAPD,CAAgBjE,EAAA,CACrCmE,QAAS,GAAC,IAAApE,OACLqB,EAAkBO,MAAS,CAC9ByC,OAAQ,kCACRD,QAAS,WACT,qBAAsB,CACpBE,aAAc"}
1	+ {"version":3,"file":"create.search-match.js","sources":["../../../src/data-view/create.search-match.tsx"],"sourcesContent":["import React, { Component, ComponentType } from 'react'\r\nimport { MenuList, MenuItem, Typography, styled } from '@mui/material'\r\nimport { IFilterConfigs } from './types'\r\nimport { FilterNotes } from './ui.units'\r\nimport { createFilterStore } from './filter-store'\r\nimport { filterMenuClasses, getFieldsMatches } from './helpers'\r\nimport { IDataViewContext, mapDataViewContext } from './context'\r\n\r\nexport interface ISearchMatchProps {}\r\n\r\nfunction createSearchMatch<T>(): ComponentType<ISearchMatchProps> {\r\n class SearchMatch extends Component<ISearchMatchProps> {\r\n render = () => {\r\n return mapDataViewContext<T>((context) => {\r\n const { keyword } = context\r\n const { fields, quickSearch } = context.filterBarConfigs\r\n const fieldMatches = getFieldsMatches<T>(fields, keyword)\r\n const keys = Object.keys(fieldMatches).filter((x) => !!x) as (keyof IFilterConfigs<T>)[]\r\n const quickSearchLabel = quickSearch?.label ?? 'Quick search'\r\n\r\n return (\r\n <MenuListCustom className={filterMenuClasses.list}>\r\n {keys.map((key, i) => {\r\n const item = fieldMatches[key]\r\n const label = item?.label ?? key.toString()\r\n const notes = item?.quickSearchMatch?.notes\r\n return (\r\n <MenuItem key={key.toString() + i} className={filterMenuClasses.item} onClick={() => this.handleClick(context, key)}>\r\n <Typography noWrap variant='body2' component='span' sx={{ flex: 1 }}>\r\n {label} \"{keyword}\"\r\n </Typography>\r\n {notes && <FilterNotes title={`The ${label} includes`} disabledSize {...notes} />}\r\n </MenuItem>\r\n )\r\n })}\r\n {quickSearch && (\r\n <MenuItem className={filterMenuClasses.item} onClick={() => this.handleQuickSearchClick(context)}>\r\n <Typography noWrap variant='body2' component='span' sx={{ flex: 1 }}>\r\n {quickSearchLabel ?? 'Quick search'} "{keyword}"\r\n </Typography>\r\n {quickSearch.notes && (\r\n <FilterNotes title={`The ${quickSearchLabel.toLocaleLowerCase()} includes`} disabledSize {...quickSearch.notes} />\r\n )}\r\n </MenuItem>\r\n )}\r\n </MenuListCustom>\r\n )\r\n })\r\n }\r\n\r\n handleClick = (context: IDataViewContext<T>, field: keyof T) => {\r\n const store = createFilterStore(context.filterState)\r\n store.addFilterItem(field, { value: context.keyword }, { reason: 'quickSearch', area: 'input' })\r\n context.onFilterStateChange?.(store.build())\r\n }\r\n\r\n handleQuickSearchClick = (context: IDataViewContext<T>) => {\r\n const store = createFilterStore(context.filterState)\r\n store.addQuickSearch(context.keyword, { reason: 'quickSearch', area: 'input' })\r\n context.onFilterStateChange?.(store.build())\r\n }\r\n }\r\n return SearchMatch\r\n}\r\nexport default createSearchMatch\r\n\r\nconst MenuListCustom = styled(MenuList)({\r\n padding: 0,\r\n [`.${filterMenuClasses.item}`]: {\r\n height: 'var(--filter-item-height, 40px)',\r\n padding: '8px 16px',\r\n '&:not(:last-child)': {\r\n borderBottom: '1px solid var(--color-divider, rgba(145 160 170 / 10%))'\r\n }\r\n }\r\n})\r\n"],"names":["createSearchMatch","SearchMatch","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","this","concat","_defineProperty","mapDataViewContext","context","_quickSearch$label","keyword","_context$filterBarCon","filterBarConfigs","fields","quickSearch","fieldMatches","getFieldsMatches","keys","Object","filter","x","quickSearchLabel","label","_jsxs","MenuListCustom","className","filterMenuClasses","list","map","key","i","_item$label","_item$quickSearchMatc","item","toString","notes","quickSearchMatch","MenuItem","onClick","handleClick","children","Typography","noWrap","variant","component","sx","flex","_jsx","FilterNotes","_objectSpread","title","disabledSize","handleQuickSearchClick","toLocaleLowerCase","field","_context$onFilterStat","store","createFilterStore","filterState","addFilterItem","value","reason","area","onFilterStateChange","call","build","_context$onFilterStat2","addQuickSearch","_inherits","Component","_createClass","styled","MenuList","padding","height","borderBottom"],"mappings":"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"}

package/dist/src/data-view/create.sort-menu.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as t,inherits as e,createClass as r,classCallCheck as a,callSuper as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as n,jsx as i}from"react/jsx-runtime";import{Component as l}from"react";import{styled as c,Box as d,List as s,Typography as u,ListItem as m,ListItemButton as p,ListItemText as f,IconButton as g}from"@mui/material";import{createFilterStore as h}from"./filter-store.js";import{ClearAllButton as C,mapSortConfigs as x}from"./ui.units.js";import{mapDataViewContext as v,defaultDataViewContext as b}from"./context.js";var S="SortMenu-root",k="SortMenu-header",w="SortMenu-list",y="SortMenu-item",V="SortMenu-activeItem",B="SortMenu-itemText",M="SortMenu-directionButton",N="SortMenu-clearButton";function j(){return function(){function c(e){var r;return a(this,c),r=o(this,c,[e]),t(r,"dataViewContext",b),t(r,"renderSortList",(function(){var t=r.dataViewContext.filterBarConfigs.fields||{},e=Object.keys(t).filter((function(e){var r=t[e];return!1!==(null==r?void 0:r.sortable)})),a=r.dataViewContext.filterState.sort;return 0===e.length?i(d,{sx:{p:2,textAlign:"center"},children:i(u,{variant:"body2",color:"text.secondary",children:"No sortable fields available"})}):i(P,{className:w,disablePadding:!0,children:e.map((function(e){var o=t[e],l=(null==a?void 0:a.field)===e,c=l?a.direction:void 0,d=x[c||"asc"];return i(m,{className:"".concat(y," ").concat(l?V:""),disablePadding:!0,children:n(p,{onClick:function(){return r.handleFieldClick(e,c)},className:l?"active":"",children:[i(f,{primary:(null==o?void 0:o.label)||e.toString(),className:B,primaryTypographyProps:{className:B,sx:{fontWeight:l?600:400}}}),l&&i(g,{size:"small",className:M,onClick:function(t){t.stopPropagation(),r.handleDirectionToggle(e,c)},title:"Sort ".concat(d.title.toLocaleLowerCase()),children:d.icon})]})},e.toString())}))})})),t(r,"handleFieldClick",(function(t,e){var a={field:t,direction:e&&"asc"===e?"desc":"asc"},o=h(r.dataViewContext.filterState).changeSort(a,{area:"sortButton"});r.dataViewContext.onFilterStateChange(o.build())})),t(r,"handleDirectionToggle",(function(t,e){if(e){var a={field:t,direction:"asc"===e?"desc":"asc"},o=h(r.dataViewContext.filterState).changeSort(a,{area:"sortButton"});r.dataViewContext.onFilterStateChange(o.build())}})),t(r,"handleClearSort",(function(){var t=h(r.dataViewContext.filterState).removeSort({area:"sortButton"});r.dataViewContext.onFilterStateChange(t.build())})),r.dataViewContext=b,r}return e(c,l),r(c,[{key:"render",value:function(){var t=this;return v((function(e){return t.dataViewContext=e,n(L,{className:S,children:[n(d,{className:k,children:[i(u,{variant:"subtitle2",sx:{fontWeight:600},children:"Sort By"}),t.dataViewContext.filterState.sort&&i(C,{className:N,onClick:function(){return t.handleClearSort()},title:"Clear sort",children:"Clear"})]}),t.renderSortList()]})}))}}])}()}var L=c(d)((function(e){var r=e.theme;return t(t(t(t(t({minWidth:"240px",maxWidth:"360px",backgroundColor:r.palette.background.paper,borderRadius:"4px",overflow:"hidden",border:"1px solid ".concat(r.palette.divider)},".".concat(k),{display:"flex",alignItems:"center",background:"dark"===r.palette.mode?r.palette.grey[800]:r.palette.grey[900],padding:"8px",gap:"8px",".MuiTypography-root":{color:r.palette.common.white,flex:1}}),".".concat(w),{maxHeight:"300px",overflowY:"auto"}),".".concat(y),{"&:not(:last-child)":{borderBottom:"1px solid ".concat(r.palette.divider)}}),".".concat(M),{marginLeft:"auto",color:r.palette.primary.main}),".".concat(N),{color:r.palette.error.main})})),P=c(s)((function(t){var e=t.theme;return{".MuiListItemButton-root":{backgroundColor:"transparent","&:hover":{backgroundColor:"dark"===e.palette.mode?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.04)"},"&.active":{backgroundColor:"dark"===e.palette.mode?"rgba(144, 202, 249, 0.08)":"rgba(25, 118, 210, 0.08)","&:hover":{backgroundColor:"dark"===e.palette.mode?"rgba(144, 202, 249, 0.12)":"rgba(25, 118, 210, 0.12)"}}}}}));export{j as default};
+import{defineProperty as t,inherits as e,createClass as r,classCallCheck as a,callSuper as o}from"../../_virtual/_rollupPluginBabelHelpers.js";import{jsxs as n,jsx as i}from"react/jsx-runtime";import{Component as l}from"react";import{styled as c,Box as d,List as s,Typography as u,ListItem as m,ListItemButton as p,ListItemText as f,IconButton as g}from"@mui/material";import{createFilterStore as h}from"./filter-store.js";import{ClearAllButton as C,mapSortConfigs as x}from"./ui.units.js";import{mapDataViewContext as v,defaultDataViewContext as b}from"./context.js";var S="SortMenu-root",k="SortMenu-header",w="SortMenu-list",y="SortMenu-item",V="SortMenu-activeItem",B="SortMenu-itemText",M="SortMenu-directionButton",N="SortMenu-clearButton";function j(){return function(){function c(e){var r;return a(this,c),r=o(this,c,[e]),t(r,"dataViewContext",b),t(r,"renderSortList",function(){var t=r.dataViewContext.filterBarConfigs.fields||{},e=Object.keys(t).filter(function(e){var r=t[e];return!1!==(null==r?void 0:r.sortable)}),a=r.dataViewContext.filterState.sort;return 0===e.length?i(d,{sx:{p:2,textAlign:"center"},children:i(u,{variant:"body2",color:"text.secondary",children:"No sortable fields available"})}):i(P,{className:w,disablePadding:!0,children:e.map(function(e){var o=t[e],l=(null==a?void 0:a.field)===e,c=l?a.direction:void 0,d=x[c||"asc"];return i(m,{className:"".concat(y," ").concat(l?V:""),disablePadding:!0,children:n(p,{onClick:function(){return r.handleFieldClick(e,c)},className:l?"active":"",children:[i(f,{primary:(null==o?void 0:o.label)||e.toString(),className:B,primaryTypographyProps:{className:B,sx:{fontWeight:l?600:400}}}),l&&i(g,{size:"small",className:M,onClick:function(t){t.stopPropagation(),r.handleDirectionToggle(e,c)},title:"Sort ".concat(d.title.toLocaleLowerCase()),children:d.icon})]})},e.toString())})})}),t(r,"handleFieldClick",function(t,e){var a={field:t,direction:e&&"asc"===e?"desc":"asc"},o=h(r.dataViewContext.filterState).changeSort(a,{area:"sortButton"});r.dataViewContext.onFilterStateChange(o.build())}),t(r,"handleDirectionToggle",function(t,e){if(e){var a={field:t,direction:"asc"===e?"desc":"asc"},o=h(r.dataViewContext.filterState).changeSort(a,{area:"sortButton"});r.dataViewContext.onFilterStateChange(o.build())}}),t(r,"handleClearSort",function(){var t=h(r.dataViewContext.filterState).removeSort({area:"sortButton"});r.dataViewContext.onFilterStateChange(t.build())}),r.dataViewContext=b,r}return e(c,l),r(c,[{key:"render",value:function(){var t=this;return v(function(e){return t.dataViewContext=e,n(L,{className:S,children:[n(d,{className:k,children:[i(u,{variant:"subtitle2",sx:{fontWeight:600},children:"Sort By"}),t.dataViewContext.filterState.sort&&i(C,{className:N,onClick:function(){return t.handleClearSort()},title:"Clear sort",children:"Clear"})]}),t.renderSortList()]})})}}])}()}var L=c(d)(function(e){var r=e.theme;return t(t(t(t(t({minWidth:"240px",maxWidth:"360px",backgroundColor:r.palette.background.paper,borderRadius:"4px",overflow:"hidden",border:"1px solid ".concat(r.palette.divider)},".".concat(k),{display:"flex",alignItems:"center",background:"dark"===r.palette.mode?r.palette.grey[800]:r.palette.grey[900],padding:"8px",gap:"8px",".MuiTypography-root":{color:r.palette.common.white,flex:1}}),".".concat(w),{maxHeight:"300px",overflowY:"auto"}),".".concat(y),{"&:not(:last-child)":{borderBottom:"1px solid ".concat(r.palette.divider)}}),".".concat(M),{marginLeft:"auto",color:r.palette.primary.main}),".".concat(N),{color:r.palette.error.main})}),P=c(s)(function(t){var e=t.theme;return{".MuiListItemButton-root":{backgroundColor:"transparent","&:hover":{backgroundColor:"dark"===e.palette.mode?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.04)"},"&.active":{backgroundColor:"dark"===e.palette.mode?"rgba(144, 202, 249, 0.08)":"rgba(25, 118, 210, 0.08)","&:hover":{backgroundColor:"dark"===e.palette.mode?"rgba(144, 202, 249, 0.12)":"rgba(25, 118, 210, 0.12)"}}}}});export{j as default};
 //# sourceMappingURL=create.sort-menu.js.map