@revolist/revogrid 4.27.1 → 4.27.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{filter.button-F2Bw3UAd.js → filter.button-C6ixuMmr.js} +3 -2
- package/dist/cjs/index.cjs.js +3 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/revo-grid.cjs.entry.js +3 -3
- package/dist/cjs/revo-grid.cjs.js +1 -1
- package/dist/cjs/revogr-data_4.cjs.entry.js +9 -8
- package/dist/cjs/revogr-filter-panel.cjs.entry.js +139 -33
- package/dist/cjs/{row-resize.plugin-sK9_rcUN.js → row-resize.plugin-C4YOF1lN.js} +54 -5
- package/dist/collection/components/header/header-renderer.js +7 -6
- package/dist/collection/components/header/revogr-header-style.css +8 -3
- package/dist/collection/components/revoGrid/revo-grid-style.css +12 -2
- package/dist/collection/plugins/filter/filter.button.js +3 -2
- package/dist/collection/plugins/filter/filter.indexed.js +5 -0
- package/dist/collection/plugins/filter/filter.panel.js +138 -31
- package/dist/collection/plugins/filter/filter.plugin.js +48 -5
- package/dist/collection/plugins/filter/filter.style.css +25 -3
- package/dist/{revo-grid/filter.button-DMhpuAiw.js → esm/filter.button-CEPUxLUo.js} +3 -2
- package/dist/esm/index.js +3 -3
- package/dist/esm/loader.js +1 -1
- package/dist/esm/revo-grid.entry.js +3 -3
- package/dist/esm/revo-grid.js +1 -1
- package/dist/esm/revogr-data_4.entry.js +9 -8
- package/dist/esm/revogr-filter-panel.entry.js +139 -33
- package/dist/{revo-grid/row-resize.plugin-DBOgjLdE.js → esm/row-resize.plugin-Beu0pMds.js} +54 -6
- package/dist/{esm/filter.button-DMhpuAiw.js → revo-grid/filter.button-CEPUxLUo.js} +3 -2
- package/dist/revo-grid/index.esm.js +3 -3
- package/dist/revo-grid/revo-grid.entry.js +3 -3
- package/dist/revo-grid/revo-grid.esm.js +1 -1
- package/dist/revo-grid/revogr-data_4.entry.js +9 -8
- package/dist/revo-grid/revogr-filter-panel.entry.js +139 -33
- package/dist/{esm/row-resize.plugin-DBOgjLdE.js → revo-grid/row-resize.plugin-Beu0pMds.js} +54 -6
- package/dist/types/plugins/filter/filter.indexed.d.ts +2 -0
- package/dist/types/plugins/filter/filter.panel.d.ts +9 -2
- package/dist/types/plugins/filter/filter.plugin.d.ts +8 -1
- package/dist/types/plugins/filter/filter.types.d.ts +8 -0
- package/dist/types/types/interfaces.d.ts +13 -1
- package/hydrate/index.js +203 -46
- package/hydrate/index.mjs +203 -46
- package/package.json +1 -1
- package/standalone/filter.button.js +1 -1
- package/standalone/index.js +1 -1
- package/standalone/revo-grid.js +1 -1
- package/standalone/revogr-filter-panel.js +1 -1
- package/standalone/revogr-header2.js +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Built by Revolist OU ❤️
|
|
3
3
|
*/
|
|
4
|
-
import{proxyCustomElement as t,HTMLElement as e,createEvent as i,h as r,Host as o,transformTag as l}from"@stencil/core/internal/client";import{d as s}from"./debounce.js";import{e as n,f as a,d,i as h}from"./filter.button.js";Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector),Element.prototype.closest||(Element.prototype.closest=function(t){let e=this;do{if(Element.prototype.matches.call(e,t))return e;e=e.parentElement||e.parentNode}while(null!==e&&1===e.nodeType);return null});const c="text/revogrid-filter-id";function p(t,e,i){if(e===i)return!1;const r=t.findIndex((t=>t.id===e)),o=t.findIndex((t=>t.id===i));if(-1===r||-1===o||r===o)return!1;const l=t.map((t=>{var e;return null!==(e=t.relation)&&void 0!==e?e:"and"})),[s]=t.splice(r,1);return t.splice(o,0,s),t.forEach(((e,i)=>{var r;e.relation=i===t.length-1?"and":null!==(r=l[i])&&void 0!==r?r:"and"})),!0}const u="none",f="add-filter",g=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.filterChange=i(this,"filterChange",7),this.resetChange=i(this,"resetChange",7),this.filterCaptionsInternal={title:"Filter by",ok:"Close",save:"Save",reset:"Reset",cancel:"Cancel",add:"Add condition",placeholder:"Enter value...",and:"and",or:"or",filterCondition:"Filter condition",removeFilter:"Remove filter",reorderFilter:"Reorder filter"},this.isFilterIdSet=!1,this.filterId=0,this.currentFilterId=-1,this.currentFilterType=u,this.filterItems={},this.filterNames={},this.filterEntities={},this.disableDynamicFiltering=!1,this.closeOnOutsideClick=!0,this.allowDuplicateOperators=!0,this.debouncedApplyFilter=s((()=>{this.filterChange.emit(this.filterItems)}),400)}onMouseDown(t){if(!this.changes)return;const e=t.composedPath(),i=this.getAddFilterSelect();if(i instanceof HTMLSelectElement){if(e.includes(i))return;i.value=u}this.currentFilterType=u,this.changes&&(this.changes.type=u),this.currentFilterId=-1,!e.includes(this.element)&&!this.isOwnFilterButton(t.target)&&this.closeOnOutsideClick&&(this.changes=void 0)}async show(t){this.changes=t,this.filterItems=(null==t?void 0:t.filterItems)||{},this.changes&&(this.changes.type=this.changes.type||u)}async getChanges(){return this.changes}componentWillRender(){if(!this.isFilterIdSet){this.isFilterIdSet=!0;const t=Object.keys(this.filterItems);for(const e of t)this.filterId+=this.filterItems[e].length}}getFilterItemsList(){var t,e;const i=null===(t=this.changes)||void 0===t?void 0:t.prop;if(void 0===i)return"";const o=null!==(e=this.filterItems[i])&&void 0!==e?e:[],l=o.filter((t=>!t.hidden)).length,s=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions);return r("div",{key:this.filterId},r("ul",{class:"multi-filter-list-container"},o.map(((t,e)=>{let o;if(t.hidden)return;e!==this.filterItems[i].length-1&&(o=r(n,{text:"and"===t.relation?s.and:s.or,onClick:()=>this.toggleFilterAndOr(t.id)}));const h=this.renderExtra(i,e),c=this.draggedFilterId===t.id,p=this.dragOverFilterId===t.id&&!c,u=l>1;return r("li",{key:t.id,class:"multi-filter-list","aria-label":`${s.filterCondition} ${e+1}`},r("div",{class:{"multi-filter-list-row":!0,"filter-row-drop-active":void 0!==this.draggedFilterId&&!c,"filter-row-dragging":c,"filter-row-drag-over":p}},u?r("button",{type:"button",class:"filter-row-drop-target",tabIndex:-1,"aria-label":`${s.filterCondition} ${e+1}`,onDragOver:e=>this.onFilterDragOver(e,t.id),onDragLeave:()=>this.onFilterDragLeave(t.id),onDrop:e=>this.onFilterDrop(e,i,t.id)}):"",u?r(a,{ariaLabel:s.reorderFilter,dragging:c,dragOver:p,onDragStart:e=>this.onFilterDragStart(e,t.id),onDragEnd:()=>this.onFilterDragEnd(),onKeyDown:e=>this.onFilterReorderKeyDown(e,i,t.id)}):"",r("div",{class:{"select-input":!0}},r("select",{class:"select-css select-filter",onChange:t=>this.onFilterTypeChange(t,i,e)},this.renderSelectOptions(this.filterItems[i][e].type,!0)),h?r("div",{class:"filter-extra"},h):""),r("div",{class:"multi-filter-list-action"},o,r(d,{ariaLabel:s.removeFilter,onClick:()=>this.onRemoveFilter(t.id)}))))}))),o.some((t=>!t.hidden))?r("div",{class:"add-filter-divider"}):"")}componentDidRender(){this.syncDialog()}syncDialog(){this.dialog&&(this.changes?(this.dialog.open||this.dialog.show(),!1!==this.changes.autoCorrect&&(this.autoCorrect(this.dialog),requestAnimationFrame((()=>this.autoCorrect(this.dialog))))):this.dialog.open&&this.dialog.close())}autoCorrect(t){var e;if(!t||!this.changes)return;t.style.maxHeight="",t.style.left=this.changes.x+"px",t.style.top=this.changes.y+"px";const i=t.getBoundingClientRect(),r=null!==(e=this.changes.anchorY)&&void 0!==e?e:this.changes.y,o=this.changes.y,l=Math.max(0,r-8),s=Math.max(0,window.innerHeight-o-8),n=i.height>s&&l>s;t.style.maxHeight=Math.max(8,n?l:s)+"px";const a=t.getBoundingClientRect(),d=Math.max(8,window.innerWidth-a.width-8),h=Math.max(8,window.innerHeight-a.height-8),c=Math.min(Math.max(8,this.changes.x),d),p=Math.min(Math.max(8,n?r-a.height:o),h);t.style.left=c+"px",t.style.top=p+"px"}onFilterTypeChange(t,e,i){t.target instanceof HTMLSelectElement&&(this.filterItems[e][i].type=t.target.value,this.filterId++,setTimeout((()=>{const t=document.getElementById("filter-input-"+this.filterItems[e][i].id);t instanceof HTMLInputElement&&t.focus()}),0),this.disableDynamicFiltering||this.debouncedApplyFilter())}onAddNewFilter(t){this.currentFilterType=t.target.value,this.addNewFilterToProp();const e=this.getAddFilterSelect();e&&(e.value=u,this.currentFilterType=u),this.disableDynamicFiltering||this.debouncedApplyFilter()}addNewFilterToProp(){var t;const e=null===(t=this.changes)||void 0===t?void 0:t.prop;(e||0===e)&&(this.filterItems[e]||(this.filterItems[e]=[]),"none"!==this.currentFilterType&&(this.filterId++,this.currentFilterId=this.filterId,this.filterItems[e].push({id:this.currentFilterId,type:this.currentFilterType,value:"",relation:"and"}),setTimeout((()=>{const t=document.getElementById("filter-input-"+this.currentFilterId);t&&t.focus()}),0)))}onSave(){this.filterChange.emit(this.filterItems)}onCancel(){this.changes=void 0}onReset(){var t;this.assertChanges(),this.resetChange.emit(null===(t=this.changes)||void 0===t?void 0:t.prop),this.filterId++}onRemoveFilter(t){var e;this.assertChanges(),this.filterId++;const i=null===(e=this.changes)||void 0===e?void 0:e.prop,r=this.filterItems[null!=i?i:""];if(!r)return;const o=r.findIndex((e=>e.id===t));-1!==o&&(r.splice(o,1),0===r.length&&delete this.filterItems[null!=i?i:""],this.disableDynamicFiltering||this.debouncedApplyFilter())}onFilterDragStart(t,e){this.draggedFilterId=e,function(t,e){t&&(t.effectAllowed="move",t.setData(c,e+""),t.setData("text/plain",e+""))}(t.dataTransfer,e)}onFilterDragOver(t,e){void 0!==this.draggedFilterId&&this.draggedFilterId!==e&&(t.preventDefault(),t.dataTransfer&&(t.dataTransfer.dropEffect="move"),this.dragOverFilterId=e)}onFilterDragLeave(t){this.dragOverFilterId===t&&(this.dragOverFilterId=void 0)}onFilterDrop(t,e,i){var r;t.preventDefault();const o=null!==(r=this.draggedFilterId)&&void 0!==r?r:function(t){if(!t)return;const e=(t.getData(c)||t.getData("text/plain")).trim();if(!e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}(t.dataTransfer);if(this.onFilterDragEnd(),void 0===o)return;const l=this.filterItems[e];l&&p(l,o,i)&&(this.filterId++,this.disableDynamicFiltering||this.debouncedApplyFilter())}onFilterDragEnd(){this.draggedFilterId=void 0,this.dragOverFilterId=void 0}onFilterReorderKeyDown(t,e,i){let r=0;if("ArrowUp"===t.key)r=-1;else{if("ArrowDown"!==t.key)return;r=1}const o=this.filterItems[e];if(!o)return;const l=o.filter((t=>!t.hidden)),s=l.findIndex((t=>t.id===i));if(-1===s)return;t.preventDefault(),t.stopPropagation();const n=l[s+r];n&&p(o,i,n.id)&&(this.filterId++,this.disableDynamicFiltering||this.debouncedApplyFilter())}toggleFilterAndOr(t){var e;this.assertChanges(),this.filterId++;const i=null===(e=this.changes)||void 0===e?void 0:e.prop,r=this.filterItems[null!=i?i:""];if(!r)return;const o=r.findIndex((e=>e.id===t));-1!==o&&(r[o].relation="and"===r[o].relation?"or":"and",this.disableDynamicFiltering||this.debouncedApplyFilter())}assertChanges(){if(!this.changes)throw Error("Changes required per edit")}renderSelectOptions(t,e=!1){var i;if(!this.changes)return;const o=[],l=this.changes.prop;if(void 0===l)return;const s=new Set;Object.keys(this.filterItems).forEach((t=>{this.filterItems[t].forEach((t=>{t.hidden&&s.add(t.type)}))}));const n=new Set((null!==(i=this.filterItems[l])&&void 0!==i?i:[]).filter((t=>!t.hidden)).map((t=>t.type)));if(!e){const t=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions);o.push(r("option",{selected:this.currentFilterType===u,value:u},l&&this.filterItems[l]&&this.filterItems[l].length>0?t.add:this.filterNames[u]))}for(let i in this.changes.filterTypes){const l=this.changes.filterTypes[i].filter((i=>!s.has(i)&&(this.allowDuplicateOperators||!n.has(i)||e&&t===i)));l.length&&(o.push(...l.map((e=>r("option",{value:e,selected:t===e},this.filterNames[e])))),o.push(r("option",{disabled:!0})))}return o}renderExtra(t,e){const i=this.filterItems[t];if(!i)return"";const o=i=>{this.filterItems[t][e].value=i,this.disableDynamicFiltering||this.debouncedApplyFilter()},l=()=>{const t=this.getAddFilterSelect();t&&(t.value=u,this.currentFilterType=u,this.addNewFilterToProp(),t.focus())},s=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions),n=this.filterEntities[i[e].type].extra;return"function"==typeof n?n(r,{value:i[e].value,filter:i[e],prop:t,index:e,placeholder:s.placeholder,onInput:t=>{o(t)},onFocus:()=>{l()}}):"input"!==n&&"datepicker"!==n?"":r("input",{id:"filter-input-"+i[e].id,placeholder:s.placeholder,type:"datepicker"===n?"date":"text",value:i[e].value,onInput:t=>{t.target instanceof HTMLInputElement&&o(t.target.value)},onKeyDown:t=>{"enter"!==t.key.toLowerCase()?t.stopPropagation():this.getAddFilterSelect()&&l()}})}getAddFilterSelect(){return this.element.querySelector("#"+f)}isOwnFilterButton(t){if(!(t instanceof Element))return!1;if(!h(t))return!1;const e=this.getOwningGrid(this.element),i=this.getOwningGrid(t);return!!e&&e===i}getOwningGrid(t){const e=t.closest("revo-grid");if(e)return e;const i=t.getRootNode();return i instanceof ShadowRoot&&"revo-grid"===i.host.localName?i.host:void 0}render(){var t,e,i,l,s,n,a,d,h;const c={left:(null!==(e=null===(t=this.changes)||void 0===t?void 0:t.x)&&void 0!==e?e:0)+"px",top:(null!==(l=null===(i=this.changes)||void 0===i?void 0:i.y)&&void 0!==l?l:0)+"px"},p=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions);return r(o,{key:"d0e4ebb408750b11b3965da6a25e581733c968e3"},r("dialog",{key:"3df36777c931ec1063e8574169ca880a99dbfe41",class:"filter-panel-dialog",style:c,ref:t=>this.dialog=t,onCancel:t=>{t.preventDefault(),this.onCancel()}},this.changes&&[r("slot",{key:"header-slot",slot:"header"}),(null===(n=(s=this.changes).extraContent)||void 0===n?void 0:n.call(s,this.changes))||"",!0!==(null===(a=this.changes)||void 0===a?void 0:a.hideDefaultFilters)&&[r("label",{key:"filter-title"},p.title),r("div",{key:"filter-holder",class:"filter-holder"},this.getFilterItemsList()),r("div",{key:"add-filter",class:"add-filter"},r("select",{key:"e2a8bd29f2090d3e6c933795427b71ca190b82aa",id:f,class:"select-css",onChange:t=>this.onAddNewFilter(t)},this.renderSelectOptions(this.currentFilterType)))],r("slot",{key:"default-slot"}),(null===(h=(d=this.changes).extraBottomContent)||void 0===h?void 0:h.call(d,this.changes))||"",r("div",{key:"filter-actions",class:"filter-actions"},this.disableDynamicFiltering&&[r("button",{key:"save",type:"button",id:"revo-button-save","aria-label":"save",class:"revo-button green",onClick:()=>this.onSave()},p.save),r("button",{key:"cancel",type:"button",id:"revo-button-ok","aria-label":"ok",class:"revo-button green",onClick:()=>this.onCancel()},p.cancel)],!this.disableDynamicFiltering&&[r("button",{key:"ok",type:"button",id:"revo-button-ok","aria-label":"ok",class:"revo-button green",onClick:()=>this.onCancel()},p.ok),r("button",{key:"reset",type:"button",id:"revo-button-reset","aria-label":"reset",class:"revo-button outline",onClick:()=>this.onReset()},p.reset)]),r("slot",{key:"footer-slot",slot:"footer"})]))}get element(){return this}static get style(){return'.revo-button{position:relative;overflow:hidden;color:var(--rg-theme-button-text);background-color:var(--rg-theme-button-bg);height:32px;line-height:32px;padding:0 15px;outline:0;border:0;border-radius:7px;box-sizing:border-box;cursor:pointer}.revo-button.green{background-color:var(--rg-theme-button-success-bg)}.revo-button.red{background-color:var(--rg-theme-button-danger-bg)}.revo-button:disabled,.revo-button[disabled]{cursor:not-allowed !important;filter:opacity(0.35) !important}.revo-button.outline{border:1px solid var(--rg-theme-button-outline-border);line-height:30px;background:none;color:var(--rg-theme-button-outline-text);box-shadow:none}revogr-filter-panel{display:block}revogr-filter-panel .filter-panel-dialog{position:fixed;top:0;left:0;z-index:100;max-height:calc(100vh - 16px);overflow:auto;opacity:1;transform:none;color:var(--rg-theme-filter-panel-text);background-color:var(--rg-theme-filter-panel-bg);border:1px solid var(--rg-theme-filter-panel-border);transform-origin:62px 0px;box-shadow:0 5px 18px -2px var(--rg-theme-filter-panel-shadow);box-sizing:border-box;padding:10px;border-radius:8px;margin:0;min-width:220px;text-align:left;animation:revogr-filter-panel-open 140ms cubic-bezier(0.2, 0, 0, 1)}revogr-filter-panel .filter-panel-dialog .filter-holder>div{display:flex;flex-direction:column}revogr-filter-panel .filter-panel-dialog label{font-size:13px;display:block;padding:8px 0}revogr-filter-panel .filter-panel-dialog select{width:100%}revogr-filter-panel .filter-panel-dialog input[type=text]{border:0;min-height:34px;margin:5px 0;color:var(--rg-theme-filter-panel-text);background:var(--rg-theme-filter-panel-input-bg);border-radius:5px;padding:0 10px;box-sizing:border-box;width:100%}revogr-filter-panel .filter-panel-dialog .filter-actions{position:sticky;right:0;bottom:-10px;left:0;z-index:1;text-align:right;margin:10px -10px -10px;padding:0 5px 10px 10px;background:var(--rg-theme-filter-panel-bg);border-top:1px solid var(--rg-theme-filter-panel-divider)}revogr-filter-panel .filter-panel-dialog .filter-actions button{margin-top:10px;margin-right:5px}@keyframes revogr-filter-panel-open{from{opacity:0;transform:translateY(-4px) scale(0.98)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){revogr-filter-panel .filter-panel-dialog{animation:none}}.rgHeaderCell:hover .rv-filter{transition:opacity 267ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 178ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}.rgHeaderCell:hover .rv-filter,.rgHeaderCell .rv-filter.active{opacity:1}.rgHeaderCell .rv-filter{height:24px;width:24px;background:none;border:0;opacity:0;visibility:visible;cursor:pointer;border-radius:4px;position:relative;z-index:1}.rgHeaderCell .rv-filter.active{color:var(--rg-theme-filter-panel-icon-active)}.rgHeaderCell .rv-filter .filter-img{color:var(--rg-theme-filter-panel-icon);width:11px}.select-css{display:block;font-family:sans-serif;line-height:1.3;padding:0.6em 1.4em 0.5em 0.8em;width:100%;max-width:100%;box-sizing:border-box;margin:0;color:var(--rg-theme-filter-panel-text);border:1px solid var(--rg-theme-filter-panel-select-border);box-shadow:transparent;border-radius:0.5em;appearance:none;background-color:var(--rg-theme-filter-panel-input-bg);background-image:var(--revo-grid-filter-panel-select-arrow, 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%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"));background-repeat:no-repeat, repeat;background-position:right 0.7em top 50%, 0 0;background-size:0.65em auto, 100%;}.select-css::-ms-expand{display:none}.select-css{}.select-css:hover{border-color:var(--rg-theme-filter-panel-select-border)}.select-css{}.select-css:focus{border-color:var(--rg-theme-filter-panel-select-border-hover);box-shadow:var(--rg-theme-filter-panel-focus-ring);outline:none}.select-css{}.select-css option{font-weight:normal}.select-css{}.select-css:disabled,.select-css[aria-disabled=true]{color:var(--rg-theme-filter-panel-muted-text);background-image:var(--revo-grid-filter-panel-select-arrow-disabled, 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"))}.select-css:disabled:hover,.select-css[aria-disabled=true]{border-color:var(--rg-theme-filter-panel-select-border)}.multi-filter-list{margin-top:5px;margin-bottom:5px}.multi-filter-list div{white-space:nowrap}.multi-filter-list .multi-filter-list-row{display:flex;align-items:center;gap:6px;position:relative}.multi-filter-list .multi-filter-list-row.filter-row-dragging{opacity:0.65}.multi-filter-list .multi-filter-list-row.filter-row-drag-over::before{content:"";position:absolute;top:-4px;right:0;left:0;z-index:2;height:2px;background:var(--rg-theme-filter-panel-reorder-accent);border-radius:999px;box-shadow:0 0 0 2px var(--rg-theme-filter-panel-bg)}.multi-filter-list .multi-filter-list-row.filter-row-drop-active .filter-row-drop-target{pointer-events:auto}.multi-filter-list .filter-row-drop-target{position:absolute;inset:0;z-index:1;padding:0;pointer-events:none;background:transparent;border:0}.multi-filter-list .multi-filter-list-action{display:flex;align-self:stretch;flex:0 0 auto;justify-content:flex-end;align-items:center}.multi-filter-list .and-or-button{margin:0 0 0 10px;min-width:58px;cursor:pointer}.multi-filter-list .trash-button{margin:0 0 -2px 6px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;width:22px;height:100%;font-size:16px}.multi-filter-list .trash-button .trash-img{width:1em}.multi-filter-list .reorder-button{border:0;background:transparent;color:var(--rg-theme-filter-panel-reorder-color);cursor:grab;font-family:monospace;font-size:12px;letter-spacing:0;line-height:1;padding:6px 2px;transform:scaleX(0.8);width:16px}.multi-filter-list .reorder-button.filter-row-drag-over{color:var(--rg-theme-filter-panel-reorder-accent)}.multi-filter-list .reorder-button:active{cursor:grabbing}.multi-filter-list-container{padding:0;margin:0;list-style:none}.add-filter-divider{display:block;margin:0 -10px 10px -10px;border-bottom:1px solid var(--rg-theme-filter-panel-divider);height:10px}.select-input{display:flex;align-items:center;flex:1 1 auto;gap:6px;min-width:0}.select-input .select-filter,.select-input .filter-extra{flex:1 1 0;min-width:0}.select-input .select-filter{width:auto}.select-input .filter-extra{display:flex}.select-input .filter-extra>*{width:100%}.select-input input[type=text],.select-input input[type=date]{margin:0}'}},[260,"revogr-filter-panel",{filterNames:[16],filterEntities:[16],filterCaptions:[16],disableDynamicFiltering:[4,"disable-dynamic-filtering"],closeOnOutsideClick:[4,"close-on-outside-click"],allowDuplicateOperators:[4,"allow-duplicate-operators"],isFilterIdSet:[32],filterId:[32],currentFilterId:[32],currentFilterType:[32],changes:[32],filterItems:[32],draggedFilterId:[32],dragOverFilterId:[32],show:[64],getChanges:[64]},[[5,"mousedown","onMouseDown"]]]),v=g,b=function(){"undefined"!=typeof customElements&&["revogr-filter-panel"].forEach((t=>{"revogr-filter-panel"===t&&(customElements.get(l(t))||customElements.define(l(t),g))}))};export{v as RevogrFilterPanel,b as defineCustomElement}
|
|
4
|
+
import{proxyCustomElement as t,HTMLElement as e,createEvent as i,h as r,Host as o,transformTag as l}from"@stencil/core/internal/client";import{d as s}from"./debounce.js";import{e as n,f as a,d,i as h}from"./filter.button.js";Element.prototype.matches||(Element.prototype.matches=Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector),Element.prototype.closest||(Element.prototype.closest=function(t){let e=this;do{if(Element.prototype.matches.call(e,t))return e;e=e.parentElement||e.parentNode}while(null!==e&&1===e.nodeType);return null});const c="text/revogrid-filter-id";function p(t,e,i){if(e===i)return!1;const r=t.findIndex((t=>t.id===e)),o=t.findIndex((t=>t.id===i));if(-1===r||-1===o||r===o)return!1;const l=t.map((t=>{var e;return null!==(e=t.relation)&&void 0!==e?e:"and"})),[s]=t.splice(r,1);return t.splice(o,0,s),t.forEach(((e,i)=>{var r;e.relation=i===t.length-1?"and":null!==(r=l[i])&&void 0!==r?r:"and"})),!0}const u="none",f="add-filter",g=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.filterChange=i(this,"filterChange",7),this.resetChange=i(this,"resetChange",7),this.hasChanges=!1,this.filterCaptionsInternal={title:"Filter by",ok:"Close",save:"Save",reset:"Reset",cancel:"Cancel",add:"Add condition",placeholder:"Enter value...",and:"and",or:"or",filterCondition:"Filter condition",removeFilter:"Remove filter",reorderFilter:"Reorder filter"},this.isFilterIdSet=!1,this.filterId=0,this.currentFilterId=-1,this.currentFilterType=u,this.filterItems={},this.filterNames={},this.filterEntities={},this.disableDynamicFiltering=!1,this.closeOnOutsideClick=!0,this.allowDuplicateOperators=!0,this.debouncedApplyFilter=s((()=>{this.emitFilterChange()}),400)}onMouseDown(t){if(!this.changes)return;const e=t.composedPath(),i=this.getAddFilterSelect();if(i instanceof HTMLSelectElement){if(e.includes(i))return;i.value=u}this.currentFilterType=u,this.changes&&(this.changes.type=u),this.currentFilterId=-1,!e.includes(this.element)&&!this.isOwnFilterButton(t.target)&&this.closeOnOutsideClick&&(this.changes=void 0)}async show(t){if(this.hasChanges=!1,this.changes=t,this.filterItems=this.cloneFilterItems((null==t?void 0:t.filterItems)||{}),this.draftFilter=void 0,this.changes){this.changes.type=this.changes.type||u;const t=this.changes.prop,e=void 0===t?void 0:this.filterItems[t];if(!(null==e?void 0:e.length)&&!1!==this.changes.showDefaultFilter){const t=this.resolveDraftFilterType(this.changes.defaultFilterType);t&&(this.draftFilter={id:++this.filterId,type:t,value:"",relation:"and"})}}}async getChanges(){return this.changes}componentWillRender(){if(!this.isFilterIdSet){this.isFilterIdSet=!0;const t=Object.keys(this.filterItems);for(const e of t)this.filterId+=this.filterItems[e].length}}getFilterItemsList(){var t,e;const i=null===(t=this.changes)||void 0===t?void 0:t.prop;if(void 0===i)return"";const o=(null!==(e=this.filterItems[i])&&void 0!==e?e:[]).map(((t,e)=>({filter:t,index:e,isDraft:!1})));this.draftFilter&&o.push({filter:this.draftFilter,index:o.length,isDraft:!0});const l=o.filter((({filter:t})=>!t.hidden)),s=l.length,h=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions);return r("div",{key:this.filterId},r("ul",{class:"multi-filter-list-container"},o.map((({filter:t,index:e,isDraft:o})=>{var c;let p;if(t.hidden)return;(null===(c=l[s-1])||void 0===c?void 0:c.filter.id)!==t.id&&(p=r(n,{text:"and"===t.relation?h.and:h.or,onClick:()=>this.toggleFilterAndOr(t.id)}));const u=this.renderExtra(i,e,o),f=this.draggedFilterId===t.id,g=this.dragOverFilterId===t.id&&!f,v=s>1&&!o;return r("li",{key:t.id,class:"multi-filter-list","aria-label":`${h.filterCondition} ${e+1}`},r("div",{class:{"multi-filter-list-row":!0,"filter-row-drop-active":void 0!==this.draggedFilterId&&!f,"filter-row-dragging":f,"filter-row-drag-over":g}},v?r("button",{type:"button",class:"filter-row-drop-target",tabIndex:-1,"aria-label":`${h.filterCondition} ${e+1}`,onDragOver:e=>this.onFilterDragOver(e,t.id),onDragLeave:()=>this.onFilterDragLeave(t.id),onDrop:e=>this.onFilterDrop(e,i,t.id)}):"",v?r(a,{ariaLabel:h.reorderFilter,dragging:f,dragOver:g,onDragStart:e=>this.onFilterDragStart(e,t.id),onDragEnd:()=>this.onFilterDragEnd(),onKeyDown:e=>this.onFilterReorderKeyDown(e,i,t.id)}):"",r("div",{class:{"select-input":!0}},r("select",{class:"select-css select-filter",onChange:t=>this.onFilterTypeChange(t,i,e,o)},this.renderSelectOptions(t.type,!0)),u?r("div",{class:"filter-extra"},u):""),r("div",{class:"multi-filter-list-action"},p,r(d,{ariaLabel:h.removeFilter,onClick:()=>this.onRemoveFilter(t.id)}))))}))),s?r("div",{class:"add-filter-divider"}):"")}componentDidRender(){this.syncDialog()}syncDialog(){this.dialog&&(this.changes?(this.dialog.open||this.dialog.show(),!1!==this.changes.autoCorrect&&(this.autoCorrect(this.dialog),requestAnimationFrame((()=>this.autoCorrect(this.dialog))))):this.dialog.open&&this.dialog.close())}autoCorrect(t){var e;if(!t||!this.changes)return;t.style.maxHeight="",t.style.left=this.changes.x+"px",t.style.top=this.changes.y+"px";const i=t.getBoundingClientRect(),r=null!==(e=this.changes.anchorY)&&void 0!==e?e:this.changes.y,o=this.changes.y,l=Math.max(0,r-8),s=Math.max(0,window.innerHeight-o-8),n=i.height>s&&l>s;t.style.maxHeight=Math.max(8,n?l:s)+"px";const a=t.getBoundingClientRect(),d=Math.max(8,window.innerWidth-a.width-8),h=Math.max(8,window.innerHeight-a.height-8),c=Math.min(Math.max(8,this.changes.x),d),p=Math.min(Math.max(8,n?r-a.height:o),h);t.style.left=c+"px",t.style.top=p+"px"}onFilterTypeChange(t,e,i,r=!1){if(!(t.target instanceof HTMLSelectElement))return;const o=t.target.value,l=r?this.promoteDraft(e,o):this.filterItems[e][i];l&&(l.type=o,this.hasChanges=!0,this.filterId++,setTimeout((()=>{const t=document.getElementById("filter-input-"+l.id);t instanceof HTMLInputElement&&t.focus()}),0),this.disableDynamicFiltering||this.debouncedApplyFilter())}onAddNewFilter(t){this.currentFilterType=t.target.value,this.addNewFilterToProp();const e=this.getAddFilterSelect();e&&(e.value=u,this.currentFilterType=u),this.disableDynamicFiltering||this.debouncedApplyFilter()}addNewFilterToProp(){var t;const e=null===(t=this.changes)||void 0===t?void 0:t.prop;(e||0===e)&&(this.filterItems[e]||(this.filterItems[e]=[]),"none"!==this.currentFilterType&&(this.filterId++,this.currentFilterId=this.filterId,this.draftFilter?(this.draftFilter.id=this.currentFilterId,this.draftFilter.type=this.currentFilterType,this.promoteDraft(e)):(this.filterItems[e].push({id:this.currentFilterId,type:this.currentFilterType,value:"",relation:"and"}),this.hasChanges=!0),setTimeout((()=>{const t=document.getElementById("filter-input-"+this.currentFilterId);t&&t.focus()}),0)))}onSave(){this.hasChanges&&this.emitFilterChange()}onCancel(){this.changes=void 0}onReset(){var t;this.assertChanges(),this.draftFilter=void 0;const e=null===(t=this.changes)||void 0===t?void 0:t.prop;void 0!==e&&delete this.filterItems[e],this.resetChange.emit(e),this.filterId++}onRemoveFilter(t){var e,i;this.assertChanges(),this.filterId++;const r=null===(e=this.changes)||void 0===e?void 0:e.prop;if((null===(i=this.draftFilter)||void 0===i?void 0:i.id)===t)return void(this.draftFilter=void 0);const o=this.filterItems[null!=r?r:""];if(!o)return;const l=o.findIndex((e=>e.id===t));-1!==l&&(o.splice(l,1),this.hasChanges=!0,0===o.length&&delete this.filterItems[null!=r?r:""],this.disableDynamicFiltering||this.debouncedApplyFilter())}onFilterDragStart(t,e){this.draggedFilterId=e,function(t,e){t&&(t.effectAllowed="move",t.setData(c,e+""),t.setData("text/plain",e+""))}(t.dataTransfer,e)}onFilterDragOver(t,e){void 0!==this.draggedFilterId&&this.draggedFilterId!==e&&(t.preventDefault(),t.dataTransfer&&(t.dataTransfer.dropEffect="move"),this.dragOverFilterId=e)}onFilterDragLeave(t){this.dragOverFilterId===t&&(this.dragOverFilterId=void 0)}onFilterDrop(t,e,i){var r;t.preventDefault();const o=null!==(r=this.draggedFilterId)&&void 0!==r?r:function(t){if(!t)return;const e=(t.getData(c)||t.getData("text/plain")).trim();if(!e)return;const i=Number(e);return Number.isFinite(i)?i:void 0}(t.dataTransfer);if(this.onFilterDragEnd(),void 0===o)return;const l=this.filterItems[e];l&&p(l,o,i)&&(this.hasChanges=!0,this.filterId++,this.disableDynamicFiltering||this.debouncedApplyFilter())}onFilterDragEnd(){this.draggedFilterId=void 0,this.dragOverFilterId=void 0}onFilterReorderKeyDown(t,e,i){let r=0;if("ArrowUp"===t.key)r=-1;else{if("ArrowDown"!==t.key)return;r=1}const o=this.filterItems[e];if(!o)return;const l=o.filter((t=>!t.hidden)),s=l.findIndex((t=>t.id===i));if(-1===s)return;t.preventDefault(),t.stopPropagation();const n=l[s+r];n&&p(o,i,n.id)&&(this.hasChanges=!0,this.filterId++,this.disableDynamicFiltering||this.debouncedApplyFilter())}toggleFilterAndOr(t){var e;this.assertChanges(),this.filterId++;const i=null===(e=this.changes)||void 0===e?void 0:e.prop,r=this.filterItems[null!=i?i:""];if(!r)return;const o=r.findIndex((e=>e.id===t));-1!==o&&(r[o].relation="and"===r[o].relation?"or":"and",this.hasChanges=!0,this.disableDynamicFiltering||this.debouncedApplyFilter())}assertChanges(){if(!this.changes)throw Error("Changes required per edit")}renderSelectOptions(t,e=!1){var i;if(!this.changes)return;const o=[],l=this.changes.prop;if(void 0===l)return;const s=new Set;Object.keys(this.filterItems).forEach((t=>{this.filterItems[t].forEach((t=>{t.hidden&&s.add(t.type)}))}));const n=new Set((null!==(i=this.filterItems[l])&&void 0!==i?i:[]).filter((t=>!t.hidden)).map((t=>t.type)));if(!e){const t=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions);o.push(r("option",{selected:this.currentFilterType===u,value:u},l&&this.filterItems[l]&&this.filterItems[l].length>0?t.add:this.filterNames[u]))}for(let i in this.changes.filterTypes){const l=this.changes.filterTypes[i].filter((i=>!s.has(i)&&(this.allowDuplicateOperators||!n.has(i)||e&&t===i)));l.length&&(o.push(...l.map((e=>r("option",{value:e,selected:t===e},this.filterNames[e])))),o.push(r("option",{disabled:!0})))}return o}renderExtra(t,e,i=!1){var o,l;const s=i?this.draftFilter:null===(o=this.filterItems[t])||void 0===o?void 0:o[e];if(!s)return"";const n=e=>{s.value=e,i&&!this.isMeaningfulDraftValue(e)||i&&!this.promoteDraft(t)||(this.hasChanges=!0,this.disableDynamicFiltering||this.debouncedApplyFilter())},a=()=>{const t=this.getAddFilterSelect();t&&(t.value=u,this.currentFilterType=u,this.addNewFilterToProp(),t.focus())},d=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions),h=null===(l=this.filterEntities[s.type])||void 0===l?void 0:l.extra;return"function"==typeof h?h(r,{value:s.value,filter:s,prop:t,index:e,placeholder:d.placeholder,onInput:t=>{n(t)},onFocus:()=>{a()}}):"input"!==h&&"datepicker"!==h?"":r("input",{id:"filter-input-"+s.id,placeholder:d.placeholder,type:"datepicker"===h?"date":"text",value:s.value,onInput:t=>{t.target instanceof HTMLInputElement&&n(t.target.value)},onKeyDown:t=>{"enter"!==t.key.toLowerCase()?t.stopPropagation():this.getAddFilterSelect()&&a()}})}resolveDraftFilterType(t){var e,i;const r=Object.values(null!==(i=null===(e=this.changes)||void 0===e?void 0:e.filterTypes)&&void 0!==i?i:{}).flat();return t&&r.includes(t)?t:r[0]}promoteDraft(t,e){if(!this.draftFilter)return;this.filterItems[t]||(this.filterItems[t]=[]),e&&(this.draftFilter.type=e);const i=this.draftFilter;return this.filterItems[t].push(i),this.draftFilter=void 0,this.hasChanges=!0,i}isMeaningfulDraftValue(t){return""!==t&&null!=t}emitFilterChange(){this.filterChange.emit(this.cloneFilterItems(this.filterItems))}cloneFilterItems(t){return Object.fromEntries(Object.entries(t).map((([t,e])=>[t,e.map((t=>Object.assign({},t)))])))}getAddFilterSelect(){return this.element.querySelector("#"+f)}isOwnFilterButton(t){if(!(t instanceof Element))return!1;if(!h(t))return!1;const e=this.getOwningGrid(this.element),i=this.getOwningGrid(t);return!!e&&e===i}getOwningGrid(t){const e=t.closest("revo-grid");if(e)return e;const i=t.getRootNode();return i instanceof ShadowRoot&&"revo-grid"===i.host.localName?i.host:void 0}render(){var t,e,i,l,s,n,a,d,h;const c={left:(null!==(e=null===(t=this.changes)||void 0===t?void 0:t.x)&&void 0!==e?e:0)+"px",top:(null!==(l=null===(i=this.changes)||void 0===i?void 0:i.y)&&void 0!==l?l:0)+"px"},p=Object.assign(Object.assign({},this.filterCaptionsInternal),this.filterCaptions);return r(o,{key:"0bb6ac39407141e989b6a2f54063ee5ed789e40e"},r("dialog",{key:"28a919ca4184018e8f00bbd31d373e153306d163",class:"filter-panel-dialog",style:c,ref:t=>this.dialog=t,onCancel:t=>{t.preventDefault(),this.onCancel()}},this.changes&&[r("slot",{key:"header-slot",slot:"header"}),(null===(n=(s=this.changes).extraContent)||void 0===n?void 0:n.call(s,this.changes))||"",!0!==(null===(a=this.changes)||void 0===a?void 0:a.hideDefaultFilters)&&[r("label",{key:"filter-title"},p.title),r("div",{key:"filter-holder",class:"filter-holder"},this.getFilterItemsList()),r("div",{key:"add-filter",class:"add-filter"},r("select",{key:"c5816b6699d8608bd8ec2621bbbd4c70daf52a1e",id:f,class:"select-css",onChange:t=>this.onAddNewFilter(t)},this.renderSelectOptions(this.currentFilterType)))],r("slot",{key:"default-slot"}),(null===(h=(d=this.changes).extraBottomContent)||void 0===h?void 0:h.call(d,this.changes))||"",r("div",{key:"filter-actions",class:"filter-actions"},this.disableDynamicFiltering&&[r("button",{key:"save",type:"button",id:"revo-button-save","aria-label":"save",class:"revo-button green",onClick:()=>this.onSave()},p.save),r("button",{key:"cancel",type:"button",id:"revo-button-ok","aria-label":"ok",class:"revo-button green",onClick:()=>this.onCancel()},p.cancel)],!this.disableDynamicFiltering&&[r("button",{key:"ok",type:"button",id:"revo-button-ok","aria-label":"ok",class:"revo-button green",onClick:()=>this.onCancel()},p.ok),r("button",{key:"reset",type:"button",id:"revo-button-reset","aria-label":"reset",class:"revo-button outline",onClick:()=>this.onReset()},p.reset)]),r("slot",{key:"footer-slot",slot:"footer"})]))}get element(){return this}static get style(){return'.revo-button{position:relative;overflow:hidden;color:var(--rg-theme-button-text);background-color:var(--rg-theme-button-bg);height:32px;line-height:32px;padding:0 15px;outline:0;border:0;border-radius:7px;box-sizing:border-box;cursor:pointer}.revo-button.green{background-color:var(--rg-theme-button-success-bg)}.revo-button.red{background-color:var(--rg-theme-button-danger-bg)}.revo-button:disabled,.revo-button[disabled]{cursor:not-allowed !important;filter:opacity(0.35) !important}.revo-button.outline{border:1px solid var(--rg-theme-button-outline-border);line-height:30px;background:none;color:var(--rg-theme-button-outline-text);box-shadow:none}revogr-filter-panel{display:block}revogr-filter-panel .filter-panel-dialog{position:fixed;top:0;left:0;z-index:100;max-height:calc(100vh - 16px);overflow:auto;opacity:1;transform:none;color:var(--rg-theme-filter-panel-text);background-color:var(--rg-theme-filter-panel-bg);border:1px solid var(--rg-theme-filter-panel-border);transform-origin:62px 0px;box-shadow:0 5px 18px -2px var(--rg-theme-filter-panel-shadow);box-sizing:border-box;padding:10px;border-radius:8px;margin:0;min-width:220px;text-align:left;animation:revogr-filter-panel-open 140ms cubic-bezier(0.2, 0, 0, 1)}revogr-filter-panel .filter-panel-dialog .filter-holder>div{display:flex;flex-direction:column}revogr-filter-panel .filter-panel-dialog label{font-size:13px;display:block;padding:8px 0}revogr-filter-panel .filter-panel-dialog select{width:100%}revogr-filter-panel .filter-panel-dialog input[type=text]{border:0;min-height:34px;margin:5px 0;color:var(--rg-theme-filter-panel-text);background:var(--rg-theme-filter-panel-input-bg);border-radius:5px;padding:0 10px;box-sizing:border-box;width:100%}revogr-filter-panel .filter-panel-dialog .filter-actions{position:sticky;right:0;bottom:-10px;left:0;z-index:1;text-align:right;margin:10px -10px -10px;padding:0 5px 10px 10px;background:var(--rg-theme-filter-panel-bg);border-top:1px solid var(--rg-theme-filter-panel-divider)}revogr-filter-panel .filter-panel-dialog .filter-actions button{margin-top:10px;margin-right:5px}@keyframes revogr-filter-panel-open{from{opacity:0;transform:translateY(-4px) scale(0.98)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){revogr-filter-panel .filter-panel-dialog{animation:none}}.rgHeaderCell:hover .rv-filter{transition:opacity 267ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, width 267ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 178ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}.rgHeaderCell:hover:has(.rv-filter) .header-content,.rgHeaderCell:focus-within:has(.rv-filter) .header-content,.rgHeaderCell:has(.rv-filter.active) .header-content{margin-right:24px}.rgHeaderCell:hover:has(.rv-filter):has(.desc) .header-content,.rgHeaderCell:hover:has(.rv-filter):has(.asc) .header-content,.rgHeaderCell:focus-within:has(.rv-filter):has(.desc) .header-content,.rgHeaderCell:focus-within:has(.rv-filter):has(.asc) .header-content,.rgHeaderCell:has(.rv-filter.active):has(.desc) .header-content,.rgHeaderCell:has(.rv-filter.active):has(.asc) .header-content{margin-right:8px;padding-right:24px}.rgHeaderCell:hover .rv-filter,.rgHeaderCell:focus-within .rv-filter,.rgHeaderCell .rv-filter.active{opacity:1;width:24px}@media (hover: none), (pointer: coarse){.rgHeaderCell:has(.rv-filter) .header-content{margin-right:24px}.rgHeaderCell:has(.rv-filter):has(.desc) .header-content,.rgHeaderCell:has(.rv-filter):has(.asc) .header-content{margin-right:8px;padding-right:24px}.rgHeaderCell .rv-filter{opacity:1;width:24px}}.rgHeaderCell .rv-filter{height:24px;width:0;background:none;border:0;opacity:0;visibility:visible;cursor:pointer;border-radius:4px;position:relative;z-index:1;padding:0}.rgHeaderCell .rv-filter.active{color:var(--rg-theme-filter-panel-icon-active)}.rgHeaderCell .rv-filter .filter-img{color:var(--rg-theme-filter-panel-icon);width:11px}.select-css{display:block;font-family:sans-serif;line-height:1.3;padding:0.6em 1.4em 0.5em 0.8em;width:100%;max-width:100%;box-sizing:border-box;margin:0;color:var(--rg-theme-filter-panel-text);border:1px solid var(--rg-theme-filter-panel-select-border);box-shadow:transparent;border-radius:0.5em;appearance:none;background-color:var(--rg-theme-filter-panel-input-bg);background-image:var(--revo-grid-filter-panel-select-arrow, 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%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"));background-repeat:no-repeat, repeat;background-position:right 0.7em top 50%, 0 0;background-size:0.65em auto, 100%;}.select-css::-ms-expand{display:none}.select-css{}.select-css:hover{border-color:var(--rg-theme-filter-panel-select-border)}.select-css{}.select-css:focus{border-color:var(--rg-theme-filter-panel-select-border-hover);box-shadow:var(--rg-theme-filter-panel-focus-ring);outline:none}.select-css{}.select-css option{font-weight:normal}.select-css{}.select-css:disabled,.select-css[aria-disabled=true]{color:var(--rg-theme-filter-panel-muted-text);background-image:var(--revo-grid-filter-panel-select-arrow-disabled, 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"))}.select-css:disabled:hover,.select-css[aria-disabled=true]{border-color:var(--rg-theme-filter-panel-select-border)}.multi-filter-list{margin-top:5px;margin-bottom:5px}.multi-filter-list div{white-space:nowrap}.multi-filter-list .multi-filter-list-row{display:flex;align-items:center;gap:6px;position:relative}.multi-filter-list .multi-filter-list-row.filter-row-dragging{opacity:0.65}.multi-filter-list .multi-filter-list-row.filter-row-drag-over::before{content:"";position:absolute;top:-4px;right:0;left:0;z-index:2;height:2px;background:var(--rg-theme-filter-panel-reorder-accent);border-radius:999px;box-shadow:0 0 0 2px var(--rg-theme-filter-panel-bg)}.multi-filter-list .multi-filter-list-row.filter-row-drop-active .filter-row-drop-target{pointer-events:auto}.multi-filter-list .filter-row-drop-target{position:absolute;inset:0;z-index:1;padding:0;pointer-events:none;background:transparent;border:0}.multi-filter-list .multi-filter-list-action{display:flex;align-self:stretch;flex:0 0 auto;justify-content:flex-end;align-items:center}.multi-filter-list .and-or-button{margin:0 0 0 10px;min-width:58px;cursor:pointer}.multi-filter-list .trash-button{margin:0 0 -2px 6px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;width:22px;height:100%;font-size:16px}.multi-filter-list .trash-button .trash-img{width:1em}.multi-filter-list .reorder-button{border:0;background:transparent;color:var(--rg-theme-filter-panel-reorder-color);cursor:grab;font-family:monospace;font-size:12px;letter-spacing:0;line-height:1;padding:6px 2px;transform:scaleX(0.8);width:16px}.multi-filter-list .reorder-button.filter-row-drag-over{color:var(--rg-theme-filter-panel-reorder-accent)}.multi-filter-list .reorder-button:active{cursor:grabbing}.multi-filter-list-container{padding:0;margin:0;list-style:none}.add-filter-divider{display:block;margin:0 -10px 10px -10px;border-bottom:1px solid var(--rg-theme-filter-panel-divider);height:10px}.select-input{display:flex;align-items:center;flex:1 1 auto;gap:6px;min-width:0}.select-input .select-filter,.select-input .filter-extra{flex:1 1 0;min-width:0}.select-input .select-filter{width:auto}.select-input .filter-extra{display:flex}.select-input .filter-extra>*{width:100%}.select-input input[type=text],.select-input input[type=date]{margin:0}'}},[260,"revogr-filter-panel",{filterNames:[16],filterEntities:[16],filterCaptions:[16],disableDynamicFiltering:[4,"disable-dynamic-filtering"],closeOnOutsideClick:[4,"close-on-outside-click"],allowDuplicateOperators:[4,"allow-duplicate-operators"],isFilterIdSet:[32],filterId:[32],currentFilterId:[32],currentFilterType:[32],changes:[32],filterItems:[32],draftFilter:[32],draggedFilterId:[32],dragOverFilterId:[32],show:[64],getChanges:[64]},[[5,"mousedown","onMouseDown"]]]),v=g,b=function(){"undefined"!=typeof customElements&&["revogr-filter-panel"].forEach((t=>{"revogr-filter-panel"===t&&(customElements.get(l(t))||customElements.define(l(t),g))}))};export{v as RevogrFilterPanel,b as defineCustomElement}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* Built by Revolist OU ❤️
|
|
3
3
|
*/
|
|
4
|
-
import{h as e,proxyCustomElement as t,HTMLElement as i,createEvent as r,transformTag as s}from"@stencil/core/internal/client";import{M as o,D as n,d as h,H as l,F as a,e as d,f as c}from"./consts.js";import"./platform.js";import{a as u}from"./dimension.helpers.js";import{c as v}from"./filter.button.js";import{R as g}from"./column.service.js";function p(e,t,i){const r=new CustomEvent(t,{detail:i,cancelable:!0,bubbles:!0});return null==e||e.dispatchEvent(r),r}function b(e,t,i){return e.preventDefault(),p(e.target,t,i)}const f=({column:t})=>{var i;const r={class:null!==(i=null==t?void 0:t.order)&&void 0!==i?i:"sort-off"};return e("span",Object.assign({},{class:"sort-indicator"}),e("i",Object.assign({},r)),(null==t?void 0:t.sortIndex)?e("sup",Object.assign({},{class:"sort-order-index"}),t.sortIndex):null)};var m;!function(e){e.start="resize:start",e.move="resize:move",e.end="resize:end"}(m||(m={}));const z={"resizable-r":{bit:1,cursor:"ew-resize"},"resizable-rb":{bit:3,cursor:"se-resize"},"resizable-b":{bit:2,cursor:"s-resize"},"resizable-lb":{bit:6,cursor:"sw-resize"},"resizable-l":{bit:4,cursor:"w-resize"},"resizable-lt":{bit:12,cursor:"nw-resize"},"resizable-t":{bit:8,cursor:"n-resize"},"resizable-rt":{bit:9,cursor:"ne-resize"}};class x{constructor(e,t){var i,r,s;this.initialProps=e,this.$event=t,this.mouseX=0,this.mouseY=0,this.width=0,this.height=0,this.changeX=0,this.changeY=0,this.disableCalcMap=15,this.props=(s=e,Object.assign(Object.assign({},s),{fitParent:s.fitParent||!1,active:s.active||[],disableAttributes:s.disableAttributes||[],minWidth:s.minWidth||0,minHeight:s.minHeight||0})),this.mouseMoveFunc=this.handleMove.bind(this),this.mouseUpFunc=this.handleUp.bind(this),this.minW=this.props.minWidth,this.minH=this.props.minHeight,this.maxW=null!==(i=this.props.maxWidth)&&void 0!==i?i:0,this.maxH=null!==(r=this.props.maxHeight)&&void 0!==r?r:0,this.parent={width:0,height:0},this.resizeState=0}set(e){this.$el=e,this.props.disableAttributes.forEach((e=>{switch(e){case"l":this.disableCalcMap&=-2;break;case"t":this.disableCalcMap&=-3;break;case"w":this.disableCalcMap&=-5;break;case"h":this.disableCalcMap&=-9}}))}emitEvent(e,t){var i;if(!this.$event)return;const r=null===(i=this.activeResizer)||void 0===i?void 0:i.classList.contains("resizable-l");this.$event(Object.assign({eventName:e,width:this.width+this.changeX*(r?-1:1),height:this.height+this.changeY,changedX:this.changeX,changedY:this.changeY},t))}static isTouchEvent(e){var t;return(null===(t=e.touches)||void 0===t?void 0:t.length)>=0}handleMove(e){var t;if(!this.resizeState)return;let i,r;x.isTouchEvent(e)?(i=e.touches[0].clientY,r=e.touches[0].clientX):(i=e.clientY,r=e.clientX);let s=this.resizeState&z["resizable-r"].bit||this.resizeState&z["resizable-l"].bit;if((this.resizeState&z["resizable-t"].bit||this.resizeState&z["resizable-b"].bit)&&8&this.disableCalcMap){let e=this.changeY+(i-this.mouseY);const t=this.height+e;t<this.minH&&(e=-(this.height-this.minH)),this.maxH&&t>this.maxH&&(e=this.maxH-this.height),this.changeY=e,this.mouseY=i,this.activeResizer&&(this.activeResizer.style.bottom=-this.changeY+"px")}if(s&&4&this.disableCalcMap){const e=null===(t=this.activeResizer)||void 0===t?void 0:t.classList.contains("resizable-l");let i=this.changeX+(r-this.mouseX);const s=this.width+i*(e?-1:1);s<this.minW&&(i=-(this.width-this.minW)),this.maxW&&s>this.maxW&&(i=this.maxW-this.width),this.changeX=i,this.mouseX=r,this.activeResizer&&(e?this.activeResizer.style.left=`${this.changeX}px`:this.activeResizer.style.right=-this.changeX+"px")}this.emitEvent(m.move)}handleDown(e){if(!e.defaultPrevented){e.preventDefault(),this.dropInitial();for(let t in z){const i=e.target;if(this.$el.contains(i)&&(null==i?void 0:i.classList.contains(t))){document.body.style.cursor=z[t].cursor,x.isTouchEvent(e)?this.setInitials(e.touches[0],i):(e.preventDefault&&e.preventDefault(),this.setInitials(e,i)),this.resizeState=z[t].bit,this.emitEvent(m.start);break}}this.bindMove()}}handleUp(e){e.preventDefault(),0!==this.resizeState&&(this.resizeState=0,document.body.style.cursor="",this.emitEvent(m.end)),this.dropInitial(),this.unbindMove()}setInitials({clientX:e,clientY:t},i){var r,s,o,n;const h=getComputedStyle(this.$el);if(this.$el.classList.add("active"),this.activeResizer=i,4&this.disableCalcMap){this.mouseX=e,this.width=this.$el.clientWidth,this.parent.width=null!==(s=null===(r=this.$el.parentElement)||void 0===r?void 0:r.clientWidth)&&void 0!==s?s:0;const t=parseFloat(h.paddingLeft)+parseFloat(h.paddingRight);this.minW=Math.max(t,this.initialProps.minWidth||0),this.initialProps.maxWidth&&(this.maxW=Math.max(this.width,this.initialProps.maxWidth))}if(8&this.disableCalcMap){this.mouseY=t,this.height=this.$el.clientHeight,this.parent.height=null!==(n=null===(o=this.$el.parentElement)||void 0===o?void 0:o.clientHeight)&&void 0!==n?n:0;const e=parseFloat(h.paddingTop)+parseFloat(h.paddingBottom);this.minH=Math.max(e,this.initialProps.minHeight||0),this.initialProps.maxHeight&&(this.maxH=Math.max(this.height,this.initialProps.maxHeight))}}dropInitial(){this.changeX=this.changeY=this.minW=this.minH,this.width=this.height=0,this.activeResizer&&this.activeResizer.removeAttribute("style"),this.$el.classList.remove("active"),this.activeResizer=void 0}bindMove(){document.documentElement.addEventListener("mouseup",this.mouseUpFunc,!0),document.documentElement.addEventListener("touchend",this.mouseUpFunc,!0),document.documentElement.addEventListener("mousemove",this.mouseMoveFunc,!0),document.documentElement.addEventListener("touchmove",this.mouseMoveFunc,!0),document.documentElement.addEventListener("mouseleave",this.mouseUpFunc)}unbindMove(){document.documentElement.removeEventListener("mouseup",this.mouseUpFunc,!0),document.documentElement.removeEventListener("touchend",this.mouseUpFunc,!0),document.documentElement.removeEventListener("mousemove",this.mouseMoveFunc,!0),document.documentElement.removeEventListener("touchmove",this.mouseMoveFunc,!0),document.documentElement.removeEventListener("mouseleave",this.mouseUpFunc)}}const w=(t,i)=>{const r=[],s=t.canResize&&new x(t,(e=>{var i;e.eventName===m.end&&(null===(i=t.onResize)||void 0===i||i.call(t,e))}))||null;if(t.active&&t.canResize)for(let i in t.active)r.push(e("div",{onClick:e=>e.preventDefault(),onDblClick:e=>{var i;e.preventDefault(),null===(i=t.onDblClick)||void 0===i||i.call(t,e)},onMouseDown:e=>null==s?void 0:s.handleDown(e),onTouchStart:e=>null==s?void 0:s.handleDown(e),class:`resizable resizable-${t.active[i]}`}));return e("div",Object.assign({},t,{ref:e=>e&&(null==s?void 0:s.set(e))}),i,r)},C="columnclick",H=({data:t,props:i,additionalData:r},s)=>{let o=(null==t?void 0:t.name)||"",n=i;if((null==t?void 0:t.columnTemplate)&&(o=t.columnTemplate(e,t,r)),null==t?void 0:t.columnProperties){const e=t.columnProperties(t);e&&(n=g(i,e))}const h=Object.assign(Object.assign({},n),{onMouseDown(e){p(e.currentTarget,C,{data:t,event:e})}});return e(w,Object.assign({},h),e("div",{class:"header-content"},o),s)},y=t=>{var i,r,s,d,c,u,g,p,b,m;const z=!!((null===(i=t.data)||void 0===i?void 0:i.sortable)||(null===(r=t.data)||void 0===r?void 0:r.order)||(null===(s=t.data)||void 0===s?void 0:s.sortIndex)),x={[l]:!0,[h]:!!(null===(d=t.data)||void 0===d?void 0:d.sortable)};(null===(c=t.data)||void 0===c?void 0:c.order)&&(x[t.data.order]=!0);const w={key:String(null!==(g=null===(u=t.data)||void 0===u?void 0:u.prop)&&void 0!==g?g:t.column.itemIndex),[n]:t.column.itemIndex,canResize:t.canResize,minWidth:(null===(p=t.data)||void 0===p?void 0:p.minSize)||o,maxWidth:null===(b=t.data)||void 0===b?void 0:b.maxSize,active:t.active||["r"],class:x,style:{width:`${t.column.size}px`,transform:`translateX(${t.column.start-(t.renderOffset||0)}px)`},onResize:t.onResize,onDblClick(e){var i;null===(i=t.onDblClick)||void 0===i||i.call(t,{column:t.data,index:t.column.itemIndex,originalEvent:e,providers:t.data.providers})},onClick(e){!e.defaultPrevented&&t.onClick&&t.onClick({column:t.data,index:t.column.itemIndex,originalEvent:e,providers:t.data.providers})}};return t.range&&t.column.itemIndex>=t.range.x&&t.column.itemIndex<=t.range.x1&&"object"==typeof w.class&&(w.class[a]=!0),e(H,{data:t.data,props:w,additionalData:t.additionalData},z?e(f,{column:t.data}):null,t.canFilter&&!1!==(null===(m=t.data)||void 0===m?void 0:m.filter)?e(v,{column:t.data}):"")},k=t=>{const i={key:`${t.group.name}-${t.group.indexes.join("-")}`,canResize:t.canResize,minWidth:t.group.indexes.length*o,maxWidth:0,active:t.active||["r"],class:{[l]:!0},style:{transform:`translateX(${t.start-(t.renderOffset||0)}px)`,width:t.end-t.start+"px"},onResize:t.onResize};return e(H,{data:Object.assign(Object.assign({},t.group),{prop:"",providers:t.providers,index:t.start}),props:i,additionalData:t.additionalData})},j=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.initialHeaderClick=r(this,"beforeheaderclick",7),this.headerresize=r(this,"headerresize",7),this.beforeResize=r(this,"beforeheaderresize",7),this.headerdblClick=r(this,"headerdblclick",7),this.beforeHeaderRender=r(this,"beforeheaderrender",7),this.beforeGroupHeaderRender=r(this,"beforegroupheaderrender",7),this.afterHeaderRender=r(this,"afterheaderrender",7),this.groupingDepth=0,this.additionalData={}}onResize({width:e},t){this.beforeResize.emit([Object.assign(Object.assign({},this.colData[t]),{size:e||void 0})]).defaultPrevented||this.headerresize.emit({[t]:e||0})}onResizeGroup(e,t,i){const r={},s=e/(i-t+1);for(let e=t;e<=i;e++){const t=u(this.dimensionCol.state,e);r[e]=t.end-t.start+s}this.headerresize.emit(r)}componentDidRender(){this.afterHeaderRender.emit(this.providers)}render(){var t;const i=this.viewportCol.get("items"),r=null===(t=this.selectionStore)||void 0===t?void 0:t.get("range"),{cells:s}=this.renderHeaderColumns(i,r),o=this.renderGroupingColumns();return[e("div",{key:"3cc466db6bc4df0cd61c47a22c3a0473318e5dd8",class:"group-rgRow"},o),e("div",{key:"9742a3fa4d4b75073aef5544806f42386ebffdea",class:`${d} ${c}`},s)]}renderHeaderColumns(t,i){const r=[],s=this.viewportCol.get("renderOffset")||0;for(let e of t){const t={range:i,column:e,data:Object.assign(Object.assign({},this.colData[e.itemIndex]),{index:e.itemIndex,providers:this.providers}),canFilter:!!this.columnFilter,canResize:this.canResize,renderOffset:s,active:this.resizeHandler,additionalData:this.additionalData,onResize:t=>this.onResize(t,e.itemIndex),onDblClick:e=>this.headerdblClick.emit(e),onClick:e=>this.initialHeaderClick.emit(e)},o=this.beforeHeaderRender.emit(t);o.defaultPrevented||r.push(o.detail)}const o=this.getDuplicateHeaderProps(r);return{cells:r.map((t=>e(y,Object.assign({key:this.getHeaderCellKey(t.data,this.type,o)},t))))}}renderGroupingColumns(){const e=this.getVisibleGroupRange();return Array.from({length:this.groupingDepth},((t,i)=>this.renderGroupRow(i,e))).flat()}renderGroupRow(t,i){return[...(this.groups[t]||[]).map((e=>this.renderGroupColumn(e,t,i))).filter((e=>!!e)),e("div",{key:`group-row-${t}`,class:{[d]:!0,group:!0}})]}renderGroupColumn(t,i,r){const s=this.getGroupIndexRange(t),o=this.getGroupBounds(s),n={level:i,providers:this.providers,start:o.start,end:o.end,group:t,renderOffset:this.viewportCol.get("renderOffset")||0,active:this.resizeHandler,canResize:this.canResize,additionalData:this.additionalData,onResize:e=>{var t;return s?this.onResizeGroup(null!==(t=e.changedX)&&void 0!==t?t:0,s.startIndex,s.endIndex):void 0}},h=this.beforeGroupHeaderRender.emit(n);if(h.defaultPrevented)return;const l=this.getGroupIndexRange(h.detail.group);if(!(l&&r&&(a=l.startIndex,d=l.endIndex,c=r,a<=c.end&&d>=c.start)))return;var a,d,c;h.detail.onResize===n.onResize&&(h.detail.onResize=e=>{var t;return this.onResizeGroup(null!==(t=e.changedX)&&void 0!==t?t:0,l.startIndex,l.endIndex)});const u=this.getGroupBounds(l);return h.detail.start===n.start&&(h.detail.start=u.start),h.detail.end===n.end&&(h.detail.end=u.end),e(k,Object.assign({key:this.getGroupHeaderCellKey(h.detail.group,i)},h.detail))}getGroupIndexRange(e){var t;const i=null!==(t=e.indexes[0])&&void 0!==t?t:-1;if(!(i<0))return{startIndex:i,endIndex:e.indexes[e.indexes.length-1]}}getGroupBounds(e){return e?{start:u(this.dimensionCol.state,e.startIndex).start,end:u(this.dimensionCol.state,e.endIndex).end}:{start:0,end:0}}getVisibleGroupRange(){const e=this.viewportCol.get("items");if(e.length)return e.reduce(((e,t)=>({start:Math.min(e.start,t.itemIndex),end:Math.max(e.end,t.itemIndex)})),{start:e[0].itemIndex,end:e[0].itemIndex})}getHeaderCellKey(e,t,i){if(void 0===(null==e?void 0:e.prop))return`${t}-${String(null==e?void 0:e.index)}`;const r=String(e.prop);return i.has(r)?`${t}-${r}-${String(e.index)}`:`${t}-${r}`}getDuplicateHeaderProps(e){const t=new Set,i=new Set;return e.forEach((({data:e})=>{if(void 0!==(null==e?void 0:e.prop)){const r=String(e.prop);t.has(r)?i.add(r):t.add(r)}})),i}getGroupHeaderCellKey(e,t){return`group-${t}-${e.name}-${e.indexes.join("-")}`}get providers(){return{type:this.type,readonly:this.readonly,data:this.colData,viewport:this.viewportCol,dimension:this.dimensionCol,selection:this.selectionStore}}get element(){return this}static get style(){return'@charset "UTF-8";revogr-header{position:relative;z-index:5;display:block}revogr-header .header-rgRow{display:block;position:relative}revogr-header .header-rgRow.group{z-index:0}revogr-header .group-rgRow{position:relative;overflow:hidden}revogr-header .rgHeaderCell{position:absolute;box-sizing:border-box;height:100%;z-index:1;display:flex;text-align:var(--rg-theme-header-text-align, center)}revogr-header .rgHeaderCell.align-center{text-align:center}revogr-header .rgHeaderCell.align-left{text-align:left}revogr-header .rgHeaderCell.align-right{text-align:right}revogr-header .rgHeaderCell.sortable{cursor:pointer}revogr-header .rgHeaderCell .sort-indicator{display:inline-flex;align-items:flex-start;gap:1px}revogr-header .rgHeaderCell .sort-indicator i.asc:after,revogr-header .rgHeaderCell .sort-indicator i.desc:after{font-size:13px}revogr-header .rgHeaderCell .sort-indicator i.asc:after{content:"↑"}revogr-header .rgHeaderCell .sort-indicator i.desc:after{content:"↓"}revogr-header .rgHeaderCell .sort-indicator .sort-order-index{font-size:10px;line-height:1;top:0}revogr-header .rgHeaderCell.active{z-index:10}revogr-header .rgHeaderCell.active .resizable{background-color:var(--rg-theme-header-resize-hover)}revogr-header .rgHeaderCell .header-content{position:absolute;z-index:0;inset:0;box-sizing:border-box;padding:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}revogr-header .rgHeaderCell>span:first-of-type{position:relative;z-index:1;margin-left:auto}revogr-header .rgHeaderCell .resizable{display:block;position:absolute;z-index:90;touch-action:none;user-select:none}revogr-header .rgHeaderCell .resizable:hover{background-color:var(--rg-theme-header-resize-hover)}revogr-header .rgHeaderCell>.resizable-r{cursor:ew-resize;width:6px;right:0;top:0;height:100%}revogr-header .rgHeaderCell>.resizable-rb{cursor:se-resize;width:6px;height:6px;right:0;bottom:0}revogr-header .rgHeaderCell>.resizable-b{cursor:s-resize;height:6px;bottom:0;width:100%;left:0}revogr-header .rgHeaderCell>.resizable-lb{cursor:sw-resize;width:6px;height:6px;left:0;bottom:0}revogr-header .rgHeaderCell>.resizable-l{cursor:w-resize;width:6px;left:0;height:100%;top:0}revogr-header .rgHeaderCell>.resizable-lt{cursor:nw-resize;width:6px;height:6px;left:0;top:0}revogr-header .rgHeaderCell>.resizable-t{cursor:n-resize;height:6px;top:0;width:100%;left:0}revogr-header .rgHeaderCell>.resizable-rt{cursor:ne-resize;width:6px;height:6px;right:0;top:0}revogr-header .rv-filter{visibility:hidden}'}},[0,"revogr-header",{viewportCol:[16],dimensionCol:[16],selectionStore:[16],groups:[16],groupingDepth:[2,"grouping-depth"],readonly:[4],canResize:[4,"can-resize"],resizeHandler:[16],colData:[16],columnFilter:[4,"column-filter"],type:[1],additionalData:[8,"additional-data"]}]);function O(){"undefined"!=typeof customElements&&["revogr-header"].forEach((e=>{"revogr-header"===e&&(customElements.get(s(e))||customElements.define(s(e),j))}))}export{C as O,j as R,f as S,b as a,O as b,p as d}
|
|
4
|
+
import{h as e,proxyCustomElement as t,HTMLElement as i,createEvent as r,transformTag as s}from"@stencil/core/internal/client";import{M as o,D as n,d as h,H as l,F as a,e as d,f as c}from"./consts.js";import"./platform.js";import{a as u}from"./dimension.helpers.js";import{c as v}from"./filter.button.js";import{R as g}from"./column.service.js";function p(e,t,i){const r=new CustomEvent(t,{detail:i,cancelable:!0,bubbles:!0});return null==e||e.dispatchEvent(r),r}function b(e,t,i){return e.preventDefault(),p(e.target,t,i)}const f=({column:t})=>{var i;const r={class:null!==(i=null==t?void 0:t.order)&&void 0!==i?i:"sort-off"};return e("span",Object.assign({},{class:"sort-indicator"}),e("i",Object.assign({},r)),(null==t?void 0:t.sortIndex)?e("sup",Object.assign({},{class:"sort-order-index"}),t.sortIndex):null)};var m;!function(e){e.start="resize:start",e.move="resize:move",e.end="resize:end"}(m||(m={}));const z={"resizable-r":{bit:1,cursor:"ew-resize"},"resizable-rb":{bit:3,cursor:"se-resize"},"resizable-b":{bit:2,cursor:"s-resize"},"resizable-lb":{bit:6,cursor:"sw-resize"},"resizable-l":{bit:4,cursor:"w-resize"},"resizable-lt":{bit:12,cursor:"nw-resize"},"resizable-t":{bit:8,cursor:"n-resize"},"resizable-rt":{bit:9,cursor:"ne-resize"}};class x{constructor(e,t){var i,r,s;this.initialProps=e,this.$event=t,this.mouseX=0,this.mouseY=0,this.width=0,this.height=0,this.changeX=0,this.changeY=0,this.disableCalcMap=15,this.props=(s=e,Object.assign(Object.assign({},s),{fitParent:s.fitParent||!1,active:s.active||[],disableAttributes:s.disableAttributes||[],minWidth:s.minWidth||0,minHeight:s.minHeight||0})),this.mouseMoveFunc=this.handleMove.bind(this),this.mouseUpFunc=this.handleUp.bind(this),this.minW=this.props.minWidth,this.minH=this.props.minHeight,this.maxW=null!==(i=this.props.maxWidth)&&void 0!==i?i:0,this.maxH=null!==(r=this.props.maxHeight)&&void 0!==r?r:0,this.parent={width:0,height:0},this.resizeState=0}set(e){this.$el=e,this.props.disableAttributes.forEach((e=>{switch(e){case"l":this.disableCalcMap&=-2;break;case"t":this.disableCalcMap&=-3;break;case"w":this.disableCalcMap&=-5;break;case"h":this.disableCalcMap&=-9}}))}emitEvent(e,t){var i;if(!this.$event)return;const r=null===(i=this.activeResizer)||void 0===i?void 0:i.classList.contains("resizable-l");this.$event(Object.assign({eventName:e,width:this.width+this.changeX*(r?-1:1),height:this.height+this.changeY,changedX:this.changeX,changedY:this.changeY},t))}static isTouchEvent(e){var t;return(null===(t=e.touches)||void 0===t?void 0:t.length)>=0}handleMove(e){var t;if(!this.resizeState)return;let i,r;x.isTouchEvent(e)?(i=e.touches[0].clientY,r=e.touches[0].clientX):(i=e.clientY,r=e.clientX);let s=this.resizeState&z["resizable-r"].bit||this.resizeState&z["resizable-l"].bit;if((this.resizeState&z["resizable-t"].bit||this.resizeState&z["resizable-b"].bit)&&8&this.disableCalcMap){let e=this.changeY+(i-this.mouseY);const t=this.height+e;t<this.minH&&(e=-(this.height-this.minH)),this.maxH&&t>this.maxH&&(e=this.maxH-this.height),this.changeY=e,this.mouseY=i,this.activeResizer&&(this.activeResizer.style.bottom=-this.changeY+"px")}if(s&&4&this.disableCalcMap){const e=null===(t=this.activeResizer)||void 0===t?void 0:t.classList.contains("resizable-l");let i=this.changeX+(r-this.mouseX);const s=this.width+i*(e?-1:1);s<this.minW&&(i=-(this.width-this.minW)),this.maxW&&s>this.maxW&&(i=this.maxW-this.width),this.changeX=i,this.mouseX=r,this.activeResizer&&(e?this.activeResizer.style.left=`${this.changeX}px`:this.activeResizer.style.right=-this.changeX+"px")}this.emitEvent(m.move)}handleDown(e){if(!e.defaultPrevented){e.preventDefault(),this.dropInitial();for(let t in z){const i=e.target;if(this.$el.contains(i)&&(null==i?void 0:i.classList.contains(t))){document.body.style.cursor=z[t].cursor,x.isTouchEvent(e)?this.setInitials(e.touches[0],i):(e.preventDefault&&e.preventDefault(),this.setInitials(e,i)),this.resizeState=z[t].bit,this.emitEvent(m.start);break}}this.bindMove()}}handleUp(e){e.preventDefault(),0!==this.resizeState&&(this.resizeState=0,document.body.style.cursor="",this.emitEvent(m.end)),this.dropInitial(),this.unbindMove()}setInitials({clientX:e,clientY:t},i){var r,s,o,n;const h=getComputedStyle(this.$el);if(this.$el.classList.add("active"),this.activeResizer=i,4&this.disableCalcMap){this.mouseX=e,this.width=this.$el.clientWidth,this.parent.width=null!==(s=null===(r=this.$el.parentElement)||void 0===r?void 0:r.clientWidth)&&void 0!==s?s:0;const t=parseFloat(h.paddingLeft)+parseFloat(h.paddingRight);this.minW=Math.max(t,this.initialProps.minWidth||0),this.initialProps.maxWidth&&(this.maxW=Math.max(this.width,this.initialProps.maxWidth))}if(8&this.disableCalcMap){this.mouseY=t,this.height=this.$el.clientHeight,this.parent.height=null!==(n=null===(o=this.$el.parentElement)||void 0===o?void 0:o.clientHeight)&&void 0!==n?n:0;const e=parseFloat(h.paddingTop)+parseFloat(h.paddingBottom);this.minH=Math.max(e,this.initialProps.minHeight||0),this.initialProps.maxHeight&&(this.maxH=Math.max(this.height,this.initialProps.maxHeight))}}dropInitial(){this.changeX=this.changeY=this.minW=this.minH,this.width=this.height=0,this.activeResizer&&this.activeResizer.removeAttribute("style"),this.$el.classList.remove("active"),this.activeResizer=void 0}bindMove(){document.documentElement.addEventListener("mouseup",this.mouseUpFunc,!0),document.documentElement.addEventListener("touchend",this.mouseUpFunc,!0),document.documentElement.addEventListener("mousemove",this.mouseMoveFunc,!0),document.documentElement.addEventListener("touchmove",this.mouseMoveFunc,!0),document.documentElement.addEventListener("mouseleave",this.mouseUpFunc)}unbindMove(){document.documentElement.removeEventListener("mouseup",this.mouseUpFunc,!0),document.documentElement.removeEventListener("touchend",this.mouseUpFunc,!0),document.documentElement.removeEventListener("mousemove",this.mouseMoveFunc,!0),document.documentElement.removeEventListener("touchmove",this.mouseMoveFunc,!0),document.documentElement.removeEventListener("mouseleave",this.mouseUpFunc)}}const w=(t,i)=>{const r=[],s=t.canResize&&new x(t,(e=>{var i;e.eventName===m.end&&(null===(i=t.onResize)||void 0===i||i.call(t,e))}))||null;if(t.active&&t.canResize)for(let i in t.active)r.push(e("div",{onClick:e=>e.preventDefault(),onDblClick:e=>{var i;e.preventDefault(),null===(i=t.onDblClick)||void 0===i||i.call(t,e)},onMouseDown:e=>null==s?void 0:s.handleDown(e),onTouchStart:e=>null==s?void 0:s.handleDown(e),class:`resizable resizable-${t.active[i]}`}));return e("div",Object.assign({},t,{ref:e=>e&&(null==s?void 0:s.set(e))}),i,r)},C="columnclick",H=({data:t,props:i,additionalData:r},s)=>{let o=(null==t?void 0:t.name)||"",n=i;if((null==t?void 0:t.columnTemplate)&&(o=t.columnTemplate(e,t,r)),null==t?void 0:t.columnProperties){const e=t.columnProperties(t);e&&(n=g(i,e))}const h=Object.assign(Object.assign({},n),{onMouseDown(e){p(e.currentTarget,C,{data:t,event:e})}});return e(w,Object.assign({},h),e("div",{class:"header-content"},o),s)},y=t=>{var i,r,s,d,c,u,g,p,b,m;const z=!!((null===(i=t.data)||void 0===i?void 0:i.sortable)||(null===(r=t.data)||void 0===r?void 0:r.order)||(null===(s=t.data)||void 0===s?void 0:s.sortIndex)),x=!(!t.canFilter||!1===(null===(d=t.data)||void 0===d?void 0:d.filter)),w={[l]:!0,[h]:!!(null===(c=t.data)||void 0===c?void 0:c.sortable)};(null===(u=t.data)||void 0===u?void 0:u.order)&&(w[t.data.order]=!0);const C={key:String(null!==(p=null===(g=t.data)||void 0===g?void 0:g.prop)&&void 0!==p?p:t.column.itemIndex),[n]:t.column.itemIndex,canResize:t.canResize,minWidth:(null===(b=t.data)||void 0===b?void 0:b.minSize)||o,maxWidth:null===(m=t.data)||void 0===m?void 0:m.maxSize,active:t.active||["r"],class:w,style:{width:`${t.column.size}px`,transform:`translateX(${t.column.start-(t.renderOffset||0)}px)`},onResize:t.onResize,onDblClick(e){var i;null===(i=t.onDblClick)||void 0===i||i.call(t,{column:t.data,index:t.column.itemIndex,originalEvent:e,providers:t.data.providers})},onClick(e){!e.defaultPrevented&&t.onClick&&t.onClick({column:t.data,index:t.column.itemIndex,originalEvent:e,providers:t.data.providers})}};return t.range&&t.column.itemIndex>=t.range.x&&t.column.itemIndex<=t.range.x1&&"object"==typeof C.class&&(C.class[a]=!0),e(H,{data:t.data,props:C,additionalData:t.additionalData},z||x?e("span",{class:"header-controls"},z?e(f,{column:t.data}):null,x?e(v,{column:t.data}):null):null)},k=t=>{const i={key:`${t.group.name}-${t.group.indexes.join("-")}`,canResize:t.canResize,minWidth:t.group.indexes.length*o,maxWidth:0,active:t.active||["r"],class:{[l]:!0},style:{transform:`translateX(${t.start-(t.renderOffset||0)}px)`,width:t.end-t.start+"px"},onResize:t.onResize};return e(H,{data:Object.assign(Object.assign({},t.group),{prop:"",providers:t.providers,index:t.start}),props:i,additionalData:t.additionalData})},j=t(class extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.initialHeaderClick=r(this,"beforeheaderclick",7),this.headerresize=r(this,"headerresize",7),this.beforeResize=r(this,"beforeheaderresize",7),this.headerdblClick=r(this,"headerdblclick",7),this.beforeHeaderRender=r(this,"beforeheaderrender",7),this.beforeGroupHeaderRender=r(this,"beforegroupheaderrender",7),this.afterHeaderRender=r(this,"afterheaderrender",7),this.groupingDepth=0,this.additionalData={}}onResize({width:e},t){this.beforeResize.emit([Object.assign(Object.assign({},this.colData[t]),{size:e||void 0})]).defaultPrevented||this.headerresize.emit({[t]:e||0})}onResizeGroup(e,t,i){const r={},s=e/(i-t+1);for(let e=t;e<=i;e++){const t=u(this.dimensionCol.state,e);r[e]=t.end-t.start+s}this.headerresize.emit(r)}componentDidRender(){this.afterHeaderRender.emit(this.providers)}render(){var t;const i=this.viewportCol.get("items"),r=null===(t=this.selectionStore)||void 0===t?void 0:t.get("range"),{cells:s}=this.renderHeaderColumns(i,r),o=this.renderGroupingColumns();return[e("div",{key:"3cc466db6bc4df0cd61c47a22c3a0473318e5dd8",class:"group-rgRow"},o),e("div",{key:"9742a3fa4d4b75073aef5544806f42386ebffdea",class:`${d} ${c}`},s)]}renderHeaderColumns(t,i){const r=[],s=this.viewportCol.get("renderOffset")||0;for(let e of t){const t={range:i,column:e,data:Object.assign(Object.assign({},this.colData[e.itemIndex]),{index:e.itemIndex,providers:this.providers}),canFilter:!!this.columnFilter,canResize:this.canResize,renderOffset:s,active:this.resizeHandler,additionalData:this.additionalData,onResize:t=>this.onResize(t,e.itemIndex),onDblClick:e=>this.headerdblClick.emit(e),onClick:e=>this.initialHeaderClick.emit(e)},o=this.beforeHeaderRender.emit(t);o.defaultPrevented||r.push(o.detail)}const o=this.getDuplicateHeaderProps(r);return{cells:r.map((t=>e(y,Object.assign({key:this.getHeaderCellKey(t.data,this.type,o)},t))))}}renderGroupingColumns(){const e=this.getVisibleGroupRange();return Array.from({length:this.groupingDepth},((t,i)=>this.renderGroupRow(i,e))).flat()}renderGroupRow(t,i){return[...(this.groups[t]||[]).map((e=>this.renderGroupColumn(e,t,i))).filter((e=>!!e)),e("div",{key:`group-row-${t}`,class:{[d]:!0,group:!0}})]}renderGroupColumn(t,i,r){const s=this.getGroupIndexRange(t),o=this.getGroupBounds(s),n={level:i,providers:this.providers,start:o.start,end:o.end,group:t,renderOffset:this.viewportCol.get("renderOffset")||0,active:this.resizeHandler,canResize:this.canResize,additionalData:this.additionalData,onResize:e=>{var t;return s?this.onResizeGroup(null!==(t=e.changedX)&&void 0!==t?t:0,s.startIndex,s.endIndex):void 0}},h=this.beforeGroupHeaderRender.emit(n);if(h.defaultPrevented)return;const l=this.getGroupIndexRange(h.detail.group);if(!(l&&r&&(a=l.startIndex,d=l.endIndex,c=r,a<=c.end&&d>=c.start)))return;var a,d,c;h.detail.onResize===n.onResize&&(h.detail.onResize=e=>{var t;return this.onResizeGroup(null!==(t=e.changedX)&&void 0!==t?t:0,l.startIndex,l.endIndex)});const u=this.getGroupBounds(l);return h.detail.start===n.start&&(h.detail.start=u.start),h.detail.end===n.end&&(h.detail.end=u.end),e(k,Object.assign({key:this.getGroupHeaderCellKey(h.detail.group,i)},h.detail))}getGroupIndexRange(e){var t;const i=null!==(t=e.indexes[0])&&void 0!==t?t:-1;if(!(i<0))return{startIndex:i,endIndex:e.indexes[e.indexes.length-1]}}getGroupBounds(e){return e?{start:u(this.dimensionCol.state,e.startIndex).start,end:u(this.dimensionCol.state,e.endIndex).end}:{start:0,end:0}}getVisibleGroupRange(){const e=this.viewportCol.get("items");if(e.length)return e.reduce(((e,t)=>({start:Math.min(e.start,t.itemIndex),end:Math.max(e.end,t.itemIndex)})),{start:e[0].itemIndex,end:e[0].itemIndex})}getHeaderCellKey(e,t,i){if(void 0===(null==e?void 0:e.prop))return`${t}-${String(null==e?void 0:e.index)}`;const r=String(e.prop);return i.has(r)?`${t}-${r}-${String(e.index)}`:`${t}-${r}`}getDuplicateHeaderProps(e){const t=new Set,i=new Set;return e.forEach((({data:e})=>{if(void 0!==(null==e?void 0:e.prop)){const r=String(e.prop);t.has(r)?i.add(r):t.add(r)}})),i}getGroupHeaderCellKey(e,t){return`group-${t}-${e.name}-${e.indexes.join("-")}`}get providers(){return{type:this.type,readonly:this.readonly,data:this.colData,viewport:this.viewportCol,dimension:this.dimensionCol,selection:this.selectionStore}}get element(){return this}static get style(){return'@charset "UTF-8";revogr-header{position:relative;z-index:5;display:block}revogr-header .header-rgRow{display:block;position:relative}revogr-header .header-rgRow.group{z-index:0}revogr-header .group-rgRow{position:relative;overflow:hidden}revogr-header .rgHeaderCell{position:absolute;box-sizing:border-box;height:100%;z-index:1;display:flex;text-align:var(--rg-theme-header-text-align, center)}revogr-header .rgHeaderCell.align-center{text-align:center}revogr-header .rgHeaderCell.align-left{text-align:left}revogr-header .rgHeaderCell.align-right{text-align:right}revogr-header .rgHeaderCell.sortable{cursor:pointer}revogr-header .rgHeaderCell .sort-indicator{display:inline-flex;align-items:flex-start;gap:1px}revogr-header .rgHeaderCell .sort-indicator i.asc:after,revogr-header .rgHeaderCell .sort-indicator i.desc:after{font-size:13px}revogr-header .rgHeaderCell .sort-indicator i.asc:after{content:"↑"}revogr-header .rgHeaderCell .sort-indicator i.desc:after{content:"↓"}revogr-header .rgHeaderCell .sort-indicator .sort-order-index{font-size:10px;line-height:1;top:0}revogr-header .rgHeaderCell.active{z-index:10}revogr-header .rgHeaderCell.active .resizable{background-color:var(--rg-theme-header-resize-hover)}revogr-header .rgHeaderCell .header-content{position:absolute;z-index:0;inset:0;box-sizing:border-box;padding:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1}revogr-header .rgHeaderCell .header-controls{position:absolute;top:0;right:1px;bottom:1px;min-width:15px;z-index:1;display:flex;align-items:center}revogr-header .rgHeaderCell .resizable{display:block;position:absolute;z-index:90;touch-action:none;user-select:none}revogr-header .rgHeaderCell .resizable:hover{background-color:var(--rg-theme-header-resize-hover)}revogr-header .rgHeaderCell>.resizable-r{cursor:ew-resize;width:6px;right:0;top:0;height:100%}revogr-header .rgHeaderCell>.resizable-rb{cursor:se-resize;width:6px;height:6px;right:0;bottom:0}revogr-header .rgHeaderCell>.resizable-b{cursor:s-resize;height:6px;bottom:0;width:100%;left:0}revogr-header .rgHeaderCell>.resizable-lb{cursor:sw-resize;width:6px;height:6px;left:0;bottom:0}revogr-header .rgHeaderCell>.resizable-l{cursor:w-resize;width:6px;left:0;height:100%;top:0}revogr-header .rgHeaderCell>.resizable-lt{cursor:nw-resize;width:6px;height:6px;left:0;top:0}revogr-header .rgHeaderCell>.resizable-t{cursor:n-resize;height:6px;top:0;width:100%;left:0}revogr-header .rgHeaderCell>.resizable-rt{cursor:ne-resize;width:6px;height:6px;right:0;top:0}revogr-header .rv-filter{visibility:hidden}'}},[0,"revogr-header",{viewportCol:[16],dimensionCol:[16],selectionStore:[16],groups:[16],groupingDepth:[2,"grouping-depth"],readonly:[4],canResize:[4,"can-resize"],resizeHandler:[16],colData:[16],columnFilter:[4,"column-filter"],type:[1],additionalData:[8,"additional-data"]}]);function O(){"undefined"!=typeof customElements&&["revogr-header"].forEach((e=>{"revogr-header"===e&&(customElements.get(s(e))||customElements.define(s(e),j))}))}export{C as O,j as R,f as S,b as a,O as b,p as d}
|