feat: filter hyper

revolist · Nov 13, 2024 · 9554909 · 9554909
1 parent ffc7226
commit 9554909
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 5 deletions.
diff --git a/src/components.d.ts b/src/components.d.ts
@@ -5,7 +5,7 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
-import { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, CellTemplateProp, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, ExtraNodeFuncConfig, FocusAfterRenderEvent, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, Nullable, PluginBaseComponent, PositionItem, Providers, RangeArea, RangeClipboardCopyEventProps, RangeClipboardPasteEvent, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
+import { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, CellTemplateProp, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, ExtraNodeFuncConfig, FocusAfterRenderEvent, FocusRenderEvent, FocusTemplateFunc, HyperFunc, InitialHeaderClick, MultiDimensionType, Nullable, PluginBaseComponent, PositionItem, Providers, RangeArea, RangeClipboardCopyEventProps, RangeClipboardPasteEvent, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
 import { GridPlugin } from "./plugins/base.plugin";
 import { AutoSizeColumnConfig } from "./plugins/column.auto-size.plugin";
 import { ColumnFilterConfig, FilterCaptions, FilterCollection, LogicFunction, MultiFilterItem, ShowData } from "./plugins/filter/filter.types";
@@ -19,7 +19,7 @@ import { DSourceState, Groups } from "./store/index";
 import { ResizeProps } from "./components/header/resizable.directive";
 import { HeaderRenderProps } from "./components/header/header-renderer";
 import { EventData } from "./components/overlay/selection.utils";
-export { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, CellTemplateProp, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, ExtraNodeFuncConfig, FocusAfterRenderEvent, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, Nullable, PluginBaseComponent, PositionItem, Providers, RangeArea, RangeClipboardCopyEventProps, RangeClipboardPasteEvent, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
+export { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, CellTemplateProp, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, ExtraNodeFuncConfig, FocusAfterRenderEvent, FocusRenderEvent, FocusTemplateFunc, HyperFunc, InitialHeaderClick, MultiDimensionType, Nullable, PluginBaseComponent, PositionItem, Providers, RangeArea, RangeClipboardCopyEventProps, RangeClipboardPasteEvent, RowDefinition, RowHeaders, SaveDataDetails, SelectionStoreState, TempRange, Theme, ViewportData, ViewPortResizeEvent, ViewPortScrollEvent, ViewportState, ViewSettingSizeProp } from "./types/index";
 export { GridPlugin } from "./plugins/base.plugin";
 export { AutoSizeColumnConfig } from "./plugins/column.auto-size.plugin";
 export { ColumnFilterConfig, FilterCaptions, FilterCollection, LogicFunction, MultiFilterItem, ShowData } from "./plugins/filter/filter.types";
@@ -434,6 +434,7 @@ export namespace Components {
           * Disables dynamic filtering. A way to apply filters on Save only
          */
         "disableDynamicFiltering": boolean;
+        "extraContent"?: (h: HyperFunc<VNode>, data: ShowData) => VNode | VNode[];
         "filterCaptions": FilterCaptions | undefined;
         "filterEntities": Record<string, LogicFunction>;
         "filterNames": Record<string, string>;
@@ -1812,6 +1813,7 @@ declare namespace LocalJSX {
           * Disables dynamic filtering. A way to apply filters on Save only
          */
         "disableDynamicFiltering"?: boolean;
+        "extraContent"?: (h: HyperFunc<VNode>, data: ShowData) => VNode | VNode[];
         "filterCaptions"?: FilterCaptions | undefined;
         "filterEntities"?: Record<string, LogicFunction>;
         "filterNames"?: Record<string, string>;

diff --git a/src/plugins/filter/filter.panel.tsx b/src/plugins/filter/filter.panel.tsx
@@ -21,7 +21,7 @@ import {
   MultiFilterItem,
   ShowData,
 } from './filter.types';
-import { ColumnProp } from '@type';
+import { ColumnProp, HyperFunc } from '@type';
 import { FilterType } from './filter.indexed';
 
 const defaultType: FilterType = 'none';
@@ -69,6 +69,8 @@ export class FilterPanel {
    */
   @Prop() disableDynamicFiltering = false;
 
+  @Prop() extraContent?: (h: HyperFunc<VNode>, data: ShowData) => VNode | VNode[];
+
   @Event() filterChange: EventEmitter<MultiFilterItem>;
   @Event() resetChange: EventEmitter<ColumnProp>;
 
@@ -442,6 +444,7 @@ export class FilterPanel {
         }}
       >
         <slot slot="header" />
+        { this.extraContent?.(h, this.changes) }
         <label>{capts.title}</label>
         <div class="filter-holder">{this.getFilterItemsList()}</div>
 

diff --git a/src/plugins/filter/filter.plugin.tsx b/src/plugins/filter/filter.plugin.tsx
@@ -1,6 +1,6 @@
-import { h } from '@stencil/core';
+import { h, type VNode } from '@stencil/core';
 
-import type { ColumnProp, ColumnRegular, DataType, PluginProviders } from '@type';
+import type { ColumnProp, ColumnRegular, DataType, HyperFunc, PluginProviders } from '@type';
 import { BasePlugin } from '../base.plugin';
 import { FILTER_PROP, isFilterBtn } from './filter.button';
 import {
@@ -14,6 +14,7 @@ import type {
   FilterCollection,
   LogicFunction,
   MultiFilterItem,
+  ShowData,
 } from './filter.types';
 
 import { getCellDataParsed } from '../../utils';
@@ -57,6 +58,8 @@ export class FilterPlugin extends BasePlugin {
 
   filterProp = FILTER_PROP;
 
+  extraHyperContent?: (h: HyperFunc<VNode>, data: ShowData) => VNode | VNode[];
+
   constructor(
     public revogrid: HTMLRevoGridElement,
     providers: PluginProviders,
@@ -79,6 +82,7 @@ export class FilterPlugin extends BasePlugin {
         onFilterChange={e => this.onFilterChange(e.detail)}
         onResetChange={e => this.onFilterReset(e.detail)}
         disableDynamicFiltering={config?.disableDynamicFiltering}
+        extraContent={this.extraHyperContent}
         ref={e => (this.pop = e)}
       > { this.extraContent() }</revogr-filter-panel>,
     ];