igniteui-angular-inputs
Version:
Ignite UI Angular input components for building rich data visualizations for modern web apps.
1,001 lines (998 loc) • 41.1 kB
JavaScript
import { Output, TemplateRef, EventEmitter, Component, ViewContainerRef, ViewChild, ContentChildren, Input, ChangeDetectionStrategy, HostBinding } from '@angular/core';
import { XButtonGroup } from "./XButtonGroup";
import { ensureEnum, brushToString, stringToBrush, ensureBool, toSpinal, initializePropertiesFromCss, NamePatcher } from "igniteui-angular-core";
import { AngularRenderer, PortalManager } from "igniteui-angular-core";
import { delegateCombine } from "igniteui-angular-core";
import { IgxXButtonComponent } from './igx-x-button-component';
import { IgxXButtonGroupButtonCollection } from './igx-x-button-group-button-collection';
import { CollectionAdapter } from "igniteui-angular-core";
import { NotifyCollectionChangedAction } from "igniteui-angular-core";
import { IgxButtonGroupSelectionChangedEventArgs } from './igx-button-group-selection-changed-event-args';
import { ButtonGroupOrientation_$type } from './ButtonGroupOrientation';
import { ControlDisplayDensity_$type } from "igniteui-angular-core";
import { BaseControlTheme_$type } from "igniteui-angular-core";
import { ButtonGroupDisplayStyle_$type } from './ButtonGroupDisplayStyle';
import * as i0 from "@angular/core";
export let IgxXButtonGroupComponent = /*@__PURE__*/ (() => {
class IgxXButtonGroupComponent {
constructor(renderer, _elRef, ngZone, injector, componentFactoryResolver) {
this.renderer = renderer;
this._elRef = _elRef;
this.ngZone = ngZone;
this.injector = injector;
this.componentFactoryResolver = componentFactoryResolver;
this._wrapper = null;
this._portalManager = null;
this._root = null;
/**
* The style mappings actually present in the chart. Do not directly modify this array.
* This array's contents can be modified by causing Angular to reproject the child content.
* Or adding and removing stye mappings from the manual style mapping collection on the styleMappings property.
*/
this.actualButtons = [];
this._buttons = null;
this._buttonsAdapter = null;
this._implementation = null;
this.__p = null;
this._hasUserValues = new Set();
this._stylingContainer = null;
this._stylingParent = null;
this._inStyling = false;
this._selectionChanged = null;
this._zoneRunner = null;
if (this._styling) {
NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
}
this._implementation = this.createImplementation();
this._implementation.externalObject = this;
if (renderer) {
this.container = renderer.createElement("div");
renderer.appendChild(_elRef.element.nativeElement, this.container);
renderer.setStyle(this.container, "display", "inline-block");
}
var root;
root = this.container;
if (this.container != null) {
root = this.container;
}
if (root && root.nativeElement) {
root = root.nativeElement;
}
this._root = root;
var buttonGroup = this.i;
this._buttonGroup = buttonGroup;
this._buttonsAdapter = new CollectionAdapter([], this.i.buttons, this.actualButtons, (c) => c.i, (i) => {
if (this._root && this._root.parentElement) {
i._styling(this._root, this, this);
}
}, (i) => { });
if (renderer) {
this._portalManager = new PortalManager("buttonContent", componentFactoryResolver);
var ren = new AngularRenderer(root, this.renderer, window.document, this.ngZone, true, {}, this._portalManager);
this._wrapper = ren;
buttonGroup.provideContainer(ren);
}
}
/**
* A collection or manually added axes for the chart.
*/
get buttons() {
if (this._buttons === null) {
let coll = new IgxXButtonGroupButtonCollection();
let inner = coll._innerColl;
inner.addListener((sender, e) => {
switch (e.action) {
case NotifyCollectionChangedAction.Add:
this._buttonsAdapter.insertManualItem(e.newStartingIndex, e.newItems.item(0));
break;
case NotifyCollectionChangedAction.Remove:
this._buttonsAdapter.removeManualItemAt(e.oldStartingIndex);
break;
case NotifyCollectionChangedAction.Replace:
this._buttonsAdapter.removeManualItemAt(e.oldStartingIndex);
this._buttonsAdapter.insertManualItem(e.newStartingIndex, e.newItems.item(0));
break;
case NotifyCollectionChangedAction.Reset:
this._buttonsAdapter.clearManualItems();
break;
}
});
this._buttons = coll;
}
return this._buttons;
}
// supports angular themes or custom properties set in CSS
updateStyle() {
this._styling(this._root, this);
}
ngOnDestroy() {
this._buttonGroup.destroy();
this._wrapper.destroy();
}
ngAfterContentInit() {
this._buttonsAdapter.updateQuery(this.contentButtons);
this._styling(this._root, this);
if (this.actualButtons && this.actualButtons.length > 0) {
var currButtons = this.actualButtons;
for (var i = 0; i < currButtons.length; i++) {
currButtons[i]._styling(this._root, this, this);
}
}
this.updateStyle();
}
ngAfterViewInit() {
this._portalManager.dynamicContent = this._dynamicContent;
this._portalManager.onChildContentChanged(this._childTemplateRef);
}
createImplementation() {
return new XButtonGroup();
}
get i() {
return this._implementation;
}
/**
* Gets or sets the display style to use for the button.
*/
get displayType() {
return this.i.i;
}
set displayType(v) {
this.i.i = ensureEnum(ButtonGroupDisplayStyle_$type, v);
}
/**
* Gets or sets the base built in theme to use for the button group.
*/
get baseTheme() {
return this.i.p;
}
set baseTheme(v) {
this.i.p = ensureEnum(BaseControlTheme_$type, v);
}
/**
* Gets or sets the display density to use for the button group.
*/
get density() {
return this.i.t;
}
set density(v) {
this.i.t = ensureEnum(ControlDisplayDensity_$type, v);
}
/**
* Gets the actual display density to use for the button group.
*/
get actualDensity() {
return this.i.s;
}
set actualDensity(v) {
this.i.s = ensureEnum(ControlDisplayDensity_$type, v);
}
/**
* Gets the currently selected button indices.
*/
get selectedIndices() {
return this.i.d;
}
set selectedIndices(v) {
if (v && !Array.isArray(v) && typeof (v) == "string") {
const re = /\s*(?:,|\s|$)\s*/gm;
v = v.split(re);
}
this.i.d = v;
}
/**
* Gets the actual item corner radius for the appropriate corners.
*/
get actualItemCornerRadius() {
return this.i.al;
}
set actualItemCornerRadius(v) {
this.i.al = +v;
}
/**
* Gets the actual item background color.
*/
get actualItemBackgroundColor() {
return brushToString(this.i.ez);
}
set actualItemBackgroundColor(v) {
this.i.ez = stringToBrush(v);
}
/**
* Gets the actual item background color.
*/
get actualItemDisabledBackgroundColor() {
return brushToString(this.i.e1);
}
set actualItemDisabledBackgroundColor(v) {
this.i.e1 = stringToBrush(v);
}
/**
* Gets the actual item text color.
*/
get actualItemTextColor() {
return brushToString(this.i.e6);
}
set actualItemTextColor(v) {
this.i.e6 = stringToBrush(v);
}
/**
* Gets the actual item text color.
*/
get actualItemDisabledTextColor() {
return brushToString(this.i.e3);
}
set actualItemDisabledTextColor(v) {
this.i.e3 = stringToBrush(v);
}
/**
* Gets the actual item border color.
*/
get actualItemBorderColor() {
return brushToString(this.i.e0);
}
set actualItemBorderColor(v) {
this.i.e0 = stringToBrush(v);
}
/**
* Gets the actual item border color.
*/
get actualItemDisabledBorderColor() {
return brushToString(this.i.e2);
}
set actualItemDisabledBorderColor(v) {
this.i.e2 = stringToBrush(v);
}
/**
* Gets the actual item border width.
*/
get actualItemBorderWidth() {
return this.i.ak;
}
set actualItemBorderWidth(v) {
this.i.ak = +v;
}
/**
* Gets the actual selected item background color.
*/
get actualSelectedItemBackgroundColor() {
return brushToString(this.i.e7);
}
set actualSelectedItemBackgroundColor(v) {
this.i.e7 = stringToBrush(v);
}
/**
* Gets the stroke actual selected item text color.
*/
get actualSelectedItemTextColor() {
return brushToString(this.i.fa);
}
set actualSelectedItemTextColor(v) {
this.i.fa = stringToBrush(v);
}
/**
* Gets the actual item hovered background color.
*/
get actualItemHoverBackgroundColor() {
return brushToString(this.i.e4);
}
set actualItemHoverBackgroundColor(v) {
this.i.e4 = stringToBrush(v);
}
/**
* Gets the actual item text color.
*/
get actualItemHoverTextColor() {
return brushToString(this.i.e5);
}
set actualItemHoverTextColor(v) {
this.i.e5 = stringToBrush(v);
}
/**
* Gets the actual selected item hovered background color.
*/
get actualSelectedItemHoverBackgroundColor() {
return brushToString(this.i.e8);
}
set actualSelectedItemHoverBackgroundColor(v) {
this.i.e8 = stringToBrush(v);
}
/**
* Gets the actual selected item hovered text color.
*/
get actualSelectedItemHoverTextColor() {
return brushToString(this.i.e9);
}
set actualSelectedItemHoverTextColor(v) {
this.i.e9 = stringToBrush(v);
}
/**
* Gets or sets the corner radius to use for the appropriate corners for the item buttons.
*/
get itemCornerRadius() {
return this.i.a1;
}
set itemCornerRadius(v) {
this.i.a1 = +v;
}
/**
* Gets or sets the color to use the background of the buttons in the group.
*/
get itemBackgroundColor() {
return brushToString(this.i.hn);
}
set itemBackgroundColor(v) {
this.i.hn = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the background of the buttons in the group.
*/
get itemDisabledBackgroundColor() {
return brushToString(this.i.hp);
}
set itemDisabledBackgroundColor(v) {
this.i.hp = stringToBrush(v);
}
/**
* Gets or sets the color to use the text of the buttons in the group.
*/
get itemTextColor() {
return brushToString(this.i.hu);
}
set itemTextColor(v) {
this.i.hu = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the text of the buttons in the group.
*/
get itemDisabledTextColor() {
return brushToString(this.i.hr);
}
set itemDisabledTextColor(v) {
this.i.hr = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered background of the buttons in the group.
*/
get itemHoverBackgroundColor() {
return brushToString(this.i.hs);
}
set itemHoverBackgroundColor(v) {
this.i.hs = stringToBrush(v);
}
/**
* Gets or sets the color to use the border of the buttons in the group.
*/
get itemBorderColor() {
return brushToString(this.i.ho);
}
set itemBorderColor(v) {
this.i.ho = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the border of the buttons in the group.
*/
get itemDisabledBorderColor() {
return brushToString(this.i.hq);
}
set itemDisabledBorderColor(v) {
this.i.hq = stringToBrush(v);
}
/**
* Gets or sets the border width to use for the buttons in the group.
*/
get itemBorderWidth() {
return this.i.a0;
}
set itemBorderWidth(v) {
this.i.a0 = +v;
}
/**
* Gets or sets the color to use the hovered text of the buttons in the group.
*/
get itemHoverTextColor() {
return brushToString(this.i.ht);
}
set itemHoverTextColor(v) {
this.i.ht = stringToBrush(v);
}
/**
* Gets or sets the color to use the background of the buttons in the group that are selected.
*/
get selectedItemBackgroundColor() {
return brushToString(this.i.h7);
}
set selectedItemBackgroundColor(v) {
this.i.h7 = stringToBrush(v);
}
/**
* Gets or sets the color to use the text of the buttons in the group that are selected.
*/
get selectedItemTextColor() {
return brushToString(this.i.ia);
}
set selectedItemTextColor(v) {
this.i.ia = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered background of the buttons in the group that are selected.
*/
get selectedItemHoverBackgroundColor() {
return brushToString(this.i.h8);
}
set selectedItemHoverBackgroundColor(v) {
this.i.h8 = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered text of the buttons in the group that are selected.
*/
get selectedItemHoverTextColor() {
return brushToString(this.i.h9);
}
set selectedItemHoverTextColor(v) {
this.i.h9 = stringToBrush(v);
}
/**
* Gets or sets the corner radius to use for the appropriate corners for the outlined type item buttons.
*/
get outlinedItemCornerRadius() {
return this.i.a3;
}
set outlinedItemCornerRadius(v) {
this.i.a3 = +v;
}
/**
* Gets or sets the color to use the background of the buttons in the group when type is outlined.
*/
get outlinedItemBackgroundColor() {
return brushToString(this.i.hv);
}
set outlinedItemBackgroundColor(v) {
this.i.hv = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the background of the buttons in the group when type is outlined.
*/
get outlinedItemDisabledBackgroundColor() {
return brushToString(this.i.hx);
}
set outlinedItemDisabledBackgroundColor(v) {
this.i.hx = stringToBrush(v);
}
/**
* Gets or sets the color to use the text of the buttons in the group when type is outlined.
*/
get outlinedItemTextColor() {
return brushToString(this.i.h2);
}
set outlinedItemTextColor(v) {
this.i.h2 = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the text of the buttons in the group when type is outlined.
*/
get outlinedItemDisabledTextColor() {
return brushToString(this.i.hz);
}
set outlinedItemDisabledTextColor(v) {
this.i.hz = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered background of the buttons in the group when type is outlined.
*/
get outlinedItemHoverBackgroundColor() {
return brushToString(this.i.h0);
}
set outlinedItemHoverBackgroundColor(v) {
this.i.h0 = stringToBrush(v);
}
/**
* Gets or sets the color to use the border of the buttons in the group when type is outlined.
*/
get outlinedItemBorderColor() {
return brushToString(this.i.hw);
}
set outlinedItemBorderColor(v) {
this.i.hw = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the border of the buttons in the group when type is outlined.
*/
get outlinedItemDisabledBorderColor() {
return brushToString(this.i.hy);
}
set outlinedItemDisabledBorderColor(v) {
this.i.hy = stringToBrush(v);
}
/**
* Gets or sets the border width to use for the buttons in the group when type is outlined.
*/
get outlinedItemBorderWidth() {
return this.i.a2;
}
set outlinedItemBorderWidth(v) {
this.i.a2 = +v;
}
/**
* Gets or sets the color to use the hovered text of the buttons in the group when type is outlined.
*/
get outlinedItemHoverTextColor() {
return brushToString(this.i.h1);
}
set outlinedItemHoverTextColor(v) {
this.i.h1 = stringToBrush(v);
}
/**
* Gets or sets the color to use the background of the buttons in the group that are selected when type is outlined.
*/
get outlinedSelectedItemBackgroundColor() {
return brushToString(this.i.h3);
}
set outlinedSelectedItemBackgroundColor(v) {
this.i.h3 = stringToBrush(v);
}
/**
* Gets or sets the color to use the text of the buttons in the group that are selected when type is outlined.
*/
get outlinedSelectedItemTextColor() {
return brushToString(this.i.h6);
}
set outlinedSelectedItemTextColor(v) {
this.i.h6 = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered background of the buttons in the group that are selected when type is outlined.
*/
get outlinedSelectedItemHoverBackgroundColor() {
return brushToString(this.i.h4);
}
set outlinedSelectedItemHoverBackgroundColor(v) {
this.i.h4 = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered text of the buttons in the group that are selected when type is outlined.
*/
get outlinedSelectedItemHoverTextColor() {
return brushToString(this.i.h5);
}
set outlinedSelectedItemHoverTextColor(v) {
this.i.h5 = stringToBrush(v);
}
/**
* Gets or sets the corner radius to use for the appropriate corners for the flat type item buttons.
*/
get flatItemCornerRadius() {
return this.i.az;
}
set flatItemCornerRadius(v) {
this.i.az = +v;
}
/**
* Gets or sets the color to use the background of the buttons in the group when type is flat.
*/
get flatItemBackgroundColor() {
return brushToString(this.i.hb);
}
set flatItemBackgroundColor(v) {
this.i.hb = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the background of the buttons in the group when type is flat.
*/
get flatItemDisabledBackgroundColor() {
return brushToString(this.i.hd);
}
set flatItemDisabledBackgroundColor(v) {
this.i.hd = stringToBrush(v);
}
/**
* Gets or sets the color to use the text of the buttons in the group when type is flat.
*/
get flatItemTextColor() {
return brushToString(this.i.hi);
}
set flatItemTextColor(v) {
this.i.hi = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the text of the buttons in the group when type is flat.
*/
get flatItemDisabledTextColor() {
return brushToString(this.i.hf);
}
set flatItemDisabledTextColor(v) {
this.i.hf = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered background of the buttons in the group when type is flat.
*/
get flatItemHoverBackgroundColor() {
return brushToString(this.i.hg);
}
set flatItemHoverBackgroundColor(v) {
this.i.hg = stringToBrush(v);
}
/**
* Gets or sets the color to use the border of the buttons in the group when type is flat.
*/
get flatItemBorderColor() {
return brushToString(this.i.hc);
}
set flatItemBorderColor(v) {
this.i.hc = stringToBrush(v);
}
/**
* Gets or sets the disabled color to use the border of the buttons in the group when type is flat.
*/
get flatItemDisabledBorderColor() {
return brushToString(this.i.he);
}
set flatItemDisabledBorderColor(v) {
this.i.he = stringToBrush(v);
}
/**
* Gets or sets the border width to use for the buttons in the group when type is flat.
*/
get flatItemBorderWidth() {
return this.i.ay;
}
set flatItemBorderWidth(v) {
this.i.ay = +v;
}
/**
* Gets or sets the color to use the hovered text of the buttons in the group when type is flat.
*/
get flatItemHoverTextColor() {
return brushToString(this.i.hh);
}
set flatItemHoverTextColor(v) {
this.i.hh = stringToBrush(v);
}
/**
* Gets or sets the color to use the background of the buttons in the group that are selected when type is flat.
*/
get flatSelectedItemBackgroundColor() {
return brushToString(this.i.hj);
}
set flatSelectedItemBackgroundColor(v) {
this.i.hj = stringToBrush(v);
}
/**
* Gets or sets the color to use the text of the buttons in the group that are selected when type is flat.
*/
get flatSelectedItemTextColor() {
return brushToString(this.i.hm);
}
set flatSelectedItemTextColor(v) {
this.i.hm = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered background of the buttons in the group that are selected when type is flat.
*/
get flatSelectedItemHoverBackgroundColor() {
return brushToString(this.i.hk);
}
set flatSelectedItemHoverBackgroundColor(v) {
this.i.hk = stringToBrush(v);
}
/**
* Gets or sets the color to use the hovered text of the buttons in the group that are selected when type is flat.
*/
get flatSelectedItemHoverTextColor() {
return brushToString(this.i.hl);
}
set flatSelectedItemHoverTextColor(v) {
this.i.hl = stringToBrush(v);
}
/**
* Gets or sets the oreientation to use the button group when type is outlined.
*/
get orientation() {
return this.i.k;
}
set orientation(v) {
this.i.k = ensureEnum(ButtonGroupOrientation_$type, v);
}
/**
* Gets or sets the id to use for the button group.
*/
get id() {
return this.i.b5;
}
set id(v) {
this.i.b5 = v;
}
/**
* Gets or sets whether the checkbox is disabled.
*/
get disabled() {
return this.i.disabled;
}
set disabled(v) {
this.i.disabled = ensureBool(v);
}
/**
* Gets or sets whether the group supports multi-select.
*/
get isMultiSelect() {
return this.i.z;
}
set isMultiSelect(v) {
this.i.z = ensureBool(v);
}
findByName(name) {
if (this.findEphemera) {
if (name && name.indexOf("@@e:") == 0) {
return this.findEphemera(name);
}
}
if (this.buttons != null && this.buttons.findByName && this.buttons.findByName(name)) {
return this.buttons.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("XButtonGroupComponent");
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();
}
/**
* Exports visual information about the current state of the grid.
*/
exportVisualModel() {
let iv = this.i.a5();
return (iv);
}
/**
* Returns a serialized copy of the exported visual model
*/
exportSerializedVisualModel() {
let iv = this.i.bq();
return (iv);
}
get selectionChanged() {
if (this._selectionChanged == null) {
this._selectionChanged = new EventEmitter();
this.i.selectionChanged = delegateCombine(this.i.selectionChanged, (o, e) => {
this._runInZone(() => {
let outerArgs = new IgxButtonGroupSelectionChangedEventArgs();
outerArgs._provideImplementation(e);
if (this.beforeSelectionChanged) {
this.beforeSelectionChanged(this, outerArgs);
}
this._selectionChanged.emit({
sender: this,
args: outerArgs
});
});
});
}
return this._selectionChanged;
}
_runInZone(act) {
if (this._zoneRunner != null) {
this._zoneRunner(act);
}
else {
act();
}
}
}
IgxXButtonGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXButtonGroupComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i0.Injector }, { token: i0.ComponentFactoryResolver }], target: i0.ɵɵFactoryTarget.Component });
IgxXButtonGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxXButtonGroupComponent, selector: "igx-x-button-group", inputs: { displayType: "displayType", baseTheme: "baseTheme", density: "density", actualDensity: "actualDensity", selectedIndices: "selectedIndices", actualItemCornerRadius: "actualItemCornerRadius", actualItemBackgroundColor: "actualItemBackgroundColor", actualItemDisabledBackgroundColor: "actualItemDisabledBackgroundColor", actualItemTextColor: "actualItemTextColor", actualItemDisabledTextColor: "actualItemDisabledTextColor", actualItemBorderColor: "actualItemBorderColor", actualItemDisabledBorderColor: "actualItemDisabledBorderColor", actualItemBorderWidth: "actualItemBorderWidth", actualSelectedItemBackgroundColor: "actualSelectedItemBackgroundColor", actualSelectedItemTextColor: "actualSelectedItemTextColor", actualItemHoverBackgroundColor: "actualItemHoverBackgroundColor", actualItemHoverTextColor: "actualItemHoverTextColor", actualSelectedItemHoverBackgroundColor: "actualSelectedItemHoverBackgroundColor", actualSelectedItemHoverTextColor: "actualSelectedItemHoverTextColor", itemCornerRadius: "itemCornerRadius", itemBackgroundColor: "itemBackgroundColor", itemDisabledBackgroundColor: "itemDisabledBackgroundColor", itemTextColor: "itemTextColor", itemDisabledTextColor: "itemDisabledTextColor", itemHoverBackgroundColor: "itemHoverBackgroundColor", itemBorderColor: "itemBorderColor", itemDisabledBorderColor: "itemDisabledBorderColor", itemBorderWidth: "itemBorderWidth", itemHoverTextColor: "itemHoverTextColor", selectedItemBackgroundColor: "selectedItemBackgroundColor", selectedItemTextColor: "selectedItemTextColor", selectedItemHoverBackgroundColor: "selectedItemHoverBackgroundColor", selectedItemHoverTextColor: "selectedItemHoverTextColor", outlinedItemCornerRadius: "outlinedItemCornerRadius", outlinedItemBackgroundColor: "outlinedItemBackgroundColor", outlinedItemDisabledBackgroundColor: "outlinedItemDisabledBackgroundColor", outlinedItemTextColor: "outlinedItemTextColor", outlinedItemDisabledTextColor: "outlinedItemDisabledTextColor", outlinedItemHoverBackgroundColor: "outlinedItemHoverBackgroundColor", outlinedItemBorderColor: "outlinedItemBorderColor", outlinedItemDisabledBorderColor: "outlinedItemDisabledBorderColor", outlinedItemBorderWidth: "outlinedItemBorderWidth", outlinedItemHoverTextColor: "outlinedItemHoverTextColor", outlinedSelectedItemBackgroundColor: "outlinedSelectedItemBackgroundColor", outlinedSelectedItemTextColor: "outlinedSelectedItemTextColor", outlinedSelectedItemHoverBackgroundColor: "outlinedSelectedItemHoverBackgroundColor", outlinedSelectedItemHoverTextColor: "outlinedSelectedItemHoverTextColor", flatItemCornerRadius: "flatItemCornerRadius", flatItemBackgroundColor: "flatItemBackgroundColor", flatItemDisabledBackgroundColor: "flatItemDisabledBackgroundColor", flatItemTextColor: "flatItemTextColor", flatItemDisabledTextColor: "flatItemDisabledTextColor", flatItemHoverBackgroundColor: "flatItemHoverBackgroundColor", flatItemBorderColor: "flatItemBorderColor", flatItemDisabledBorderColor: "flatItemDisabledBorderColor", flatItemBorderWidth: "flatItemBorderWidth", flatItemHoverTextColor: "flatItemHoverTextColor", flatSelectedItemBackgroundColor: "flatSelectedItemBackgroundColor", flatSelectedItemTextColor: "flatSelectedItemTextColor", flatSelectedItemHoverBackgroundColor: "flatSelectedItemHoverBackgroundColor", flatSelectedItemHoverTextColor: "flatSelectedItemHoverTextColor", orientation: "orientation", id: "id", disabled: "disabled", isMultiSelect: "isMultiSelect" }, outputs: { selectionChanged: "selectionChanged" }, host: { properties: { "attr.id": "this.id" }, classAttribute: "ig-x-button-group igx-x-button-group" }, providers: [], queries: [{ propertyName: "contentButtons", predicate: IgxXButtonComponent }], viewQueries: [{ propertyName: "_dynamicContent", first: true, predicate: ["dynamicContent"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "_childTemplateRef", first: true, predicate: ["childContent"], descendants: true, read: TemplateRef }], ngImport: i0, template: `<ng-template #childContent><ng-content></ng-content></ng-template>
<ng-container #dynamicContent></ng-container>`, isInline: true, styles: ["\n\t\t:host {\n\t\t\tdisplay: inline-block; \n\t\t}\n\t"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
return IgxXButtonGroupComponent;
})();
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxXButtonGroupComponent, decorators: [{
type: Component,
args: [{
selector: 'igx-x-button-group',
template: `<ng-template #childContent><ng-content></ng-content></ng-template>
<ng-container #dynamicContent></ng-container>`,
changeDetection: ChangeDetectionStrategy.OnPush,
providers: [],
host: { 'class': 'ig-x-button-group igx-x-button-group' },
styles: [`
:host {
display: inline-block;
}
`]
}]
}], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i0.Injector }, { type: i0.ComponentFactoryResolver }]; }, propDecorators: { _dynamicContent: [{
type: ViewChild,
args: ["dynamicContent", { read: ViewContainerRef, static: true }]
}], _childTemplateRef: [{
type: ViewChild,
args: ["childContent", { read: TemplateRef, static: false }]
}], contentButtons: [{
type: ContentChildren,
args: [IgxXButtonComponent]
}], displayType: [{
type: Input
}], baseTheme: [{
type: Input
}], density: [{
type: Input
}], actualDensity: [{
type: Input
}], selectedIndices: [{
type: Input
}], actualItemCornerRadius: [{
type: Input
}], actualItemBackgroundColor: [{
type: Input
}], actualItemDisabledBackgroundColor: [{
type: Input
}], actualItemTextColor: [{
type: Input
}], actualItemDisabledTextColor: [{
type: Input
}], actualItemBorderColor: [{
type: Input
}], actualItemDisabledBorderColor: [{
type: Input
}], actualItemBorderWidth: [{
type: Input
}], actualSelectedItemBackgroundColor: [{
type: Input
}], actualSelectedItemTextColor: [{
type: Input
}], actualItemHoverBackgroundColor: [{
type: Input
}], actualItemHoverTextColor: [{
type: Input
}], actualSelectedItemHoverBackgroundColor: [{
type: Input
}], actualSelectedItemHoverTextColor: [{
type: Input
}], itemCornerRadius: [{
type: Input
}], itemBackgroundColor: [{
type: Input
}], itemDisabledBackgroundColor: [{
type: Input
}], itemTextColor: [{
type: Input
}], itemDisabledTextColor: [{
type: Input
}], itemHoverBackgroundColor: [{
type: Input
}], itemBorderColor: [{
type: Input
}], itemDisabledBorderColor: [{
type: Input
}], itemBorderWidth: [{
type: Input
}], itemHoverTextColor: [{
type: Input
}], selectedItemBackgroundColor: [{
type: Input
}], selectedItemTextColor: [{
type: Input
}], selectedItemHoverBackgroundColor: [{
type: Input
}], selectedItemHoverTextColor: [{
type: Input
}], outlinedItemCornerRadius: [{
type: Input
}], outlinedItemBackgroundColor: [{
type: Input
}], outlinedItemDisabledBackgroundColor: [{
type: Input
}], outlinedItemTextColor: [{
type: Input
}], outlinedItemDisabledTextColor: [{
type: Input
}], outlinedItemHoverBackgroundColor: [{
type: Input
}], outlinedItemBorderColor: [{
type: Input
}], outlinedItemDisabledBorderColor: [{
type: Input
}], outlinedItemBorderWidth: [{
type: Input
}], outlinedItemHoverTextColor: [{
type: Input
}], outlinedSelectedItemBackgroundColor: [{
type: Input
}], outlinedSelectedItemTextColor: [{
type: Input
}], outlinedSelectedItemHoverBackgroundColor: [{
type: Input
}], outlinedSelectedItemHoverTextColor: [{
type: Input
}], flatItemCornerRadius: [{
type: Input
}], flatItemBackgroundColor: [{
type: Input
}], flatItemDisabledBackgroundColor: [{
type: Input
}], flatItemTextColor: [{
type: Input
}], flatItemDisabledTextColor: [{
type: Input
}], flatItemHoverBackgroundColor: [{
type: Input
}], flatItemBorderColor: [{
type: Input
}], flatItemDisabledBorderColor: [{
type: Input
}], flatItemBorderWidth: [{
type: Input
}], flatItemHoverTextColor: [{
type: Input
}], flatSelectedItemBackgroundColor: [{
type: Input
}], flatSelectedItemTextColor: [{
type: Input
}], flatSelectedItemHoverBackgroundColor: [{
type: Input
}], flatSelectedItemHoverTextColor: [{
type: Input
}], orientation: [{
type: Input
}], id: [{
type: HostBinding,
args: ['attr.id']
}, {
type: Input
}], disabled: [{
type: Input
}], isMultiSelect: [{
type: Input
}], selectionChanged: [{
type: Output
}] } });