devextreme-react 24.1.2-beta → 24.1.3

package/esm/core/template-manager.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 24.1.2-beta
- * Build date: Mon May 13 2024
+ * Version: 24.1.3
+ * Build date: Tue Jun 11 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -11,33 +11,6 @@
  * https://github.com/DevExpress/devextreme-react
  */
 
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
 import * as React from 'react';
 import * as events from 'devextreme/events';
 import { useState, useMemo, useCallback, useEffect, useRef, } from 'react';
@@ -47,7 +20,7 @@ import { DX_REMOVE_EVENT } from './component-base';
 import { getOption as getConfigOption } from './config';
 function normalizeProps(props) {
     if (getConfigOption('useLegacyTemplateEngine')) {
-        var model = props.data;
+        const model = props.data;
         if (model && Object.prototype.hasOwnProperty.call(model, 'key')) {
             model.dxkey = model.key;
         }
@@ -55,32 +28,30 @@ function normalizeProps(props) {
     }
     return props;
 }
-export var TemplateManager = function (_a) {
-    var init = _a.init;
-    var _b = __read(useState(new TemplateInstantiationModels()), 2), instantiationModels = _b[0], setInstantiationModels = _b[1];
-    var _c = __read(useState(), 2), updateContext = _c[0], setUpdateContext = _c[1];
-    var widgetId = useRef('');
-    var templateFactories = useRef({});
-    var subscribeOnRemoval = useCallback(function (container, onRemoved) {
+export const TemplateManager = ({ init }) => {
+    const [instantiationModels, setInstantiationModels] = useState(new TemplateInstantiationModels());
+    const [updateContext, setUpdateContext] = useState();
+    const widgetId = useRef('');
+    const templateFactories = useRef({});
+    const subscribeOnRemoval = useCallback((container, onRemoved) => {
         if (container.nodeType === Node.ELEMENT_NODE) {
             events.on(container, DX_REMOVE_EVENT, onRemoved);
         }
     }, []);
-    var unsubscribeOnRemoval = useCallback(function (container, onRemoved) {
+    const unsubscribeOnRemoval = useCallback((container, onRemoved) => {
         if (container.nodeType === Node.ELEMENT_NODE) {
             events.off(container, DX_REMOVE_EVENT, onRemoved);
         }
     }, []);
-    var unwrapElement = useCallback(function (element) { return (element.get ? element.get(0) : element); }, []);
-    var createMapKey = useCallback(function (key1, key2) { return ({ key1: key1, key2: key2 }); }, []);
-    var getRandomId = useCallback(function () { return "".concat(generateID()).concat(generateID()).concat(generateID()); }, []);
-    var getRenderFunc = useCallback(function (templateKey) { return function (_a) {
-        var data = _a.model, index = _a.index, container = _a.container, onRendered = _a.onRendered;
-        var containerElement = unwrapElement(container);
-        var key = createMapKey(data, containerElement);
-        var onRemoved = function () {
-            setInstantiationModels(function (currentInstantiationModels) {
-                var template = currentInstantiationModels.get(key);
+    const unwrapElement = useCallback((element) => (element.get ? element.get(0) : element), []);
+    const createMapKey = useCallback((key1, key2) => ({ key1, key2 }), []);
+    const getRandomId = useCallback(() => `${generateID()}${generateID()}${generateID()}`, []);
+    const getRenderFunc = useCallback((templateKey) => ({ model: data, index, container, onRendered, }) => {
+        const containerElement = unwrapElement(container);
+        const key = createMapKey(data, containerElement);
+        const onRemoved = () => {
+            setInstantiationModels((currentInstantiationModels) => {
+                const template = currentInstantiationModels.get(key);
                 if (template) {
                     currentInstantiationModels.delete(key);
                     return currentInstantiationModels.shallowCopy();
@@ -88,49 +59,48 @@ export var TemplateManager = function (_a) {
                 return currentInstantiationModels;
             });
         };
-        var hostWidgetId = widgetId.current;
-        setInstantiationModels(function (currentInstantiationModels) {
+        const hostWidgetId = widgetId.current;
+        setInstantiationModels((currentInstantiationModels) => {
             currentInstantiationModels.set(key, {
-                templateKey: templateKey,
-                index: index,
+                templateKey,
+                index,
                 componentKey: getRandomId(),
-                onRendered: function () {
+                onRendered: () => {
                     unsubscribeOnRemoval(containerElement, onRemoved);
                     if (hostWidgetId === widgetId.current) {
-                        onRendered === null || onRendered === void 0 ? void 0 : onRendered();
+                        onRendered?.();
                     }
                 },
-                onRemoved: onRemoved,
+                onRemoved,
             });
             return currentInstantiationModels.shallowCopy();
         });
         return containerElement;
-    }; }, [unsubscribeOnRemoval, createMapKey]);
-    useMemo(function () {
+    }, [unsubscribeOnRemoval, createMapKey]);
+    useMemo(() => {
         function getTemplateFunction(template) {
             switch (template.type) {
-                case 'children': return function () { return template.content; };
-                case 'render': return function (props) {
+                case 'children': return () => template.content;
+                case 'render': return (props) => {
                     normalizeProps(props);
                     return template.content(props.data, props.index);
                 };
-                case 'component': return function (props) {
+                case 'component': return (props) => {
                     props = normalizeProps(props);
                     return React.createElement.bind(null, template.content)(props);
                 };
-                default: return function () { return React.createElement(React.Fragment); };
+                default: return () => React.createElement(React.Fragment);
             }
         }
         function createDXTemplates(templateOptions) {
-            var factories = Object.entries(templateOptions)
-                .reduce(function (res, _a) {
-                var _b;
-                var _c = __read(_a, 2), key = _c[0], template = _c[1];
-                return (__assign(__assign({}, res), (_b = {}, _b[key] = getTemplateFunction(template), _b)));
-            }, {});
+            const factories = Object.entries(templateOptions)
+                .reduce((res, [key, template]) => ({
+                ...res,
+                [key]: getTemplateFunction(template),
+            }), {});
             templateFactories.current = factories;
-            var dxTemplates = Object.keys(factories)
-                .reduce(function (templates, templateKey) {
+            const dxTemplates = Object.keys(factories)
+                .reduce((templates, templateKey) => {
                 templates[templateKey] = { render: getRenderFunc(templateKey) };
                 return templates;
             }, {});
@@ -141,11 +111,11 @@ export var TemplateManager = function (_a) {
             setInstantiationModels(new TemplateInstantiationModels());
         }
         function updateTemplates(onUpdated) {
-            setUpdateContext({ onUpdated: onUpdated });
+            setUpdateContext({ onUpdated });
         }
-        init({ createDXTemplates: createDXTemplates, clearInstantiationModels: clearInstantiationModels, updateTemplates: updateTemplates });
+        init({ createDXTemplates, clearInstantiationModels, updateTemplates });
     }, [init, getRenderFunc]);
-    useEffect(function () {
+    useEffect(() => {
         if (updateContext) {
             updateContext.onUpdated();
         }
@@ -153,10 +123,9 @@ export var TemplateManager = function (_a) {
     if (instantiationModels.empty) {
         return null;
     }
-    return (React.createElement(React.Fragment, null, Array.from(instantiationModels).map(function (_a) {
-        var _b = __read(_a, 2), _c = _b[0], data = _c.key1, container = _c.key2, _d = _b[1], index = _d.index, templateKey = _d.templateKey, componentKey = _d.componentKey, onRendered = _d.onRendered, onRemoved = _d.onRemoved;
+    return (React.createElement(React.Fragment, null, Array.from(instantiationModels).map(([{ key1: data, key2: container }, { index, templateKey, componentKey, onRendered, onRemoved, }]) => {
         subscribeOnRemoval(container, onRemoved);
-        var factory = templateFactories.current[templateKey];
+        const factory = templateFactories.current[templateKey];
         if (factory) {
             return React.createElement(TemplateWrapper, { key: componentKey, templateFactory: factory, data: data, index: index, container: container, onRemoved: onRemoved, onRendered: onRendered });
         }

package/esm/core/template-wrapper.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 24.1.2-beta
- * Build date: Mon May 13 2024
+ * Version: 24.1.3
+ * Build date: Tue Jun 11 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -11,52 +11,35 @@
  * https://github.com/DevExpress/devextreme-react
  */
 
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
-        }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
-};
 import * as React from 'react';
 import * as events from 'devextreme/events';
 import { useCallback, useLayoutEffect, useEffect, useState, useRef, useMemo, memo, } from 'react';
 import { createPortal } from 'react-dom';
 import { DX_REMOVE_EVENT } from './component-base';
 import { RemovalLockerContext } from './helpers';
-var createHiddenNode = function (containerNodeName, ref, defaultElement) {
-    var style = { display: 'none' };
+const createHiddenNode = (containerNodeName, ref, defaultElement) => {
+    const style = { display: 'none' };
     switch (containerNodeName) {
         case 'TABLE':
             return React.createElement("tbody", { style: style, ref: ref });
         case 'TBODY':
             return React.createElement("tr", { style: style, ref: ref });
         default:
-            return React.createElement(defaultElement, { style: style, ref: ref });
+            return React.createElement(defaultElement, { style, ref });
     }
 };
-var TemplateWrapperComponent = function (_a) {
-    var templateFactory = _a.templateFactory, data = _a.data, index = _a.index, container = _a.container, onRemoved = _a.onRemoved, onRendered = _a.onRendered;
-    var _b = __read(useState(false), 2), removalListenerRequired = _b[0], setRemovalListenerRequired = _b[1];
-    var isRemovalLocked = useRef(false);
-    var removalLocker = useMemo(function () { return ({
-        lock: function () { isRemovalLocked.current = true; },
-        unlock: function () { isRemovalLocked.current = false; },
-    }); }, []);
-    var element = useRef();
-    var hiddenNodeElement = useRef();
-    var removalListenerElement = useRef();
-    var onTemplateRemoved = useCallback(function (_, args) {
-        if ((args === null || args === void 0 ? void 0 : args.isUnmounting) || isRemovalLocked.current) {
+const TemplateWrapperComponent = ({ templateFactory, data, index, container, onRemoved, onRendered, }) => {
+    const [removalListenerRequired, setRemovalListenerRequired] = useState(false);
+    const isRemovalLocked = useRef(false);
+    const removalLocker = useMemo(() => ({
+        lock() { isRemovalLocked.current = true; },
+        unlock() { isRemovalLocked.current = false; },
+    }), []);
+    const element = useRef();
+    const hiddenNodeElement = useRef();
+    const removalListenerElement = useRef();
+    const onTemplateRemoved = useCallback((_, args) => {
+        if (args?.isUnmounting || isRemovalLocked.current) {
             return;
         }
         if (element.current) {
@@ -67,8 +50,8 @@ var TemplateWrapperComponent = function (_a) {
         }
         onRemoved();
     }, [onRemoved]);
-    useLayoutEffect(function () {
-        var el = element.current;
+    useLayoutEffect(() => {
+        const el = element.current;
         if (el && el.nodeType === Node.ELEMENT_NODE) {
             events.off(el, DX_REMOVE_EVENT, onTemplateRemoved);
             events.on(el, DX_REMOVE_EVENT, onTemplateRemoved);
@@ -80,7 +63,7 @@ var TemplateWrapperComponent = function (_a) {
             events.off(removalListenerElement.current, DX_REMOVE_EVENT, onTemplateRemoved);
             events.on(removalListenerElement.current, DX_REMOVE_EVENT, onTemplateRemoved);
         }
-        return function () {
+        return () => {
             if (element.current) {
                 container.appendChild(element.current);
             }
@@ -95,20 +78,20 @@ var TemplateWrapperComponent = function (_a) {
             }
         };
     }, [onTemplateRemoved, removalListenerRequired, container]);
-    useEffect(function () {
+    useEffect(() => {
         onRendered();
     }, [onRendered]);
-    var hiddenNode = createHiddenNode(container === null || container === void 0 ? void 0 : container.nodeName, function (node) {
+    const hiddenNode = createHiddenNode(container?.nodeName, (node) => {
         hiddenNodeElement.current = node;
-        element.current = node === null || node === void 0 ? void 0 : node.previousSibling;
+        element.current = node?.previousSibling;
     }, 'div');
-    var removalListener = removalListenerRequired
-        ? createHiddenNode(container === null || container === void 0 ? void 0 : container.nodeName, function (node) { removalListenerElement.current = node; }, 'span')
+    const removalListener = removalListenerRequired
+        ? createHiddenNode(container?.nodeName, (node) => { removalListenerElement.current = node; }, 'span')
         : undefined;
     return createPortal(React.createElement(React.Fragment, null,
         React.createElement(RemovalLockerContext.Provider, { value: removalLocker },
-            templateFactory({ data: data, index: index, onRendered: onRendered }),
+            templateFactory({ data, index, onRendered }),
             hiddenNode,
             removalListener)), container);
 };
-export var TemplateWrapper = memo(TemplateWrapperComponent);
+export const TemplateWrapper = memo(TemplateWrapperComponent);

package/esm/core/template.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 24.1.2-beta
- * Build date: Mon May 13 2024
+ * Version: 24.1.3
+ * Build date: Tue Jun 11 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -12,7 +12,7 @@
  */
 
 import { memo } from 'react';
-var Template = memo(function () { return null; });
+const Template = memo(() => null);
 function findProps(child) {
     if (child.type !== Template) {
         return undefined;

package/esm/core/types.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 24.1.2-beta
- * Build date: Mon May 13 2024
+ * Version: 24.1.3
+ * Build date: Tue Jun 11 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/widget-config.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 24.1.2-beta
- * Build date: Mon May 13 2024
+ * Version: 24.1.3
+ * Build date: Tue Jun 11 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -11,10 +11,10 @@
  * https://github.com/DevExpress/devextreme-react
  */
 
-var elementPropNames = ['style', 'id'];
-var classNamePropName = 'className';
-var refPropName = ['dropZone', 'dialogTrigger'];
-var internalProps = {
+const elementPropNames = ['style', 'id'];
+const classNamePropName = 'className';
+const refPropName = ['dropZone', 'dialogTrigger'];
+const internalProps = {
     WidgetClass: {},
     isPortalComponent: false,
     defaults: {},
@@ -23,10 +23,10 @@ var internalProps = {
     subscribableOptions: [],
     independentEvents: [],
     useRequestAnimationFrameFlag: false,
-    clearExtensions: function () { return undefined; },
-    renderChildren: function () { return undefined; },
-    beforeCreateWidget: function () { return undefined; },
-    afterCreateWidget: function () { return undefined; },
+    clearExtensions: () => undefined,
+    renderChildren: () => undefined,
+    beforeCreateWidget: () => undefined,
+    afterCreateWidget: () => undefined,
 };
 function isIgnoredProp(name) {
     return name === 'children'
@@ -35,9 +35,8 @@ function isIgnoredProp(name) {
         || Object.prototype.hasOwnProperty.call(internalProps, name);
 }
 function getRefElement(value) {
-    var _a, _b;
-    if (value === null || value === void 0 ? void 0 : value.current) {
-        if ((_b = (_a = value.current).instance) === null || _b === void 0 ? void 0 : _b.call(_a).element()) {
+    if (value?.current) {
+        if (value.current.instance?.().element()) {
             return value.current.instance().element();
         }
         return value.current;
@@ -46,17 +45,17 @@ function getRefElement(value) {
 }
 function separateProps(props, defaultsProps, templateProps) {
     templateProps = templateProps || [];
-    var defaults = {};
-    var options = {};
-    var templates = {};
-    var knownTemplates = {};
-    templateProps.forEach(function (value) {
+    const defaults = {};
+    const options = {};
+    const templates = {};
+    const knownTemplates = {};
+    templateProps.forEach((value) => {
         knownTemplates[value.component] = true;
         knownTemplates[value.render] = true;
     });
-    Object.keys(props).forEach(function (key) {
-        var defaultOptionName = defaultsProps ? defaultsProps[key] : null;
-        var value = props[key];
+    Object.keys(props).forEach((key) => {
+        const defaultOptionName = defaultsProps ? defaultsProps[key] : null;
+        const value = props[key];
         if (isIgnoredProp(key)) {
             return;
         }
@@ -74,7 +73,7 @@ function separateProps(props, defaultsProps, templateProps) {
         }
         options[key] = props[key];
     });
-    return { options: options, defaults: defaults, templates: templates };
+    return { options, defaults, templates };
 }
 function getClassName(props) {
     return props[classNamePropName];