igniteui-webcomponents-inputs 7.1.1-beta.1 → 7.1.1-beta.3

package/esm2022/lib/igc-multi-slider-component.js

@@ -0,0 +1,680 @@
+import { IgcHTMLElement } from "igniteui-webcomponents-core";
+import { delegateCombine, delegateRemove } from "igniteui-webcomponents-core";
+import { IgcMultiSliderThumbCollection } from "./igc-multi-slider-thumb-collection";
+import { MultiSliderOrientation_$type } from "./MultiSliderOrientation";
+import { IgcMultiSliderResolvingToolTipValueEventArgs } from "./igc-multi-slider-resolving-tool-tip-value-event-args";
+import { IgcMultiSliderThumbValueChangingEventArgs } from "./igc-multi-slider-thumb-value-changing-event-args";
+import { IgcMultiSliderYValueChangingEventArgs } from "./igc-multi-slider-y-value-changing-event-args";
+import { MultiSlider } from "./MultiSlider";
+import { TypeRegistrar } from "igniteui-webcomponents-core";
+import { NamePatcher, getAllPropertyNames, fromSpinal, toSpinal, fromRect, toRect, rectToString, ensureEnum, enumToString, brushToString, stringToBrush, ensureBool, initializePropertiesFromCss } from "igniteui-webcomponents-core";
+import { RegisterElementHelper } from "igniteui-webcomponents-core";
+import { MultiSliderThumbCollection as MultiSliderThumbCollection_internal } from "./MultiSliderThumbCollection";
+import { MultiSliderThumb } from "./MultiSliderThumb";
+import { SyncableObservableCollection$1 } from "igniteui-webcomponents-core";
+import { FontInfo } from "igniteui-webcomponents-core";
+class IgcMultiSliderComponent extends IgcHTMLElement {
+    createImplementation() {
+        return new MultiSlider();
+    }
+    /**
+     * @hidden
+     */
+    get i() {
+        return this._implementation;
+    } /**
+                                 * @hidden
+                                 */
+    static _createFromInternal(internal) {
+        if (!internal) {
+            return null;
+        }
+        if (!internal.$type) {
+            return null;
+        }
+        let name = internal.$type.name;
+        let externalName = "Igc" + name + "Component";
+        if (!TypeRegistrar.isRegistered(externalName)) {
+            return null;
+        }
+        return TypeRegistrar.create(externalName);
+    }
+    onImplementationCreated() {
+    }
+    constructor() {
+        super();
+        this._settingAttributes = false;
+        this._attached = false;
+        this._queuedSetAttributes = [];
+        this._updatingFromAttribute = false;
+        this._thumbs = null;
+        this.__p = null;
+        this._hasUserValues = new Set();
+        this._stylingContainer = null;
+        this._stylingParent = null;
+        this._inStyling = false;
+        this._resolvingToolTipValue = null;
+        this._resolvingToolTipValue_wrapped = null;
+        this._thumbValueChanging = null;
+        this._thumbValueChanging_wrapped = null;
+        this._thumbValueChanged = null;
+        this._thumbValueChanged_wrapped = null;
+        this._yValueChanging = null;
+        this._yValueChanging_wrapped = null;
+        this._yValueChanged = null;
+        this._yValueChanged_wrapped = null;
+        if (this._styling) {
+            NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
+        }
+        this._implementation = this.createImplementation();
+        Object.defineProperty(this._implementation, 'externalObject', { value: this, enumerable: false, configurable: true, writable: true });
+        this.onImplementationCreated();
+        if (this._initializeAdapters) {
+            this._initializeAdapters();
+        }
+    }
+    _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;
+    }
+    connectedCallback() {
+        if (super["connectedCallback"]) {
+            super["connectedCallback"]();
+        }
+        if (this.i.connectedCallback) {
+            this.i.connectedCallback();
+        }
+        if (!this._attached) {
+            this._attached = true;
+            this._flushQueuedAttributes();
+        }
+    }
+    disconnectedCallback() {
+        if (super["disconnectedCallback"]) {
+            super["disconnectedCallback"]();
+        }
+        if (this.i.disconnectedCallback) {
+            this.i.disconnectedCallback();
+        }
+        if (this._attached) {
+            this._attached = false;
+        }
+    }
+    static { this._observedAttributesIgcMultiSliderComponent = null; }
+    static get observedAttributes() {
+        if (IgcMultiSliderComponent._observedAttributesIgcMultiSliderComponent == null) {
+            let names = getAllPropertyNames(IgcMultiSliderComponent);
+            for (let i = 0; i < names.length; i++) {
+                names[i] = toSpinal(names[i]);
+            }
+            IgcMultiSliderComponent._observedAttributesIgcMultiSliderComponent = names;
+        }
+        return IgcMultiSliderComponent._observedAttributesIgcMultiSliderComponent;
+    }
+    attributeChangedCallback(name, oldValue, newValue) {
+        if (this._settingAttributes) {
+            return;
+        }
+        let setName = fromSpinal(name);
+        this._updatingFromAttribute = true;
+        this[setName] = newValue;
+        this._updatingFromAttribute = false;
+    }
+    static { this.htmlTagName = "igc-multi-slider"; }
+    static { this._isElementRegistered = false; }
+    static register() {
+        if (!IgcMultiSliderComponent._isElementRegistered) {
+            IgcMultiSliderComponent._isElementRegistered = true;
+            RegisterElementHelper.registerElement(IgcMultiSliderComponent.htmlTagName, IgcMultiSliderComponent);
+        }
+    }
+    /**
+     * Gets the column definitions that are assigned to the grid. This collection can be modified to add or remove columns in the grid.
+    */
+    get thumbs() {
+        if (this._thumbs === null) {
+            let coll = new IgcMultiSliderThumbCollection();
+            let innerColl = this.i.thumbs;
+            if (!innerColl) {
+                innerColl = new MultiSliderThumbCollection_internal();
+            }
+            this._thumbs = coll._fromInner(innerColl);
+        }
+        return this._thumbs;
+    }
+    set thumbs(v) {
+        if (this._thumbs !== null) {
+            this._thumbs._setSyncTarget(null);
+            this._thumbs = null;
+        }
+        let coll = new IgcMultiSliderThumbCollection();
+        this._thumbs = coll._fromOuter(v);
+        let syncColl = new SyncableObservableCollection$1(MultiSliderThumb.$type);
+        let innerColl = this.i.thumbs;
+        if (!innerColl) {
+            innerColl = new MultiSliderThumbCollection_internal();
+        }
+        syncColl._inner = innerColl;
+        syncColl.clear();
+        this._thumbs._setSyncTarget(syncColl);
+    }
+    get min() {
+        return this.i.bg;
+    }
+    set min(v) {
+        this.i.bg = +v;
+        this._a("min", this.i.bg);
+    }
+    get max() {
+        return this.i.bf;
+    }
+    set max(v) {
+        this.i.bf = +v;
+        this._a("max", this.i.bf);
+    }
+    get step() {
+        return this.i.bl;
+    }
+    set step(v) {
+        this.i.bl = +v;
+        this._a("step", this.i.bl);
+    }
+    get yMax() {
+        return this.i.bu;
+    }
+    set yMax(v) {
+        this.i.bu = +v;
+        this._a("yMax", this.i.bu);
+    }
+    get yMin() {
+        return this.i.bv;
+    }
+    set yMin(v) {
+        this.i.bv = +v;
+        this._a("yMin", this.i.bv);
+    }
+    get yStep() {
+        return this.i.bx;
+    }
+    set yStep(v) {
+        this.i.bx = +v;
+        this._a("yStep", this.i.bx);
+    }
+    /**
+     * Gets or sets the scaling value used to affect the pixel density of the control.
+     * A higher scaling ratio will produce crisper visuals at the expense of memory.  Lower values will cause the control
+     * to appear blurry.
+    */
+    get pixelScalingRatio() {
+        return this.i.bh;
+    }
+    set pixelScalingRatio(v) {
+        this.i.bh = +v;
+        this._a("pixelScalingRatio", this.i.bh);
+    }
+    get actualPixelScalingRatio() {
+        return this.i.a9;
+    }
+    set actualPixelScalingRatio(v) {
+        this.i.a9 = +v;
+        this._a("actualPixelScalingRatio", this.i.a9);
+    }
+    get windowRect() {
+        return fromRect(this.i.e1);
+    }
+    set windowRect(v) {
+        this.i.e1 = toRect(v);
+        this._a("windowRect", rectToString(this.i.e1));
+    }
+    get yValue() {
+        return this.i.b0;
+    }
+    set yValue(v) {
+        this.i.b0 = +v;
+        this._a("yValue", this.i.b0);
+    }
+    get startInset() {
+        return this.i.bk;
+    }
+    set startInset(v) {
+        this.i.bk = +v;
+        this._a("startInset", this.i.bk);
+    }
+    get endInset() {
+        return this.i.be;
+    }
+    set endInset(v) {
+        this.i.be = +v;
+        this._a("endInset", this.i.be);
+    }
+    get trackStartInset() {
+        return this.i.bq;
+    }
+    set trackStartInset(v) {
+        this.i.bq = +v;
+        this._a("trackStartInset", this.i.bq);
+    }
+    get trackEndInset() {
+        return this.i.bp;
+    }
+    set trackEndInset(v) {
+        this.i.bp = +v;
+        this._a("trackEndInset", this.i.bp);
+    }
+    get yTrackStartInset() {
+        return this.i.bz;
+    }
+    set yTrackStartInset(v) {
+        this.i.bz = +v;
+        this._a("yTrackStartInset", this.i.bz);
+    }
+    get yTrackEndInset() {
+        return this.i.by;
+    }
+    set yTrackEndInset(v) {
+        this.i.by = +v;
+        this._a("yTrackEndInset", this.i.by);
+    }
+    get barExtent() {
+        return this.i.bb;
+    }
+    set barExtent(v) {
+        this.i.bb = +v;
+        this._a("barExtent", this.i.bb);
+    }
+    get orientation() {
+        return this.i.e;
+    }
+    set orientation(v) {
+        this.i.e = ensureEnum(MultiSliderOrientation_$type, v);
+        this._a("orientation", enumToString(MultiSliderOrientation_$type, this.i.e));
+    }
+    get thumbBrush() {
+        return brushToString(this.i.es);
+    }
+    set thumbBrush(v) {
+        this.i.es = stringToBrush(v);
+        this._a("thumbBrush", brushToString(this.i.es));
+    }
+    get thumbStrokeThickness() {
+        return this.i.bn;
+    }
+    set thumbStrokeThickness(v) {
+        this.i.bn = +v;
+        this._a("thumbStrokeThickness", this.i.bn);
+    }
+    get thumbOutline() {
+        return brushToString(this.i.et);
+    }
+    set thumbOutline(v) {
+        this.i.et = stringToBrush(v);
+        this._a("thumbOutline", brushToString(this.i.et));
+    }
+    get thumbWidth() {
+        return this.i.bo;
+    }
+    set thumbWidth(v) {
+        this.i.bo = +v;
+        this._a("thumbWidth", this.i.bo);
+    }
+    get thumbHeight() {
+        return this.i.bm;
+    }
+    set thumbHeight(v) {
+        this.i.bm = +v;
+        this._a("thumbHeight", this.i.bm);
+    }
+    get barBrush() {
+        return brushToString(this.i.ek);
+    }
+    set barBrush(v) {
+        this.i.ek = stringToBrush(v);
+        this._a("barBrush", brushToString(this.i.ek));
+    }
+    get barOutline() {
+        return brushToString(this.i.el);
+    }
+    set barOutline(v) {
+        this.i.el = stringToBrush(v);
+        this._a("barOutline", brushToString(this.i.el));
+    }
+    get barStrokeThickness() {
+        return this.i.bc;
+    }
+    set barStrokeThickness(v) {
+        this.i.bc = +v;
+        this._a("barStrokeThickness", this.i.bc);
+    }
+    get rangeThumbBrush() {
+        return brushToString(this.i.ep);
+    }
+    set rangeThumbBrush(v) {
+        this.i.ep = stringToBrush(v);
+        this._a("rangeThumbBrush", brushToString(this.i.ep));
+    }
+    get rangeThumbOutline() {
+        return brushToString(this.i.eq);
+    }
+    set rangeThumbOutline(v) {
+        this.i.eq = stringToBrush(v);
+        this._a("rangeThumbOutline", brushToString(this.i.eq));
+    }
+    get rangeThumbStrokeThickness() {
+        return this.i.bj;
+    }
+    set rangeThumbStrokeThickness(v) {
+        this.i.bj = +v;
+        this._a("rangeThumbStrokeThickness", this.i.bj);
+    }
+    get rangeThumbRidgesBrush() {
+        return brushToString(this.i.er);
+    }
+    set rangeThumbRidgesBrush(v) {
+        this.i.er = stringToBrush(v);
+        this._a("rangeThumbRidgesBrush", brushToString(this.i.er));
+    }
+    get thumbRidgesBrush() {
+        return brushToString(this.i.eu);
+    }
+    set thumbRidgesBrush(v) {
+        this.i.eu = stringToBrush(v);
+        this._a("thumbRidgesBrush", brushToString(this.i.eu));
+    }
+    get calloutBrush() {
+        return brushToString(this.i.em);
+    }
+    set calloutBrush(v) {
+        this.i.em = stringToBrush(v);
+        this._a("calloutBrush", brushToString(this.i.em));
+    }
+    get calloutTextColor() {
+        return brushToString(this.i.eo);
+    }
+    set calloutTextColor(v) {
+        this.i.eo = stringToBrush(v);
+        this._a("calloutTextColor", brushToString(this.i.eo));
+    }
+    get calloutOutline() {
+        return brushToString(this.i.en);
+    }
+    set calloutOutline(v) {
+        this.i.en = stringToBrush(v);
+        this._a("calloutOutline", brushToString(this.i.en));
+    }
+    get calloutStrokeThickness() {
+        return this.i.bd;
+    }
+    set calloutStrokeThickness(v) {
+        this.i.bd = +v;
+        this._a("calloutStrokeThickness", this.i.bd);
+    }
+    get isCustomThumbProvided() {
+        return this.i.ac;
+    }
+    get isCustomRangeThumbProvided() {
+        return this.i.aa;
+    }
+    get isCustomBarProvided() {
+        return this.i.z;
+    }
+    get isCustomShadeProvided() {
+        return this.i.ab;
+    }
+    get areThumbCalloutsEnabled() {
+        return this.i.t;
+    }
+    set areThumbCalloutsEnabled(v) {
+        this.i.t = ensureBool(v);
+        this._a("areThumbCalloutsEnabled", this.i.t);
+    }
+    get thumbCalloutTextStyle() {
+        if (this.i.p == null) {
+            return null;
+        }
+        return this.i.p.fontString;
+    }
+    set thumbCalloutTextStyle(v) {
+        let fi = new FontInfo();
+        fi.fontString = v;
+        this.i.p = fi;
+        this._a("thumbCalloutTextStyle", this.i.p != null ? this.i.p.fontString : "");
+    }
+    findByName(name) {
+        if (this.findEphemera) {
+            if (name && name.indexOf("@@e:") == 0) {
+                return this.findEphemera(name);
+            }
+        }
+        if (this.thumbs != null && this.thumbs.findByName && this.thumbs.findByName(name)) {
+            return this.thumbs.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("MultiSliderComponent");
+        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;
+    }
+    onDetachedFromUI() {
+        this.i.onDetachedFromUI();
+    }
+    onAttachedToUI() {
+        this.i.onAttachedToUI();
+    }
+    /**
+     * Called by the UI framework to provide a UI container for rendering this control.
+    
+    * @param container  * The UI container element.
+    */
+    provideContainer(container) {
+        this.i.provideContainer(container);
+    }
+    flush() {
+        this.i.c7();
+    }
+    trackDirty() {
+        this.i.trackDirty();
+    }
+    /**
+     * Shows the ZoomSlider.
+    
+    */
+    show() {
+        this.i.dw();
+    }
+    /**
+     * Hides the ZoomSlider.
+    
+    */
+    hide() {
+        this.i.c8();
+    }
+    get resolvingToolTipValue() {
+        return this._resolvingToolTipValue;
+    }
+    set resolvingToolTipValue(ev) {
+        if (this._resolvingToolTipValue_wrapped !== null) {
+            this.i.resolvingToolTipValue = delegateRemove(this.i.resolvingToolTipValue, this._resolvingToolTipValue_wrapped);
+            this._resolvingToolTipValue_wrapped = null;
+            this._resolvingToolTipValue = null;
+        }
+        this._resolvingToolTipValue = ev;
+        this._resolvingToolTipValue_wrapped = (o, e) => {
+            let outerArgs = new IgcMultiSliderResolvingToolTipValueEventArgs();
+            outerArgs._provideImplementation(e);
+            if (this.beforeResolvingToolTipValue) {
+                this.beforeResolvingToolTipValue(this, outerArgs);
+            }
+            if (this._resolvingToolTipValue) {
+                this._resolvingToolTipValue(this, outerArgs);
+            }
+        };
+        this.i.resolvingToolTipValue = delegateCombine(this.i.resolvingToolTipValue, this._resolvingToolTipValue_wrapped);
+        ;
+    }
+    get thumbValueChanging() {
+        return this._thumbValueChanging;
+    }
+    set thumbValueChanging(ev) {
+        if (this._thumbValueChanging_wrapped !== null) {
+            this.i.thumbValueChanging = delegateRemove(this.i.thumbValueChanging, this._thumbValueChanging_wrapped);
+            this._thumbValueChanging_wrapped = null;
+            this._thumbValueChanging = null;
+        }
+        this._thumbValueChanging = ev;
+        this._thumbValueChanging_wrapped = (o, e) => {
+            let outerArgs = new IgcMultiSliderThumbValueChangingEventArgs();
+            outerArgs._provideImplementation(e);
+            if (this.beforeThumbValueChanging) {
+                this.beforeThumbValueChanging(this, outerArgs);
+            }
+            if (this._thumbValueChanging) {
+                this._thumbValueChanging(this, outerArgs);
+            }
+        };
+        this.i.thumbValueChanging = delegateCombine(this.i.thumbValueChanging, this._thumbValueChanging_wrapped);
+        ;
+    }
+    get thumbValueChanged() {
+        return this._thumbValueChanged;
+    }
+    set thumbValueChanged(ev) {
+        if (this._thumbValueChanged_wrapped !== null) {
+            this.i.thumbValueChanged = delegateRemove(this.i.thumbValueChanged, this._thumbValueChanged_wrapped);
+            this._thumbValueChanged_wrapped = null;
+            this._thumbValueChanged = null;
+        }
+        this._thumbValueChanged = ev;
+        this._thumbValueChanged_wrapped = (o, e) => {
+            let outerArgs = new IgcMultiSliderThumbValueChangingEventArgs();
+            outerArgs._provideImplementation(e);
+            if (this.beforeThumbValueChanged) {
+                this.beforeThumbValueChanged(this, outerArgs);
+            }
+            if (this._thumbValueChanged) {
+                this._thumbValueChanged(this, outerArgs);
+            }
+        };
+        this.i.thumbValueChanged = delegateCombine(this.i.thumbValueChanged, this._thumbValueChanged_wrapped);
+        ;
+    }
+    get yValueChanging() {
+        return this._yValueChanging;
+    }
+    set yValueChanging(ev) {
+        if (this._yValueChanging_wrapped !== null) {
+            this.i.yValueChanging = delegateRemove(this.i.yValueChanging, this._yValueChanging_wrapped);
+            this._yValueChanging_wrapped = null;
+            this._yValueChanging = null;
+        }
+        this._yValueChanging = ev;
+        this._yValueChanging_wrapped = (o, e) => {
+            let outerArgs = new IgcMultiSliderYValueChangingEventArgs();
+            outerArgs._provideImplementation(e);
+            if (this.beforeYValueChanging) {
+                this.beforeYValueChanging(this, outerArgs);
+            }
+            if (this._yValueChanging) {
+                this._yValueChanging(this, outerArgs);
+            }
+        };
+        this.i.yValueChanging = delegateCombine(this.i.yValueChanging, this._yValueChanging_wrapped);
+        ;
+    }
+    get yValueChanged() {
+        return this._yValueChanged;
+    }
+    set yValueChanged(ev) {
+        if (this._yValueChanged_wrapped !== null) {
+            this.i.yValueChanged = delegateRemove(this.i.yValueChanged, this._yValueChanged_wrapped);
+            this._yValueChanged_wrapped = null;
+            this._yValueChanged = null;
+        }
+        this._yValueChanged = ev;
+        this._yValueChanged_wrapped = (o, e) => {
+            let outerArgs = new IgcMultiSliderYValueChangingEventArgs();
+            outerArgs._provideImplementation(e);
+            if (this.beforeYValueChanged) {
+                this.beforeYValueChanged(this, outerArgs);
+            }
+            if (this._yValueChanged) {
+                this._yValueChanged(this, outerArgs);
+            }
+        };
+        this.i.yValueChanged = delegateCombine(this.i.yValueChanged, this._yValueChanged_wrapped);
+        ;
+    }
+}
+export { IgcMultiSliderComponent };