@revolist/revogrid 4.14.4 → 4.14.5

package/dist/cjs/revogr-filter-panel.cjs.entry.js

@@ -199,27 +199,6 @@ const FilterPanel = class {
                 input.focus();
         }, 0);
     }
-    onUserInput(index, prop, event) {
-        // update the value of the filter item
-        this.filterItems[prop][index].value = event.target.value;
-        if (!this.disableDynamicFiltering) {
-            this.debouncedApplyFilter();
-        }
-    }
-    onKeyDown(e) {
-        if (e.key.toLowerCase() === 'enter') {
-            const select = document.getElementById('add-filter');
-            if (select) {
-                select.value = defaultType;
-                this.currentFilterType = defaultType;
-                this.addNewFilterToProp();
-                select.focus();
-            }
-            return;
-        }
-        // keep event local, don't escalate farther to dom
-        e.stopPropagation();
-    }
     onSave() {
         this.filterChange.emit(this.filterItems);
     }
@@ -308,10 +287,56 @@ const FilterPanel = class {
         const currentFilter = this.filterItems[prop];
         if (!currentFilter)
             return '';
-        if (this.filterEntities[currentFilter[index$1].type].extra !== 'input')
-            return '';
+        const applyFilter = (value) => {
+            this.filterItems[prop][index$1].value = value;
+            if (!this.disableDynamicFiltering) {
+                this.debouncedApplyFilter();
+            }
+        };
+        const focusNext = () => {
+            const select = document.getElementById('add-filter');
+            if (select) {
+                select.value = defaultType;
+                this.currentFilterType = defaultType;
+                this.addNewFilterToProp();
+                select.focus();
+            }
+        };
         const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
-        return (index.h("input", { id: `filter-input-${currentFilter[index$1].id}`, placeholder: capts.placeholder, type: "text", value: currentFilter[index$1].value, onInput: this.onUserInput.bind(this, index$1, prop), onKeyDown: e => this.onKeyDown(e) }));
+        const extra = this.filterEntities[currentFilter[index$1].type].extra;
+        if (typeof extra === 'function') {
+            return extra(index.h, {
+                value: currentFilter[index$1].value,
+                filter: currentFilter[index$1],
+                prop,
+                index: index$1,
+                placeholder: capts.placeholder,
+                onInput: (value) => {
+                    applyFilter(value);
+                },
+                onFocus: () => {
+                    focusNext();
+                }
+            });
+        }
+        if (extra !== 'input' && extra !== 'datepicker') {
+            return '';
+        }
+        return (index.h("input", { id: `filter-input-${currentFilter[index$1].id}`, placeholder: capts.placeholder, type: extra === 'datepicker' ? 'date' : 'text', value: currentFilter[index$1].value, onInput: (e) => {
+                if (e.target instanceof HTMLInputElement) {
+                    applyFilter(e.target.value);
+                }
+            }, onKeyDown: e => {
+                if (e.key.toLowerCase() === 'enter') {
+                    const select = document.getElementById('add-filter');
+                    if (select) {
+                        focusNext();
+                    }
+                    return;
+                }
+                // keep event local, don't escalate farther to dom
+                e.stopPropagation();
+            } }));
     }
     render() {
         var _a, _b, _c;

package/dist/cjs/revogr-filter-panel.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"revogr-filter-panel.entry.cjs.js","mappings":"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","names":["debounce","isFilterBtn","h","index","AndOrButton","TrashButton","Host"],"sources":["src/utils/closest.polifill.ts","src/plugins/filter/filter.style.scss?tag=revogr-filter-panel","src/plugins/filter/filter.panel.tsx"],"sourcesContent":["(function closest() {\n  if (!Element.prototype.matches) {\n    Element.prototype.matches =\n      ((Element.prototype as unknown) as { msMatchesSelector: (selectors: string) => boolean }).msMatchesSelector || Element.prototype.webkitMatchesSelector;\n  }\n\n  if (!Element.prototype.closest) {\n    Element.prototype.closest = function (s: string) {\n      let el: HTMLElement | Element | (Node & ParentNode) | null = this;\n\n      do {\n        if (Element.prototype.matches.call(el, s)) {\n          return el;\n        }\n        el = el.parentElement || el.parentNode;\n      } while (el !== null && el.nodeType === 1);\n      return null;\n    };\n  }\n})();\n","revogr-filter-panel {\n  position: absolute;\n  display: block;\n  top: 0;\n  left: 0;\n  z-index: 100;\n  max-height: calc(100% - 80px);\n  min-width: 250px;\n  overflow: auto;\n\n  opacity: 1;\n  transform: none;\n  background-color: var(--revo-grid-filter-panel-bg, #fff);\n  border: 1px solid var(--revo-grid-filter-panel-border, #cecece);\n  transform-origin: 62px 0px;\n  box-shadow: 0 5px 18px -2px var(--revo-grid-filter-panel-shadow, rgba(0, 0, 0, 0.15));\n  padding: 10px;\n  border-radius: 8px;\n\n  min-width: 220px;\n  text-align: left;\n\n  .filter-holder > div {\n    display: flex;\n    flex-direction: column;\n  }\n\n  label {\n    font-size: 13px;\n    display: block;\n    padding: 8px 0;\n  }\n\n  select {\n    width: 100%;\n  }\n\n  input[type='text'] {\n    border: 0;\n    min-height: 34px;\n    margin: 5px 0;\n    background: var(--revo-grid-filter-panel-input-bg, #f3f3f3);\n    border-radius: 5px;\n    padding: 0 10px;\n    box-sizing: border-box;\n    width: 100%;\n  }\n\n  button {\n    margin-top: 10px;\n    margin-right: 5px;\n  }\n\n  .filter-actions {\n    text-align: right;\n    margin-right: -5px;\n  }\n}\n\n.rgHeaderCell {\n  &:hover .rv-filter {\n    transition:\n      opacity 267ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,\n      transform 178ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n  }\n  &:hover .rv-filter,\n  .rv-filter.active {\n    opacity: 1;\n  }\n\n  .rv-filter {\n    $btn-size: 24px;\n    height: $btn-size;\n    width: $btn-size;\n    background: none;\n    border: 0;\n    opacity: 0;\n    visibility: visible;\n    cursor: pointer;\n    border-radius: 4px;\n\n    &.active {\n      color: #10224a;\n    }\n\n    .filter-img {\n      $img-size: 11px;\n      color: gray;\n      width: $img-size;\n    }\n  }\n}\n\n.select-css {\n  $gradient: 'data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E';\n\n  display: block;\n  font-family: sans-serif;\n  line-height: 1.3;\n  padding: 0.6em 1.4em 0.5em 0.8em;\n  width: 100%;\n  max-width: 100%; /* useful when width is set to anything other than 100% */\n  box-sizing: border-box;\n  margin: 0;\n  border: 1px solid var(--revo-grid-filter-panel-select-border, #d9d9d9);\n  box-shadow: transparent;\n  border-radius: 0.5em;\n  appearance: none;\n  background-color: var(--revo-grid-filter-panel-input-bg, #f3f3f3);\n  background-image: url($gradient);\n  background-repeat: no-repeat, repeat;\n  /* arrow icon position (1em from the right, 50% vertical) , then gradient position*/\n  background-position:\n    right 0.7em top 50%,\n    0 0;\n  /* icon size, then gradient */\n  background-size:\n    0.65em auto,\n    100%;\n\n  /* Hide arrow icon in IE browsers */\n  &::-ms-expand {\n    display: none;\n  }\n  /* Hover style */\n  &:hover {\n    border-color: var(--revo-grid-filter-panel-select-border, #d9d9d9);\n  }\n  /* Focus style */\n  &:focus {\n    border-color: var(--revo-grid-filter-panel-select-border-hover, #d9d9d9);\n    box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7);\n    box-shadow: 0 0 0 3px -moz-mac-focusring;\n    outline: none;\n  }\n\n  /* Set options to normal weight */\n  option {\n    font-weight: normal;\n  }\n\n  /* Disabled styles */\n  &:disabled,\n  &[aria-disabled='true'] {\n    color: gray;\n    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),\n      linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);\n  }\n\n  &:disabled:hover,\n  &[aria-disabled='true'] {\n    border-color: var(--revo-grid-filter-panel-select-border, #d9d9d9);\n  }\n}\n\n.multi-filter-list {\n  margin-top: 5px;\n  margin-bottom: 5px;\n\n  div {\n    white-space: nowrap;\n  }\n\n  .multi-filter-list-action {\n    display: flex;\n\n    justify-content: space-between;\n    align-items: center;\n  }\n\n  .and-or-button {\n    margin: 0 0 0 10px;\n    min-width: 58px;\n    cursor: pointer;\n  }\n  .trash-button {\n    $btn-remove-size: 22px;\n    margin: 0 0 -2px 6px;\n    cursor: pointer;\n\n    width: $btn-remove-size;\n    height: 100%;\n    font-size: 16px;\n\n    .trash-img {\n      width: 1em;\n    }\n  }\n}\n\n.add-filter-divider {\n  display: block;\n  margin: 0 -10px 10px -10px;\n\n  border-bottom: 1px solid var(--revo-grid-filter-panel-divider, #d9d9d9);\n  height: 10px;\n}\n\n.select-input {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n","// filter.panel.tsx\n\nimport {\n  h,\n  Component,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  type VNode,\n  Element,\n} from '@stencil/core';\nimport debounce from 'lodash/debounce';\n\nimport { AndOrButton, isFilterBtn, TrashButton } from './filter.button';\nimport '../../utils/closest.polifill';\nimport {\n  FilterCaptions,\n  LogicFunction,\n  MultiFilterItem,\n  ShowData,\n} from './filter.types';\nimport type { ColumnProp } from '@type';\nimport { FilterType } from './filter.indexed';\n\nconst defaultType: FilterType = 'none';\n\nconst FILTER_LIST_CLASS = 'multi-filter-list';\nconst FILTER_LIST_CLASS_ACTION = 'multi-filter-list-action';\nconst FILTER_ID = 'add-filter';\n\n/**\n * Filter panel for editing filters\n */\n/**\n * @internal\n */\n@Component({\n  tag: 'revogr-filter-panel',\n  styleUrl: 'filter.style.scss',\n})\nexport class FilterPanel {\n  private filterCaptionsInternal: FilterCaptions = {\n    title: 'Filter by',\n    ok: 'Ok',\n    save: 'Save',\n    // drops the filter\n    reset: 'Reset',\n    cancel: 'Cancel',\n    add: 'Add condition',\n    placeholder: 'Enter value...',\n    and: 'and',\n    or: 'or',\n  };\n\n  @Element() element!: HTMLElement;\n  @State() isFilterIdSet = false;\n  @State() filterId = 0;\n  @State() currentFilterId = -1;\n  @State() currentFilterType: FilterType = defaultType;\n  @State() changes: ShowData | undefined;\n  @State() filterItems: MultiFilterItem = {};\n  @Prop() filterNames: Record<string, string> = {};\n  @Prop() filterEntities: Record<string, LogicFunction> = {};\n  @Prop() filterCaptions: Partial<FilterCaptions> | undefined;\n  /**\n   * Disables dynamic filtering. A way to apply filters on Save only\n   */\n  @Prop() disableDynamicFiltering = false;\n  @Event() filterChange: EventEmitter<MultiFilterItem>;\n  @Event() resetChange: EventEmitter<ColumnProp>;\n\n  @Listen('mousedown', { target: 'document' }) onMouseDown(e: MouseEvent) {\n    // click on anything then select drops values to default\n    if (!this.changes || e.defaultPrevented) {\n      return;\n    }\n    const path = e.composedPath();\n    const select = document.getElementById(FILTER_ID);\n    if (select instanceof HTMLSelectElement) {\n      // click on select should be skipped\n      if (path.includes(select)) {\n        return;\n      }\n      select.value = defaultType;\n    }\n    this.currentFilterType = defaultType;\n    if (this.changes) {\n      this.changes.type = defaultType;\n    }\n    this.currentFilterId = -1;\n\n    const isOutside = !path.includes(this.element);\n\n    if (\n      e.target instanceof HTMLElement &&\n      isOutside &&\n      !isFilterBtn(e.target)\n    ) {\n      this.changes = undefined;\n    }\n  }\n\n  @Method() async show(newEntity?: ShowData) {\n    this.changes = newEntity;\n    this.filterItems = newEntity?.filterItems || {};\n    if (this.changes) {\n      this.changes.type = this.changes.type || defaultType;\n    }\n  }\n\n  @Method() async getChanges() {\n    return this.changes;\n  }\n\n  componentWillRender() {\n    if (!this.isFilterIdSet) {\n      this.isFilterIdSet = true;\n      const filterItems = Object.keys(this.filterItems);\n      for (const prop of filterItems) {\n        // we set the proper filterId so there won't be any conflict when removing filters\n        this.filterId += this.filterItems[prop].length;\n      }\n    }\n  }\n\n  getFilterItemsList() {\n    const prop = this.changes?.prop;\n    if (typeof prop === 'undefined') return '';\n\n    const propFilters = this.filterItems[prop] ?? [];\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n    return (\n      <div key={this.filterId}>\n        {propFilters.map((filter, index) => {\n          let andOrButton;\n          if (filter.hidden) {\n            return;\n          }\n\n          // hide toggle button if there is only one filter and the last one\n          if (index !== this.filterItems[prop].length - 1) {\n            andOrButton = (\n              <div onClick={() => this.toggleFilterAndOr(filter.id)}>\n                <AndOrButton\n                  text={filter.relation === 'and' ? capts.and : capts.or}\n                />\n              </div>\n            );\n          }\n\n          return (\n            <div key={filter.id} class={FILTER_LIST_CLASS}>\n              <div class={{ 'select-input': true }}>\n                <select\n                  class=\"select-css select-filter\"\n                  onChange={e => this.onFilterTypeChange(e, prop, index)}\n                >\n                  {this.renderSelectOptions(\n                    this.filterItems[prop][index].type,\n                    true,\n                  )}\n                </select>\n                <div class={FILTER_LIST_CLASS_ACTION}>{andOrButton}</div>\n                <div onClick={() => this.onRemoveFilter(filter.id)}>\n                  <TrashButton />\n                </div>\n              </div>\n              <div>{this.renderExtra(prop, index)}</div>\n            </div>\n          );\n        })}\n\n        {propFilters.filter(f => !f.hidden).length > 0 ? <div class=\"add-filter-divider\" /> : ''}\n      </div>\n    );\n  }\n\n  private autoCorrect(el?: HTMLElement | null) {\n    if (!el) {\n      return;\n    }\n    const pos = el.getBoundingClientRect();\n    const maxLeft = window.innerWidth - pos.width;\n\n    if (pos.left > maxLeft && el.offsetLeft) {\n      el.style.left = `${maxLeft - (el.parentElement?.getBoundingClientRect().left ?? 0)}px`;\n    }\n  }\n\n  private onFilterTypeChange(e: Event, prop: ColumnProp, index: number) {\n    if (!(e.target instanceof HTMLSelectElement)) {\n      return;\n    }\n    this.filterItems[prop][index].type = e.target.value as FilterType;\n\n    // this re-renders the input to know if we need extra input\n    this.filterId++;\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.filterItems[prop][index].id,\n      );\n      if (input instanceof HTMLInputElement) {\n        input.focus();\n      }\n    }, 0);\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private debouncedApplyFilter = debounce(() => {\n    this.filterChange.emit(this.filterItems);\n  }, 400);\n\n  private onAddNewFilter(e: Event) {\n    const el = e.target as HTMLSelectElement;\n    this.currentFilterType = el.value as FilterType;\n    this.addNewFilterToProp();\n\n    // reset value after adding new filter\n    const select = document.getElementById('add-filter') as HTMLSelectElement;\n    if (select) {\n      select.value = defaultType;\n      this.currentFilterType = defaultType;\n    }\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private addNewFilterToProp() {\n    const prop = this.changes?.prop;\n    if (!(prop || prop === 0)) return;\n\n    if (!this.filterItems[prop]) {\n      this.filterItems[prop] = [];\n    }\n\n    if (this.currentFilterType === 'none') return;\n\n    this.filterId++;\n    this.currentFilterId = this.filterId;\n\n    this.filterItems[prop].push({\n      id: this.currentFilterId,\n      type: this.currentFilterType,\n      value: '',\n      relation: 'and',\n    });\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.currentFilterId,\n      ) as HTMLInputElement;\n      if (input) input.focus();\n    }, 0);\n  }\n\n  private onUserInput(index: number, prop: ColumnProp, event: Event) {\n    // update the value of the filter item\n    this.filterItems[prop][index].value = (\n      event.target as HTMLInputElement\n    ).value;\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private onKeyDown(e: KeyboardEvent) {\n    if (e.key.toLowerCase() === 'enter') {\n      const select = document.getElementById('add-filter') as HTMLSelectElement;\n      if (select) {\n        select.value = defaultType;\n        this.currentFilterType = defaultType;\n        this.addNewFilterToProp();\n        select.focus();\n      }\n      return;\n    }\n    // keep event local, don't escalate farther to dom\n    e.stopPropagation();\n  }\n\n  private onSave() {\n    this.filterChange.emit(this.filterItems);\n  }\n\n  private onCancel() {\n    this.changes = undefined;\n  }\n\n  private onReset() {\n    this.assertChanges();\n\n    this.resetChange.emit(this.changes?.prop);\n\n    // this updates the DOM which is used by getFilterItemsList() key\n    this.filterId++;\n  }\n\n  private onRemoveFilter(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n    items.splice(index, 1);\n\n    // let's remove the prop if no more filters so the filter icon will be removed\n    if (items.length === 0) delete this.filterItems[prop ?? ''];\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private toggleFilterAndOr(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n\n    items[index].relation = items[index].relation === 'and' ? 'or' : 'and';\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private assertChanges() {\n    if (!this.changes) {\n      throw new Error('Changes required per edit');\n    }\n  }\n\n  renderSelectOptions(type: FilterType, isDefaultTypeRemoved = false) {\n    if (!this.changes) {\n      return;\n    }\n    const options: VNode[] = [];\n    const prop = this.changes.prop;\n\n    const hidden = new Set<string>();\n    Object.entries(this.filterItems).forEach(([_, values]) => {\n      values.forEach((filter) => {\n        if (filter.hidden) {\n          hidden.add(filter.type);\n        }\n      })\n    });\n\n    if (!isDefaultTypeRemoved) {\n      const capts = Object.assign(\n        this.filterCaptionsInternal,\n        this.filterCaptions,\n      );\n\n      options.push(\n        <option\n          selected={this.currentFilterType === defaultType}\n          value={defaultType}\n        >\n          {prop && this.filterItems[prop] && this.filterItems[prop].length > 0\n            ? capts.add\n            : this.filterNames[defaultType]}\n        </option>,\n      );\n    }\n\n    for (let gIndex in this.changes.filterTypes) {\n      const group = this.changes.filterTypes[gIndex].filter(k => !hidden.has(k));\n      if (group.length) {\n        options.push(\n          ...group.map(k => (\n            <option value={k} selected={type === k}>\n              {this.filterNames[k]}\n            </option>\n          )),\n        );\n        options.push(<option disabled></option>);\n      }\n    }\n    return options;\n  }\n\n  renderExtra(prop: ColumnProp, index: number) {\n    const currentFilter = this.filterItems[prop];\n\n    if (!currentFilter) return '';\n\n    if (this.filterEntities[currentFilter[index].type].extra !== 'input')\n      return '';\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n\n    return (\n      <input\n        id={`filter-input-${currentFilter[index].id}`}\n        placeholder={capts.placeholder}\n        type=\"text\"\n        value={currentFilter[index].value}\n        onInput={this.onUserInput.bind(this, index, prop)}\n        onKeyDown={e => this.onKeyDown(e)}\n      />\n    );\n  }\n\n  render() {\n    if (!this.changes) {\n      return <Host style={{ display: 'none' }}></Host>;\n    }\n    const style = {\n      display: 'block',\n      left: `${this.changes.x}px`,\n      top: `${this.changes.y}px`,\n    };\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n\n    return (\n      <Host\n        style={style}\n        ref={el => {\n          this.changes?.autoCorrect && this.autoCorrect(el);\n        }}\n      >\n        <slot slot=\"header\" />\n        { this.changes.extraContent?.(this.changes) || '' }\n\n        { this.changes?.hideDefaultFilters !== true && (\n          [\n            <label>{capts.title}</label>,\n            <div class=\"filter-holder\">{this.getFilterItemsList()}</div>,\n            <div class=\"add-filter\">\n              <select\n                id={FILTER_ID}\n                class=\"select-css\"\n                onChange={e => this.onAddNewFilter(e)}\n              >\n                {this.renderSelectOptions(this.currentFilterType)}\n              </select>\n            </div>\n          ]\n        )}\n\n        <slot />\n        <div class=\"filter-actions\">\n          {this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-save\"\n              aria-label=\"save\"\n              class=\"revo-button green\"\n              onClick={() => this.onSave()}\n            >\n              {capts.save}\n            </button>,\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.cancel}\n            </button>,\n          ]}\n          {!this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.ok}\n            </button>,\n\n            <button\n              id=\"revo-button-reset\"\n              aria-label=\"reset\"\n              class=\"revo-button outline\"\n              onClick={() => this.onReset()}\n            >\n              {capts.reset}\n            </button>,\n          ]}\n        </div>\n        <slot slot=\"footer\" />\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"revogr-filter-panel.entry.cjs.js","mappings":"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","names":["debounce","isFilterBtn","h","index","AndOrButton","TrashButton","Host"],"sources":["src/utils/closest.polifill.ts","src/plugins/filter/filter.style.scss?tag=revogr-filter-panel","src/plugins/filter/filter.panel.tsx"],"sourcesContent":["(function closest() {\n  if (!Element.prototype.matches) {\n    Element.prototype.matches =\n      ((Element.prototype as unknown) as { msMatchesSelector: (selectors: string) => boolean }).msMatchesSelector || Element.prototype.webkitMatchesSelector;\n  }\n\n  if (!Element.prototype.closest) {\n    Element.prototype.closest = function (s: string) {\n      let el: HTMLElement | Element | (Node & ParentNode) | null = this;\n\n      do {\n        if (Element.prototype.matches.call(el, s)) {\n          return el;\n        }\n        el = el.parentElement || el.parentNode;\n      } while (el !== null && el.nodeType === 1);\n      return null;\n    };\n  }\n})();\n","revogr-filter-panel {\n  position: absolute;\n  display: block;\n  top: 0;\n  left: 0;\n  z-index: 100;\n  max-height: calc(100% - 80px);\n  min-width: 250px;\n  overflow: auto;\n\n  opacity: 1;\n  transform: none;\n  background-color: var(--revo-grid-filter-panel-bg, #fff);\n  border: 1px solid var(--revo-grid-filter-panel-border, #cecece);\n  transform-origin: 62px 0px;\n  box-shadow: 0 5px 18px -2px var(--revo-grid-filter-panel-shadow, rgba(0, 0, 0, 0.15));\n  padding: 10px;\n  border-radius: 8px;\n\n  min-width: 220px;\n  text-align: left;\n\n  .filter-holder > div {\n    display: flex;\n    flex-direction: column;\n  }\n\n  label {\n    font-size: 13px;\n    display: block;\n    padding: 8px 0;\n  }\n\n  select {\n    width: 100%;\n  }\n\n  input[type='text'] {\n    border: 0;\n    min-height: 34px;\n    margin: 5px 0;\n    background: var(--revo-grid-filter-panel-input-bg, #f3f3f3);\n    border-radius: 5px;\n    padding: 0 10px;\n    box-sizing: border-box;\n    width: 100%;\n  }\n\n  button {\n    margin-top: 10px;\n    margin-right: 5px;\n  }\n\n  .filter-actions {\n    text-align: right;\n    margin-right: -5px;\n  }\n}\n\n.rgHeaderCell {\n  &:hover .rv-filter {\n    transition:\n      opacity 267ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,\n      transform 178ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n  }\n  &:hover .rv-filter,\n  .rv-filter.active {\n    opacity: 1;\n  }\n\n  .rv-filter {\n    $btn-size: 24px;\n    height: $btn-size;\n    width: $btn-size;\n    background: none;\n    border: 0;\n    opacity: 0;\n    visibility: visible;\n    cursor: pointer;\n    border-radius: 4px;\n\n    &.active {\n      color: #10224a;\n    }\n\n    .filter-img {\n      $img-size: 11px;\n      color: gray;\n      width: $img-size;\n    }\n  }\n}\n\n.select-css {\n  $gradient: 'data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E';\n\n  display: block;\n  font-family: sans-serif;\n  line-height: 1.3;\n  padding: 0.6em 1.4em 0.5em 0.8em;\n  width: 100%;\n  max-width: 100%; /* useful when width is set to anything other than 100% */\n  box-sizing: border-box;\n  margin: 0;\n  border: 1px solid var(--revo-grid-filter-panel-select-border, #d9d9d9);\n  box-shadow: transparent;\n  border-radius: 0.5em;\n  appearance: none;\n  background-color: var(--revo-grid-filter-panel-input-bg, #f3f3f3);\n  background-image: url($gradient);\n  background-repeat: no-repeat, repeat;\n  /* arrow icon position (1em from the right, 50% vertical) , then gradient position*/\n  background-position:\n    right 0.7em top 50%,\n    0 0;\n  /* icon size, then gradient */\n  background-size:\n    0.65em auto,\n    100%;\n\n  /* Hide arrow icon in IE browsers */\n  &::-ms-expand {\n    display: none;\n  }\n  /* Hover style */\n  &:hover {\n    border-color: var(--revo-grid-filter-panel-select-border, #d9d9d9);\n  }\n  /* Focus style */\n  &:focus {\n    border-color: var(--revo-grid-filter-panel-select-border-hover, #d9d9d9);\n    box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7);\n    box-shadow: 0 0 0 3px -moz-mac-focusring;\n    outline: none;\n  }\n\n  /* Set options to normal weight */\n  option {\n    font-weight: normal;\n  }\n\n  /* Disabled styles */\n  &:disabled,\n  &[aria-disabled='true'] {\n    color: gray;\n    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22graytext%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),\n      linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);\n  }\n\n  &:disabled:hover,\n  &[aria-disabled='true'] {\n    border-color: var(--revo-grid-filter-panel-select-border, #d9d9d9);\n  }\n}\n\n.multi-filter-list {\n  margin-top: 5px;\n  margin-bottom: 5px;\n\n  div {\n    white-space: nowrap;\n  }\n\n  .multi-filter-list-action {\n    display: flex;\n\n    justify-content: space-between;\n    align-items: center;\n  }\n\n  .and-or-button {\n    margin: 0 0 0 10px;\n    min-width: 58px;\n    cursor: pointer;\n  }\n  .trash-button {\n    $btn-remove-size: 22px;\n    margin: 0 0 -2px 6px;\n    cursor: pointer;\n\n    width: $btn-remove-size;\n    height: 100%;\n    font-size: 16px;\n\n    .trash-img {\n      width: 1em;\n    }\n  }\n}\n\n.add-filter-divider {\n  display: block;\n  margin: 0 -10px 10px -10px;\n\n  border-bottom: 1px solid var(--revo-grid-filter-panel-divider, #d9d9d9);\n  height: 10px;\n}\n\n.select-input {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n","// filter.panel.tsx\n\nimport {\n  h,\n  Component,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  type VNode,\n  Element,\n} from '@stencil/core';\nimport debounce from 'lodash/debounce';\n\nimport { AndOrButton, isFilterBtn, TrashButton } from './filter.button';\nimport '../../utils/closest.polifill';\nimport {\n  FilterCaptions,\n  LogicFunction,\n  MultiFilterItem,\n  ShowData,\n} from './filter.types';\nimport type { ColumnProp } from '@type';\nimport { FilterType } from './filter.indexed';\n\nconst defaultType: FilterType = 'none';\n\nconst FILTER_LIST_CLASS = 'multi-filter-list';\nconst FILTER_LIST_CLASS_ACTION = 'multi-filter-list-action';\nconst FILTER_ID = 'add-filter';\n\n/**\n * Filter panel for editing filters\n */\n/**\n * @internal\n */\n@Component({\n  tag: 'revogr-filter-panel',\n  styleUrl: 'filter.style.scss',\n})\nexport class FilterPanel {\n  private filterCaptionsInternal: FilterCaptions = {\n    title: 'Filter by',\n    ok: 'Ok',\n    save: 'Save',\n    // drops the filter\n    reset: 'Reset',\n    cancel: 'Cancel',\n    add: 'Add condition',\n    placeholder: 'Enter value...',\n    and: 'and',\n    or: 'or',\n  };\n\n  @Element() element!: HTMLElement;\n  @State() isFilterIdSet = false;\n  @State() filterId = 0;\n  @State() currentFilterId = -1;\n  @State() currentFilterType: FilterType = defaultType;\n  @State() changes: ShowData | undefined;\n  @State() filterItems: MultiFilterItem = {};\n  @Prop() filterNames: Record<string, string> = {};\n  @Prop() filterEntities: Record<string, LogicFunction> = {};\n  @Prop() filterCaptions: Partial<FilterCaptions> | undefined;\n  /**\n   * Disables dynamic filtering. A way to apply filters on Save only\n   */\n  @Prop() disableDynamicFiltering = false;\n  @Event() filterChange: EventEmitter<MultiFilterItem>;\n  @Event() resetChange: EventEmitter<ColumnProp>;\n\n  @Listen('mousedown', { target: 'document' }) onMouseDown(e: MouseEvent) {\n    // click on anything then select drops values to default\n    if (!this.changes || e.defaultPrevented) {\n      return;\n    }\n    const path = e.composedPath();\n    const select = document.getElementById(FILTER_ID);\n    if (select instanceof HTMLSelectElement) {\n      // click on select should be skipped\n      if (path.includes(select)) {\n        return;\n      }\n      select.value = defaultType;\n    }\n    this.currentFilterType = defaultType;\n    if (this.changes) {\n      this.changes.type = defaultType;\n    }\n    this.currentFilterId = -1;\n\n    const isOutside = !path.includes(this.element);\n\n    if (\n      e.target instanceof HTMLElement &&\n      isOutside &&\n      !isFilterBtn(e.target)\n    ) {\n      this.changes = undefined;\n    }\n  }\n\n  @Method() async show(newEntity?: ShowData) {\n    this.changes = newEntity;\n    this.filterItems = newEntity?.filterItems || {};\n    if (this.changes) {\n      this.changes.type = this.changes.type || defaultType;\n    }\n  }\n\n  @Method() async getChanges() {\n    return this.changes;\n  }\n\n  componentWillRender() {\n    if (!this.isFilterIdSet) {\n      this.isFilterIdSet = true;\n      const filterItems = Object.keys(this.filterItems);\n      for (const prop of filterItems) {\n        // we set the proper filterId so there won't be any conflict when removing filters\n        this.filterId += this.filterItems[prop].length;\n      }\n    }\n  }\n\n  getFilterItemsList() {\n    const prop = this.changes?.prop;\n    if (typeof prop === 'undefined') return '';\n\n    const propFilters = this.filterItems[prop] ?? [];\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n    return (\n      <div key={this.filterId}>\n        {propFilters.map((filter, index) => {\n          let andOrButton;\n          if (filter.hidden) {\n            return;\n          }\n\n          // hide toggle button if there is only one filter and the last one\n          if (index !== this.filterItems[prop].length - 1) {\n            andOrButton = (\n              <div onClick={() => this.toggleFilterAndOr(filter.id)}>\n                <AndOrButton\n                  text={filter.relation === 'and' ? capts.and : capts.or}\n                />\n              </div>\n            );\n          }\n\n          return (\n            <div key={filter.id} class={FILTER_LIST_CLASS}>\n              <div class={{ 'select-input': true }}>\n                <select\n                  class=\"select-css select-filter\"\n                  onChange={e => this.onFilterTypeChange(e, prop, index)}\n                >\n                  {this.renderSelectOptions(\n                    this.filterItems[prop][index].type,\n                    true,\n                  )}\n                </select>\n                <div class={FILTER_LIST_CLASS_ACTION}>{andOrButton}</div>\n                <div onClick={() => this.onRemoveFilter(filter.id)}>\n                  <TrashButton />\n                </div>\n              </div>\n              <div>{this.renderExtra(prop, index)}</div>\n            </div>\n          );\n        })}\n\n        {propFilters.filter(f => !f.hidden).length > 0 ? <div class=\"add-filter-divider\" /> : ''}\n      </div>\n    );\n  }\n\n  private autoCorrect(el?: HTMLElement | null) {\n    if (!el) {\n      return;\n    }\n    const pos = el.getBoundingClientRect();\n    const maxLeft = window.innerWidth - pos.width;\n\n    if (pos.left > maxLeft && el.offsetLeft) {\n      el.style.left = `${maxLeft - (el.parentElement?.getBoundingClientRect().left ?? 0)}px`;\n    }\n  }\n\n  private onFilterTypeChange(e: Event, prop: ColumnProp, index: number) {\n    if (!(e.target instanceof HTMLSelectElement)) {\n      return;\n    }\n    this.filterItems[prop][index].type = e.target.value as FilterType;\n\n    // this re-renders the input to know if we need extra input\n    this.filterId++;\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.filterItems[prop][index].id,\n      );\n      if (input instanceof HTMLInputElement) {\n        input.focus();\n      }\n    }, 0);\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private debouncedApplyFilter = debounce(() => {\n    this.filterChange.emit(this.filterItems);\n  }, 400);\n\n  private onAddNewFilter(e: Event) {\n    const el = e.target as HTMLSelectElement;\n    this.currentFilterType = el.value as FilterType;\n    this.addNewFilterToProp();\n\n    // reset value after adding new filter\n    const select = document.getElementById('add-filter') as HTMLSelectElement;\n    if (select) {\n      select.value = defaultType;\n      this.currentFilterType = defaultType;\n    }\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private addNewFilterToProp() {\n    const prop = this.changes?.prop;\n    if (!(prop || prop === 0)) return;\n\n    if (!this.filterItems[prop]) {\n      this.filterItems[prop] = [];\n    }\n\n    if (this.currentFilterType === 'none') return;\n\n    this.filterId++;\n    this.currentFilterId = this.filterId;\n\n    this.filterItems[prop].push({\n      id: this.currentFilterId,\n      type: this.currentFilterType,\n      value: '',\n      relation: 'and',\n    });\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.currentFilterId,\n      ) as HTMLInputElement;\n      if (input) input.focus();\n    }, 0);\n  }\n\n  private onSave() {\n    this.filterChange.emit(this.filterItems);\n  }\n\n  private onCancel() {\n    this.changes = undefined;\n  }\n\n  private onReset() {\n    this.assertChanges();\n\n    this.resetChange.emit(this.changes?.prop);\n\n    // this updates the DOM which is used by getFilterItemsList() key\n    this.filterId++;\n  }\n\n  private onRemoveFilter(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n    items.splice(index, 1);\n\n    // let's remove the prop if no more filters so the filter icon will be removed\n    if (items.length === 0) delete this.filterItems[prop ?? ''];\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private toggleFilterAndOr(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n\n    items[index].relation = items[index].relation === 'and' ? 'or' : 'and';\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private assertChanges() {\n    if (!this.changes) {\n      throw new Error('Changes required per edit');\n    }\n  }\n\n  renderSelectOptions(type: FilterType, isDefaultTypeRemoved = false) {\n    if (!this.changes) {\n      return;\n    }\n    const options: VNode[] = [];\n    const prop = this.changes.prop;\n\n    const hidden = new Set<string>();\n    Object.entries(this.filterItems).forEach(([_, values]) => {\n      values.forEach((filter) => {\n        if (filter.hidden) {\n          hidden.add(filter.type);\n        }\n      })\n    });\n\n    if (!isDefaultTypeRemoved) {\n      const capts = Object.assign(\n        this.filterCaptionsInternal,\n        this.filterCaptions,\n      );\n\n      options.push(\n        <option\n          selected={this.currentFilterType === defaultType}\n          value={defaultType}\n        >\n          {prop && this.filterItems[prop] && this.filterItems[prop].length > 0\n            ? capts.add\n            : this.filterNames[defaultType]}\n        </option>,\n      );\n    }\n\n    for (let gIndex in this.changes.filterTypes) {\n      const group = this.changes.filterTypes[gIndex].filter(k => !hidden.has(k));\n      if (group.length) {\n        options.push(\n          ...group.map(k => (\n            <option value={k} selected={type === k}>\n              {this.filterNames[k]}\n            </option>\n          )),\n        );\n        options.push(<option disabled></option>);\n      }\n    }\n    return options;\n  }\n\n  renderExtra(prop: ColumnProp, index: number) {\n    const currentFilter = this.filterItems[prop];\n\n    if (!currentFilter) return '';\n\n    const applyFilter = (value?: any) => {\n      this.filterItems[prop][index].value = value;\n      if (!this.disableDynamicFiltering) {\n        this.debouncedApplyFilter();\n      }\n    };\n\n    const focusNext = () => {\n      const select = document.getElementById('add-filter') as HTMLSelectElement;\n      if (select) {\n        select.value = defaultType;\n        this.currentFilterType = defaultType;\n        this.addNewFilterToProp();\n        select.focus();\n      }\n    };\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n    const extra = this.filterEntities[currentFilter[index].type].extra;\n    if (typeof extra === 'function') {\n      return extra(h, {\n        value: currentFilter[index].value,\n        filter: currentFilter[index],\n        prop,\n        index,\n        placeholder: capts.placeholder,\n        onInput: (value: any) => {\n          applyFilter(value);\n        },\n        onFocus: () => {\n          focusNext();\n        }\n      });\n    }\n    if (extra !== 'input' && extra !== 'datepicker') {\n      return '';\n    }\n    return (\n      <input\n        id={`filter-input-${currentFilter[index].id}`}\n        placeholder={capts.placeholder}\n        type={extra === 'datepicker' ? 'date' : 'text'}\n        value={currentFilter[index].value}\n        onInput={(e) => {\n          if (e.target instanceof HTMLInputElement) {\n            applyFilter(e.target.value);\n          }\n        }}\n        onKeyDown={e => {\n          if (e.key.toLowerCase() === 'enter') {\n            const select = document.getElementById('add-filter') as HTMLSelectElement;\n            if (select) {\n              focusNext();\n            }\n            return;\n          }\n          // keep event local, don't escalate farther to dom\n          e.stopPropagation();\n        }}\n      />\n    );\n  }\n\n  render() {\n    if (!this.changes) {\n      return <Host style={{ display: 'none' }}></Host>;\n    }\n    const style = {\n      display: 'block',\n      left: `${this.changes.x}px`,\n      top: `${this.changes.y}px`,\n    };\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n\n    return (\n      <Host\n        style={style}\n        ref={el => {\n          this.changes?.autoCorrect && this.autoCorrect(el);\n        }}\n      >\n        <slot slot=\"header\" />\n        { this.changes.extraContent?.(this.changes) || '' }\n\n        { this.changes?.hideDefaultFilters !== true && (\n          [\n            <label>{capts.title}</label>,\n            <div class=\"filter-holder\">{this.getFilterItemsList()}</div>,\n            <div class=\"add-filter\">\n              <select\n                id={FILTER_ID}\n                class=\"select-css\"\n                onChange={e => this.onAddNewFilter(e)}\n              >\n                {this.renderSelectOptions(this.currentFilterType)}\n              </select>\n            </div>\n          ]\n        )}\n\n        <slot />\n        <div class=\"filter-actions\">\n          {this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-save\"\n              aria-label=\"save\"\n              class=\"revo-button green\"\n              onClick={() => this.onSave()}\n            >\n              {capts.save}\n            </button>,\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.cancel}\n            </button>,\n          ]}\n          {!this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.ok}\n            </button>,\n\n            <button\n              id=\"revo-button-reset\"\n              aria-label=\"reset\"\n              class=\"revo-button outline\"\n              onClick={() => this.onReset()}\n            >\n              {capts.reset}\n            </button>,\n          ]}\n        </div>\n        <slot slot=\"footer\" />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/collection/plugins/filter/filter.panel.js

@@ -177,27 +177,6 @@ export class FilterPanel {
                 input.focus();
         }, 0);
     }
-    onUserInput(index, prop, event) {
-        // update the value of the filter item
-        this.filterItems[prop][index].value = event.target.value;
-        if (!this.disableDynamicFiltering) {
-            this.debouncedApplyFilter();
-        }
-    }
-    onKeyDown(e) {
-        if (e.key.toLowerCase() === 'enter') {
-            const select = document.getElementById('add-filter');
-            if (select) {
-                select.value = defaultType;
-                this.currentFilterType = defaultType;
-                this.addNewFilterToProp();
-                select.focus();
-            }
-            return;
-        }
-        // keep event local, don't escalate farther to dom
-        e.stopPropagation();
-    }
     onSave() {
         this.filterChange.emit(this.filterItems);
     }
@@ -286,10 +265,56 @@ export class FilterPanel {
         const currentFilter = this.filterItems[prop];
         if (!currentFilter)
             return '';
-        if (this.filterEntities[currentFilter[index].type].extra !== 'input')
-            return '';
+        const applyFilter = (value) => {
+            this.filterItems[prop][index].value = value;
+            if (!this.disableDynamicFiltering) {
+                this.debouncedApplyFilter();
+            }
+        };
+        const focusNext = () => {
+            const select = document.getElementById('add-filter');
+            if (select) {
+                select.value = defaultType;
+                this.currentFilterType = defaultType;
+                this.addNewFilterToProp();
+                select.focus();
+            }
+        };
         const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
-        return (h("input", { id: `filter-input-${currentFilter[index].id}`, placeholder: capts.placeholder, type: "text", value: currentFilter[index].value, onInput: this.onUserInput.bind(this, index, prop), onKeyDown: e => this.onKeyDown(e) }));
+        const extra = this.filterEntities[currentFilter[index].type].extra;
+        if (typeof extra === 'function') {
+            return extra(h, {
+                value: currentFilter[index].value,
+                filter: currentFilter[index],
+                prop,
+                index,
+                placeholder: capts.placeholder,
+                onInput: (value) => {
+                    applyFilter(value);
+                },
+                onFocus: () => {
+                    focusNext();
+                }
+            });
+        }
+        if (extra !== 'input' && extra !== 'datepicker') {
+            return '';
+        }
+        return (h("input", { id: `filter-input-${currentFilter[index].id}`, placeholder: capts.placeholder, type: extra === 'datepicker' ? 'date' : 'text', value: currentFilter[index].value, onInput: (e) => {
+                if (e.target instanceof HTMLInputElement) {
+                    applyFilter(e.target.value);
+                }
+            }, onKeyDown: e => {
+                if (e.key.toLowerCase() === 'enter') {
+                    const select = document.getElementById('add-filter');
+                    if (select) {
+                        focusNext();
+                    }
+                    return;
+                }
+                // keep event local, don't escalate farther to dom
+                e.stopPropagation();
+            } }));
     }
     render() {
         var _a, _b, _c;

package/dist/collection/plugins/filter/filter.panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter.panel.js","sourceRoot":"","sources":["../../../src/plugins/filter/filter.panel.tsx"],"names":[],"mappings":"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","sourcesContent":["// filter.panel.tsx\n\nimport {\n  h,\n  Component,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  type VNode,\n  Element,\n} from '@stencil/core';\nimport debounce from 'lodash/debounce';\n\nimport { AndOrButton, isFilterBtn, TrashButton } from './filter.button';\nimport '../../utils/closest.polifill';\nimport {\n  FilterCaptions,\n  LogicFunction,\n  MultiFilterItem,\n  ShowData,\n} from './filter.types';\nimport type { ColumnProp } from '@type';\nimport { FilterType } from './filter.indexed';\n\nconst defaultType: FilterType = 'none';\n\nconst FILTER_LIST_CLASS = 'multi-filter-list';\nconst FILTER_LIST_CLASS_ACTION = 'multi-filter-list-action';\nconst FILTER_ID = 'add-filter';\n\n/**\n * Filter panel for editing filters\n */\n/**\n * @internal\n */\n@Component({\n  tag: 'revogr-filter-panel',\n  styleUrl: 'filter.style.scss',\n})\nexport class FilterPanel {\n  private filterCaptionsInternal: FilterCaptions = {\n    title: 'Filter by',\n    ok: 'Ok',\n    save: 'Save',\n    // drops the filter\n    reset: 'Reset',\n    cancel: 'Cancel',\n    add: 'Add condition',\n    placeholder: 'Enter value...',\n    and: 'and',\n    or: 'or',\n  };\n\n  @Element() element!: HTMLElement;\n  @State() isFilterIdSet = false;\n  @State() filterId = 0;\n  @State() currentFilterId = -1;\n  @State() currentFilterType: FilterType = defaultType;\n  @State() changes: ShowData | undefined;\n  @State() filterItems: MultiFilterItem = {};\n  @Prop() filterNames: Record<string, string> = {};\n  @Prop() filterEntities: Record<string, LogicFunction> = {};\n  @Prop() filterCaptions: Partial<FilterCaptions> | undefined;\n  /**\n   * Disables dynamic filtering. A way to apply filters on Save only\n   */\n  @Prop() disableDynamicFiltering = false;\n  @Event() filterChange: EventEmitter<MultiFilterItem>;\n  @Event() resetChange: EventEmitter<ColumnProp>;\n\n  @Listen('mousedown', { target: 'document' }) onMouseDown(e: MouseEvent) {\n    // click on anything then select drops values to default\n    if (!this.changes || e.defaultPrevented) {\n      return;\n    }\n    const path = e.composedPath();\n    const select = document.getElementById(FILTER_ID);\n    if (select instanceof HTMLSelectElement) {\n      // click on select should be skipped\n      if (path.includes(select)) {\n        return;\n      }\n      select.value = defaultType;\n    }\n    this.currentFilterType = defaultType;\n    if (this.changes) {\n      this.changes.type = defaultType;\n    }\n    this.currentFilterId = -1;\n\n    const isOutside = !path.includes(this.element);\n\n    if (\n      e.target instanceof HTMLElement &&\n      isOutside &&\n      !isFilterBtn(e.target)\n    ) {\n      this.changes = undefined;\n    }\n  }\n\n  @Method() async show(newEntity?: ShowData) {\n    this.changes = newEntity;\n    this.filterItems = newEntity?.filterItems || {};\n    if (this.changes) {\n      this.changes.type = this.changes.type || defaultType;\n    }\n  }\n\n  @Method() async getChanges() {\n    return this.changes;\n  }\n\n  componentWillRender() {\n    if (!this.isFilterIdSet) {\n      this.isFilterIdSet = true;\n      const filterItems = Object.keys(this.filterItems);\n      for (const prop of filterItems) {\n        // we set the proper filterId so there won't be any conflict when removing filters\n        this.filterId += this.filterItems[prop].length;\n      }\n    }\n  }\n\n  getFilterItemsList() {\n    const prop = this.changes?.prop;\n    if (typeof prop === 'undefined') return '';\n\n    const propFilters = this.filterItems[prop] ?? [];\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n    return (\n      <div key={this.filterId}>\n        {propFilters.map((filter, index) => {\n          let andOrButton;\n          if (filter.hidden) {\n            return;\n          }\n\n          // hide toggle button if there is only one filter and the last one\n          if (index !== this.filterItems[prop].length - 1) {\n            andOrButton = (\n              <div onClick={() => this.toggleFilterAndOr(filter.id)}>\n                <AndOrButton\n                  text={filter.relation === 'and' ? capts.and : capts.or}\n                />\n              </div>\n            );\n          }\n\n          return (\n            <div key={filter.id} class={FILTER_LIST_CLASS}>\n              <div class={{ 'select-input': true }}>\n                <select\n                  class=\"select-css select-filter\"\n                  onChange={e => this.onFilterTypeChange(e, prop, index)}\n                >\n                  {this.renderSelectOptions(\n                    this.filterItems[prop][index].type,\n                    true,\n                  )}\n                </select>\n                <div class={FILTER_LIST_CLASS_ACTION}>{andOrButton}</div>\n                <div onClick={() => this.onRemoveFilter(filter.id)}>\n                  <TrashButton />\n                </div>\n              </div>\n              <div>{this.renderExtra(prop, index)}</div>\n            </div>\n          );\n        })}\n\n        {propFilters.filter(f => !f.hidden).length > 0 ? <div class=\"add-filter-divider\" /> : ''}\n      </div>\n    );\n  }\n\n  private autoCorrect(el?: HTMLElement | null) {\n    if (!el) {\n      return;\n    }\n    const pos = el.getBoundingClientRect();\n    const maxLeft = window.innerWidth - pos.width;\n\n    if (pos.left > maxLeft && el.offsetLeft) {\n      el.style.left = `${maxLeft - (el.parentElement?.getBoundingClientRect().left ?? 0)}px`;\n    }\n  }\n\n  private onFilterTypeChange(e: Event, prop: ColumnProp, index: number) {\n    if (!(e.target instanceof HTMLSelectElement)) {\n      return;\n    }\n    this.filterItems[prop][index].type = e.target.value as FilterType;\n\n    // this re-renders the input to know if we need extra input\n    this.filterId++;\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.filterItems[prop][index].id,\n      );\n      if (input instanceof HTMLInputElement) {\n        input.focus();\n      }\n    }, 0);\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private debouncedApplyFilter = debounce(() => {\n    this.filterChange.emit(this.filterItems);\n  }, 400);\n\n  private onAddNewFilter(e: Event) {\n    const el = e.target as HTMLSelectElement;\n    this.currentFilterType = el.value as FilterType;\n    this.addNewFilterToProp();\n\n    // reset value after adding new filter\n    const select = document.getElementById('add-filter') as HTMLSelectElement;\n    if (select) {\n      select.value = defaultType;\n      this.currentFilterType = defaultType;\n    }\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private addNewFilterToProp() {\n    const prop = this.changes?.prop;\n    if (!(prop || prop === 0)) return;\n\n    if (!this.filterItems[prop]) {\n      this.filterItems[prop] = [];\n    }\n\n    if (this.currentFilterType === 'none') return;\n\n    this.filterId++;\n    this.currentFilterId = this.filterId;\n\n    this.filterItems[prop].push({\n      id: this.currentFilterId,\n      type: this.currentFilterType,\n      value: '',\n      relation: 'and',\n    });\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.currentFilterId,\n      ) as HTMLInputElement;\n      if (input) input.focus();\n    }, 0);\n  }\n\n  private onUserInput(index: number, prop: ColumnProp, event: Event) {\n    // update the value of the filter item\n    this.filterItems[prop][index].value = (\n      event.target as HTMLInputElement\n    ).value;\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private onKeyDown(e: KeyboardEvent) {\n    if (e.key.toLowerCase() === 'enter') {\n      const select = document.getElementById('add-filter') as HTMLSelectElement;\n      if (select) {\n        select.value = defaultType;\n        this.currentFilterType = defaultType;\n        this.addNewFilterToProp();\n        select.focus();\n      }\n      return;\n    }\n    // keep event local, don't escalate farther to dom\n    e.stopPropagation();\n  }\n\n  private onSave() {\n    this.filterChange.emit(this.filterItems);\n  }\n\n  private onCancel() {\n    this.changes = undefined;\n  }\n\n  private onReset() {\n    this.assertChanges();\n\n    this.resetChange.emit(this.changes?.prop);\n\n    // this updates the DOM which is used by getFilterItemsList() key\n    this.filterId++;\n  }\n\n  private onRemoveFilter(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n    items.splice(index, 1);\n\n    // let's remove the prop if no more filters so the filter icon will be removed\n    if (items.length === 0) delete this.filterItems[prop ?? ''];\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private toggleFilterAndOr(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n\n    items[index].relation = items[index].relation === 'and' ? 'or' : 'and';\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private assertChanges() {\n    if (!this.changes) {\n      throw new Error('Changes required per edit');\n    }\n  }\n\n  renderSelectOptions(type: FilterType, isDefaultTypeRemoved = false) {\n    if (!this.changes) {\n      return;\n    }\n    const options: VNode[] = [];\n    const prop = this.changes.prop;\n\n    const hidden = new Set<string>();\n    Object.entries(this.filterItems).forEach(([_, values]) => {\n      values.forEach((filter) => {\n        if (filter.hidden) {\n          hidden.add(filter.type);\n        }\n      })\n    });\n\n    if (!isDefaultTypeRemoved) {\n      const capts = Object.assign(\n        this.filterCaptionsInternal,\n        this.filterCaptions,\n      );\n\n      options.push(\n        <option\n          selected={this.currentFilterType === defaultType}\n          value={defaultType}\n        >\n          {prop && this.filterItems[prop] && this.filterItems[prop].length > 0\n            ? capts.add\n            : this.filterNames[defaultType]}\n        </option>,\n      );\n    }\n\n    for (let gIndex in this.changes.filterTypes) {\n      const group = this.changes.filterTypes[gIndex].filter(k => !hidden.has(k));\n      if (group.length) {\n        options.push(\n          ...group.map(k => (\n            <option value={k} selected={type === k}>\n              {this.filterNames[k]}\n            </option>\n          )),\n        );\n        options.push(<option disabled></option>);\n      }\n    }\n    return options;\n  }\n\n  renderExtra(prop: ColumnProp, index: number) {\n    const currentFilter = this.filterItems[prop];\n\n    if (!currentFilter) return '';\n\n    if (this.filterEntities[currentFilter[index].type].extra !== 'input')\n      return '';\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n\n    return (\n      <input\n        id={`filter-input-${currentFilter[index].id}`}\n        placeholder={capts.placeholder}\n        type=\"text\"\n        value={currentFilter[index].value}\n        onInput={this.onUserInput.bind(this, index, prop)}\n        onKeyDown={e => this.onKeyDown(e)}\n      />\n    );\n  }\n\n  render() {\n    if (!this.changes) {\n      return <Host style={{ display: 'none' }}></Host>;\n    }\n    const style = {\n      display: 'block',\n      left: `${this.changes.x}px`,\n      top: `${this.changes.y}px`,\n    };\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n\n    return (\n      <Host\n        style={style}\n        ref={el => {\n          this.changes?.autoCorrect && this.autoCorrect(el);\n        }}\n      >\n        <slot slot=\"header\" />\n        { this.changes.extraContent?.(this.changes) || '' }\n\n        { this.changes?.hideDefaultFilters !== true && (\n          [\n            <label>{capts.title}</label>,\n            <div class=\"filter-holder\">{this.getFilterItemsList()}</div>,\n            <div class=\"add-filter\">\n              <select\n                id={FILTER_ID}\n                class=\"select-css\"\n                onChange={e => this.onAddNewFilter(e)}\n              >\n                {this.renderSelectOptions(this.currentFilterType)}\n              </select>\n            </div>\n          ]\n        )}\n\n        <slot />\n        <div class=\"filter-actions\">\n          {this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-save\"\n              aria-label=\"save\"\n              class=\"revo-button green\"\n              onClick={() => this.onSave()}\n            >\n              {capts.save}\n            </button>,\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.cancel}\n            </button>,\n          ]}\n          {!this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.ok}\n            </button>,\n\n            <button\n              id=\"revo-button-reset\"\n              aria-label=\"reset\"\n              class=\"revo-button outline\"\n              onClick={() => this.onReset()}\n            >\n              {capts.reset}\n            </button>,\n          ]}\n        </div>\n        <slot slot=\"footer\" />\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"filter.panel.js","sourceRoot":"","sources":["../../../src/plugins/filter/filter.panel.tsx"],"names":[],"mappings":"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","sourcesContent":["// filter.panel.tsx\n\nimport {\n  h,\n  Component,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  type VNode,\n  Element,\n} from '@stencil/core';\nimport debounce from 'lodash/debounce';\n\nimport { AndOrButton, isFilterBtn, TrashButton } from './filter.button';\nimport '../../utils/closest.polifill';\nimport {\n  FilterCaptions,\n  LogicFunction,\n  MultiFilterItem,\n  ShowData,\n} from './filter.types';\nimport type { ColumnProp } from '@type';\nimport { FilterType } from './filter.indexed';\n\nconst defaultType: FilterType = 'none';\n\nconst FILTER_LIST_CLASS = 'multi-filter-list';\nconst FILTER_LIST_CLASS_ACTION = 'multi-filter-list-action';\nconst FILTER_ID = 'add-filter';\n\n/**\n * Filter panel for editing filters\n */\n/**\n * @internal\n */\n@Component({\n  tag: 'revogr-filter-panel',\n  styleUrl: 'filter.style.scss',\n})\nexport class FilterPanel {\n  private filterCaptionsInternal: FilterCaptions = {\n    title: 'Filter by',\n    ok: 'Ok',\n    save: 'Save',\n    // drops the filter\n    reset: 'Reset',\n    cancel: 'Cancel',\n    add: 'Add condition',\n    placeholder: 'Enter value...',\n    and: 'and',\n    or: 'or',\n  };\n\n  @Element() element!: HTMLElement;\n  @State() isFilterIdSet = false;\n  @State() filterId = 0;\n  @State() currentFilterId = -1;\n  @State() currentFilterType: FilterType = defaultType;\n  @State() changes: ShowData | undefined;\n  @State() filterItems: MultiFilterItem = {};\n  @Prop() filterNames: Record<string, string> = {};\n  @Prop() filterEntities: Record<string, LogicFunction> = {};\n  @Prop() filterCaptions: Partial<FilterCaptions> | undefined;\n  /**\n   * Disables dynamic filtering. A way to apply filters on Save only\n   */\n  @Prop() disableDynamicFiltering = false;\n  @Event() filterChange: EventEmitter<MultiFilterItem>;\n  @Event() resetChange: EventEmitter<ColumnProp>;\n\n  @Listen('mousedown', { target: 'document' }) onMouseDown(e: MouseEvent) {\n    // click on anything then select drops values to default\n    if (!this.changes || e.defaultPrevented) {\n      return;\n    }\n    const path = e.composedPath();\n    const select = document.getElementById(FILTER_ID);\n    if (select instanceof HTMLSelectElement) {\n      // click on select should be skipped\n      if (path.includes(select)) {\n        return;\n      }\n      select.value = defaultType;\n    }\n    this.currentFilterType = defaultType;\n    if (this.changes) {\n      this.changes.type = defaultType;\n    }\n    this.currentFilterId = -1;\n\n    const isOutside = !path.includes(this.element);\n\n    if (\n      e.target instanceof HTMLElement &&\n      isOutside &&\n      !isFilterBtn(e.target)\n    ) {\n      this.changes = undefined;\n    }\n  }\n\n  @Method() async show(newEntity?: ShowData) {\n    this.changes = newEntity;\n    this.filterItems = newEntity?.filterItems || {};\n    if (this.changes) {\n      this.changes.type = this.changes.type || defaultType;\n    }\n  }\n\n  @Method() async getChanges() {\n    return this.changes;\n  }\n\n  componentWillRender() {\n    if (!this.isFilterIdSet) {\n      this.isFilterIdSet = true;\n      const filterItems = Object.keys(this.filterItems);\n      for (const prop of filterItems) {\n        // we set the proper filterId so there won't be any conflict when removing filters\n        this.filterId += this.filterItems[prop].length;\n      }\n    }\n  }\n\n  getFilterItemsList() {\n    const prop = this.changes?.prop;\n    if (typeof prop === 'undefined') return '';\n\n    const propFilters = this.filterItems[prop] ?? [];\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n    return (\n      <div key={this.filterId}>\n        {propFilters.map((filter, index) => {\n          let andOrButton;\n          if (filter.hidden) {\n            return;\n          }\n\n          // hide toggle button if there is only one filter and the last one\n          if (index !== this.filterItems[prop].length - 1) {\n            andOrButton = (\n              <div onClick={() => this.toggleFilterAndOr(filter.id)}>\n                <AndOrButton\n                  text={filter.relation === 'and' ? capts.and : capts.or}\n                />\n              </div>\n            );\n          }\n\n          return (\n            <div key={filter.id} class={FILTER_LIST_CLASS}>\n              <div class={{ 'select-input': true }}>\n                <select\n                  class=\"select-css select-filter\"\n                  onChange={e => this.onFilterTypeChange(e, prop, index)}\n                >\n                  {this.renderSelectOptions(\n                    this.filterItems[prop][index].type,\n                    true,\n                  )}\n                </select>\n                <div class={FILTER_LIST_CLASS_ACTION}>{andOrButton}</div>\n                <div onClick={() => this.onRemoveFilter(filter.id)}>\n                  <TrashButton />\n                </div>\n              </div>\n              <div>{this.renderExtra(prop, index)}</div>\n            </div>\n          );\n        })}\n\n        {propFilters.filter(f => !f.hidden).length > 0 ? <div class=\"add-filter-divider\" /> : ''}\n      </div>\n    );\n  }\n\n  private autoCorrect(el?: HTMLElement | null) {\n    if (!el) {\n      return;\n    }\n    const pos = el.getBoundingClientRect();\n    const maxLeft = window.innerWidth - pos.width;\n\n    if (pos.left > maxLeft && el.offsetLeft) {\n      el.style.left = `${maxLeft - (el.parentElement?.getBoundingClientRect().left ?? 0)}px`;\n    }\n  }\n\n  private onFilterTypeChange(e: Event, prop: ColumnProp, index: number) {\n    if (!(e.target instanceof HTMLSelectElement)) {\n      return;\n    }\n    this.filterItems[prop][index].type = e.target.value as FilterType;\n\n    // this re-renders the input to know if we need extra input\n    this.filterId++;\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.filterItems[prop][index].id,\n      );\n      if (input instanceof HTMLInputElement) {\n        input.focus();\n      }\n    }, 0);\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private debouncedApplyFilter = debounce(() => {\n    this.filterChange.emit(this.filterItems);\n  }, 400);\n\n  private onAddNewFilter(e: Event) {\n    const el = e.target as HTMLSelectElement;\n    this.currentFilterType = el.value as FilterType;\n    this.addNewFilterToProp();\n\n    // reset value after adding new filter\n    const select = document.getElementById('add-filter') as HTMLSelectElement;\n    if (select) {\n      select.value = defaultType;\n      this.currentFilterType = defaultType;\n    }\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private addNewFilterToProp() {\n    const prop = this.changes?.prop;\n    if (!(prop || prop === 0)) return;\n\n    if (!this.filterItems[prop]) {\n      this.filterItems[prop] = [];\n    }\n\n    if (this.currentFilterType === 'none') return;\n\n    this.filterId++;\n    this.currentFilterId = this.filterId;\n\n    this.filterItems[prop].push({\n      id: this.currentFilterId,\n      type: this.currentFilterType,\n      value: '',\n      relation: 'and',\n    });\n\n    // adding setTimeout will wait for the next tick DOM update then focus on input\n    setTimeout(() => {\n      const input = document.getElementById(\n        'filter-input-' + this.currentFilterId,\n      ) as HTMLInputElement;\n      if (input) input.focus();\n    }, 0);\n  }\n\n  private onSave() {\n    this.filterChange.emit(this.filterItems);\n  }\n\n  private onCancel() {\n    this.changes = undefined;\n  }\n\n  private onReset() {\n    this.assertChanges();\n\n    this.resetChange.emit(this.changes?.prop);\n\n    // this updates the DOM which is used by getFilterItemsList() key\n    this.filterId++;\n  }\n\n  private onRemoveFilter(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n    items.splice(index, 1);\n\n    // let's remove the prop if no more filters so the filter icon will be removed\n    if (items.length === 0) delete this.filterItems[prop ?? ''];\n\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private toggleFilterAndOr(id: number) {\n    this.assertChanges();\n\n    // this is for reactivity issues for getFilterItemsList()\n    this.filterId++;\n\n    const prop = this.changes?.prop;\n\n    const items = this.filterItems[prop ?? ''];\n    if (!items) return;\n\n    const index = items.findIndex(d => d.id === id);\n    if (index === -1) return;\n\n    items[index].relation = items[index].relation === 'and' ? 'or' : 'and';\n    if (!this.disableDynamicFiltering) {\n      this.debouncedApplyFilter();\n    }\n  }\n\n  private assertChanges() {\n    if (!this.changes) {\n      throw new Error('Changes required per edit');\n    }\n  }\n\n  renderSelectOptions(type: FilterType, isDefaultTypeRemoved = false) {\n    if (!this.changes) {\n      return;\n    }\n    const options: VNode[] = [];\n    const prop = this.changes.prop;\n\n    const hidden = new Set<string>();\n    Object.entries(this.filterItems).forEach(([_, values]) => {\n      values.forEach((filter) => {\n        if (filter.hidden) {\n          hidden.add(filter.type);\n        }\n      })\n    });\n\n    if (!isDefaultTypeRemoved) {\n      const capts = Object.assign(\n        this.filterCaptionsInternal,\n        this.filterCaptions,\n      );\n\n      options.push(\n        <option\n          selected={this.currentFilterType === defaultType}\n          value={defaultType}\n        >\n          {prop && this.filterItems[prop] && this.filterItems[prop].length > 0\n            ? capts.add\n            : this.filterNames[defaultType]}\n        </option>,\n      );\n    }\n\n    for (let gIndex in this.changes.filterTypes) {\n      const group = this.changes.filterTypes[gIndex].filter(k => !hidden.has(k));\n      if (group.length) {\n        options.push(\n          ...group.map(k => (\n            <option value={k} selected={type === k}>\n              {this.filterNames[k]}\n            </option>\n          )),\n        );\n        options.push(<option disabled></option>);\n      }\n    }\n    return options;\n  }\n\n  renderExtra(prop: ColumnProp, index: number) {\n    const currentFilter = this.filterItems[prop];\n\n    if (!currentFilter) return '';\n\n    const applyFilter = (value?: any) => {\n      this.filterItems[prop][index].value = value;\n      if (!this.disableDynamicFiltering) {\n        this.debouncedApplyFilter();\n      }\n    };\n\n    const focusNext = () => {\n      const select = document.getElementById('add-filter') as HTMLSelectElement;\n      if (select) {\n        select.value = defaultType;\n        this.currentFilterType = defaultType;\n        this.addNewFilterToProp();\n        select.focus();\n      }\n    };\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n    const extra = this.filterEntities[currentFilter[index].type].extra;\n    if (typeof extra === 'function') {\n      return extra(h, {\n        value: currentFilter[index].value,\n        filter: currentFilter[index],\n        prop,\n        index,\n        placeholder: capts.placeholder,\n        onInput: (value: any) => {\n          applyFilter(value);\n        },\n        onFocus: () => {\n          focusNext();\n        }\n      });\n    }\n    if (extra !== 'input' && extra !== 'datepicker') {\n      return '';\n    }\n    return (\n      <input\n        id={`filter-input-${currentFilter[index].id}`}\n        placeholder={capts.placeholder}\n        type={extra === 'datepicker' ? 'date' : 'text'}\n        value={currentFilter[index].value}\n        onInput={(e) => {\n          if (e.target instanceof HTMLInputElement) {\n            applyFilter(e.target.value);\n          }\n        }}\n        onKeyDown={e => {\n          if (e.key.toLowerCase() === 'enter') {\n            const select = document.getElementById('add-filter') as HTMLSelectElement;\n            if (select) {\n              focusNext();\n            }\n            return;\n          }\n          // keep event local, don't escalate farther to dom\n          e.stopPropagation();\n        }}\n      />\n    );\n  }\n\n  render() {\n    if (!this.changes) {\n      return <Host style={{ display: 'none' }}></Host>;\n    }\n    const style = {\n      display: 'block',\n      left: `${this.changes.x}px`,\n      top: `${this.changes.y}px`,\n    };\n\n    const capts = Object.assign(\n      this.filterCaptionsInternal,\n      this.filterCaptions,\n    );\n\n    return (\n      <Host\n        style={style}\n        ref={el => {\n          this.changes?.autoCorrect && this.autoCorrect(el);\n        }}\n      >\n        <slot slot=\"header\" />\n        { this.changes.extraContent?.(this.changes) || '' }\n\n        { this.changes?.hideDefaultFilters !== true && (\n          [\n            <label>{capts.title}</label>,\n            <div class=\"filter-holder\">{this.getFilterItemsList()}</div>,\n            <div class=\"add-filter\">\n              <select\n                id={FILTER_ID}\n                class=\"select-css\"\n                onChange={e => this.onAddNewFilter(e)}\n              >\n                {this.renderSelectOptions(this.currentFilterType)}\n              </select>\n            </div>\n          ]\n        )}\n\n        <slot />\n        <div class=\"filter-actions\">\n          {this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-save\"\n              aria-label=\"save\"\n              class=\"revo-button green\"\n              onClick={() => this.onSave()}\n            >\n              {capts.save}\n            </button>,\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.cancel}\n            </button>,\n          ]}\n          {!this.disableDynamicFiltering && [\n            <button\n              id=\"revo-button-ok\"\n              aria-label=\"ok\"\n              class=\"revo-button green\"\n              onClick={() => this.onCancel()}\n            >\n              {capts.ok}\n            </button>,\n\n            <button\n              id=\"revo-button-reset\"\n              aria-label=\"reset\"\n              class=\"revo-button outline\"\n              onClick={() => this.onReset()}\n            >\n              {capts.reset}\n            </button>,\n          ]}\n        </div>\n        <slot slot=\"footer\" />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/plugins/filter/filter.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter.types.js","sourceRoot":"","sources":["../../../src/plugins/filter/filter.types.ts"],"names":[],"mappings":"AAAA,kBAAkB;AAqDjB,CAAC;AAYD,CAAC;AA0ED,CAAC","sourcesContent":["// filter.types.ts\n\nimport type { ColumnProp, ColumnRegular } from '@type';\nimport type { FilterType } from './filter.indexed';\n\nexport type DateEnum =\n  | 'today'\n  | 'yesterday'\n  | 'tomorrow'\n  | 'thisweek'\n  | 'lastweek'\n  | 'nextweek'\n  | 'thismonth'\n  | 'lastmonth'\n  | 'nextmonth'\n  | 'thisyear'\n  | 'lastyear'\n  | 'nextyear';\n\nexport type ExtraField = 'input' | 'select' | 'multi' | 'datepicker';\n\nexport type LogicFunctionParam = any;\nexport type LogicFunctionExtraParam =\n  | 'select'\n  | 'input'\n  | 'multi'\n  | 'datepicker'\n  | number\n  | Date\n  | DateEnum\n  | null\n  | undefined\n  | string\n  | string[]\n  | number[];\nexport interface LogicFunction<T1 = LogicFunctionParam, T2 = LogicFunctionExtraParam> {\n  (value: T1, extra?: T2): boolean;\n  extra?: ExtraField;\n}\n\nexport interface CustomFilter<T1 = LogicFunctionParam, T2 = LogicFunctionExtraParam> {\n  /**\n   * Property defined in column { filter: string/number/abstract/enum...etc }\n   */\n  columnFilterType: string;\n  /**\n   * Filter name\n   */\n  name: string;\n  /**\n   * Function to apply the filter\n   */\n  func: LogicFunction<T1, T2>;\n};\n\nexport interface FilterCaptions {\n  title: string;\n  save: string;\n  reset: string;\n  ok: string;\n  cancel: string;\n  add: string;\n  placeholder: string;\n  and: string;\n  or: string;\n};\n\nexport interface FilterLocalization {\n  captions: Partial<FilterCaptions>;\n  filterNames: Record<FilterType, string>;\n}\n/**\n * Filter configuration for a column. This is the type of the `filter` property on a column.\n */\nexport interface ColumnFilterConfig {\n  /**\n   * The collection of filters to be applied to the column.\n   */\n  collection?: Record<ColumnProp, FilterCollectionItem>;\n  /**\n   * The names of the filters to be included in the filter dropdown.\n   */\n  include?: string[];\n  /**\n   * A mapping of custom filter names to custom filter functions.\n   */\n  customFilters?: Record<string, CustomFilter>;\n  /**\n   * The property on the column idintifying which has the filter is applied.\n   */\n  filterProp?: string;\n  /**\n   * The localization for the filter dropdown.\n   */\n  localization?: FilterLocalization;\n  /**\n   * Information about the multi-filter items.\n   */\n  multiFilterItems?: MultiFilterItem;\n  /**\n   * Whether or not to disable dynamic filtering. If set to true, the filter will only be applied\n   * when the user clicks on the filter button.\n   */\n  disableDynamicFiltering?: boolean;\n}\n\nexport type FilterCollectionItem = {\n  type: FilterType;\n  value?: any;\n};\n\n\nexport interface FilterItem {\n  // column id\n  prop?: ColumnProp;\n  // filter type definition\n  type?: FilterType;\n  // value for additional filtering, text value or some id\n  value?: any;\n}\n\nexport interface FilterData {\n  id: number;\n  /**\n   * Filter type\n   */\n  type: FilterType;\n  /**\n   * Filter value\n   */\n  value?: any;\n  /**\n   * Filter invisible in filter panel\n   */\n  hidden?: boolean;\n  /**\n   * Filter relation\n   */\n  relation?: 'and' | 'or';\n};\n\nexport interface MultiFilterItem {\n  [prop: string]: FilterData[];\n}\n\nexport interface ShowData extends FilterItem, Omit<ColumnRegular, 'filter'> {\n  x: number;\n  y: number;\n  /**\n   * Auto correct position if it is out of document bounds\n   */\n  autoCorrect?: boolean;\n  filterTypes?: Record<string, string[]>;\n  filterItems?: MultiFilterItem;\n  // hide default filters\n  hideDefaultFilters?: boolean;\n  // pass vnodes from plugins\n  extraContent?: (data: ShowData) => any;\n}\n"]}
+{"version":3,"file":"filter.types.js","sourceRoot":"","sources":["../../../src/plugins/filter/filter.types.ts"],"names":[],"mappings":"AAAA,kBAAkB;AA8DjB,CAAC;AAYD,CAAC;AA0ED,CAAC","sourcesContent":["// filter.types.ts\n\nimport type { ColumnProp, ColumnRegular, HyperFunc } from '@type';\nimport type { FilterType } from './filter.indexed';\nimport type { VNode } from '@stencil/core';\n\nexport type DateEnum =\n  | 'today'\n  | 'yesterday'\n  | 'tomorrow'\n  | 'thisweek'\n  | 'lastweek'\n  | 'nextweek'\n  | 'thismonth'\n  | 'lastmonth'\n  | 'nextmonth'\n  | 'thisyear'\n  | 'lastyear'\n  | 'nextyear';\n\nexport type ExtraField = 'input' | 'datepicker' | ((h: HyperFunc<VNode>, config: {\n  value: any;\n  filter: FilterItem;\n  prop: ColumnProp;\n  index: number;\n  placeholder: string;\n  onInput: (value: any) => void;\n  onFocus: () => void;\n}) => VNode | VNode[]);\n\nexport type LogicFunctionParam = any;\nexport type LogicFunctionExtraParam =\n  | 'select'\n  | 'input'\n  | 'multi'\n  | 'datepicker'\n  | number\n  | Date\n  | DateEnum\n  | null\n  | undefined\n  | string\n  | string[]\n  | number[];\nexport interface LogicFunction<T1 = LogicFunctionParam, T2 = LogicFunctionExtraParam> {\n  (value: T1, extra?: T2): boolean;\n  extra?: ExtraField;\n}\n\nexport interface CustomFilter<T1 = LogicFunctionParam, T2 = LogicFunctionExtraParam> {\n  /**\n   * Property defined in column { filter: string/number/abstract/enum...etc }\n   */\n  columnFilterType: string;\n  /**\n   * Filter name\n   */\n  name: string;\n  /**\n   * Function to apply the filter\n   */\n  func: LogicFunction<T1, T2>;\n};\n\nexport interface FilterCaptions {\n  title: string;\n  save: string;\n  reset: string;\n  ok: string;\n  cancel: string;\n  add: string;\n  placeholder: string;\n  and: string;\n  or: string;\n};\n\nexport interface FilterLocalization {\n  captions: Partial<FilterCaptions>;\n  filterNames: Record<FilterType, string>;\n}\n/**\n * Filter configuration for a column. This is the type of the `filter` property on a column.\n */\nexport interface ColumnFilterConfig {\n  /**\n   * The collection of filters to be applied to the column.\n   */\n  collection?: Record<ColumnProp, FilterCollectionItem>;\n  /**\n   * The names of the filters to be included in the filter dropdown.\n   */\n  include?: string[];\n  /**\n   * A mapping of custom filter names to custom filter functions.\n   */\n  customFilters?: Record<string, CustomFilter>;\n  /**\n   * The property on the column idintifying which has the filter is applied.\n   */\n  filterProp?: string;\n  /**\n   * The localization for the filter dropdown.\n   */\n  localization?: FilterLocalization;\n  /**\n   * Information about the multi-filter items.\n   */\n  multiFilterItems?: MultiFilterItem;\n  /**\n   * Whether or not to disable dynamic filtering. If set to true, the filter will only be applied\n   * when the user clicks on the filter button.\n   */\n  disableDynamicFiltering?: boolean;\n}\n\nexport type FilterCollectionItem = {\n  type: FilterType;\n  value?: any;\n};\n\n\nexport interface FilterItem {\n  // column id\n  prop?: ColumnProp;\n  // filter type definition\n  type?: FilterType;\n  // value for additional filtering, text value or some id\n  value?: any;\n}\n\nexport interface FilterData {\n  id: number;\n  /**\n   * Filter type\n   */\n  type: FilterType;\n  /**\n   * Filter value\n   */\n  value?: any;\n  /**\n   * Filter invisible in filter panel\n   */\n  hidden?: boolean;\n  /**\n   * Filter relation\n   */\n  relation?: 'and' | 'or';\n};\n\nexport interface MultiFilterItem {\n  [prop: string]: FilterData[];\n}\n\nexport interface ShowData extends FilterItem, Omit<ColumnRegular, 'filter'> {\n  x: number;\n  y: number;\n  /**\n   * Auto correct position if it is out of document bounds\n   */\n  autoCorrect?: boolean;\n  filterTypes?: Record<string, string[]>;\n  filterItems?: MultiFilterItem;\n  // hide default filters\n  hideDefaultFilters?: boolean;\n  // pass vnodes from plugins\n  extraContent?: (data: ShowData) => any;\n}\n"]}

package/dist/esm/revogr-filter-panel.entry.js

@@ -195,27 +195,6 @@ const FilterPanel = class {
                 input.focus();
         }, 0);
     }
-    onUserInput(index, prop, event) {
-        // update the value of the filter item
-        this.filterItems[prop][index].value = event.target.value;
-        if (!this.disableDynamicFiltering) {
-            this.debouncedApplyFilter();
-        }
-    }
-    onKeyDown(e) {
-        if (e.key.toLowerCase() === 'enter') {
-            const select = document.getElementById('add-filter');
-            if (select) {
-                select.value = defaultType;
-                this.currentFilterType = defaultType;
-                this.addNewFilterToProp();
-                select.focus();
-            }
-            return;
-        }
-        // keep event local, don't escalate farther to dom
-        e.stopPropagation();
-    }
     onSave() {
         this.filterChange.emit(this.filterItems);
     }
@@ -304,10 +283,56 @@ const FilterPanel = class {
         const currentFilter = this.filterItems[prop];
         if (!currentFilter)
             return '';
-        if (this.filterEntities[currentFilter[index].type].extra !== 'input')
-            return '';
+        const applyFilter = (value) => {
+            this.filterItems[prop][index].value = value;
+            if (!this.disableDynamicFiltering) {
+                this.debouncedApplyFilter();
+            }
+        };
+        const focusNext = () => {
+            const select = document.getElementById('add-filter');
+            if (select) {
+                select.value = defaultType;
+                this.currentFilterType = defaultType;
+                this.addNewFilterToProp();
+                select.focus();
+            }
+        };
         const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);
-        return (h("input", { id: `filter-input-${currentFilter[index].id}`, placeholder: capts.placeholder, type: "text", value: currentFilter[index].value, onInput: this.onUserInput.bind(this, index, prop), onKeyDown: e => this.onKeyDown(e) }));
+        const extra = this.filterEntities[currentFilter[index].type].extra;
+        if (typeof extra === 'function') {
+            return extra(h, {
+                value: currentFilter[index].value,
+                filter: currentFilter[index],
+                prop,
+                index,
+                placeholder: capts.placeholder,
+                onInput: (value) => {
+                    applyFilter(value);
+                },
+                onFocus: () => {
+                    focusNext();
+                }
+            });
+        }
+        if (extra !== 'input' && extra !== 'datepicker') {
+            return '';
+        }
+        return (h("input", { id: `filter-input-${currentFilter[index].id}`, placeholder: capts.placeholder, type: extra === 'datepicker' ? 'date' : 'text', value: currentFilter[index].value, onInput: (e) => {
+                if (e.target instanceof HTMLInputElement) {
+                    applyFilter(e.target.value);
+                }
+            }, onKeyDown: e => {
+                if (e.key.toLowerCase() === 'enter') {
+                    const select = document.getElementById('add-filter');
+                    if (select) {
+                        focusNext();
+                    }
+                    return;
+                }
+                // keep event local, don't escalate farther to dom
+                e.stopPropagation();
+            } }));
     }
     render() {
         var _a, _b, _c;