@revolist/revogrid 4.9.13 → 4.9.17

package/dist/revo-grid/revogr-filter-panel.entry.js.map

@@ -1 +1 @@
-{"version":3,"names":["closest","Element","prototype","matches","msMatchesSelector","webkitMatchesSelector","s","el","this","call","parentElement","parentNode","nodeType","filterStyleCss","RevogrFilterPanelStyle0","defaultType","FILTER_LIST_CLASS","FILTER_LIST_CLASS_ACTION","FILTER_ID","FilterPanel","filterCaptionsInternal","title","save","reset","cancel","add","placeholder","and","or","debouncedApplyFilter","debounce","filterChange","emit","filterItems","onMouseDown","e","changes","defaultPrevented","path","composedPath","select","document","getElementById","HTMLSelectElement","includes","value","currentFilterType","type","currentFilterId","isOutside","element","target","HTMLElement","isFilterBtn","undefined","show","newEntity","getChanges","componentWillRender","isFilterIdSet","Object","keys","prop","filterId","length","renderSelectOptions","isDefaultTypeRemoved","options","_a","capts","assign","filterCaptions","push","h","selected","filterNames","gIndex","filterTypes","map","k","disabled","renderExtra","index","currentFilter","filterEntities","extra","id","onInput","onUserInput","bind","onKeyDown","getFilterItemsList","propFilters","key","d","andOrButton","onClick","toggleFilterAndOr","AndOrButton","text","relation","class","onChange","onFilterTypeChange","onRemoveFilter","TrashButton","autoCorrect","pos","getBoundingClientRect","maxLeft","window","innerWidth","width","left","offsetLeft","style","_b","render","Host","display","x","top","y","ref","onAddNewFilter","disableDynamicFiltering","onSave","onReset","onCancel","setTimeout","input","HTMLInputElement","focus","addNewFilterToProp","event","toLowerCase","stopPropagation","assertChanges","items","findIndex","splice","Error"],"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\n  opacity: 1;\n  transform: none;\n  background-color: #fff;\n  transform-origin: 62px 0px;\n  box-shadow: 0 5px 18px -2px rgba(black, 20%);\n  padding: 10px;\n  border-radius: 4px;\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: #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  $linearGradient: linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);\n  $borderColor: #f1f1f1;\n\n  display: block;\n  font-family: sans-serif;\n  font-weight: 600;\n  color: #444;\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 $borderColor;\n  box-shadow: transparent;\n  border-radius: 0.5em;\n  appearance: none;\n  background-color: #fff;\n  background-image: url($gradient), $linearGradient;\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: rgb(197, 197, 197);\n  }\n  /* Focus style */\n  &:focus {\n    border-color: $borderColor;\n    box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7);\n    box-shadow: 0 0 0 3px -moz-mac-focusring;\n    color: #222;\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: $borderColor;\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 #d9d9d9;\n  height: 10px;\n}\n\n.select-input {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n","import { Component, Event, EventEmitter, h, Host, Listen, Method, Prop, State, VNode, Element } from '@stencil/core';\nimport { FilterType } from './filter.service';\nimport { AndOrButton, isFilterBtn, TrashButton } from './filter.button';\nimport '../../utils/closest.polifill';\nimport { LogicFunction } from './filter.types';\nimport { FilterCaptions } from './filter.plugin';\nimport debounce from 'lodash/debounce';\nimport { ColumnProp } from '@type';\n\nexport type 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 type FilterData = {\n  id: number;\n  type: FilterType;\n  value?: any;\n  relation: 'and' | 'or';\n};\n\nexport type MultiFilterItem = {\n  [prop: string]: FilterData[];\n};\n\nexport type ShowData = {\n  x: number;\n  y: number;\n  /**\n   * Auto correct position if it is out of document bounds\n   */\n  autoCorrect?: boolean;\n} & FilterItem;\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    save: 'Save',\n    // drops the filter\n    reset: 'Clear changes',\n    cancel: 'Close',\n    add: 'Add more 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  @Prop() filterItems: MultiFilterItem = {};\n  @Prop() filterTypes: Record<string, string[]> = {};\n  @Prop() filterNames: Record<string, string> = {};\n  @Prop() filterEntities: Record<string, LogicFunction> = {};\n  @Prop() filterCaptions: FilterCaptions | undefined;\n  @Prop() disableDynamicFiltering = false;\n  @Event() filterChange: EventEmitter<MultiFilterItem>;\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 (e.target instanceof HTMLElement && isOutside && !isFilterBtn(e.target)) {\n      this.changes = undefined;\n    }\n  }\n\n  @Method() async show(newEntity?: ShowData) {\n    this.changes = newEntity;\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  renderSelectOptions(type: FilterType, isDefaultTypeRemoved = false) {\n    const options: VNode[] = [];\n    const prop = this.changes?.prop;\n\n    if (!isDefaultTypeRemoved) {\n      const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);\n\n      options.push(\n        <option selected={this.currentFilterType === defaultType} value={defaultType}>\n          {prop && this.filterItems[prop] && this.filterItems[prop].length > 0 ? capts.add : this.filterNames[defaultType]}\n        </option>,\n      );\n    }\n\n    for (let gIndex in this.filterTypes) {\n      options.push(\n        ...this.filterTypes[gIndex].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    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') return '';\n\n    const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);\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  getFilterItemsList() {\n    const prop = this.changes?.prop;\n    if (!(prop || prop === 0)) return '';\n\n    const propFilters = this.filterItems[prop] || [];\n    const capts = Object.assign(this.filterCaptionsInternal, this.filterCaptions);\n    return (\n      <div key={this.filterId}>\n        {propFilters.map((d, index) => {\n          let andOrButton;\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(d.id)}>\n                <AndOrButton text={d.relation === 'and' ? capts.and : capts.or} />\n              </div>\n            );\n          }\n\n          return (\n            <div key={d.id} class={FILTER_LIST_CLASS}>\n              <div class={{ 'select-input': true }}>\n                <select class=\"select-css select-filter\" onChange={e => this.onFilterTypeChange(e, prop, index)}>\n                  {this.renderSelectOptions(this.filterItems[prop][index].type, true)}\n                </select>\n                <div class={FILTER_LIST_CLASS_ACTION}>{andOrButton}</div>\n                <div onClick={() => this.onRemoveFilter(d.id)}>\n                  <TrashButton />\n                </div>\n              </div>\n              <div>{this.renderExtra(prop, index)}</div>\n            </div>\n          );\n        })}\n\n        {propFilters.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  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(this.filterCaptionsInternal, this.filterCaptions);\n\n    return (\n      <Host style={style} ref={(el) => { this.changes?.autoCorrect && this.autoCorrect(el) }}>\n        <label>{capts.title}</label>\n        <div class=\"filter-holder\">{this.getFilterItemsList()}</div>\n\n        <div class=\"add-filter\">\n          <select id={FILTER_ID} class=\"select-css\" onChange={e => this.onAddNewFilter(e)}>\n            {this.renderSelectOptions(this.currentFilterType)}\n          </select>\n        </div>\n        <div class=\"filter-actions\">\n          {this.disableDynamicFiltering &&\n            <button id=\"revo-button-save\" aria-label=\"save\" class=\"revo-button green\"  onClick={() => this.onSave()}>\n              {capts.save}\n            </button>\n          }\n          <button id=\"revo-button-reset\" aria-label=\"reset\" class=\"revo-button light\" onClick={() => this.onReset()}>\n            {capts.reset}\n          </button>\n          <button id=\"revo-button-cancel\" aria-label=\"cancel\" class=\"revo-button light\" onClick={() => this.onCancel()}>\n            {capts.cancel}\n          </button>\n        </div>\n      </Host>\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('filter-input-' + this.filterItems[prop][index].id);\n      if (input instanceof HTMLInputElement) {\n        input.focus();\n      }\n    }, 0);\n\n    if (!this.disableDynamicFiltering) this.debouncedApplyFilter();\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) this.debouncedApplyFilter();\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('filter-input-' + this.currentFilterId) 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 = (event.target as HTMLInputElement).value;\n\n    if (!this.disableDynamicFiltering) this.debouncedApplyFilter();\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    delete this.filterItems[this.changes?.prop ?? ''];\n\n    // this updates the DOM which is used by getFilterItemsList() key\n    this.filterId++;\n\n    this.filterChange.emit(this.filterItems);\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) this.debouncedApplyFilter();\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) this.debouncedApplyFilter();\n  }\n\n  private assertChanges() {\n    if (!this.changes) {\n      throw new Error('Changes required per edit');\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["closest","Element","prototype","matches","msMatchesSelector","webkitMatchesSelector","s","el","this","call","parentElement","parentNode","nodeType","filterStyleCss","RevogrFilterPanelStyle0","defaultType","FILTER_LIST_CLASS","FILTER_LIST_CLASS_ACTION","FILTER_ID","FilterPanel","filterCaptionsInternal","title","save","reset","cancel","add","placeholder","and","or","debouncedApplyFilter","debounce","filterChange","emit","filterItems","onMouseDown","e","changes","defaultPrevented","path","composedPath","select","document","getElementById","HTMLSelectElement","includes","value","currentFilterType","type","currentFilterId","isOutside","element","target","HTMLElement","isFilterBtn","undefined","show","newEntity","getChanges","componentWillRender","isFilterIdSet","Object","keys","prop","filterId","length","renderSelectOptions","isDefaultTypeRemoved","options","capts","assign","filterCaptions","push","h","selected","filterNames","gIndex","filterTypes","map","k","disabled","renderExtra","index","currentFilter","filterEntities","extra","id","onInput","onUserInput","bind","onKeyDown","getFilterItemsList","_a","propFilters","key","d","andOrButton","onClick","toggleFilterAndOr","AndOrButton","text","relation","class","onChange","onFilterTypeChange","onRemoveFilter","TrashButton","autoCorrect","pos","getBoundingClientRect","maxLeft","window","innerWidth","width","left","offsetLeft","style","_b","render","Host","display","x","top","y","ref","onAddNewFilter","disableDynamicFiltering","onSave","onReset","onCancel","setTimeout","input","HTMLInputElement","focus","addNewFilterToProp","event","toLowerCase","stopPropagation","assertChanges","items","findIndex","splice","Error"],"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\n  opacity: 1;\n  transform: none;\n  background-color: #fff;\n  transform-origin: 62px 0px;\n  box-shadow: 0 5px 18px -2px rgba(black, 20%);\n  padding: 10px;\n  border-radius: 4px;\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: #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  $linearGradient: linear-gradient(to bottom, #ffffff 0%, #ffffff 100%);\n  $borderColor: #f1f1f1;\n\n  display: block;\n  font-family: sans-serif;\n  font-weight: 600;\n  color: #444;\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 $borderColor;\n  box-shadow: transparent;\n  border-radius: 0.5em;\n  appearance: none;\n  background-color: #fff;\n  background-image: url($gradient), $linearGradient;\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: rgb(197, 197, 197);\n  }\n  /* Focus style */\n  &:focus {\n    border-color: $borderColor;\n    box-shadow: 0 0 1px 3px rgba(59, 153, 252, 0.7);\n    box-shadow: 0 0 0 3px -moz-mac-focusring;\n    color: #222;\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: $borderColor;\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 #d9d9d9;\n  height: 10px;\n}\n\n.select-input {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n","import {\n  h,\n  Component,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  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 { FilterCaptions, LogicFunction, MultiFilterItem, ShowData } from './filter.types';\nimport { ColumnProp } from '@type';\nimport { FilterType } from './filter.indexed';\n\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    save: 'Save',\n    // drops the filter\n    reset: 'Clear changes',\n    cancel: 'Close',\n    add: 'Add more 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  @Prop() filterItems: MultiFilterItem = {};\n  @Prop() filterNames: Record<string, string> = {};\n  @Prop() filterEntities: Record<string, LogicFunction> = {};\n  @Prop() filterCaptions: FilterCaptions | undefined;\n  @Prop() disableDynamicFiltering = false;\n  @Event() filterChange: EventEmitter<MultiFilterItem>;\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    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  renderSelectOptions(type: FilterType, isDefaultTypeRemoved = false) {\n    if (!this.changes) {\n      return;\n    }\n    const options: VNode[] = [];\n    const prop = this.changes.prop;\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      options.push(\n        ...this.changes.filterTypes[gIndex].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    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  getFilterItemsList() {\n    const prop = this.changes?.prop;\n    if (!(prop || prop === 0)) 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((d, index) => {\n          let andOrButton;\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(d.id)}>\n                <AndOrButton\n                  text={d.relation === 'and' ? capts.and : capts.or}\n                />\n              </div>\n            );\n          }\n\n          return (\n            <div key={d.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(d.id)}>\n                  <TrashButton />\n                </div>\n              </div>\n              <div>{this.renderExtra(prop, index)}</div>\n            </div>\n          );\n        })}\n\n        {propFilters.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  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        <label>{capts.title}</label>\n        <div class=\"filter-holder\">{this.getFilterItemsList()}</div>\n\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        <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          )}\n          <button\n            id=\"revo-button-reset\"\n            aria-label=\"reset\"\n            class=\"revo-button light\"\n            onClick={() => this.onReset()}\n          >\n            {capts.reset}\n          </button>\n          <button\n            id=\"revo-button-cancel\"\n            aria-label=\"cancel\"\n            class=\"revo-button light\"\n            onClick={() => this.onCancel()}\n          >\n            {capts.cancel}\n          </button>\n        </div>\n      </Host>\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) this.debouncedApplyFilter();\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) this.debouncedApplyFilter();\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) this.debouncedApplyFilter();\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    delete this.filterItems[this.changes?.prop ?? ''];\n\n    // this updates the DOM which is used by getFilterItemsList() key\n    this.filterId++;\n\n    this.filterChange.emit(this.filterItems);\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) this.debouncedApplyFilter();\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) this.debouncedApplyFilter();\n  }\n\n  private assertChanges() {\n    if (!this.changes) {\n      throw new Error('Changes required per edit');\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/revo-grid/{row-header-utils-c7e3e2d5.js → row-header-utils-f5b04d1a.js}

@@ -1,5 +1,5 @@
 /*!
  * Built by Revolist OU ❤️
  */
-import{i as t,V as e,v as i}from"./index-74b9801b.js";function s(e,i,s,l,u){const f=t(u,e);const h=d(i);let m;if(h){let t=f.itemIndex-(h.itemIndex||0);if(t){m=a(Math.abs(t),Object.assign(Object.assign({positiveDirection:t>-1},u),i))}}const v=n(l,u.realSize,f);if(m){const t=o(f,s,v,m,u);if(t.length){r(m.items,t,m)}}if(!m){const t=c({firstItemStart:f.start,firstItemIndex:f.itemIndex,origSize:u.originItemSize,maxSize:v,maxCount:s,sizes:u.sizes});m={items:t,start:0,end:t.length-1}}return m}function n(t,e,i){return Math.min(t+(i.end-i.start),e)}function r(t,e,i){t.splice(i.end+1,0,...e);if(i.start>=i.end&&!(i.start===i.end&&i.start===0)){i.start+=e.length}i.end+=e.length}function o(t,e,i,s,n){const r=h(s);const o=c({sizes:n.sizes,firstItemStart:r.end,firstItemIndex:r.itemIndex+1,origSize:n.originItemSize,maxSize:i-(r.end-t.start),maxCount:e});return o}function c(t,e=0){const i=[];let s=t.firstItemIndex;let n=e;while(n<=t.maxSize&&s<t.maxCount){const e=l(s,t.sizes,t.origSize);i.push({start:t.firstItemStart+n,end:t.firstItemStart+n+e,itemIndex:s,size:e});n+=e;s++}return i}function a(t,e){var i,s;const n=[...e.items];const r=n.length;let o={start:e.start,end:e.end};if(t>r){return undefined}if(e.positiveDirection){let i=h(e);let s=o.start;const c=s+t;for(;s<c;s++){const t=i.itemIndex+1;const c=l(t,e.sizes,e.originItemSize);if(i.end+c>e.realSize){break}let a=s%r;if(!n[a]){throw new Error("incorrect index")}n[a]=i={start:i.end,end:i.end+c,itemIndex:t,size:c};o.start++;o.end=a}}else{let c=d(e);const a=o.end;for(let u=0;u<t;u++){const t=((i=c===null||c===void 0?void 0:c.itemIndex)!==null&&i!==void 0?i:0)-1;const f=l(t,e.sizes,e.originItemSize);let d=a-u;d=(d<0?r+d:d)%r;if(!n[d]){console.error("incorrect index");break}const h=(s=c===null||c===void 0?void 0:c.start)!==null&&s!==void 0?s:0;n[d]=c={start:h-f,end:h,itemIndex:t,size:f};o.start=d;o.end--}}const c={start:(o.start<0?r+o.start:o.start)%r,end:(o.end<0?r+o.end:o.end)%r};return Object.assign({items:n},c)}function l(t,e,i=0){if(e&&e[t]){return e[t]}return i}function u(t,e,i,s){if(!i||!s){return false}return t>=i.start&&t<=i.end||t>i.end&&s.end===e}function f(t,e,i,s){var n;if(!i){return false}return e+t>((n=s===null||s===void 0?void 0:s.end)!==null&&n!==void 0?n:0)}function d(t){return t.items[t.start]}function h(t){return t.items[t.end]}function m(t,e,i,s){const n=[...t];const r=n.length;let o=s;let c=0;let a=e;if(!r){return[]}while(c<r){const t=n[a];t.start=o;t.size=i;t.end=t.start+i;o=t.end;a++;c++;if(a===r){a=0}}return n}function v(){return{items:[],start:0,end:0,virtualSize:0,realCount:0}}class b{get lastCoordinate(){return this.lastKnownScroll}set lastCoordinate(t){this.lastKnownScroll=t}constructor(t){this.type=t;this.lastKnownScroll=0;this.store=e(v());this.store.onChange("realCount",(()=>this.clearItems()));this.store.onChange("virtualSize",(()=>this.clearItems()))}setViewPortCoordinate(t,e,i=false){const n=this.store.get("virtualSize");if(!n){return}const c=1;const a=e.originItemSize*c;const l=a*2;const m=n+l;let v=0;if(e.realSize>n){v=e.realSize-n-a}let b=t;if(b<0){b=0}else if(b>v){b=v}this.lastCoordinate=b;b-=a;b=b<0?0:b<v?b:v;let z;if(i){z={items:[],start:0,end:0}}else{z=this.getItems()}const x=d(z);const I=h(z);let j={};if(!u(b,e.realSize,x,I)){j=Object.assign(Object.assign({},j),s(b,z,this.store.get("realCount"),m,e));this.setViewport(Object.assign({},j))}else if(f(b,m,x,I)){const t=[...z.items];const i=o(x,this.store.get("realCount"),m+b-x.start,z,{sizes:e.sizes,originItemSize:e.originItemSize});if(i.length){const e={start:this.store.get("start"),end:this.store.get("end")};r(t,i,e);j=Object.assign(Object.assign(Object.assign({},j),{items:[...t]}),e);this.setViewport(Object.assign({},j))}}}setOriginalSizes(t){const e=this.store.get("items");const s=e.length;if(!s){return}i(this.store,{items:m(e,this.store.get("start"),t,this.lastCoordinate)})}getItems(){return{items:this.store.get("items"),start:this.store.get("start"),end:this.store.get("end")}}setViewport(t){i(this.store,t)}clearItems(){this.store.set("items",[])}}const z=10;const x=(t,e,i=50)=>(e===null||e===void 0?void 0:e.size)||Math.max((t.toString().length+1)*z,i);export{b as V,o as a,c as b,f as c,d,h as e,x as f,s as g,u as i,a as r,m as s,r as u};
-//# sourceMappingURL=row-header-utils-c7e3e2d5.js.map
+import{i as t,V as e,v as i}from"./index-6c437a0d.js";function s(e,i,s,l,u){const f=t(u,e);const h=d(i);let m;if(h){let t=f.itemIndex-(h.itemIndex||0);if(t){m=a(Math.abs(t),Object.assign(Object.assign({positiveDirection:t>-1},u),i))}}const v=n(l,u.realSize,f);if(m){const t=o(f,s,v,m,u);if(t.length){r(m.items,t,m)}}if(!m){const t=c({firstItemStart:f.start,firstItemIndex:f.itemIndex,origSize:u.originItemSize,maxSize:v,maxCount:s,sizes:u.sizes});m={items:t,start:0,end:t.length-1}}return m}function n(t,e,i){return Math.min(t+(i.end-i.start),e)}function r(t,e,i){t.splice(i.end+1,0,...e);if(i.start>=i.end&&!(i.start===i.end&&i.start===0)){i.start+=e.length}i.end+=e.length}function o(t,e,i,s,n){const r=h(s);const o=c({sizes:n.sizes,firstItemStart:r.end,firstItemIndex:r.itemIndex+1,origSize:n.originItemSize,maxSize:i-(r.end-t.start),maxCount:e});return o}function c(t,e=0){const i=[];let s=t.firstItemIndex;let n=e;while(n<=t.maxSize&&s<t.maxCount){const e=l(s,t.sizes,t.origSize);i.push({start:t.firstItemStart+n,end:t.firstItemStart+n+e,itemIndex:s,size:e});n+=e;s++}return i}function a(t,e){var i,s;const n=[...e.items];const r=n.length;let o={start:e.start,end:e.end};if(t>r){return undefined}if(e.positiveDirection){let i=h(e);let s=o.start;const c=s+t;for(;s<c;s++){const t=i.itemIndex+1;const c=l(t,e.sizes,e.originItemSize);if(i.end+c>e.realSize){break}let a=s%r;if(!n[a]){throw new Error("incorrect index")}n[a]=i={start:i.end,end:i.end+c,itemIndex:t,size:c};o.start++;o.end=a}}else{let c=d(e);const a=o.end;for(let u=0;u<t;u++){const t=((i=c===null||c===void 0?void 0:c.itemIndex)!==null&&i!==void 0?i:0)-1;const f=l(t,e.sizes,e.originItemSize);let d=a-u;d=(d<0?r+d:d)%r;if(!n[d]){console.error("incorrect index");break}const h=(s=c===null||c===void 0?void 0:c.start)!==null&&s!==void 0?s:0;n[d]=c={start:h-f,end:h,itemIndex:t,size:f};o.start=d;o.end--}}const c={start:(o.start<0?r+o.start:o.start)%r,end:(o.end<0?r+o.end:o.end)%r};return Object.assign({items:n},c)}function l(t,e,i=0){if(e&&e[t]){return e[t]}return i}function u(t,e,i,s){if(!i||!s){return false}return t>=i.start&&t<=i.end||t>i.end&&s.end===e}function f(t,e,i,s){var n;if(!i){return false}return e+t>((n=s===null||s===void 0?void 0:s.end)!==null&&n!==void 0?n:0)}function d(t){return t.items[t.start]}function h(t){return t.items[t.end]}function m(t,e,i,s){const n=[...t];const r=n.length;let o=s;let c=0;let a=e;if(!r){return[]}while(c<r){const t=n[a];t.start=o;t.size=i;t.end=t.start+i;o=t.end;a++;c++;if(a===r){a=0}}return n}function v(){return{items:[],start:0,end:0,virtualSize:0,realCount:0}}class z{get lastCoordinate(){return this.lastKnownScroll}set lastCoordinate(t){this.lastKnownScroll=t}constructor(t){this.type=t;this.lastKnownScroll=0;this.store=e(v());this.store.onChange("realCount",(()=>this.clearItems()));this.store.onChange("virtualSize",(()=>this.clearItems()))}setViewPortCoordinate(t,e,i=false){const n=this.store.get("virtualSize");if(!n){return}const c=1;const a=e.originItemSize*c;const l=a*2;const m=n+l;let v=0;if(e.realSize>n){v=e.realSize-n-a}let z=t;if(z<0){z=0}else if(z>v){z=v}this.lastCoordinate=z;z-=a;z=z<0?0:z<v?z:v;let b;if(i){b={items:[],start:0,end:0}}else{b=this.getItems()}const x=d(b);const I=h(b);let j={};if(!u(z,e.realSize,x,I)){j=Object.assign(Object.assign({},j),s(z,b,this.store.get("realCount"),m,e));this.setViewport(Object.assign({},j))}else if(f(z,m,x,I)){const t=[...b.items];const i=o(x,this.store.get("realCount"),m+z-x.start,b,{sizes:e.sizes,originItemSize:e.originItemSize});if(i.length){const e={start:this.store.get("start"),end:this.store.get("end")};r(t,i,e);j=Object.assign(Object.assign(Object.assign({},j),{items:[...t]}),e);this.setViewport(Object.assign({},j))}}}setOriginalSizes(t){const e=this.store.get("items");const s=e.length;if(!s){return}i(this.store,{items:m(e,this.store.get("start"),t,this.lastCoordinate)})}getItems(){return{items:this.store.get("items"),start:this.store.get("start"),end:this.store.get("end")}}setViewport(t){i(this.store,t)}clearItems(){this.store.set("items",[])}}const b=10;const x=(t,e,i=50)=>(e===null||e===void 0?void 0:e.size)||Math.max((t.toString().length+1)*b,i);export{z as V,o as a,c as b,f as c,d,h as e,x as f,s as g,u as i,a as r,m as s,r as u};
+//# sourceMappingURL=row-header-utils-f5b04d1a.js.map

package/dist/revo-grid/{text-editor-96d69516.js → text-editor-79a617b5.js}

@@ -1,5 +1,5 @@
 /*!
  * Built by Revolist OU ❤️
  */
-import{f as i,d as t}from"./key.utils-d3df5db8.js";import{q as n}from"./index-74b9801b.js";class s{constructor(i,t){this.column=i;this.saveCallback=t;this.editInput=null;this.element=null;this.editCell=undefined}async componentDidRender(){var i;if(this.editInput){await n();(i=this.editInput)===null||i===void 0?void 0:i.focus()}}onKeyDown(n){const s=i(n.key);const e=t(n.key);if((e||s)&&n.target&&this.saveCallback&&!n.isComposing){this.beforeDisconnect();this.saveCallback(this.getValue(),e)}}beforeDisconnect(){var i;(i=this.editInput)===null||i===void 0?void 0:i.blur()}getValue(){var i;return(i=this.editInput)===null||i===void 0?void 0:i.value}render(i,t){var n,s;return i("input",{type:"text",enterKeyHint:"enter",value:(s=(n=this.editCell)===null||n===void 0?void 0:n.val)!==null&&s!==void 0?s:"",ref:i=>{this.editInput=i},onKeyDown:i=>this.onKeyDown(i)})}}export{s as T};
-//# sourceMappingURL=text-editor-96d69516.js.map
+import{f as i,d as t}from"./key.utils-5a827d12.js";import{q as n}from"./index-6c437a0d.js";class s{constructor(i,t){this.column=i;this.saveCallback=t;this.editInput=null;this.element=null;this.editCell=undefined}async componentDidRender(){var i;if(this.editInput){await n();(i=this.editInput)===null||i===void 0?void 0:i.focus()}}onKeyDown(n){const s=i(n.key);const e=t(n.key);if((e||s)&&n.target&&this.saveCallback&&!n.isComposing){this.beforeDisconnect();this.saveCallback(this.getValue(),e)}}beforeDisconnect(){var i;(i=this.editInput)===null||i===void 0?void 0:i.blur()}getValue(){var i;return(i=this.editInput)===null||i===void 0?void 0:i.value}render(i,t){var n,s;return i("input",{type:"text",enterKeyHint:"enter",value:(s=(n=this.editCell)===null||n===void 0?void 0:n.val)!==null&&s!==void 0?s:"",ref:i=>{this.editInput=i},onKeyDown:i=>this.onKeyDown(i)})}}export{s as T};
+//# sourceMappingURL=text-editor-79a617b5.js.map

package/dist/revo-grid/{throttle-262c3ed2.js → throttle-b94844de.js}

@@ -1,5 +1,5 @@
 /*!
  * Built by Revolist OU ❤️
  */
-import{o as t}from"./index-74b9801b.js";import{d as i,i as r}from"./debounce-e8e9464a.js";const s={contentSize:0,clientSize:0,virtualSize:0,maxSize:0};const e=-1;function n(t,i,r=0){return t+(r?i-r:0)}class o{constructor(t){this.cfg=t;this.preventArtificialScroll={rgRow:null,rgCol:null};this.previousScroll={rgRow:e,rgCol:e};this.params={rgRow:Object.assign({},s),rgCol:Object.assign({},s)}}setParams(t,i){const r=n(t.contentSize,t.clientSize,t.virtualSize);this.params[i]=Object.assign(Object.assign({},t),{maxSize:r-t.clientSize,virtualContentSize:r})}async setScroll(t){this.cancelScroll(t.dimension);const i=new Promise(((i,r)=>{if(this.cfg.skipAnimationFrame){return i()}const s=window.requestAnimationFrame((()=>{i()}));this.preventArtificialScroll[t.dimension]=r.bind(null,s)}));try{await i;const r=this.getParams(t.dimension);t.coordinate=Math.ceil(t.coordinate);this.previousScroll[t.dimension]=this.wrapCoordinate(t.coordinate,r);this.preventArtificialScroll[t.dimension]=null;this.cfg.applyScroll(Object.assign(Object.assign({},t),{coordinate:r.virtualSize?this.convert(t.coordinate,r,false):t.coordinate}))}catch(t){window.cancelAnimationFrame(t)}}scroll(t,i,r=false,s,n=false){this.cancelScroll(i);if(!r&&this.previousScroll[i]===t){this.previousScroll[i]=e;return}const o=this.getParams(i);this.cfg.runScroll({dimension:i,coordinate:o.virtualSize?this.convert(t,o):t,delta:s,outside:n})}getParams(t){return this.params[t]}wrapCoordinate(t,i){if(t<0){return e}if(typeof i.maxSize==="number"&&t>i.maxSize){return i.maxSize}return t}cancelScroll(t){var i,r;(r=(i=this.preventArtificialScroll)[t])===null||r===void 0?void 0:r.call(i);this.preventArtificialScroll[t]=null}convert(i,r,s=true){var e;const n=r.clientSize;const o=[0,((e=r.virtualContentSize)!==null&&e!==void 0?e:n)-n];const a=[0,r.contentSize-r.virtualSize];if(s){return t(i,o,a)}return t(i,a,o)}}class a{constructor(t=10){this.scrollThrottling=t;this.mouseWheelScrollTimestamp={rgCol:0,rgRow:0};this.lastKnownScrollCoordinate={rgCol:0,rgRow:0}}setCoordinate(t){this.lastKnownScrollCoordinate[t.dimension]=t.coordinate}latestScrollUpdate(t){this.mouseWheelScrollTimestamp[t]=(new Date).getTime()}isReady(t,i){const r=(new Date).getTime()-this.mouseWheelScrollTimestamp[t];return r>this.scrollThrottling&&i!==this.lastKnownScrollCoordinate[t]}}var c=i,l=r;var h="Expected a function";function u(t,i,r){var s=true,e=true;if(typeof t!="function"){throw new TypeError(h)}if(l(r)){s="leading"in r?!!r.leading:s;e="trailing"in r?!!r.trailing:e}return c(t,i,{leading:s,maxWait:i,trailing:e})}var d=u;export{a as L,o as a,n as g,d as t};
-//# sourceMappingURL=throttle-262c3ed2.js.map
+import{o as t}from"./index-6c437a0d.js";import{d as i,i as r}from"./debounce-e8e9464a.js";const s={contentSize:0,clientSize:0,virtualSize:0,maxSize:0};const e=-1;function n(t,i,r=0){return t+(r?i-r:0)}class o{constructor(t){this.cfg=t;this.preventArtificialScroll={rgRow:null,rgCol:null};this.previousScroll={rgRow:e,rgCol:e};this.params={rgRow:Object.assign({},s),rgCol:Object.assign({},s)}}setParams(t,i){const r=n(t.contentSize,t.clientSize,t.virtualSize);this.params[i]=Object.assign(Object.assign({},t),{maxSize:r-t.clientSize,virtualContentSize:r})}async setScroll(t){this.cancelScroll(t.dimension);const i=new Promise(((i,r)=>{if(this.cfg.skipAnimationFrame){return i()}const s=window.requestAnimationFrame((()=>{i()}));this.preventArtificialScroll[t.dimension]=r.bind(null,s)}));try{await i;const r=this.getParams(t.dimension);t.coordinate=Math.ceil(t.coordinate);this.previousScroll[t.dimension]=this.wrapCoordinate(t.coordinate,r);this.preventArtificialScroll[t.dimension]=null;this.cfg.applyScroll(Object.assign(Object.assign({},t),{coordinate:r.virtualSize?this.convert(t.coordinate,r,false):t.coordinate}))}catch(t){window.cancelAnimationFrame(t)}}scroll(t,i,r=false,s,n=false){this.cancelScroll(i);if(!r&&this.previousScroll[i]===t){this.previousScroll[i]=e;return}const o=this.getParams(i);this.cfg.runScroll({dimension:i,coordinate:o.virtualSize?this.convert(t,o):t,delta:s,outside:n})}getParams(t){return this.params[t]}wrapCoordinate(t,i){if(t<0){return e}if(typeof i.maxSize==="number"&&t>i.maxSize){return i.maxSize}return t}cancelScroll(t){var i,r;(r=(i=this.preventArtificialScroll)[t])===null||r===void 0?void 0:r.call(i);this.preventArtificialScroll[t]=null}convert(i,r,s=true){var e;const n=r.clientSize;const o=[0,((e=r.virtualContentSize)!==null&&e!==void 0?e:n)-n];const a=[0,r.contentSize-r.virtualSize];if(s){return t(i,o,a)}return t(i,a,o)}}class a{constructor(t=10){this.scrollThrottling=t;this.mouseWheelScrollTimestamp={rgCol:0,rgRow:0};this.lastKnownScrollCoordinate={rgCol:0,rgRow:0}}setCoordinate(t){this.lastKnownScrollCoordinate[t.dimension]=t.coordinate}latestScrollUpdate(t){this.mouseWheelScrollTimestamp[t]=(new Date).getTime()}isReady(t,i){const r=(new Date).getTime()-this.mouseWheelScrollTimestamp[t];return r>this.scrollThrottling&&i!==this.lastKnownScrollCoordinate[t]}}var c=i,l=r;var h="Expected a function";function u(t,i,r){var s=true,e=true;if(typeof t!="function"){throw new TypeError(h)}if(l(r)){s="leading"in r?!!r.leading:s;e="trailing"in r?!!r.trailing:e}return c(t,i,{leading:s,maxWait:i,trailing:e})}var d=u;export{a as L,o as a,n as g,d as t};
+//# sourceMappingURL=throttle-b94844de.js.map

package/dist/types/components/data/column.service.d.ts

@@ -1,6 +1,6 @@
 import { DSourceState } from "../../store/index";
+import { Observable } from '../../utils';
 import { DimensionCols, DimensionRows, RowDrag, ColumnRegular, DataType, CellProps, ColumnDataSchemaModel, ColumnProp, DataLookup, DataFormat, ChangedRange, OldNewRangeMapping, Cell, RangeArea, BeforeSaveDataDetails, EditorCtr, Editors } from "../../types/index";
-import { Observable } from '../../utils/store.utils';
 export type ColumnStores = {
     [T in DimensionCols]: Observable<DSourceState<ColumnRegular, DimensionCols>>;
 };
@@ -55,7 +55,6 @@ export default class ColumnService {
     };
     destroy(): void;
 }
-export declare function getCellData(val?: any): any;
 /**
  * Checks if the given rowDrag is a service for dragging rows.
  */

package/dist/types/components/header/header-cell-renderer.d.ts

@@ -1,11 +1,9 @@
-import { VNode } from '../../stencil-public-runtime';
-import { ResizeProps } from './resizable.directive';
-import { CellProps, ColumnTemplateProp } from "../../types/index";
-type Props = {
-    props: CellProps & Partial<ResizeProps>;
+import { FunctionalComponent } from '../../stencil-public-runtime';
+import { ResizableElementHTMLAttributes } from './resizable.element';
+import { ColumnTemplateProp } from "../../types/index";
+export declare const ON_COLUMN_CLICK = "columnclick";
+export declare const HeaderCellRenderer: FunctionalComponent<{
+    props: ResizableElementHTMLAttributes;
     additionalData: any;
     data?: ColumnTemplateProp;
-};
-export declare const ON_COLUMN_CLICK = "columnclick";
-export declare const HeaderCellRenderer: ({ data, props, additionalData }: Props, children: VNode[]) => VNode;
-export {};
+}>;

package/dist/types/components/header/header-renderer.d.ts

@@ -1,7 +1,6 @@
 import { VNode } from '../../stencil-public-runtime';
 import { ResizeEvent, ResizeProps } from './resizable.directive';
-import { VirtualPositionItem, ColumnTemplateProp, InitialHeaderClick } from "../../types/index";
-import { RangeArea } from "../../types/index";
+import { VirtualPositionItem, ColumnTemplateProp, InitialHeaderClick, RangeArea } from "../../types/index";
 type Props = {
     column: VirtualPositionItem;
     additionalData: any;
@@ -11,7 +10,7 @@ type Props = {
     canFilter?: boolean;
     onResize?(e: ResizeEvent): void;
     onClick?(data: InitialHeaderClick): void;
-    onDoubleClick?(data: InitialHeaderClick): void;
+    onDblClick?(data: InitialHeaderClick): void;
 } & Partial<Pick<ResizeProps, 'active'>>;
 declare const HeaderRenderer: (p: Props) => VNode;
 export default HeaderRenderer;

package/dist/types/components/header/resizable.directive.d.ts

@@ -7,7 +7,6 @@ export type ResizeProps = {
     maxWidth?: number;
     maxHeight?: number;
     onResize?(e: ResizeEvent): void;
-    onDoubleClick?(originalEvent: MouseEvent): void;
 };
 export type ResizeEvent = {
     eventName: string;

package/dist/types/components/header/resizable.element.d.ts

@@ -1,4 +1,5 @@
-import { VNode } from '../../stencil-public-runtime';
+import { FunctionalComponent } from '../../stencil-public-runtime';
 import { ResizeProps } from './resizable.directive';
 import type { CellProps } from "../../types/index";
-export declare const ResizableElement: (props: Partial<ResizeProps> & CellProps, children: VNode[]) => any;
+export type ResizableElementHTMLAttributes = Partial<ResizeProps> & CellProps;
+export declare const ResizableElement: FunctionalComponent;

package/dist/types/components/revoGrid/revo-grid.d.ts

@@ -6,13 +6,13 @@ import { DSourceState } from "../../store/index";
 import DimensionProvider from '../../services/dimension.provider';
 import ViewportProvider from '../../services/viewport.provider';
 import { AutoSizeColumnConfig } from '../../plugins/column.auto-size.plugin';
-import { ColumnFilterConfig, FilterCollection } from '../../plugins/filter/filter.plugin';
 import { DataInput } from '../../plugins/export/types';
 import { GroupingOptions } from '../../plugins/groupingRow/grouping.row.types';
 import { FocusedData } from './viewport.service';
 import type { Observable } from '../../utils/store.utils';
 import type { GridPlugin } from '../../plugins/base.plugin';
 import { ColumnCollection } from '../../utils/column.utils';
+import { ColumnFilterConfig, FilterCollection } from '../../plugins/filter/filter.types';
 /**
  * Revogrid - High-performance, customizable grid library for managing large datasets.
  *

package/dist/types/components.d.ts

@@ -8,7 +8,7 @@ import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, FocusAfterRenderEvent, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, Nullable, PluginBaseComponent, PositionItem, 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 } from "./plugins/filter/filter.plugin";
+import { ColumnFilterConfig, FilterCaptions, FilterCollection, LogicFunction, MultiFilterItem, ShowData } from "./plugins/filter/filter.types";
 import { GroupingOptions } from "./plugins/groupingRow/grouping.row.types";
 import { VNode } from "./stencil-public-runtime";
 import { FocusedData } from "./components/revoGrid/viewport.service";
@@ -16,15 +16,13 @@ import { ColumnCollection } from "./utils/column.utils";
 import { DataInput } from "./plugins/export/types";
 import { Observable } from "./utils/store.utils";
 import { DSourceState, Groups } from "./store/index";
-import { MultiFilterItem, ShowData } from "./plugins/filter/filter.panel";
-import { LogicFunction } from "./plugins/filter/filter.types";
 import { ResizeProps } from "./components/header/resizable.directive";
 import { Cell as Cell1, ColumnRegular as ColumnRegular1, DataType as DataType1, DimensionCols as DimensionCols1, DimensionRows as DimensionRows1, DimensionSettingsState as DimensionSettingsState1, Observable as Observable1, SelectionStoreState as SelectionStoreState1 } from "./components";
 import { EventData } from "./components/overlay/selection.utils";
 export { AfterEditEvent, AllDimensionType, ApplyFocusEvent, BeforeCellRenderEvent, BeforeEdit, BeforeRangeSaveDataDetails, BeforeRowRenderEvent, BeforeSaveDataDetails, Cell, ChangedRange, ColumnDataSchemaModel, ColumnGrouping, ColumnProp, ColumnRegular, ColumnType, DataFormat, DataType, DimensionCols, DimensionRows, DimensionSettingsState, DimensionType, DimensionTypeCol, DragStartEvent, EditCell, EditorCtr, Editors, ElementScroll, FocusAfterRenderEvent, FocusRenderEvent, FocusTemplateFunc, InitialHeaderClick, MultiDimensionType, Nullable, PluginBaseComponent, PositionItem, 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 } from "./plugins/filter/filter.plugin";
+export { ColumnFilterConfig, FilterCaptions, FilterCollection, LogicFunction, MultiFilterItem, ShowData } from "./plugins/filter/filter.types";
 export { GroupingOptions } from "./plugins/groupingRow/grouping.row.types";
 export { VNode } from "./stencil-public-runtime";
 export { FocusedData } from "./components/revoGrid/viewport.service";
@@ -32,8 +30,6 @@ export { ColumnCollection } from "./utils/column.utils";
 export { DataInput } from "./plugins/export/types";
 export { Observable } from "./utils/store.utils";
 export { DSourceState, Groups } from "./store/index";
-export { MultiFilterItem, ShowData } from "./plugins/filter/filter.panel";
-export { LogicFunction } from "./plugins/filter/filter.types";
 export { ResizeProps } from "./components/header/resizable.directive";
 export { Cell as Cell1, ColumnRegular as ColumnRegular1, DataType as DataType1, DimensionCols as DimensionCols1, DimensionRows as DimensionRows1, DimensionSettingsState as DimensionSettingsState1, Observable as Observable1, SelectionStoreState as SelectionStoreState1 } from "./components";
 export { EventData } from "./components/overlay/selection.utils";
@@ -404,7 +400,6 @@ export namespace Components {
         "filterEntities": Record<string, LogicFunction>;
         "filterItems": MultiFilterItem;
         "filterNames": Record<string, string>;
-        "filterTypes": Record<string, string[]>;
         "getChanges": () => Promise<ShowData | undefined>;
         "show": (newEntity?: ShowData) => Promise<void>;
     }
@@ -1712,7 +1707,6 @@ declare namespace LocalJSX {
         "filterEntities"?: Record<string, LogicFunction>;
         "filterItems"?: MultiFilterItem;
         "filterNames"?: Record<string, string>;
-        "filterTypes"?: Record<string, string[]>;
         "onFilterChange"?: (event: RevogrFilterPanelCustomEvent<MultiFilterItem>) => void;
     }
     /**

package/dist/types/plugins/filter/{filter.service.d.ts → filter.indexed.d.ts}

@@ -1,4 +1,6 @@
 import { LogicFunction } from './filter.types';
+export declare const filterCoreFunctionsIndexedByType: Record<FilterType, LogicFunction>;
+export declare const filterTypes: Record<string, FilterType[]>;
 export declare const filterNames: {
     none: string;
     empty: string;
@@ -16,5 +18,3 @@ export declare const filterNames: {
     lte: string;
 };
 export type FilterType = keyof typeof filterNames;
-export declare const filterEntities: Record<FilterType, LogicFunction>;
-export declare const filterTypes: Record<string, FilterType[]>;

package/dist/types/plugins/filter/filter.panel.d.ts

@@ -1,31 +1,8 @@
 import { EventEmitter, VNode } from '../../stencil-public-runtime';
-import { FilterType } from './filter.service';
 import '../../utils/closest.polifill';
-import { LogicFunction } from './filter.types';
-import { FilterCaptions } from './filter.plugin';
+import { FilterCaptions, LogicFunction, MultiFilterItem, ShowData } from './filter.types';
 import { ColumnProp } from "../../types/index";
-export type FilterItem = {
-    prop?: ColumnProp;
-    type?: FilterType;
-    value?: any;
-};
-export type FilterData = {
-    id: number;
-    type: FilterType;
-    value?: any;
-    relation: 'and' | 'or';
-};
-export type MultiFilterItem = {
-    [prop: string]: FilterData[];
-};
-export type ShowData = {
-    x: number;
-    y: number;
-    /**
-     * Auto correct position if it is out of document bounds
-     */
-    autoCorrect?: boolean;
-} & FilterItem;
+import { FilterType } from './filter.indexed';
 /**
  * Filter panel for editing filters
  */
@@ -41,7 +18,6 @@ export declare class FilterPanel {
     currentFilterType: FilterType;
     changes: ShowData | undefined;
     filterItems: MultiFilterItem;
-    filterTypes: Record<string, string[]>;
     filterNames: Record<string, string>;
     filterEntities: Record<string, LogicFunction>;
     filterCaptions: FilterCaptions | undefined;
@@ -51,7 +27,7 @@ export declare class FilterPanel {
     show(newEntity?: ShowData): Promise<void>;
     getChanges(): Promise<ShowData | undefined>;
     componentWillRender(): void;
-    renderSelectOptions(type: FilterType, isDefaultTypeRemoved?: boolean): VNode[];
+    renderSelectOptions(type: FilterType, isDefaultTypeRemoved?: boolean): VNode[] | undefined;
     renderExtra(prop: ColumnProp, index: number): any;
     getFilterItemsList(): any;
     private autoCorrect;

package/dist/types/plugins/filter/filter.plugin.d.ts

@@ -1,28 +1,6 @@
 import { BasePlugin } from '../base.plugin';
-import { MultiFilterItem } from './filter.panel';
-import { FilterType } from './filter.service';
-import { LogicFunction } from './filter.types';
-import { ColumnProp, ColumnRegular, DataType } from "../../types/index";
-import { PluginProviders } from "../../types/index";
-type CustomFilter = {
-    columnFilterType: string;
-    name: string;
-    func: LogicFunction;
-};
-export type FilterCaptions = {
-    title: string;
-    save: string;
-    reset: string;
-    cancel: string;
-    add: string;
-    placeholder: string;
-    and: string;
-    or: string;
-};
-export type FilterLocalization = {
-    captions: FilterCaptions;
-    filterNames: Record<FilterType, string>;
-};
+import { ColumnFilterConfig, FilterCollection, LogicFunction, MultiFilterItem } from './filter.types';
+import { ColumnRegular, DataType, PluginProviders } from "../../types/index";
 /**
  * @typedef ColumnFilterConfig
  * @type {object}
@@ -37,22 +15,6 @@ export type FilterLocalization = {
 /**
  * @internal
  */
-export type ColumnFilterConfig = {
-    collection?: FilterCollection;
-    include?: string[];
-    customFilters?: Record<string, CustomFilter>;
-    filterProp?: string;
-    localization?: FilterLocalization;
-    multiFilterItems?: MultiFilterItem;
-    disableDynamicFiltering?: boolean;
-};
-type HeaderEvent = CustomEvent<ColumnRegular>;
-type FilterCollectionItem = {
-    filter: LogicFunction;
-    type: FilterType;
-    value?: any;
-};
-export type FilterCollection = Record<ColumnProp, FilterCollectionItem>;
 export declare const FILTER_TRIMMED_TYPE = "filter";
 export declare const FILTER_CONFIG_CHANGED_EVENT = "filterconfigchanged";
 export declare class FilterPlugin extends BasePlugin {
@@ -60,26 +22,31 @@ export declare class FilterPlugin extends BasePlugin {
     pop?: HTMLRevogrFilterPanelElement;
     filterCollection: FilterCollection;
     multiFilterItems: MultiFilterItem;
-    possibleFilters: Record<string, string[]>;
-    possibleFilterNames: Record<string, string>;
-    possibleFilterEntities: Record<string, LogicFunction>;
+    filterByType: Record<string, string[]>;
+    filterNameIndexByType: Record<string, string>;
+    filterFunctionsIndexedByType: Record<string, LogicFunction>;
     filterProp: string;
     constructor(revogrid: HTMLRevoGridElement, providers: PluginProviders, config?: ColumnFilterConfig);
     initConfig(config: ColumnFilterConfig): void;
-    headerclick(e: HeaderEvent): Promise<void>;
+    headerclick(e: CustomEvent<ColumnRegular>): Promise<void>;
     getColumnFilter(type?: boolean | string | string[]): Record<string, string[]>;
     isValidType(type: any): type is string;
+    /**
+     * Called on internal component change
+     */
     onFilterChange(filterItems: MultiFilterItem): Promise<void>;
     /**
      * Triggers grid filtering
      */
-    doFiltering(collection: FilterCollection, items: DataType[], columns: ColumnRegular[], filterItems: MultiFilterItem): Promise<void>;
+    doFiltering(collection: FilterCollection, source: DataType[], columns: ColumnRegular[], filterItems: MultiFilterItem): Promise<void>;
     clearFiltering(): Promise<void>;
     runFiltering(): Promise<void>;
     getData(): Promise<{
         source: DataType[];
         columns: ColumnRegular[];
     }>;
-    getRowFilter(rows: DataType[], filterItems: MultiFilterItem): Record<number, boolean>;
+    /**
+     * Get trimmed rows based on filter
+     */
+    getRowFilter(rows: DataType[], filterItems: MultiFilterItem, columnByProp: Record<string, ColumnRegular>): Record<number, boolean>;
 }
-export {};

package/dist/types/plugins/filter/filter.types.d.ts

@@ -1,8 +1,93 @@
+import { ColumnProp } from "../../types/index";
+import { FilterType } from './filter.indexed';
 export type DateEnum = 'today' | 'yesterday' | 'tomorrow' | 'thisweek' | 'lastweek' | 'nextweek' | 'thismonth' | 'lastmonth' | 'nextmonth' | 'thisyear' | 'lastyear' | 'nextyear';
 export type ExtraField = 'input' | 'select' | 'multi' | 'datepicker';
 export type LogicFunctionParam = any;
-export type LogicFunctionExtraParam = 'select' | 'input' | 'multi' | 'datepicker' | undefined | string | number | Date | DateEnum | null | undefined | string[] | number[];
+export type LogicFunctionExtraParam = 'select' | 'input' | 'multi' | 'datepicker' | number | Date | DateEnum | null | undefined | string | string[] | number[];
 export type LogicFunction = {
     (value: LogicFunctionParam, extra?: LogicFunctionExtraParam): boolean;
     extra?: ExtraField;
 };
+type CustomFilter = {
+    columnFilterType: string;
+    name: string;
+    func: LogicFunction;
+};
+export type FilterCaptions = {
+    title: string;
+    save: string;
+    reset: string;
+    cancel: string;
+    add: string;
+    placeholder: string;
+    and: string;
+    or: string;
+};
+export type FilterLocalization = {
+    captions: FilterCaptions;
+    filterNames: Record<FilterType, string>;
+};
+/**
+ * Filter configuration for a column. This is the type of the `filter` property on a column.
+ */
+export type ColumnFilterConfig = {
+    /**
+     * The collection of filters to be applied to the column.
+     */
+    collection?: FilterCollection;
+    /**
+     * The names of the filters to be included in the filter dropdown.
+     */
+    include?: string[];
+    /**
+     * A mapping of custom filter names to custom filter functions.
+     */
+    customFilters?: Record<string, CustomFilter>;
+    /**
+     * The property on the column idintifying which has the filter is applied.
+     */
+    filterProp?: string;
+    /**
+     * The localization for the filter dropdown.
+     */
+    localization?: FilterLocalization;
+    /**
+     * Information about the multi-filter items.
+     */
+    multiFilterItems?: MultiFilterItem;
+    /**
+     * Whether or not to disable dynamic filtering. If set to true, the filter will only be applied
+     * when the user clicks on the filter button.
+     */
+    disableDynamicFiltering?: boolean;
+};
+type FilterCollectionItem = {
+    filter: LogicFunction;
+    type: FilterType;
+    value?: any;
+};
+export type FilterCollection = Record<ColumnProp, FilterCollectionItem>;
+export type FilterItem = {
+    prop?: ColumnProp;
+    type?: FilterType;
+    value?: any;
+};
+export type FilterData = {
+    id: number;
+    type: FilterType;
+    value?: any;
+    relation: 'and' | 'or';
+};
+export type MultiFilterItem = {
+    [prop: string]: FilterData[];
+};
+export type ShowData = {
+    x: number;
+    y: number;
+    /**
+     * Auto correct position if it is out of document bounds
+     */
+    autoCorrect?: boolean;
+    filterTypes?: Record<string, string[]>;
+} & FilterItem;
+export {};

package/dist/types/services/column.data.provider.d.ts

@@ -7,6 +7,7 @@ type SortingOrder = Record<ColumnProp, 'asc' | 'desc' | undefined>;
 export default class ColumnDataProvider {
     readonly dataSources: ColumnDataSources;
     sorting: Sorting | null;
+    collection: ColumnCollection | null;
     get order(): SortingOrder;
     get stores(): ColumnDataSources;
     constructor();
@@ -15,7 +16,7 @@ export default class ColumnDataProvider {
     getRawColumns(): Record<DimensionCols, ColumnRegular[]>;
     getColumns(type?: DimensionCols | 'all'): ColumnRegular[];
     getColumnIndexByProp(prop: ColumnProp, type: DimensionCols): number;
-    getColumnByProp(prop: ColumnProp, type: DimensionCols): ColumnRegular | undefined;
+    getColumnByProp(prop: ColumnProp): ColumnRegular[] | undefined;
     refreshByType(type: DimensionCols): void;
     setColumns(data: ColumnCollection): ColumnCollection;
     updateColumns(cols: ColumnRegular[]): void;

package/dist/types/themeManager/theme.compact.d.ts

@@ -1,4 +1,4 @@
 import { ThemePackage } from '../types/theme';
-export default class ThemeCompact implements ThemePackage {
+export declare class ThemeCompact implements ThemePackage {
     defaultRowSize: number;
 }