@progress/kendo-react-pivotgrid/components/AxisEditor.js

React PivotGrid (also called Pivot Table) can be data-bound to an OLAP service and customized extensively. KendoReact PivotGrid package

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2025 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const z=require("react"),v=require("@progress/kendo-pivotgrid-common"),u=require("@progress/kendo-react-common"),A=require("@progress/kendo-react-data-tools"),H=require("@progress/kendo-react-buttons"),T=require("../utils/index.js"),B=require("./EditorContext.js"),$=require("./AxisFilterFieldsEditor.js"),K=require("../shared/PivotGridConfiguratorEditorStateContext.js"),l=require("../hooks/usePivotConfiguratorEditor.js");function Z(e){const d=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const s in e)if(s!=="default"){const c=Object.getOwnPropertyDescriptor(e,s);Object.defineProperty(d,s,c.get?c:{enumerable:!0,get:()=>e[s]})}}return d.default=e,Object.freeze(d)}const n=Z(z),p=n.forwardRef((e,d)=>{const s=n.useRef(0),c=n.useRef(0),f=n.useRef(null),i=n.useRef(null),R=n.useRef(null),{axes:I}=n.useContext(B.PivotGridConfiguratorEditorAxesContext),[y,x]=n.useState(!1),[r,a]=n.useContext(K.PivotGridConfiguratorEditorStateContext);n.useImperativeHandle(i,()=>f.current&&f.current.element),n.useImperativeHandle(R,()=>({props:e,element:i.current})),n.useImperativeHandle(d,()=>R.current);const[F,N]=u.useCustomComponent(e.chip||m.chip),[h,E]=u.useCustomComponent(e.dropClue||m.dropClue),[_,M]=u.useCustomComponent(e.columnMenuTextColumn||m.columnMenuTextColumn),[D,G]=u.useCustomComponent(e.filterFieldsEditor||m.filterFieldsEditor),P=T.findFilters(r.filter,String(e.value),"in"),g=T.findFilters(r.filter,String(e.value)),S=(t,o)=>{a({type:l.PIVOT_CONFIGURATOR_ACTION.setSort,payload:o},t)},b=(t,o)=>{o.length?a({type:l.PIVOT_CONFIGURATOR_ACTION.setFilter,payload:[...P||[],...o.reduce((C,O)=>[...C,...O.filters.filter(w=>w.value)],[])]},t):a({type:l.PIVOT_CONFIGURATOR_ACTION.setFilter,payload:P},t)},q=t=>{a({type:l.PIVOT_CONFIGURATOR_ACTION.remove,payload:e.dataItem},t.syntheticEvent)},U=t=>{const o=t.slice(),C=T.findFilter(r.filter,String(e.dataItem.name),"in");return o.splice(1,0,n.createElement(D,{key:"axis-filter-fields-editor",defaultFilter:C,dataItem:e.dataItem,data:e.dataItem.fields,axes:I,...G})),o},V=t=>{s.current=t.clientX,c.current=t.clientY},k=t=>{Math.abs(s.current-t.clientX)<10&&Math.abs(c.current-t.clientY)<10||(i.current&&(i.current.style.transform=`translate(${t.clientX-s.current}px, ${t.clientY-c.current}px)`),x(!0),a({type:l.PIVOT_CONFIGURATOR_ACTION.setDragItem,payload:e.dataItem}))},j=()=>{x(!1),r.dragItem&&(i.current&&(i.current.style.transform=""),a({type:l.PIVOT_CONFIGURATOR_ACTION.drop,payload:e.dataItem}))},X=t=>{r.dragItem&&(a({type:l.PIVOT_CONFIGURATOR_ACTION.setDropTarget,payload:e.dataItem},t.syntheticEvent),a({type:l.PIVOT_CONFIGURATOR_ACTION.setDropZone,payload:I},t.syntheticEvent))},Y=t=>{if(r.dragItem&&!y&&i.current){const o=i.current.getBoundingClientRect(),O=t.syntheticEvent.clientX-o.left<o.width/2?"before":"after";a({type:l.PIVOT_CONFIGURATOR_ACTION.setDropDirection,payload:O},t.syntheticEvent)}};return u.useDraggable(i,{onPress:V,onDrag:k,onRelease:j}),n.createElement(n.Fragment,null,r.dropTarget&&v.compareAxes(r.dropTarget,e.dataItem)&&r.dropDirection==="before"&&n.createElement(h,{...E}),n.createElement(F,{ref:u.canUseRef(F)?f:void 0,...e,removable:!0,onRemove:q,onMouseEnter:X,onMouseMove:Y,style:{pointerEvents:y?"none":void 0},rounded:"full",...N},e.text,I!=="measureAxes"&&n.createElement(_,{field:String(e.value),itemsRender:U,sort:r.sort,onSortChange:S,filter:g&&g.length?[{logic:"and",filters:g}]:void 0,onFilterChange:b,filterContent:[A.ColumnMenuTextFilter],...M})),r.dropTarget&&v.compareAxes(r.dropTarget,e.dataItem)&&r.dropDirection==="after"&&n.createElement(h,{...E}))}),m={chip:H.Chip,columnMenuTextColumn:A.ColumnMenuTextColumn,filterFieldsEditor:$.PivotGridAxisFilterFieldsEditor,dropClue:e=>n.createElement("div",{className:"k-grouping-dropclue",style:{position:"relative",zIndex:1e4},...e})};p.defaultProps=m;p.displayName="KendoReactPivotGridAxisEditor";exports.PivotGridAxisEditor=p;