igniteui-webcomponents-layouts 1.4.2 → 3.2.2

package/esm2015/lib/igc-property-editor-panel-component.js

@@ -0,0 +1,446 @@
+import { fromSize, brushToString, stringToBrush, ensureBool, initializePropertiesFromCss, NamePatcher, toSpinal, getAllPropertyNames, fromSpinal } from "igniteui-webcomponents-core";
+import { FontInfo } from "igniteui-webcomponents-core";
+import { WebComponentRenderer, PortalManager } from "igniteui-webcomponents-core";
+import { CollectionAdapter } from "igniteui-webcomponents-core";
+import { NotifyCollectionChangedAction } from "igniteui-webcomponents-core";
+import { RegisterElementHelper } from "igniteui-webcomponents-core";
+import { PropertyEditorPanel } from "./PropertyEditorPanel";
+import { IgcHTMLElement } from "igniteui-webcomponents-core";
+import { IgcPropertyEditorPropertyDescriptionCollection } from './igc-property-editor-property-description-collection';
+import { PropertyEditorPropertyDescriptionCollection as PropertyEditorPropertyDescriptionCollection_internal } from './PropertyEditorPropertyDescriptionCollection';
+import { SyncableObservableCollection$1 } from "igniteui-webcomponents-core";
+import { PropertyEditorPropertyDescription } from './PropertyEditorPropertyDescription';
+import { IgcPropertyEditorPropertyDescriptionComponent } from './igc-property-editor-property-description-component';
+export let IgcPropertyEditorPanelComponent = /*@__PURE__*/ (() => {
+    class IgcPropertyEditorPanelComponent extends IgcHTMLElement {
+        constructor() {
+            super();
+            this._implementation = null;
+            this.contentProperties = [];
+            /**
+            * The properties actually present in the editor. Do not directly modify this array.
+            * This array's contents can be modified by using the properties property or providing child content.
+            */
+            this.actualProperties = [];
+            this._properties = null;
+            this._propertiesAdapter = null;
+            this._disconnected = false;
+            this._settingAttributes = false;
+            this._attached = false;
+            this._queuedSetAttributes = [];
+            this._updatingFromAttribute = false;
+            this._actualDataSource = null;
+            this.__p = null;
+            this._hasUserValues = new Set();
+            this._stylingContainer = null;
+            this._stylingParent = null;
+            this._inStyling = false;
+            if (this._styling) {
+                NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
+            }
+            this._implementation = this.createImplementation();
+            this._implementation.externalObject = this;
+            this._portalManager = new PortalManager("propertyEditorContent");
+            this._webComponentRenderer = new WebComponentRenderer(this, document, true, {}, this._portalManager);
+            this._webComponentWrapper = this._webComponentRenderer.createElement("div");
+            this._webComponentRenderer.updateRoot(this._webComponentWrapper);
+            this._webComponentWrapper.setStyleProperty("display", "block");
+            this._webComponentWrapper.setStyleProperty("width", "100%");
+            this._webComponentWrapper.setStyleProperty("height", "100%");
+            this._propertiesAdapter = new CollectionAdapter(this.contentProperties, this.i.properties, this.actualProperties, (c) => c.i, (i) => {
+                if (this._webComponentRenderer && this._webComponentRenderer.rootWrapper.getNativeElement().parentElement) {
+                    i._styling(this, this, this);
+                }
+            }, (i) => { });
+            this.i.provideContainer(this._webComponentRenderer);
+            this.i.notifySizeChanged();
+            let mut = new MutationObserver((list) => {
+                for (var mutation of list) {
+                    if (mutation.type == 'childList') {
+                        this.updateContentProperties();
+                    }
+                }
+            });
+            mut.observe(this, {
+                childList: true
+            });
+            this._webComponentRenderer.addSizeWatcher(() => {
+                this.i.notifySizeChanged();
+            });
+        }
+        set height(value) {
+            this._height = value;
+            this.style.height = value;
+            this.i.notifySizeChanged();
+        }
+        get height() {
+            return this._height;
+        }
+        set width(value) {
+            this._width = value;
+            this.style.width = value;
+            this.i.notifySizeChanged();
+        }
+        get width() {
+            return this._width;
+        }
+        /**
+         * A collection of manually added properties for the editor.
+        */
+        get properties() {
+            if (this._properties === null) {
+                let coll = new IgcPropertyEditorPropertyDescriptionCollection();
+                let inner = coll._innerColl;
+                inner.addListener((sender, e) => {
+                    switch (e.action) {
+                        case NotifyCollectionChangedAction.Add:
+                            this._propertiesAdapter.insertManualItem(e.newStartingIndex, e.newItems.item(0));
+                            break;
+                        case NotifyCollectionChangedAction.Remove:
+                            this._propertiesAdapter.removeManualItemAt(e.oldStartingIndex);
+                            break;
+                        case NotifyCollectionChangedAction.Replace:
+                            this._propertiesAdapter.removeManualItemAt(e.oldStartingIndex);
+                            this._propertiesAdapter.insertManualItem(e.newStartingIndex, e.newItems.item(0));
+                            break;
+                        case NotifyCollectionChangedAction.Reset:
+                            this._propertiesAdapter.clearManualItems();
+                            break;
+                    }
+                });
+                this._properties = coll;
+            }
+            return this._properties;
+        }
+        // supports angular themes or custom properties set in CSS
+        updateStyle() {
+            this._styling(this, this);
+        }
+        destroy() {
+            this._implementation.destroy();
+            this._webComponentRenderer.destroy();
+        }
+        updateContentProperties() {
+            this.contentProperties.length = 0;
+            for (var i = 0; i < this.children.length; i++) {
+                if (this.children[i] instanceof IgcPropertyEditorPropertyDescriptionComponent) {
+                    this.contentProperties.push(this.children[i]);
+                }
+            }
+            if (this._propertiesAdapter != null) {
+                this._propertiesAdapter.notifyContentChanged();
+            }
+        }
+        createImplementation() {
+            return new PropertyEditorPanel();
+        }
+        get i() {
+            return this._implementation;
+        }
+        disconnectedCallback() {
+            this._disconnected = true;
+        }
+        connectedCallback() {
+            if (this._disconnected) {
+                this._disconnected = false;
+                return;
+            }
+            this.classList.add("ig-property-editor-panel");
+            this.classList.add("igc-property-editor-panel");
+            var rootWrapper = this._webComponentRenderer.rootWrapper;
+            var rootElement = rootWrapper.getNativeElement();
+            this.appendChild(rootElement);
+            this._attached = true;
+            this.style.display = "block";
+            this.style.height = this._height;
+            this.style.width = this._width;
+            this._flushQueuedAttributes();
+            // supports themes or custom properties set in CSS
+            this._styling(this, this);
+            for (let i = 0; i < this.actualProperties.length; i++) {
+                let s = this.actualProperties[i];
+                s._styling(this, this, this);
+            }
+            this.updateContentProperties();
+            this.afterContentInit();
+        }
+        afterContentInit() {
+            this.i.notifySizeChanged();
+        }
+        _enqueueSetAttribute(attrName, attrValue) {
+            this._queuedSetAttributes.push({ attrName: attrName, attrValue: attrValue });
+        }
+        _flushQueuedAttributes() {
+            this._settingAttributes = true;
+            for (let i = 0; i < this._queuedSetAttributes.length; i++) {
+                this.setAttribute(this._queuedSetAttributes[i].attrName, this._queuedSetAttributes[i].attrValue);
+            }
+            this._settingAttributes = false;
+            this._queuedSetAttributes.length = 0;
+        }
+        _a(attrName, attrValue) {
+            if (this._updatingFromAttribute) {
+                return;
+            }
+            if (attrValue) {
+                attrValue = attrValue.toString();
+            }
+            this._settingAttributes = true;
+            attrName = toSpinal(attrName);
+            if (this._attached) {
+                this.setAttribute(attrName, attrValue);
+            }
+            else {
+                this._enqueueSetAttribute(attrName, attrValue);
+            }
+            this._settingAttributes = false;
+        }
+        static get observedAttributes() {
+            if (IgcPropertyEditorPanelComponent._observedAttributesIgcPropertyEditorPanelComponent == null) {
+                let names = getAllPropertyNames(IgcPropertyEditorPanelComponent);
+                for (let i = 0; i < names.length; i++) {
+                    names[i] = toSpinal(names[i]);
+                }
+                IgcPropertyEditorPanelComponent._observedAttributesIgcPropertyEditorPanelComponent = names;
+            }
+            return IgcPropertyEditorPanelComponent._observedAttributesIgcPropertyEditorPanelComponent;
+        }
+        attributeChangedCallback(name, oldValue, newValue) {
+            if (this._settingAttributes) {
+                return;
+            }
+            let setName = fromSpinal(name);
+            this._updatingFromAttribute = true;
+            this[setName] = newValue;
+            this._updatingFromAttribute = false;
+        }
+        static register() {
+            if (!IgcPropertyEditorPanelComponent._isElementRegistered) {
+                IgcPropertyEditorPanelComponent._isElementRegistered = true;
+                RegisterElementHelper.registerElement(IgcPropertyEditorPanelComponent.htmlTagName, IgcPropertyEditorPanelComponent);
+            }
+        }
+        /**
+         * Gets the actaul data or data source instance to which to bind the grid.
+        */
+        get actualDataSource() {
+            if (this._actualDataSource === null) {
+                let coll = new IgcPropertyEditorPropertyDescriptionCollection();
+                let innerColl = this.i.actualProperties;
+                if (!innerColl) {
+                    innerColl = new PropertyEditorPropertyDescriptionCollection_internal();
+                }
+                this._actualDataSource = coll._fromInner(innerColl);
+                this.i.actualProperties = innerColl;
+            }
+            return this._actualDataSource;
+        }
+        set actualDataSource(v) {
+            if (this._actualDataSource !== null) {
+                this._actualDataSource._setSyncTarget(null);
+                this._actualDataSource = null;
+            }
+            let coll = new IgcPropertyEditorPropertyDescriptionCollection();
+            this._actualDataSource = coll._fromOuter(v);
+            let syncColl = new SyncableObservableCollection$1(PropertyEditorPropertyDescription.$type);
+            let innerColl = this.i.actualProperties;
+            if (!innerColl) {
+                innerColl = new PropertyEditorPropertyDescriptionCollection_internal();
+            }
+            syncColl._inner = innerColl;
+            syncColl.clear();
+            this._actualDataSource._setSyncTarget(syncColl);
+            this.i.actualProperties = innerColl;
+        }
+        /**
+         * Gets or Sets the property name that contains the values.
+        */
+        get rowHeight() {
+            return this.i.bp;
+        }
+        set rowHeight(v) {
+            this.i.bp = +v;
+            this._a("rowHeight", this.i.bp);
+        }
+        get actualRowHeight() {
+            return this.i.ar;
+        }
+        set actualRowHeight(v) {
+            this.i.ar = +v;
+            this._a("actualRowHeight", this.i.ar);
+        }
+        /**
+         * Gets or Sets the property name that contains the values.
+        */
+        get cellTextStyle() {
+            if (this.i.t == null) {
+                return null;
+            }
+            return this.i.t.fontString;
+        }
+        set cellTextStyle(v) {
+            let fi = new FontInfo();
+            fi.fontString = v;
+            this.i.t = fi;
+            this._a("cellTextStyle", this.i.t != null ? this.i.t.fontString : "");
+        }
+        get actualDescriptionContext() {
+            return this.i.h;
+        }
+        set actualDescriptionContext(v) {
+            this.i.h = v;
+        }
+        get descriptionContext() {
+            return this.i.i;
+        }
+        set descriptionContext(v) {
+            this.i.i = v;
+        }
+        get componentRenderer() {
+            return this.i.e;
+        }
+        set componentRenderer(v) {
+            this.i.e = v;
+        }
+        get target() {
+            return this.i.bs;
+        }
+        set target(v) {
+            this.i.bs = v;
+        }
+        get descriptionType() {
+            return this.i.b2;
+        }
+        set descriptionType(v) {
+            this.i.b2 = v;
+        }
+        get isHorizontal() {
+            return this.i.ag;
+        }
+        set isHorizontal(v) {
+            this.i.ag = ensureBool(v);
+            this._a("isHorizontal", this.i.ag);
+        }
+        get isWrappingEnabled() {
+            return this.i.ai;
+        }
+        set isWrappingEnabled(v) {
+            this.i.ai = ensureBool(v);
+            this._a("isWrappingEnabled", this.i.ai);
+        }
+        get isIndirectModeEnabled() {
+            return this.i.ah;
+        }
+        set isIndirectModeEnabled(v) {
+            this.i.ah = ensureBool(v);
+            this._a("isIndirectModeEnabled", this.i.ah);
+        }
+        /**
+         * Gets or sets the color to use for the background of the component.
+        */
+        get backgroundColor() {
+            return brushToString(this.i.d6);
+        }
+        set backgroundColor(v) {
+            this.i.d6 = stringToBrush(v);
+            this._a("backgroundColor", brushToString(this.i.d6));
+        }
+        /**
+         * Gets or sets the color to use for the text of the component.
+        */
+        get textColor() {
+            return brushToString(this.i.d9);
+        }
+        set textColor(v) {
+            this.i.d9 = stringToBrush(v);
+            this._a("textColor", brushToString(this.i.d9));
+        }
+        findByName(name) {
+            if (this.actualDataSource != null && this.actualDataSource.findByName && this.actualDataSource.findByName(name)) {
+                return this.actualDataSource.findByName(name);
+            }
+            if (this.properties != null && this.properties.findByName && this.properties.findByName(name)) {
+                return this.properties.findByName(name);
+            }
+            return null;
+        }
+        get hasUserValues() {
+            return this._hasUserValues;
+        }
+        __m(propertyName) {
+            if (!this._inStyling) {
+                this._hasUserValues.add(propertyName);
+            }
+        }
+        _styling(container, component, parent) {
+            if (this._inStyling) {
+                return;
+            }
+            this._inStyling = true;
+            this._stylingContainer = container;
+            this._stylingParent = component;
+            let genericPrefix = "";
+            let typeName = this.i.$type.name;
+            if (typeName.indexOf("Xam") === 0) {
+                typeName = typeName.substring(3);
+            }
+            genericPrefix = toSpinal("PropertyEditorPanelComponent");
+            let additionalPrefixes = [];
+            let prefix = toSpinal(typeName);
+            additionalPrefixes.push(prefix + "-");
+            let b = this.i.$type.baseType;
+            while (b && b.name != "Object" &&
+                b.name != "Base" &&
+                b.name != "Control" &&
+                b.Name != "DependencyObject" &&
+                b.Name != "FrameworkElement") {
+                typeName = b.name;
+                if (typeName.indexOf("Xam") === 0) {
+                    typeName = typeName.substring(3);
+                }
+                let basePrefix = toSpinal(typeName);
+                additionalPrefixes.push(basePrefix + "-");
+                b = b.baseType;
+            }
+            if (parent) {
+                let parentTypeName = parent.i.$type.name;
+                if (parentTypeName.indexOf("Xam") === 0) {
+                    parentTypeName = parentTypeName.substring(3);
+                }
+                let parentPrefix = toSpinal(parentTypeName);
+                additionalPrefixes.push(parentPrefix + "-" + genericPrefix + "-");
+                additionalPrefixes.push(parentPrefix + "-" + prefix + "-");
+            }
+            initializePropertiesFromCss(container, this, genericPrefix + "-", this.hasUserValues, false, additionalPrefixes);
+            if (this._otherStyling) {
+                this._otherStyling(container, component, parent);
+            }
+            this._inStyling = false;
+        }
+        getDesiredSize() {
+            let iv = this.i.ea();
+            return fromSize(iv);
+        }
+        notifySetItem(index, oldItem, newItem) {
+            this.i.dq(index, oldItem, newItem);
+        }
+        /**
+         * Manually notifies the checkboxlist's grid that the data it has bound to has been cleared and needs to be re-examined.
+         * This should not be called if the data that the grid is bound to is already observable.
+        
+        */
+        notifyClearItems() {
+            this.i.dm();
+        }
+        notifyInsertItem(index, newItem) {
+            this.i.dn(index, newItem);
+        }
+        notifyRemoveItem(index, oldItem) {
+            this.i.dp(index, oldItem);
+        }
+    }
+    IgcPropertyEditorPanelComponent._observedAttributesIgcPropertyEditorPanelComponent = null;
+    IgcPropertyEditorPanelComponent.htmlTagName = "igc-property-editor-panel";
+    IgcPropertyEditorPanelComponent._isElementRegistered = false;
+    return IgcPropertyEditorPanelComponent;
+})();

package/esm2015/lib/igc-property-editor-panel-module.js

@@ -0,0 +1,19 @@
+/*
+THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE  AGREEMENT ("AGREEMENT") LOCATED HERE:
+https://www.infragistics.com/legal/license/igultimate-la
+https://www.infragistics.com/legal/license/igultimate-eula
+GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
+*/
+import { IgcPropertyEditorPropertyDescriptionModule } from './igc-property-editor-property-description-module';
+import { IgcPropertyEditorPanelComponent } from './igc-property-editor-panel-component';
+import { PropertyEditorPanel } from './PropertyEditorPanel';
+import { TypeRegistrar } from "igniteui-webcomponents-core";
+export class IgcPropertyEditorPanelModule {
+    static register() {
+        IgcPropertyEditorPropertyDescriptionModule.register();
+        IgcPropertyEditorPanelComponent.register();
+        TypeRegistrar.registerCons('IgcPropertyEditorPanelComponent', IgcPropertyEditorPanelComponent);
+        TypeRegistrar.registerCons('IgcPropertyEditorPanelComponent', IgcPropertyEditorPanelComponent);
+        TypeRegistrar.register('PropertyEditorPanel', PropertyEditorPanel.$type);
+    }
+}

package/esm2015/lib/igc-property-editor-property-description-button-click-event-args.js

@@ -0,0 +1,24 @@
+import { PropertyEditorPropertyDescriptionButtonClickEventArgs as PropertyEditorPropertyDescriptionButtonClickEventArgs_internal } from "./PropertyEditorPropertyDescriptionButtonClickEventArgs";
+export class IgcPropertyEditorPropertyDescriptionButtonClickEventArgs {
+    createImplementation() {
+        return new PropertyEditorPropertyDescriptionButtonClickEventArgs_internal();
+    }
+    /**
+     * @hidden
+     */
+    get i() {
+        return this._implementation;
+    }
+    onImplementationCreated() {
+    }
+    constructor() {
+        this._implementation = this.createImplementation();
+        this._implementation.externalObject = this;
+        this.onImplementationCreated();
+    }
+    _provideImplementation(i) {
+        this._implementation = i;
+        this._implementation.externalObject = this;
+        this.onImplementationCreated();
+    }
+}

package/esm2015/lib/igc-property-editor-property-description-changed-event-args.js

@@ -0,0 +1,30 @@
+import { PropertyEditorPropertyDescriptionChangedEventArgs as PropertyEditorPropertyDescriptionChangedEventArgs_internal } from "./PropertyEditorPropertyDescriptionChangedEventArgs";
+export class IgcPropertyEditorPropertyDescriptionChangedEventArgs {
+    createImplementation() {
+        return new PropertyEditorPropertyDescriptionChangedEventArgs_internal();
+    }
+    /**
+     * @hidden
+     */
+    get i() {
+        return this._implementation;
+    }
+    onImplementationCreated() {
+    }
+    constructor() {
+        this._implementation = this.createImplementation();
+        this._implementation.externalObject = this;
+        this.onImplementationCreated();
+    }
+    _provideImplementation(i) {
+        this._implementation = i;
+        this._implementation.externalObject = this;
+        this.onImplementationCreated();
+    }
+    get newValue() {
+        return this.i.newValue;
+    }
+    set newValue(v) {
+        this.i.newValue = v;
+    }
+}

package/esm2015/lib/igc-property-editor-property-description-collection.js

@@ -0,0 +1,48 @@
+import { IgCollection } from "igniteui-webcomponents-core";
+import { markType } from "igniteui-webcomponents-core";
+import { SyncableObservableCollection$2 } from "igniteui-webcomponents-core";
+import { PropertyEditorPropertyDescription as PropertyEditorPropertyDescription_internal } from './PropertyEditorPropertyDescription';
+import { IgcPropertyEditorPropertyDescriptionComponent as IgcPropertyEditorPropertyDescriptionComponent } from './igc-property-editor-property-description-component';
+export class IgcPropertyEditorPropertyDescriptionCollection extends IgCollection {
+    constructor(list) {
+        super();
+        if (!IgcPropertyEditorPropertyDescriptionComponent.$type) {
+            IgcPropertyEditorPropertyDescriptionComponent.$type = markType(IgcPropertyEditorPropertyDescriptionComponent, "IgcPropertyEditorPropertyDescriptionComponent");
+        }
+        if (list) {
+            for (let i = 0; i < list.length; i++) {
+                this.add(list[i]);
+            }
+        }
+    }
+    _createInnerColl() {
+        if (!IgcPropertyEditorPropertyDescriptionComponent.$type) {
+            IgcPropertyEditorPropertyDescriptionComponent.$type = markType(IgcPropertyEditorPropertyDescriptionComponent, "IgcPropertyEditorPropertyDescriptionComponent");
+        }
+        let coll = new SyncableObservableCollection$2(IgcPropertyEditorPropertyDescriptionComponent.$type, PropertyEditorPropertyDescription_internal.$type, 0);
+        coll.compare = (ext, int) => {
+            let comp = ext;
+            if (comp._implementation) {
+                comp = comp._implementation;
+            }
+            if (comp.equals) {
+                return comp.equals(int);
+            }
+            return comp === int;
+        };
+        coll.createTo = (ext) => {
+            return ext._implementation;
+        };
+        coll.createFrom = (int) => {
+            let ext = int.externalObject;
+            if (!ext) {
+                ext = new IgcPropertyEditorPropertyDescriptionComponent();
+                if (ext) {
+                    ext._implementation = int;
+                }
+            }
+            return ext;
+        };
+        return coll;
+    }
+}