igniteui-react-grids/esm5/lib/igr-grid-toolbar-title.js

Ignite UI React grid components.

import { __assign, __extends, __values } from "tslib";
import * as React from 'react';
import { IgrGridToolbarContent } from "./igr-grid-toolbar-content";
import { GridToolbarTitle } from "./GridToolbarTitle";
import { isValidProp } from "igniteui-react-core";
/**
 * Provides a way to template the title portion of the toolbar in the grid.
 * @igxModule IgxGridToolbarModule
 * @igxParent IgxGridToolbarComponent
 * @example
 * ```html
 * My custom title
 * ```
*/
var IgrGridToolbarTitle = /** @class */ /*@__PURE__*/ (function (_super) {
    __extends(IgrGridToolbarTitle, _super);
    function IgrGridToolbarTitle(props) {
        var _this = _super.call(this, props) || this;
        _this.portaledContentChildren = [];
        _this._getMainRef = _this._getMainRef.bind(_this);
        return _this;
    }
    IgrGridToolbarTitle.prototype.createImplementation = function () {
        var _a, _b;
        var impl = new GridToolbarTitle();
        var nat;
        if (typeof document !== 'undefined') {
            nat = document.createElement("igc-grid-toolbar-title");
        }
        else {
            nat = {
                style: {}
            };
        }
        if ((_a = this.props) === null || _a === void 0 ? void 0 : _a.className) {
            nat.className = this.props.className;
        }
        if ((_b = this.props) === null || _b === void 0 ? void 0 : _b.id) {
            nat.id = this.props.id;
        }
        impl.setNativeElement(nat);
        return impl;
    };
    Object.defineProperty(IgrGridToolbarTitle.prototype, "i", {
        /**
                                     * @hidden
                                     */
        get: function () {
            return this._implementation;
        },
        enumerable: false,
        configurable: true
    });
    IgrGridToolbarTitle.prototype.componentWillUnmount = function () {
        var e_1, _a;
        if (this.portaledContentChildren.length > 0) {
            try {
                for (var _b = __values(this.portaledContentChildren), _c = _b.next(); !_c.done; _c = _b.next()) {
                    var item = _c.value;
                    var nativeElem = item.ele;
                    if (item.ele.parentElement !== this.nativeElement) {
                        // put it back where it should be for react's portals to find.
                        this.nativeElement.appendChild(nativeElem);
                    }
                }
            }
            catch (e_1_1) {
                e_1 = { error: e_1_1 };
            }
            finally {
                try {
                    if (_c && !_c.done && (_a = _b.return))
                        _a.call(_b);
                }
                finally {
                    if (e_1)
                        throw e_1.error;
                }
            }
        }
    };
    IgrGridToolbarTitle.prototype.onImplementationCreated = function () {
        var _this = this;
        _super.prototype.onImplementationCreated.call(this);
        this._portalManager.getPortal(this._renderer.getWrapper(this._implementation.nativeElement), "ChildContent", function (p) {
            for (var i = 0; i < p.portalContainer.getChildCount(); i++) {
                _this.portaledContentChildren.push(p.portalContainer.getChildAt(i));
            }
        }, true);
    };
    IgrGridToolbarTitle.prototype.componentDidMount = function () {
        this.mounted = true;
        _super.prototype.componentDidMount.call(this);
    };
    IgrGridToolbarTitle.prototype.render = function () {
        var _this = this;
        var nativePropsName = Object.keys(this.props).filter(function (prop) { return !isValidProp(_this, prop) && prop !== "originalRef" && prop !== "className"; });
        var nativeProps = {};
        nativePropsName.forEach(function (propName) {
            nativeProps[propName] = _this.props[propName];
        });
        var propChildren = this.props.children;
        var children = [];
        React.Children.forEach(propChildren, function (ch) {
            children.push(React.cloneElement(ch));
        });
        this._portalManager.onRender(children);
        var style = {};
        style.display = 'contents';
        if (this.props.style) {
            style = this.props.style;
        }
        var div = React.createElement("div", __assign(__assign({}, nativeProps), { ref: this._getMainRef, style: style, children: children }));
        return div;
    };
    IgrGridToolbarTitle.prototype._getMainRef = function (ref) {
        this._elRef = ref;
    };
    Object.defineProperty(IgrGridToolbarTitle.prototype, "name", {
        get: function () {
            return this.i.a;
        },
        set: function (v) {
            this.i.a = v;
        },
        enumerable: false,
        configurable: true
    });
    IgrGridToolbarTitle.prototype.setNativeElement = function (element) {
        this.i.setNativeElement(element);
    };
    return IgrGridToolbarTitle;
}(IgrGridToolbarContent));
export { IgrGridToolbarTitle };