@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"),P=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),A=n.forwardRef((e,d)=>{const s=n.useRef(0),c=n.useRef(0),f=n.useRef(null),i=n.useRef(null),p=n.useRef(null),{axes:I}=n.useContext(B.PivotGridConfiguratorEditorAxesContext),[R,y]=n.useState(!1),[r,a]=n.useContext(K.PivotGridConfiguratorEditorStateContext);n.useImperativeHandle(i,()=>f.current&&f.current.element),n.useImperativeHandle(p,()=>({props:e,element:i.current})),n.useImperativeHandle(d,()=>p.current);const[x,N]=u.useCustomComponent(e.chip||C.chip),[F,h]=u.useCustomComponent(e.dropClue||C.dropClue),[_,M]=u.useCustomComponent(e.columnMenuTextColumn||C.columnMenuTextColumn),[D,G]=u.useCustomComponent(e.filterFieldsEditor||C.filterFieldsEditor),E=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:[...E||[],...o.reduce((m,O)=>[...m,...O.filters.filter(w=>w.value)],[])]},t):a({type:l.PIVOT_CONFIGURATOR_ACTION.setFilter,payload:E},t)},q=t=>{a({type:l.PIVOT_CONFIGURATOR_ACTION.remove,payload:e.dataItem},t.syntheticEvent)},U=t=>{const o=t.slice(),m=T.findFilter(r.filter,String(e.dataItem.name),"in");return o.splice(1,0,n.createElement(D,{key:"axis-filter-fields-editor",defaultFilter:m,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)`),y(!0),a({type:l.PIVOT_CONFIGURATOR_ACTION.setDragItem,payload:e.dataItem}))},j=()=>{y(!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&&!R&&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(F,{...h}),n.createElement(x,{ref:u.canUseRef(x)?f:void 0,...e,removable:!0,onRemove:q,onMouseEnter:X,onMouseMove:Y,style:{pointerEvents:R?"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:[P.ColumnMenuTextFilter],...M})),r.dropTarget&&v.compareAxes(r.dropTarget,e.dataItem)&&r.dropDirection==="after"&&n.createElement(F,{...h}))}),C={chip:H.Chip,columnMenuTextColumn:P.ColumnMenuTextColumn,filterFieldsEditor:$.PivotGridAxisFilterFieldsEditor,dropClue:e=>n.createElement("div",{className:"k-grouping-dropclue",style:{position:"relative",zIndex:1e4},...e})};A.displayName="KendoReactPivotGridAxisEditor";exports.PivotGridAxisEditor=A;