ag-grid-react
Version:
AG Grid React Component
1,532 lines (1,509 loc) • 171 kB
JavaScript
"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// packages/ag-grid-react/src/index.ts
var index_exports = {};
__export(index_exports, {
AgGridProvider: () => AgGridProvider,
AgGridReact: () => AgGridReact,
CustomComponentContext: () => CustomContext,
getInstance: () => getInstance,
useGridCellEditor: () => useGridCellEditor,
useGridDate: () => useGridDate,
useGridFilter: () => useGridFilter,
useGridFilterDisplay: () => useGridFilterDisplay,
useGridFloatingFilter: () => useGridFloatingFilter,
useGridMenuItem: () => useGridMenuItem,
warnReactiveCustomComponents: () => warnReactiveCustomComponents
});
module.exports = __toCommonJS(index_exports);
// packages/ag-grid-react/src/agGridReact.tsx
var import_react27 = __toESM(require("react"));
// packages/ag-stack/dist/package/main.esm.mjs
var VERSION = "36.0.0";
var IS_SSR = typeof window !== "object" || !window?.document?.fonts?.forEach;
var getInjectionState = () => {
const versionMap = globalThis.agStyleInjectionVersions ?? (globalThis.agStyleInjectionVersions = /* @__PURE__ */ new Map());
let state = versionMap.get(VERSION);
if (!state) {
state = {
map: /* @__PURE__ */ new WeakMap(),
grids: /* @__PURE__ */ new Map(),
paramsId: 0
};
versionMap.set(VERSION, state);
}
return state;
};
var injectionState = getInjectionState();
var LocalEventService = class {
constructor() {
this.allSyncListeners = /* @__PURE__ */ new Map();
this.allAsyncListeners = /* @__PURE__ */ new Map();
this.globalSyncListeners = /* @__PURE__ */ new Set();
this.globalAsyncListeners = /* @__PURE__ */ new Set();
this.asyncFunctionsQueue = [];
this.scheduled = false;
this.firedEvents = {};
}
setFrameworkOverrides(frameworkOverrides) {
this.frameworkOverrides = frameworkOverrides;
}
getListeners(eventType, async, autoCreateListenerCollection) {
const listenerMap = async ? this.allAsyncListeners : this.allSyncListeners;
let listeners = listenerMap.get(eventType);
if (!listeners && autoCreateListenerCollection) {
listeners = /* @__PURE__ */ new Set();
listenerMap.set(eventType, listeners);
}
return listeners;
}
noRegisteredListenersExist() {
return this.allSyncListeners.size === 0 && this.allAsyncListeners.size === 0 && this.globalSyncListeners.size === 0 && this.globalAsyncListeners.size === 0;
}
addEventListener(eventType, listener, async = false) {
this.getListeners(eventType, async, true).add(listener);
}
removeEventListener(eventType, listener, async = false) {
const listeners = this.getListeners(eventType, async, false);
if (!listeners) {
return;
}
listeners.delete(listener);
if (listeners.size === 0) {
(async ? this.allAsyncListeners : this.allSyncListeners).delete(eventType);
}
}
addGlobalListener(listener, async = false) {
this.getGlobalListeners(async).add(listener);
}
removeGlobalListener(listener, async = false) {
this.getGlobalListeners(async).delete(listener);
}
dispatchEvent(event) {
this.dispatchToListeners(event, true);
this.dispatchToListeners(event, false);
this.firedEvents[event.type] = true;
}
dispatchEventOnce(event) {
if (!this.firedEvents[event.type]) {
this.dispatchEvent(event);
}
}
dispatchToListeners(event, async) {
const eventType = event.type;
if (async && "event" in event) {
const browserEvent = event.event;
if (browserEvent instanceof Event) {
event.eventPath = browserEvent.composedPath();
}
}
const { frameworkOverrides } = this;
const runCallback = (func) => {
const callback = frameworkOverrides ? () => frameworkOverrides.wrapIncoming(func) : func;
if (async) {
this.dispatchAsync(callback);
} else {
callback();
}
};
const originalListeners = this.getListeners(eventType, async, false);
if ((originalListeners?.size ?? 0) > 0) {
const listeners = new Set(originalListeners);
for (const listener of listeners) {
if (!originalListeners?.has(listener)) {
continue;
}
runCallback(() => listener(event));
}
}
const globalListenersSrc = this.getGlobalListeners(async);
if (globalListenersSrc.size > 0) {
const globalListeners = new Set(globalListenersSrc);
for (const listener of globalListeners) {
runCallback(() => listener(eventType, event));
}
}
}
getGlobalListeners(async) {
return async ? this.globalAsyncListeners : this.globalSyncListeners;
}
// this gets called inside the grid's thread, for each event that it
// wants to set async. the grid then batches the events into one setTimeout()
// because setTimeout() is an expensive operation. ideally we would have
// each event in it's own setTimeout(), but we batch for performance.
dispatchAsync(func) {
this.asyncFunctionsQueue.push(func);
if (!this.scheduled) {
const flush = () => {
window.setTimeout(this.flushAsyncQueue.bind(this), 0);
};
const frameworkOverrides = this.frameworkOverrides;
if (frameworkOverrides) {
frameworkOverrides.wrapIncoming(flush);
} else {
flush();
}
this.scheduled = true;
}
}
// this happens in the next VM turn only, and empties the queue of events
flushAsyncQueue() {
this.scheduled = false;
const queueCopy = this.asyncFunctionsQueue.slice();
this.asyncFunctionsQueue = [];
for (const func of queueCopy) {
func();
}
}
};
function _areEqual(a, b, comparator) {
if (a === b) {
return true;
}
if (!a || !b) {
return a == null && b == null;
}
const len = a.length;
if (len !== b.length) {
return false;
}
if (comparator) {
for (let i = 0; i < len; ++i) {
const valueA = a[i];
const valueB = b[i];
if (valueA !== valueB && !comparator(valueA, valueB)) {
return false;
}
}
return true;
}
for (let i = 0; i < len; ++i) {
if (a[i] !== b[i]) {
return false;
}
}
return true;
}
function _removeFromArray(array, object) {
const index = array.indexOf(object);
if (index >= 0) {
array.splice(index, 1);
}
}
function _exists(value) {
return value != null && value !== "";
}
function _getRootNode(beans) {
return beans.eRootDiv.getRootNode();
}
function _getActiveDomElement(beans) {
return _getRootNode(beans).activeElement;
}
function _getDocument(beans) {
const { gos, eRootDiv } = beans;
let result = null;
const optionsGetDocument = gos.get("getDocument");
if (optionsGetDocument && _exists(optionsGetDocument)) {
result = optionsGetDocument();
} else if (eRootDiv) {
result = eRootDiv.ownerDocument;
}
if (result && _exists(result)) {
return result;
}
return document;
}
function _getWindow(beans) {
const eDocument = _getDocument(beans);
return eDocument.defaultView || window;
}
function _setAriaAttribute(element, attribute, value) {
element.setAttribute(_ariaAttributeName(attribute), value.toString());
}
function _removeAriaAttribute(element, attribute) {
element.removeAttribute(_ariaAttributeName(attribute));
}
function _ariaAttributeName(attribute) {
return `aria-${attribute}`;
}
function _setAriaRole(element, role) {
if (role) {
element.setAttribute("role", role);
} else {
element.removeAttribute("role");
}
}
function _setAriaMultiSelectable(element, multiSelectable) {
_setAriaAttribute(element, "multiselectable", multiSelectable);
}
function _setAriaRowCount(element, rowCount) {
_setAriaAttribute(element, "rowcount", rowCount);
}
function _setAriaRowIndex(element, rowIndex) {
_setAriaAttribute(element, "rowindex", rowIndex);
}
function _setAriaColCount(element, colCount) {
_setAriaAttribute(element, "colcount", colCount);
}
function _setAriaSort(element, sort) {
_setAriaAttribute(element, "sort", sort);
}
function _removeAriaSort(element) {
_removeAriaAttribute(element, "sort");
}
function _removeFromParent(node) {
if (node?.parentNode) {
node.remove();
}
}
function _observeResize(beans, element, callback) {
const win = _getWindow(beans);
const ResizeObserverImpl = win.ResizeObserver;
const resizeObserver = ResizeObserverImpl ? new ResizeObserverImpl(callback) : null;
resizeObserver?.observe(element);
return () => resizeObserver?.disconnect();
}
var PASSIVE_EVENTS = ["touchstart", "touchend", "touchmove", "touchcancel", "scroll"];
var NON_PASSIVE_EVENTS = ["wheel"];
function _addSafePassiveEventListener(eElement, event, listener) {
const passive = getPassiveStateForEvent(event);
let options;
if (passive != null) {
options = { passive };
}
eElement.addEventListener(event, listener, options);
}
var getPassiveStateForEvent = (event) => {
const isPassive = PASSIVE_EVENTS.includes(event);
const isNonPassive = NON_PASSIVE_EVENTS.includes(event);
if (isPassive) {
return true;
}
if (isNonPassive) {
return false;
}
};
function defaultLocaleTextFunc(_key, defaultValue) {
return defaultValue;
}
function _getLocaleTextFunc(localeSvc) {
return localeSvc?.getLocaleTextFunc() ?? defaultLocaleTextFunc;
}
var DESTROYED_EVENT = { type: "destroyed" };
var AgBeanStub = class {
constructor() {
this.beans = null;
this.gos = null;
this.eventSvc = null;
this.destroyed = false;
this.localEventService = null;
this.stubContext = null;
this.destroyFunctions = null;
this.propertyListenerId = 0;
this.lastChangeSetIdLookup = null;
}
preWireBeans(beans) {
this.beans = beans;
this.gos = beans.gos;
this.eventSvc = beans.eventSvc;
this.stubContext = beans.context;
}
// this was a test constructor niall built, when active, it prints after 5 seconds all beans/components that are
// not destroyed. to use, create a new grid, then api.destroy() before 5 seconds. then anything that gets printed
// points to a bean or component that was not properly disposed of.
// constructor() {
// setTimeout(()=> {
// if (this.isAlive()) {
// let prototype: any = Object.getPrototypeOf(this);
// const constructor: any = prototype.constructor;
// const constructorString = constructor.toString();
// const beanName = constructorString.substring(9, constructorString.indexOf("("));
// console.log('is alive ' + beanName);
// }
// }, 5000);
// }
destroy() {
const destroyFunctions = this.destroyFunctions;
if (destroyFunctions) {
for (let i = 0; i < destroyFunctions.length; i++) {
destroyFunctions[i]();
}
destroyFunctions.length = 0;
}
this.destroyed = true;
this.dispatchLocalEvent(DESTROYED_EVENT);
}
/** Add a local event listener against this BeanStub */
addEventListener(eventType, listener, async) {
let localEventService = this.localEventService;
if (!localEventService) {
localEventService = new LocalEventService();
this.localEventService = localEventService;
}
localEventService.addEventListener(eventType, listener, async);
}
/** Remove a local event listener from this BeanStub */
removeEventListener(eventType, listener, async) {
this.localEventService?.removeEventListener(eventType, listener, async);
}
dispatchLocalEvent(event) {
this.localEventService?.dispatchEvent(event);
}
addManagedElementListeners(object, handlers) {
return this._setupListeners(object, handlers);
}
addManagedEventListeners(handlers) {
return this._setupListeners(this.eventSvc, handlers);
}
addManagedListeners(object, handlers) {
return this._setupListeners(object, handlers);
}
_setupListeners(object, handlers) {
const destroyFuncs = [];
const keys = Object.keys(handlers);
for (let i = 0, len = keys.length; i < len; ++i) {
const k = keys[i];
const handler = handlers[k];
if (handler) {
destroyFuncs.push(this._setupListener(object, k, handler));
}
}
return destroyFuncs;
}
_setupListener(object, event, listener) {
if (this.destroyed) {
return () => null;
}
let destroyFunc;
if (isAgEventEmitter(object)) {
object.__addEventListener(event, listener);
destroyFunc = () => {
object.__removeEventListener(event, listener);
return null;
};
} else {
const objIsEventService = isEventService(object);
if (object instanceof HTMLElement) {
_addSafePassiveEventListener(object, event, listener);
} else if (objIsEventService) {
object.addListener(event, listener);
} else {
object.addEventListener(event, listener);
}
destroyFunc = objIsEventService ? () => {
object.removeListener(event, listener);
return null;
} : () => {
object.removeEventListener(event, listener);
return null;
};
}
return this.registerDestroyFunc(destroyFunc);
}
/**
* Setup a managed property listener for the given property.
* However, stores the destroy function in the beanStub so that if this bean
* is a component the destroy function will be called when the component is destroyed
* as opposed to being cleaned up only when the properties service is destroyed.
*/
setupPropertyListener(event, listener) {
const { gos } = this;
gos.addPropertyEventListener(event, listener);
const destroyFunc = () => {
gos.removePropertyEventListener(event, listener);
return null;
};
return this.registerDestroyFunc(destroyFunc);
}
/**
* Setup a managed property listener for the given GridOption property.
* @param event GridOption property to listen to changes for.
* @param listener Listener to run when property value changes
*/
addManagedPropertyListener(event, listener) {
if (this.destroyed) {
return () => null;
}
return this.setupPropertyListener(event, listener);
}
/**
* Setup managed property listeners for the given set of GridOption properties.
* The listener will be run if any of the property changes but will only run once if
* multiple of the properties change within the same framework lifecycle event.
* Works on the basis that GridOptionsService updates all properties *before* any property change events are fired.
* @param events Array of GridOption properties to listen for changes too.
* @param listener Shared listener to run if any of the properties change
*/
addManagedPropertyListeners(events, listener) {
if (this.destroyed) {
return;
}
const eventsKey = events.join("-") + this.propertyListenerId++;
const wrappedListener = (event) => {
const changeSet = event.changeSet;
if (changeSet) {
let lookup = this.lastChangeSetIdLookup;
if (!lookup) {
lookup = {};
this.lastChangeSetIdLookup = lookup;
}
if (changeSet.id === lookup[eventsKey]) {
return;
}
lookup[eventsKey] = changeSet.id;
}
const propertiesChangeEvent = {
type: "propertyChanged",
changeSet,
source: event.source
};
listener(propertiesChangeEvent);
};
for (let i = 0, len = events.length; i < len; ++i) {
this.setupPropertyListener(events[i], wrappedListener);
}
}
// Prototype method, not a per-instance arrow — never invoked detached, so binding per bean only wastes memory.
isAlive() {
return !this.destroyed;
}
getLocaleTextFunc() {
return _getLocaleTextFunc(this.beans.localeSvc);
}
// Lazy — most beans never register a destroy func, so the array is allocated on first push.
pushDestroyFunc(destroyFunc) {
const destroyFunctions = this.destroyFunctions;
if (destroyFunctions) {
destroyFunctions.push(destroyFunc);
} else {
this.destroyFunctions = [destroyFunc];
}
}
/** Register a destroy func and return an unregister callback that removes it if called before destroy. */
registerDestroyFunc(destroyFunc) {
this.pushDestroyFunc(destroyFunc);
return () => {
destroyFunc();
const destroyFunctions = this.destroyFunctions;
if (destroyFunctions) {
_removeFromArray(destroyFunctions, destroyFunc);
}
return null;
};
}
addDestroyFunc(func) {
if (this.destroyed) {
func();
} else {
this.pushDestroyFunc(func);
}
}
/** doesn't throw an error if `bean` is undefined */
createOptionalManagedBean(bean, context) {
return bean ? this.createManagedBean(bean, context) : void 0;
}
createManagedBean(bean, context) {
const res = this.createBean(bean, context);
this.addDestroyFunc(this.destroyBean.bind(this, bean, context));
return res;
}
createBean(bean, context, afterPreCreateCallback) {
return (context || this.stubContext).createBean(bean, afterPreCreateCallback);
}
/**
* Destroys a bean and returns undefined to support destruction and clean up in a single line.
* this.dateComp = this.context.destroyBean(this.dateComp);
*/
destroyBean(bean, context) {
return (context || this.stubContext).destroyBean(bean);
}
/**
* Destroys an array of beans and returns an empty array to support destruction and clean up in a single line.
* this.dateComps = this.context.destroyBeans(this.dateComps);
*/
destroyBeans(beans, context) {
return (context || this.stubContext).destroyBeans(beans);
}
};
AgBeanStub.prototype.__v_skip = true;
function isAgEventEmitter(object) {
return object.__addEventListener !== void 0;
}
function isEventService(object) {
return object.eventServiceType === "global";
}
var CssClassManager = class {
constructor(getGui) {
this.cssClassStates = {};
this.getGui = getGui;
}
toggleCss(className, addOrRemove) {
if (!className) {
return;
}
if (className.includes(" ")) {
const list = (className || "").split(" ");
if (list.length > 1) {
for (const cls of list) {
this.toggleCss(cls, addOrRemove);
}
return;
}
}
const updateNeeded = this.cssClassStates[className] !== addOrRemove;
if (updateNeeded && className.length) {
this.getGui()?.classList.toggle(className, addOrRemove);
this.cssClassStates[className] = addOrRemove;
}
}
};
var doOnceSet = /* @__PURE__ */ new Set();
var _doOnce = (func, key) => {
if (!doOnceSet.has(key)) {
doOnceSet.add(key);
func();
}
};
_doOnce._set = doOnceSet;
var memoize = (fn) => {
const values = /* @__PURE__ */ new Map();
return (a) => {
const key = a;
if (!values.has(key)) {
values.set(key, fn(a));
}
return values.get(key);
};
};
var accentMix = (mix) => ({ ref: "accentColor", mix });
var foregroundMix = (mix) => ({ ref: "foregroundColor", mix });
var foregroundBackgroundMix = (mix) => ({
ref: "foregroundColor",
mix,
onto: "backgroundColor"
});
var backgroundColor = { ref: "backgroundColor" };
var foregroundColor = { ref: "foregroundColor" };
var accentColor = { ref: "accentColor" };
var defaultLightColorSchemeParams = {
backgroundColor: "#fff",
foregroundColor: "#181d1f",
borderColor: foregroundMix(0.15),
chromeBackgroundColor: foregroundBackgroundMix(0.02),
browserColorScheme: "light"
};
var defaultFontFamily = () => [
"-apple-system",
"BlinkMacSystemFont",
"Segoe UI",
"Roboto",
"Oxygen-Sans",
"Ubuntu",
"Cantarell",
"Helvetica Neue",
"sans-serif"
];
var sharedDefaults = {
...defaultLightColorSchemeParams,
textColor: foregroundColor,
accentColor: "#2196f3",
invalidColor: "#e02525",
fontFamily: defaultFontFamily(),
subtleTextColor: {
ref: "textColor",
mix: 0.5
},
borderWidth: 1,
borderRadius: 4,
spacing: 8,
fontSize: 14,
fontWeight: 400,
focusShadow: {
spread: 3,
color: accentMix(0.5)
},
focusErrorShadow: {
spread: 3,
color: {
ref: "invalidColor",
onto: "backgroundColor",
mix: 0.5
}
},
popupShadow: "0 0 16px #00000026",
cardShadow: "0 1px 4px 1px #00000018",
dropdownShadow: { ref: "cardShadow" },
listItemHeight: {
calc: "max(iconSize, dataFontSize) + widgetVerticalSpacing"
},
dragAndDropImageBackgroundColor: backgroundColor,
dragAndDropImageBorder: true,
dragAndDropImageNotAllowedBorder: {
color: {
ref: "invalidColor",
onto: "dragAndDropImageBackgroundColor",
mix: 0.5
}
},
dragAndDropImageShadow: {
ref: "popupShadow"
},
iconSize: 16,
iconColor: "inherit",
toggleButtonWidth: 28,
toggleButtonHeight: 18,
toggleButtonOnBackgroundColor: accentColor,
toggleButtonOffBackgroundColor: foregroundBackgroundMix(0.3),
toggleButtonSwitchBackgroundColor: backgroundColor,
toggleButtonSwitchInset: 2,
tooltipBackgroundColor: {
ref: "chromeBackgroundColor"
},
tooltipErrorBackgroundColor: {
ref: "invalidColor",
onto: "backgroundColor",
mix: 0.1
},
tooltipTextColor: {
ref: "textColor"
},
tooltipErrorTextColor: {
ref: "invalidColor"
},
tooltipBorder: true,
tooltipErrorBorder: {
color: {
ref: "invalidColor",
onto: "backgroundColor",
mix: 0.25
}
},
panelBackgroundColor: backgroundColor,
panelTitleBarHeight: { ref: "headerHeight" },
panelTitleBarBackgroundColor: {
ref: "headerBackgroundColor"
},
panelTitleBarIconColor: {
ref: "headerTextColor"
},
panelTitleBarTextColor: {
ref: "headerTextColor"
},
panelTitleBarFontFamily: {
ref: "headerFontFamily"
},
panelTitleBarFontSize: {
ref: "headerFontSize"
},
panelTitleBarFontWeight: {
ref: "headerFontWeight"
},
panelTitleBarBorder: true,
// Unlike other picker field params, pickerFieldHeight must be a shared param
// because the pagination panel height depends on it
pickerFieldHeight: {
calc: "max(iconSize, fontSize) + spacing * 2"
},
dialogShadow: {
ref: "popupShadow"
},
dialogBorder: {
color: foregroundMix(0.2)
},
widgetContainerHorizontalPadding: {
calc: "spacing * 1.5"
},
widgetContainerVerticalPadding: {
calc: "spacing * 1.5"
},
widgetHorizontalSpacing: {
calc: "spacing * 1.5"
},
widgetVerticalSpacing: {
ref: "spacing"
},
dataFontSize: {
ref: "fontSize"
},
headerBackgroundColor: {
ref: "chromeBackgroundColor"
},
headerFontFamily: {
ref: "fontFamily"
},
headerFontSize: {
ref: "fontSize"
},
headerFontWeight: 500,
headerTextColor: {
ref: "textColor"
},
headerHeight: {
calc: "max(iconSize, headerFontSize) + spacing * 4 * headerVerticalPaddingScale"
},
headerVerticalPaddingScale: 1,
menuBorder: {
color: foregroundMix(0.2)
},
menuBackgroundColor: foregroundBackgroundMix(0.03),
menuTextColor: foregroundBackgroundMix(0.95),
menuShadow: {
ref: "popupShadow"
},
menuSeparatorColor: {
ref: "borderColor"
}
};
var paramTypes = [
"colorScheme",
"color",
"length",
"scale",
"borderStyle",
"border",
"shadow",
"image",
"fontFamily",
"fontWeight",
"duration"
];
var getParamType = memoize((param) => {
param = param.toLowerCase();
return paramTypes.find((type) => param.endsWith(type.toLowerCase())) ?? "length";
});
var TabGuardClassNames = {
TAB_GUARD: "ag-tab-guard",
TAB_GUARD_TOP: "ag-tab-guard-top",
TAB_GUARD_BOTTOM: "ag-tab-guard-bottom"
};
var RESIZE_CONTAINER_STYLE = "ag-resizer-wrapper";
var makeDiv = (dataRefPrefix, classSuffix) => ({
tag: "div",
ref: `${dataRefPrefix}Resizer`,
cls: `ag-resizer ag-resizer-${classSuffix}`
});
var RESIZE_TEMPLATE = {
tag: "div",
cls: RESIZE_CONTAINER_STYLE,
children: [
makeDiv("eTopLeft", "topLeft"),
makeDiv("eTop", "top"),
makeDiv("eTopRight", "topRight"),
makeDiv("eRight", "right"),
makeDiv("eBottomRight", "bottomRight"),
makeDiv("eBottom", "bottom"),
makeDiv("eBottomLeft", "bottomLeft"),
makeDiv("eLeft", "left")
]
};
function _toString(toEscape) {
return toEscape?.toString().toString() ?? null;
}
var DATE_TIME_SEPARATOR = "T";
var DATE_TIME_SEPARATOR_REGEXP = new RegExp(`[${DATE_TIME_SEPARATOR} ]`);
var DATE_TIME_REGEXP = new RegExp(`^\\d{4}-\\d{2}-\\d{2}(${DATE_TIME_SEPARATOR}\\d{2}:\\d{2}:\\d{2}\\D?)?`);
// packages/ag-grid-react/src/reactUi/agGridReactUi.tsx
var import_react26 = __toESM(require("react"));
var import_ag_grid_community21 = require("ag-grid-community");
// packages/ag-grid-react/src/reactUi/cellRenderer/groupCellRenderer.tsx
var import_react3 = __toESM(require("react"));
// packages/ag-grid-react/src/reactUi/beansContext.tsx
var import_react = __toESM(require("react"));
var BeansContext = import_react.default.createContext({});
var RenderModeContext = import_react.default.createContext("default");
// packages/ag-grid-react/src/reactUi/jsComp.tsx
var showJsComp = (compDetails, context, eParent, ref) => {
const doNothing = !compDetails || compDetails.componentFromFramework || context.isDestroyed();
if (doNothing) {
return;
}
const promise = compDetails.newAgStackInstance();
let comp;
let compGui;
let destroyed = false;
promise.then((c) => {
if (destroyed) {
context.destroyBean(c);
return;
}
comp = c;
compGui = comp.getGui?.();
if (compGui) {
eParent.appendChild(compGui);
}
setRef(ref, comp);
});
return () => {
destroyed = true;
if (!comp) {
return;
}
compGui?.remove();
context.destroyBean(comp);
if (ref) {
setRef(ref, void 0);
}
};
};
var setRef = (ref, value) => {
if (!ref) {
return;
}
if (ref instanceof Function) {
const refCallback = ref;
refCallback(value);
} else {
const refObj = ref;
refObj.current = value;
}
};
// packages/ag-grid-react/src/reactUi/utils.tsx
var import_react2 = __toESM(require("react"));
var import_react_dom = __toESM(require("react-dom"));
var classesList = (...list) => {
const filtered = list.filter((s) => s != null && s !== "");
return filtered.join(" ");
};
var CssClasses = class _CssClasses {
constructor(...initialClasses) {
this.classesMap = {};
for (const className of initialClasses) {
this.classesMap[className] = true;
}
}
setClass(className, on) {
const nothingHasChanged = !!this.classesMap[className] == on;
if (nothingHasChanged) {
return this;
}
const res = new _CssClasses();
res.classesMap = { ...this.classesMap };
res.classesMap[className] = on;
return res;
}
toString() {
const res = Object.keys(this.classesMap).filter((key) => this.classesMap[key]).join(" ");
return res;
}
};
var isComponentStateless = (Component2) => {
const hasSymbol = () => typeof Symbol === "function" && Symbol.for;
const getMemoType = () => hasSymbol() ? /* @__PURE__ */ Symbol.for("react.memo") : 60115;
return typeof Component2 === "function" && !(Component2.prototype && Component2.prototype.isReactComponent) || typeof Component2 === "object" && Component2.$$typeof === getMemoType();
};
var reactVersion = import_react2.default.version?.split(".")[0];
var isReactVersion17Minus = reactVersion === "16" || reactVersion === "17";
function isReact19() {
return reactVersion === "19";
}
var disableFlushSync = false;
function runWithoutFlushSync(func) {
if (!disableFlushSync) {
setTimeout(() => disableFlushSync = false, 0);
}
disableFlushSync = true;
return func();
}
var agFlushSync = (useFlushSync, fn) => {
if (!isReactVersion17Minus && useFlushSync && !disableFlushSync) {
import_react_dom.default.flushSync(fn);
} else {
fn();
}
};
var agStartTransition = (fn) => {
if (!isReactVersion17Minus) {
import_react2.default.startTransition(fn);
} else {
fn();
}
};
function agUseSyncExternalStore(subscribe, getSnapshot, defaultSnapshot) {
if (import_react2.default.useSyncExternalStore) {
return import_react2.default.useSyncExternalStore(subscribe, getSnapshot);
} else {
return defaultSnapshot;
}
}
function getNextValueIfDifferent(prev, next, maintainOrder) {
if (next == null || prev == null) {
return next;
}
if (prev === next || next.length === 0 && prev.length === 0) {
return prev;
}
if (maintainOrder || prev.length === 0 && next.length > 0 || prev.length > 0 && next.length === 0) {
return next;
}
const oldValues = [];
const newValues = [];
const prevMap = /* @__PURE__ */ new Map();
const nextMap = /* @__PURE__ */ new Map();
for (let i = 0; i < next.length; i++) {
const c = next[i];
nextMap.set(c.instanceId, c);
}
for (let i = 0; i < prev.length; i++) {
const c = prev[i];
prevMap.set(c.instanceId, c);
if (nextMap.has(c.instanceId)) {
oldValues.push(c);
}
}
for (let i = 0; i < next.length; i++) {
const c = next[i];
const instanceId = c.instanceId;
if (!prevMap.has(instanceId)) {
newValues.push(c);
}
}
if (oldValues.length === prev.length && newValues.length === 0) {
return prev;
}
if (oldValues.length === 0 && newValues.length === next.length) {
return next;
}
if (oldValues.length === 0) {
return newValues;
}
if (newValues.length === 0) {
return oldValues;
}
return [...oldValues, ...newValues];
}
// packages/ag-grid-react/src/reactUi/cellRenderer/groupCellRenderer.tsx
var GroupCellRenderer = (0, import_react3.forwardRef)((props, ref) => {
const { registry, context } = (0, import_react3.useContext)(BeansContext);
const eGui = (0, import_react3.useRef)(null);
const eValueRef = (0, import_react3.useRef)(null);
const eCheckboxRef = (0, import_react3.useRef)(null);
const eExpandedRef = (0, import_react3.useRef)(null);
const eContractedRef = (0, import_react3.useRef)(null);
const ctrlRef = (0, import_react3.useRef)();
const [innerCompDetails, setInnerCompDetails] = (0, import_react3.useState)();
const [childCount, setChildCount] = (0, import_react3.useState)();
const [value, setValue] = (0, import_react3.useState)();
const [cssClasses, setCssClasses] = (0, import_react3.useState)(() => new CssClasses());
const [expandedCssClasses, setExpandedCssClasses] = (0, import_react3.useState)(() => new CssClasses("ag-hidden"));
const [expandedAriaHidden, setExpandedAriaHidden] = (0, import_react3.useState)(true);
const [contractedCssClasses, setContractedCssClasses] = (0, import_react3.useState)(() => new CssClasses("ag-hidden"));
const [contractedAriaHidden, setContractedAriaHidden] = (0, import_react3.useState)(true);
const [checkboxCssClasses, setCheckboxCssClasses] = (0, import_react3.useState)(() => new CssClasses("ag-invisible"));
const [checkboxAriaHidden, setCheckboxAriaHidden] = (0, import_react3.useState)(true);
(0, import_react3.useImperativeHandle)(ref, () => {
return {
// force new instance when grid tries to refresh
refresh() {
return false;
}
};
});
(0, import_react3.useLayoutEffect)(() => {
return showJsComp(innerCompDetails, context, eValueRef.current);
}, [innerCompDetails]);
const setRef2 = (0, import_react3.useCallback)((eRef) => {
eGui.current = eRef;
if (!eRef || context.isDestroyed()) {
ctrlRef.current = context.destroyBean(ctrlRef.current);
return;
}
const compProxy = {
setInnerRenderer: (details, valueToDisplay) => {
setInnerCompDetails(details);
setValue(valueToDisplay);
},
setChildCount: (count) => setChildCount(count),
toggleCss: (name, on) => setCssClasses((prev) => prev.setClass(name, on)),
setContractedDisplayed: (displayed) => {
setContractedCssClasses((prev) => prev.setClass("ag-hidden", !displayed));
setContractedAriaHidden(!displayed);
},
setExpandedDisplayed: (displayed) => {
setExpandedCssClasses((prev) => prev.setClass("ag-hidden", !displayed));
setExpandedAriaHidden(!displayed);
},
setCheckboxVisible: (visible) => {
setCheckboxCssClasses((prev) => prev.setClass("ag-invisible", !visible));
setCheckboxAriaHidden(!visible);
},
setCheckboxSpacing: (add) => setCheckboxCssClasses((prev) => prev.setClass("ag-group-checkbox-spacing", add))
};
const groupCellRendererCtrl = registry.createDynamicBean("groupCellRendererCtrl", true);
if (groupCellRendererCtrl) {
ctrlRef.current = context.createBean(groupCellRendererCtrl);
ctrlRef.current.init(
compProxy,
eRef,
eCheckboxRef.current,
eExpandedRef.current,
eContractedRef.current,
GroupCellRenderer,
props
);
}
}, []);
const className = (0, import_react3.useMemo)(() => `ag-cell-wrapper ${cssClasses.toString()}`, [cssClasses]);
const expandedClassName = (0, import_react3.useMemo)(() => `ag-group-expanded ${expandedCssClasses.toString()}`, [expandedCssClasses]);
const contractedClassName = (0, import_react3.useMemo)(
() => `ag-group-contracted ${contractedCssClasses.toString()}`,
[contractedCssClasses]
);
const checkboxClassName = (0, import_react3.useMemo)(() => `ag-group-checkbox ${checkboxCssClasses.toString()}`, [checkboxCssClasses]);
const useFwRenderer = innerCompDetails?.componentFromFramework;
const FwRenderer = useFwRenderer ? innerCompDetails.componentClass : void 0;
const useValue = innerCompDetails == null && value != null;
const escapedValue = _toString(value);
return /* @__PURE__ */ import_react3.default.createElement(
"span",
{
className,
ref: setRef2,
...!props.colDef ? { role: ctrlRef.current?.getCellAriaRole() } : {}
},
/* @__PURE__ */ import_react3.default.createElement("span", { className: expandedClassName, ref: eExpandedRef, "aria-hidden": expandedAriaHidden }),
/* @__PURE__ */ import_react3.default.createElement("span", { className: contractedClassName, ref: eContractedRef, "aria-hidden": contractedAriaHidden }),
/* @__PURE__ */ import_react3.default.createElement("span", { className: checkboxClassName, ref: eCheckboxRef, "aria-hidden": checkboxAriaHidden }),
/* @__PURE__ */ import_react3.default.createElement("span", { className: "ag-group-value", ref: eValueRef }, useValue ? escapedValue : useFwRenderer ? /* @__PURE__ */ import_react3.default.createElement(FwRenderer, { ...innerCompDetails.params }) : null),
/* @__PURE__ */ import_react3.default.createElement("span", { className: "ag-group-child-count" }, childCount)
);
});
var groupCellRenderer_default = GroupCellRenderer;
// packages/ag-grid-react/src/shared/customComp/customComponentWrapper.ts
var import_ag_grid_community2 = require("ag-grid-community");
// packages/ag-grid-react/src/reactUi/customComp/customWrapperComp.tsx
var import_react5 = __toESM(require("react"));
// packages/ag-grid-react/src/shared/customComp/customContext.ts
var import_react4 = require("react");
var CustomContext = (0, import_react4.createContext)({
setMethods: () => {
}
});
// packages/ag-grid-react/src/reactUi/customComp/customWrapperComp.tsx
var CustomWrapperComp = (params) => {
const { initialProps, addUpdateCallback, CustomComponentClass, setMethods } = params;
const [{ key, ...props }, setProps] = (0, import_react5.useState)(initialProps);
(0, import_react5.useEffect)(() => {
addUpdateCallback((newProps) => setProps(newProps));
}, []);
return /* @__PURE__ */ import_react5.default.createElement(CustomContext.Provider, { value: { setMethods } }, /* @__PURE__ */ import_react5.default.createElement(CustomComponentClass, { key, ...props }));
};
var customWrapperComp_default = (0, import_react5.memo)(CustomWrapperComp);
// packages/ag-grid-react/src/shared/reactComponent.ts
var import_react6 = require("react");
var import_react_dom2 = require("react-dom");
var import_ag_grid_community = require("ag-grid-community");
// packages/ag-grid-react/src/shared/keyGenerator.ts
var counter = 0;
function generateNewKey() {
return `agPortalKey_${++counter}`;
}
// packages/ag-grid-react/src/shared/reactComponent.ts
var ReactComponent = class {
constructor(reactComponent, portalManager, componentType, suppressFallbackMethods) {
this.portal = null;
this.oldPortal = null;
this.reactComponent = reactComponent;
this.portalManager = portalManager;
this.componentType = componentType;
this.suppressFallbackMethods = !!suppressFallbackMethods;
this.statelessComponent = this.isStateless(this.reactComponent);
this.key = generateNewKey();
this.portalKey = generateNewKey();
this.instanceCreated = this.isStatelessComponent() ? import_ag_grid_community.AgPromise.resolve(false) : new import_ag_grid_community.AgPromise((resolve) => {
this.resolveInstanceCreated = resolve;
});
}
getGui() {
return this.eParentElement;
}
/** `getGui()` returns the parent element. This returns the actual root element. */
getRootElement() {
const firstChild = this.eParentElement.firstChild;
return firstChild;
}
destroy() {
if (this.componentInstance && typeof this.componentInstance.destroy == "function") {
this.componentInstance.destroy();
}
const portal = this.portal;
if (portal) {
this.portalManager.destroyPortal(portal);
}
}
createParentElement(params) {
const componentWrappingElement = this.portalManager.getComponentWrappingElement();
const eParentElement = document.createElement(componentWrappingElement || "div");
eParentElement.classList.add("ag-react-container");
params.reactContainer = eParentElement;
return eParentElement;
}
statelessComponentRendered() {
return this.eParentElement.childElementCount > 0 || this.eParentElement.childNodes.length > 0;
}
getFrameworkComponentInstance() {
return this.componentInstance;
}
isStatelessComponent() {
return this.statelessComponent;
}
getReactComponentName() {
return this.reactComponent.name;
}
getMemoType() {
return this.hasSymbol() ? /* @__PURE__ */ Symbol.for("react.memo") : 60115;
}
hasSymbol() {
return typeof Symbol === "function" && Symbol.for;
}
isStateless(Component2) {
return typeof Component2 === "function" && !(Component2.prototype && Component2.prototype.isReactComponent) || typeof Component2 === "object" && Component2.$$typeof === this.getMemoType();
}
hasMethod(name) {
const frameworkComponentInstance = this.getFrameworkComponentInstance();
return !!frameworkComponentInstance && frameworkComponentInstance[name] != null || this.fallbackMethodAvailable(name);
}
callMethod(name, args) {
const frameworkComponentInstance = this.getFrameworkComponentInstance();
if (this.isStatelessComponent()) {
return this.fallbackMethod(name, !!args && args[0] ? args[0] : {});
} else if (!frameworkComponentInstance) {
setTimeout(() => this.callMethod(name, args));
return;
}
const method = frameworkComponentInstance[name];
if (method) {
return method.apply(frameworkComponentInstance, args);
}
if (this.fallbackMethodAvailable(name)) {
return this.fallbackMethod(name, !!args && args[0] ? args[0] : {});
}
}
addMethod(name, callback) {
this[name] = callback;
}
init(params) {
this.eParentElement = this.createParentElement(params);
this.createOrUpdatePortal(params);
return new import_ag_grid_community.AgPromise((resolve) => this.createReactComponent(resolve));
}
createOrUpdatePortal(params) {
if (!this.isStatelessComponent()) {
this.ref = (element) => {
this.componentInstance = element;
this.resolveInstanceCreated?.(true);
this.resolveInstanceCreated = void 0;
};
params.ref = this.ref;
}
this.reactElement = this.createElement(this.reactComponent, { ...params, key: this.key });
this.portal = (0, import_react_dom2.createPortal)(
this.reactElement,
this.eParentElement,
this.portalKey
// fixed deltaRowModeRefreshCompRenderer
);
}
createElement(reactComponent, props) {
return (0, import_react6.createElement)(reactComponent, props);
}
createReactComponent(resolve) {
this.portalManager.mountReactPortal(this.portal, this, resolve);
}
rendered() {
return this.isStatelessComponent() && this.statelessComponentRendered() || !!(!this.isStatelessComponent() && this.getFrameworkComponentInstance());
}
/*
* fallback methods - these will be invoked if a corresponding instance method is not present
* for example if refresh is called and is not available on the component instance, then refreshComponent on this
* class will be invoked instead
*
* Currently only refresh is supported
*/
refreshComponent(args) {
this.oldPortal = this.portal;
this.createOrUpdatePortal(args);
this.portalManager.updateReactPortal(this.oldPortal, this.portal);
}
fallbackMethod(name, params) {
const method = this[`${name}Component`];
if (!this.suppressFallbackMethods && !!method) {
return method.bind(this)(params);
}
}
fallbackMethodAvailable(name) {
if (this.suppressFallbackMethods) {
return false;
}
const method = this[`${name}Component`];
return !!method;
}
};
// packages/ag-grid-react/src/shared/customComp/customComponentWrapper.ts
function addOptionalMethods(optionalMethodNames, providedMethods, component) {
for (const methodName of optionalMethodNames) {
const providedMethod = providedMethods[methodName];
if (providedMethod) {
component[methodName] = providedMethod;
}
}
}
var CustomComponentWrapper = class extends ReactComponent {
constructor() {
super(...arguments);
this.awaitUpdateCallback = new import_ag_grid_community2.AgPromise((resolve) => {
this.resolveUpdateCallback = resolve;
});
this.wrapperComponent = customWrapperComp_default;
}
init(params) {
this.sourceParams = params;
return super.init(this.getProps());
}
addMethod() {
}
getInstance() {
return this.instanceCreated.then(() => this.componentInstance);
}
getFrameworkComponentInstance() {
return this;
}
createElement(reactComponent, props) {
return super.createElement(this.wrapperComponent, {
initialProps: props,
CustomComponentClass: reactComponent,
setMethods: (methods) => this.setMethods(methods),
addUpdateCallback: (callback) => {
this.updateCallback = () => {
callback(this.getProps());
return new import_ag_grid_community2.AgPromise((resolve) => {
setTimeout(() => {
resolve();
});
});
};
this.resolveUpdateCallback();
}
});
}
setMethods(methods) {
this.providedMethods = methods;
addOptionalMethods(this.getOptionalMethods(), this.providedMethods, this);
}
getOptionalMethods() {
return [];
}
getProps() {
return {
...this.sourceParams,
key: this.key,
ref: this.ref
};
}
refreshProps() {
if (this.updateCallback) {
return this.updateCallback();
}
return new import_ag_grid_community2.AgPromise(
(resolve) => this.awaitUpdateCallback.then(() => {
this.updateCallback().then(() => resolve());
})
);
}
};
// packages/ag-grid-react/src/shared/customComp/cellRendererComponentWrapper.ts
var CellRendererComponentWrapper = class extends CustomComponentWrapper {
refresh(params) {
this.sourceParams = params;
this.refreshProps();
return true;
}
};
// packages/ag-grid-react/src/shared/customComp/customOverlayComponentWrapper.ts
var CustomOverlayComponentWrapper = class extends CustomComponentWrapper {
refresh(params) {
this.sourceParams = params;
this.refreshProps();
}
};
// packages/ag-grid-react/src/shared/customComp/dateComponentWrapper.ts
var DateComponentWrapper = class extends CustomComponentWrapper {
constructor() {
super(...arguments);
this.date = null;
this.onDateChange = (date) => this.updateDate(date);
}
getDate() {
return this.date;
}
setDate(date) {
this.date = date;
this.refreshProps();
}
refresh(params) {
this.sourceParams = params;
this.refreshProps();
}
getOptionalMethods() {
return ["afterGuiAttached", "setInputPlaceholder", "setInputAriaLabel", "setDisabled"];
}
updateDate(date) {
this.setDate(date);
this.sourceParams.onDateChanged();
}
getProps() {
const props = super.getProps();
props.date = this.date;
props.onDateChange = this.onDateChange;
delete props.onDateChanged;
return props;
}
};
// packages/ag-grid-react/src/shared/customComp/dragAndDropImageComponentWrapper.ts
var DragAndDropImageComponentWrapper = class extends CustomComponentWrapper {
constructor() {
super(...arguments);
this.label = "";
this.icon = null;
this.shake = false;
}
setIcon(iconName, shake) {
this.icon = iconName;
this.shake = shake;
this.refreshProps();
}
setLabel(label) {
this.label = label;
this.refreshProps();
}
getProps() {
const props = super.getProps();
const { label, icon, shake } = this;
props.label = label;
props.icon = icon;
props.shake = shake;
return props;
}
};
// packages/ag-grid-react/src/shared/customComp/filterComponentWrapper.ts
var import_ag_grid_community3 = require("ag-grid-community");
var FilterComponentWrapper = class extends CustomComponentWrapper {
constructor() {
super(...arguments);
this.model = null;
this.onModelChange = (model) => this.updateModel(model);
this.onUiChange = () => this.sourceParams.filterModifiedCallback();
this.expectingNewMethods = true;
this.hasBeenActive = false;
this.awaitSetMethodsCallback = new import_ag_grid_community3.AgPromise((resolve) => {
this.resolveSetMethodsCallback = resolve;
});
}
isFilterActive() {
return this.model != null;
}
doesFilterPass(params) {
return this.providedMethods.doesFilterPass(params);
}
getModel() {
return this.model;
}
setModel(model) {
this.expectingNewMethods = true;
this.model = model;
this.hasBeenActive || (this.hasBeenActive = this.isFilterActive());
return this.refreshProps();
}
refresh(newParams) {
this.sourceParams = newParams;
this.refreshProps();
return true;
}
afterGuiAttached(params) {
const providedMethods = this.providedMethods;
if (!providedMethods) {
this.awaitSetMethodsCallback.then(() => this.providedMethods?.afterGuiAttached?.(params));
} else {
providedMethods.afterGuiAttached?.(params);
}
}
getOptionalMethods() {
return ["afterGuiDetached", "onNewRowsLoaded", "getModelAsString", "onAnyFilterChanged"];
}
setMethods(methods) {
if (this.expectingNewMethods === false && this.hasBeenActive && this.providedMethods?.doesFilterPass !== methods?.doesFilterPass) {
setTimeout(() => {
this.sourceParams.filterChangedCallback();
});
}
this.expectingNewMethods = false;
super.setMethods(methods);
this.resolveSetMethodsCallback();
this.resolveFilterPassCallback?.();
this.resolveFilterPassCallback = void 0;
}
updateModel(model) {
this.resolveFilterPassCallback?.();
const awaitFilterPassCallback = new import_ag_grid_community3.AgPromise((resolve) => {
this.resolveFilterPassCallback = resolve;
});
this.setModel(model).then(() => {
awaitFilterPassCallback.then(() => {
this.sourceParams.filterChangedCallback();
});
});
}
getProps() {
const props = super.getProps();
props.model = this.model;
props.onModelChange = this.onModelChange;
props.onUiChange = this.onUiChange;
delete props.filterChangedCallback;
return props;
}
};
// packages/ag-grid-react/src/shared/customComp/filterDisplayComponentWrapper.ts
var import_ag_grid_community4 = require("ag-grid-community");
var FilterDisplayComponentWrapper = class extends CustomComponentWrapper {
constructor() {
super(...arguments);
this.awaitSetMethodsCallback = new import_ag_grid_community4.AgPromise((resolve) => {
this.resolveSetMethodsCallback = resolve;
});
}
refresh(newParams) {
this.sourceParams = newParams;
this.refreshProps();
return true;
}
afterGuiAttached(params) {
const providedMethods = this.providedMethods;
if (!providedMethods) {
this.awaitSetMethodsCallback.then(() => this.providedMethods?.afterGuiAttached?.(params));
} else {
provided