UNPKG

devextreme

Version:

HTML5 JavaScript Component Suite for Responsive Web Development

131 lines (130 loc) 4.97 kB
/** * DevExtreme (esm/__internal/core/r1/runtime/inferno/base_component.js) * Version: 25.1.3 * Build date: Wed Jun 25 2025 * * Copyright (c) 2012 - 2025 Developer Express Inc. ALL RIGHTS RESERVED * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/ */ import { Component, findDOMFromVNode } from "inferno"; import { InfernoEffectHost } from "./effect_host"; const areObjectsEqual = (firstObject, secondObject) => { const bothAreObjects = firstObject instanceof Object && secondObject instanceof Object; if (!bothAreObjects) { return firstObject === secondObject } const firstObjectKeys = Object.keys(firstObject); const secondObjectKeys = Object.keys(secondObject); if (firstObjectKeys.length !== secondObjectKeys.length) { return false } const hasDifferentElement = firstObjectKeys.some((key => firstObject[key] !== secondObject[key])); return !hasDifferentElement }; export class BaseInfernoComponent extends Component { constructor() { super(...arguments); this._pendingContext = this.context } componentWillReceiveProps(_, context) { this._pendingContext = context ?? {} } shouldComponentUpdate(nextProps, nextState) { return !areObjectsEqual(this.props, nextProps) || !areObjectsEqual(this.state, nextState) || !areObjectsEqual(this.context, this._pendingContext) } } export class InfernoComponent extends BaseInfernoComponent { constructor() { super(...arguments); this._effects = [] } createEffects() { return [] } updateEffects() {} componentWillMount() { InfernoEffectHost.lock() } componentWillUpdate(_nextProps, _nextState, _context) { InfernoEffectHost.lock() } componentDidMount() { InfernoEffectHost.callbacks.push((() => { this._effects = this.createEffects() })); InfernoEffectHost.callEffects() } componentDidUpdate() { InfernoEffectHost.callbacks.push((() => this.updateEffects())); InfernoEffectHost.callEffects() } destroyEffects() { this._effects.forEach((e => e.dispose())) } componentWillUnmount() { this.destroyEffects() } } export class InfernoWrapperComponent extends InfernoComponent { constructor() { super(...arguments); this.vDomElement = null } vDomUpdateClasses() { var _el$className; const el = this.vDomElement; const currentClasses = null !== (_el$className = el.className) && void 0 !== _el$className && _el$className.length ? el.className.split(" ") : []; const addedClasses = currentClasses.filter((className => !el.dxClasses.previous.includes(className))); const removedClasses = el.dxClasses.previous.filter((className => !currentClasses.includes(className))); addedClasses.forEach((value => { const indexInRemoved = el.dxClasses.removed.indexOf(value); if (indexInRemoved > -1) { el.dxClasses.removed.splice(indexInRemoved, 1) } else if (!el.dxClasses.added.includes(value)) { el.dxClasses.added.push(value) } })); removedClasses.forEach((value => { const indexInAdded = el.dxClasses.added.indexOf(value); if (indexInAdded > -1) { el.dxClasses.added.splice(indexInAdded, 1) } else if (!el.dxClasses.removed.includes(value)) { el.dxClasses.removed.push(value) } })) } componentDidMount() { var _el$className2; const el = findDOMFromVNode(this.$LI, true); this.vDomElement = el; super.componentDidMount(); el.dxClasses = el.dxClasses || { removed: [], added: [], previous: [] }; el.dxClasses.previous = null !== el && void 0 !== el && null !== (_el$className2 = el.className) && void 0 !== _el$className2 && _el$className2.length ? el.className.split(" ") : [] } componentDidUpdate() { super.componentDidUpdate(); const el = this.vDomElement; if (null !== el) { var _el$className3; el.dxClasses.added.forEach((className => el.classList.add(className))); el.dxClasses.removed.forEach((className => el.classList.remove(className))); el.dxClasses.previous = null !== (_el$className3 = el.className) && void 0 !== _el$className3 && _el$className3.length ? el.className.split(" ") : [] } } shouldComponentUpdate(nextProps, nextState) { const shouldUpdate = super.shouldComponentUpdate(nextProps, nextState); if (shouldUpdate) { this.vDomUpdateClasses() } return shouldUpdate } }