ng-devui
Version:
DevUI components based on Angular
157 lines (151 loc) • 33.3 kB
JavaScript
import * as i0 from '@angular/core';
import { Pipe, Component, ChangeDetectionStrategy, Input, ViewChild, HostBinding, NgModule } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
class InputGroupPipe {
constructor(render) {
this.render = render;
}
transform(content, defaultTemplate, isEmbed, containerEl, affixEl, style) {
if (isEmbed) {
const inputEl = containerEl?.querySelector('input[dTextInput]');
if (inputEl) {
setTimeout(() => this.render.setStyle(inputEl, style, `${affixEl?.offsetWidth + 4}px`));
}
}
return typeof content === 'string' ? defaultTemplate : content;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupPipe, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Pipe }); }
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: InputGroupPipe, name: "dInputGroupPipe" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupPipe, decorators: [{
type: Pipe,
args: [{
name: 'dInputGroupPipe',
}]
}], ctorParameters: () => [{ type: i0.Renderer2 }] });
class InputGroupComponent {
get embed() {
return this.isEmbed;
}
constructor(cdr, el, render) {
this.cdr = cdr;
this.el = el;
this.render = render;
this.isEmbed = false;
this.disabled = false;
this.spliceType = 'standalone';
this.isPrefix = false;
this.isSuffix = false;
this.innerContentClass = '';
this.handlerSpliceStatus = () => {
const rect = this.el.nativeElement.getBoundingClientRect();
const previous = this.checkIsInputGroup(this.el.nativeElement.previousElementSibling);
const next = this.checkIsInputGroup(this.el.nativeElement.nextElementSibling);
this.spliceLeft(previous, rect);
this.spliceRight(next, rect);
this.setInnerContentBorderRadius();
};
}
ngAfterViewInit() {
if (this.el.nativeElement.parentElement && !this.isEmbed) {
this.parent = this.el.nativeElement.parentElement;
this.handlerSpliceStatus();
// 监听父容器尺寸变化刷新拼接效果
this.resizeObserver = new window.ResizeObserver(() => this.handlerSpliceStatus());
this.resizeObserver.observe(this.parent);
}
}
ngOnDestroy() {
if (this.resizeObserver) {
this.resizeObserver.unobserve(this.parent);
}
}
checkIsInputGroup(dom) {
return dom?.nodeName === 'D-INPUT-GROUP' && dom;
}
spliceLeft(previous, rect) {
if (previous && ['left', 'both'].includes(this.spliceType)) {
const previousRect = previous.getBoundingClientRect();
this.isPrefix = rect.left > previousRect.left;
if (this.isPrefix) {
this.render.addClass(this.el.nativeElement, 'devui-splice-left-item');
return;
}
}
this.render.removeClass(this.el.nativeElement, 'devui-splice-left-item');
}
spliceRight(next, rect) {
if (next && ['right', 'both'].includes(this.spliceType)) {
const nextRect = next.getBoundingClientRect();
this.isSuffix = nextRect.left > rect.left;
if (this.isSuffix) {
this.render.addClass(this.el.nativeElement, 'devui-splice-right-item');
return;
}
}
this.render.removeClass(this.el.nativeElement, 'devui-splice-right-item');
}
setInnerContentBorderRadius() {
const isPrefix = this.isPrefix || this.prefixContent;
const isSuffix = this.isSuffix || this.suffixContent;
const prefix = isPrefix && 'prefix';
const suffix = isSuffix && 'suffix';
this.innerContentClass = isPrefix && isSuffix ? 'both' : prefix || suffix || '';
this.cdr.markForCheck();
}
changeInputPadding(pos, style) {
if (this.isEmbed && this.container) {
const dom = this.container.nativeElement.querySelector('input[dTextInput]');
if (!dom) {
return;
}
if (['right', 'both'].includes(pos)) {
this.render.setStyle(dom, 'padding-right', style);
}
if (['left', 'both'].includes(pos)) {
this.render.setStyle(dom, 'padding-left', style);
}
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: InputGroupComponent, selector: "d-input-group", inputs: { isEmbed: "isEmbed", disabled: "disabled", prefixContent: "prefixContent", suffixContent: "suffixContent", spliceType: "spliceType" }, host: { properties: { "class.embed": "this.embed" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<div class=\"devui-input-group-container\" [class.disabled]=\"isEmbed && disabled\">\n <span #prefix *ngIf=\"prefixContent\" class=\"devui-input-group-item prefix\">\n <ng-template\n [ngTemplateOutlet]=\"prefixContent | dInputGroupPipe : defaultInputGroupTemplate : isEmbed : container : prefix : 'padding-left'\"\n [ngTemplateOutletContext]=\"{ content: prefixContent, disabled: disabled }\"\n ></ng-template>\n </span>\n <span #container class=\"devui-input-group-content {{ innerContentClass }}\">\n <ng-content></ng-content>\n </span>\n <span #suffix *ngIf=\"suffixContent\" class=\"devui-input-group-item suffix\">\n <ng-template\n [ngTemplateOutlet]=\"suffixContent | dInputGroupPipe : defaultInputGroupTemplate : isEmbed : container : suffix : 'padding-right'\"\n [ngTemplateOutletContext]=\"{ content: suffixContent, disabled: disabled }\"\n ></ng-template>\n </span>\n</div>\n\n<ng-template #defaultInputGroupTemplate let-content=\"content\">\n <span>{{ content }}</span>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}:host .devui-input-group-container{display:flex;align-items:stretch}:host .devui-input-group-container .devui-input-group-item{padding:4px 8px;width:fit-content;border:1px solid var(--devui-form-control-line, #dbdbdb);border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-gray-form-control-bg, #f5f5f5);white-space:nowrap;display:flex;align-items:center}:host .devui-input-group-container .devui-input-group-item:has(+.devui-input-group-content:not(:empty)).prefix{border-top-right-radius:0;border-bottom-right-radius:0;border-right:none}:host .devui-input-group-container .devui-input-group-content:not(:empty)+.devui-input-group-item.suffix{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}:host:not([class*=devui-splice-]){margin-right:8px}:host.devui-splice-left-item .devui-input-group-item.prefix{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}:host.devui-splice-left-item ::ng-deep [dTextInput],:host.devui-splice-left-item ::ng-deep d-select{margin-right:-1px}:host.devui-splice-left-item ::ng-deep [dTextInput],:host.devui-splice-left-item ::ng-deep [dTextInput]>div.devui-dropdown-origin,:host.devui-splice-left-item ::ng-deep d-select,:host.devui-splice-left-item ::ng-deep d-select>div.devui-dropdown-origin{border-radius:0!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:first-child,:host.devui-splice-left-item ::ng-deep d-select:first-child{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:first-child>div.devui-dropdown-origin,:host.devui-splice-left-item ::ng-deep d-select:first-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:last-child,:host.devui-splice-left-item ::ng-deep d-select:last-child{margin-right:0;border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:last-child>div.devui-dropdown-origin,:host.devui-splice-left-item ::ng-deep d-select:last-child>div.devui-dropdown-origin{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-left-item ::ng-deep [dTextInput]{z-index:0}:host.devui-splice-left-item ::ng-deep [dTextInput]:hover{z-index:1}:host.devui-splice-left-item ::ng-deep [dTextInput]:focus,:host.devui-splice-left-item ::ng-deep [dTextInput]:has(:focus){z-index:2}:host.devui-splice-right-item .devui-input-group-item.suffix{border-top-right-radius:0;border-bottom-right-radius:0;border-right:none}:host.devui-splice-right-item ::ng-deep [dTextInput],:host.devui-splice-right-item ::ng-deep d-select{margin-right:-1px}:host.devui-splice-right-item ::ng-deep [dTextInput],:host.devui-splice-right-item ::ng-deep [dTextInput]>div.devui-dropdown-origin,:host.devui-splice-right-item ::ng-deep d-select,:host.devui-splice-right-item ::ng-deep d-select>div.devui-dropdown-origin{border-radius:0!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:first-child,:host.devui-splice-right-item ::ng-deep d-select:first-child{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:first-child>div.devui-dropdown-origin,:host.devui-splice-right-item ::ng-deep d-select:first-child>div.devui-dropdown-origin{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:last-child,:host.devui-splice-right-item ::ng-deep d-select:last-child{margin-right:0;border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:last-child>div.devui-dropdown-origin,:host.devui-splice-right-item ::ng-deep d-select:last-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-right-item ::ng-deep [dTextInput]{z-index:0}:host.devui-splice-right-item ::ng-deep [dTextInput]:hover{z-index:1}:host.devui-splice-right-item ::ng-deep [dTextInput]:focus,:host.devui-splice-right-item ::ng-deep [dTextInput]:has(:focus){z-index:2}:host ::ng-deep span.devui-input-group-content{display:flex;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap}:host ::ng-deep span.devui-input-group-content.both [dTextInput],:host ::ng-deep span.devui-input-group-content.both d-select{margin-right:-1px}:host ::ng-deep span.devui-input-group-content.both [dTextInput],:host ::ng-deep span.devui-input-group-content.both [dTextInput]>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.both d-select,:host ::ng-deep span.devui-input-group-content.both d-select>div.devui-dropdown-origin{border-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:first-child,:host ::ng-deep span.devui-input-group-content.both d-select:first-child{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:first-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.both d-select:first-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:last-child,:host ::ng-deep span.devui-input-group-content.both d-select:last-child{margin-right:0;border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:last-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.both d-select:last-child>div.devui-dropdown-origin{border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]{z-index:0}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:hover{z-index:1}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:focus,:host ::ng-deep span.devui-input-group-content.both [dTextInput]:has(:focus){z-index:2}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput],:host ::ng-deep span.devui-input-group-content.prefix d-select{margin-right:-1px}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput],:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.prefix d-select,:host ::ng-deep span.devui-input-group-content.prefix d-select>div.devui-dropdown-origin{border-radius:0!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:first-child,:host ::ng-deep span.devui-input-group-content.prefix d-select:first-child{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:first-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.prefix d-select:first-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:last-child,:host ::ng-deep span.devui-input-group-content.prefix d-select:last-child{margin-right:0;border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:last-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.prefix d-select:last-child>div.devui-dropdown-origin{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]{z-index:0}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:hover{z-index:1}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:focus,:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:has(:focus){z-index:2}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput],:host ::ng-deep span.devui-input-group-content.suffix d-select{margin-right:-1px}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput],:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.suffix d-select,:host ::ng-deep span.devui-input-group-content.suffix d-select>div.devui-dropdown-origin{border-radius:0!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:first-child,:host ::ng-deep span.devui-input-group-content.suffix d-select:first-child{border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:first-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.suffix d-select:first-child>div.devui-dropdown-origin{border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:last-child,:host ::ng-deep span.devui-input-group-content.suffix d-select:last-child{margin-right:0;border-top-left-radius:var(--devui-border-radius, 2px)!important;border-bottom-left-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:last-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.suffix d-select:last-child>div.devui-dropdown-origin{border-top-left-radius:var(--devui-border-radius, 2px)!important;border-bottom-left-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]{z-index:0}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:hover{z-index:1}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:focus,:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:has(:focus){z-index:2}:host.embed .devui-input-group-container .devui-input-group-item{height:100%;position:absolute;border:none;background:transparent}:host.embed .devui-input-group-container .devui-input-group-item.prefix{left:0}:host.embed .devui-input-group-container .devui-input-group-item.suffix{right:0}:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content [dTextInput],:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content d-select>div{border-top-left-radius:var(--devui-border-radius, 2px)!important;border-bottom-left-radius:var(--devui-border-radius, 2px)!important}:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content [dTextInput],:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content d-select>div{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.embed:not(.disabled) ::ng-deep:hover input[dTextInput]{border-color:var(--devui-form-control-line-hover, #808080);box-shadow:0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08))}:host.embed:not(.disabled) ::ng-deep:has(:focus) input[dTextInput]{border-color:var(--devui-form-control-line-active, #0a59f7)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: InputGroupPipe, name: "dInputGroupPipe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupComponent, decorators: [{
type: Component,
args: [{ selector: 'd-input-group', changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<div class=\"devui-input-group-container\" [class.disabled]=\"isEmbed && disabled\">\n <span #prefix *ngIf=\"prefixContent\" class=\"devui-input-group-item prefix\">\n <ng-template\n [ngTemplateOutlet]=\"prefixContent | dInputGroupPipe : defaultInputGroupTemplate : isEmbed : container : prefix : 'padding-left'\"\n [ngTemplateOutletContext]=\"{ content: prefixContent, disabled: disabled }\"\n ></ng-template>\n </span>\n <span #container class=\"devui-input-group-content {{ innerContentClass }}\">\n <ng-content></ng-content>\n </span>\n <span #suffix *ngIf=\"suffixContent\" class=\"devui-input-group-item suffix\">\n <ng-template\n [ngTemplateOutlet]=\"suffixContent | dInputGroupPipe : defaultInputGroupTemplate : isEmbed : container : suffix : 'padding-right'\"\n [ngTemplateOutletContext]=\"{ content: suffixContent, disabled: disabled }\"\n ></ng-template>\n </span>\n</div>\n\n<ng-template #defaultInputGroupTemplate let-content=\"content\">\n <span>{{ content }}</span>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}:host .devui-input-group-container{display:flex;align-items:stretch}:host .devui-input-group-container .devui-input-group-item{padding:4px 8px;width:fit-content;border:1px solid var(--devui-form-control-line, #dbdbdb);border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-gray-form-control-bg, #f5f5f5);white-space:nowrap;display:flex;align-items:center}:host .devui-input-group-container .devui-input-group-item:has(+.devui-input-group-content:not(:empty)).prefix{border-top-right-radius:0;border-bottom-right-radius:0;border-right:none}:host .devui-input-group-container .devui-input-group-content:not(:empty)+.devui-input-group-item.suffix{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}:host:not([class*=devui-splice-]){margin-right:8px}:host.devui-splice-left-item .devui-input-group-item.prefix{border-top-left-radius:0;border-bottom-left-radius:0;border-left:none}:host.devui-splice-left-item ::ng-deep [dTextInput],:host.devui-splice-left-item ::ng-deep d-select{margin-right:-1px}:host.devui-splice-left-item ::ng-deep [dTextInput],:host.devui-splice-left-item ::ng-deep [dTextInput]>div.devui-dropdown-origin,:host.devui-splice-left-item ::ng-deep d-select,:host.devui-splice-left-item ::ng-deep d-select>div.devui-dropdown-origin{border-radius:0!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:first-child,:host.devui-splice-left-item ::ng-deep d-select:first-child{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:first-child>div.devui-dropdown-origin,:host.devui-splice-left-item ::ng-deep d-select:first-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:last-child,:host.devui-splice-left-item ::ng-deep d-select:last-child{margin-right:0;border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-left-item ::ng-deep [dTextInput]:last-child>div.devui-dropdown-origin,:host.devui-splice-left-item ::ng-deep d-select:last-child>div.devui-dropdown-origin{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-left-item ::ng-deep [dTextInput]{z-index:0}:host.devui-splice-left-item ::ng-deep [dTextInput]:hover{z-index:1}:host.devui-splice-left-item ::ng-deep [dTextInput]:focus,:host.devui-splice-left-item ::ng-deep [dTextInput]:has(:focus){z-index:2}:host.devui-splice-right-item .devui-input-group-item.suffix{border-top-right-radius:0;border-bottom-right-radius:0;border-right:none}:host.devui-splice-right-item ::ng-deep [dTextInput],:host.devui-splice-right-item ::ng-deep d-select{margin-right:-1px}:host.devui-splice-right-item ::ng-deep [dTextInput],:host.devui-splice-right-item ::ng-deep [dTextInput]>div.devui-dropdown-origin,:host.devui-splice-right-item ::ng-deep d-select,:host.devui-splice-right-item ::ng-deep d-select>div.devui-dropdown-origin{border-radius:0!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:first-child,:host.devui-splice-right-item ::ng-deep d-select:first-child{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:first-child>div.devui-dropdown-origin,:host.devui-splice-right-item ::ng-deep d-select:first-child>div.devui-dropdown-origin{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:last-child,:host.devui-splice-right-item ::ng-deep d-select:last-child{margin-right:0;border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-right-item ::ng-deep [dTextInput]:last-child>div.devui-dropdown-origin,:host.devui-splice-right-item ::ng-deep d-select:last-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host.devui-splice-right-item ::ng-deep [dTextInput]{z-index:0}:host.devui-splice-right-item ::ng-deep [dTextInput]:hover{z-index:1}:host.devui-splice-right-item ::ng-deep [dTextInput]:focus,:host.devui-splice-right-item ::ng-deep [dTextInput]:has(:focus){z-index:2}:host ::ng-deep span.devui-input-group-content{display:flex;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap}:host ::ng-deep span.devui-input-group-content.both [dTextInput],:host ::ng-deep span.devui-input-group-content.both d-select{margin-right:-1px}:host ::ng-deep span.devui-input-group-content.both [dTextInput],:host ::ng-deep span.devui-input-group-content.both [dTextInput]>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.both d-select,:host ::ng-deep span.devui-input-group-content.both d-select>div.devui-dropdown-origin{border-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:first-child,:host ::ng-deep span.devui-input-group-content.both d-select:first-child{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:first-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.both d-select:first-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:last-child,:host ::ng-deep span.devui-input-group-content.both d-select:last-child{margin-right:0;border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:last-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.both d-select:last-child>div.devui-dropdown-origin{border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.both [dTextInput]{z-index:0}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:hover{z-index:1}:host ::ng-deep span.devui-input-group-content.both [dTextInput]:focus,:host ::ng-deep span.devui-input-group-content.both [dTextInput]:has(:focus){z-index:2}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput],:host ::ng-deep span.devui-input-group-content.prefix d-select{margin-right:-1px}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput],:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.prefix d-select,:host ::ng-deep span.devui-input-group-content.prefix d-select>div.devui-dropdown-origin{border-radius:0!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:first-child,:host ::ng-deep span.devui-input-group-content.prefix d-select:first-child{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:first-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.prefix d-select:first-child>div.devui-dropdown-origin{border-top-left-radius:0!important;border-bottom-left-radius:0!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:last-child,:host ::ng-deep span.devui-input-group-content.prefix d-select:last-child{margin-right:0;border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:last-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.prefix d-select:last-child>div.devui-dropdown-origin{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]{z-index:0}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:hover{z-index:1}:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:focus,:host ::ng-deep span.devui-input-group-content.prefix [dTextInput]:has(:focus){z-index:2}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput],:host ::ng-deep span.devui-input-group-content.suffix d-select{margin-right:-1px}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput],:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.suffix d-select,:host ::ng-deep span.devui-input-group-content.suffix d-select>div.devui-dropdown-origin{border-radius:0!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:first-child,:host ::ng-deep span.devui-input-group-content.suffix d-select:first-child{border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:first-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.suffix d-select:first-child>div.devui-dropdown-origin{border-top-right-radius:0!important;border-bottom-right-radius:0!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:last-child,:host ::ng-deep span.devui-input-group-content.suffix d-select:last-child{margin-right:0;border-top-left-radius:var(--devui-border-radius, 2px)!important;border-bottom-left-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:last-child>div.devui-dropdown-origin,:host ::ng-deep span.devui-input-group-content.suffix d-select:last-child>div.devui-dropdown-origin{border-top-left-radius:var(--devui-border-radius, 2px)!important;border-bottom-left-radius:var(--devui-border-radius, 2px)!important}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]{z-index:0}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:hover{z-index:1}:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:focus,:host ::ng-deep span.devui-input-group-content.suffix [dTextInput]:has(:focus){z-index:2}:host.embed .devui-input-group-container .devui-input-group-item{height:100%;position:absolute;border:none;background:transparent}:host.embed .devui-input-group-container .devui-input-group-item.prefix{left:0}:host.embed .devui-input-group-container .devui-input-group-item.suffix{right:0}:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content [dTextInput],:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content d-select>div{border-top-left-radius:var(--devui-border-radius, 2px)!important;border-bottom-left-radius:var(--devui-border-radius, 2px)!important}:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content [dTextInput],:host.embed .devui-input-group-container ::ng-deep span.devui-input-group-content d-select>div{border-top-right-radius:var(--devui-border-radius, 2px)!important;border-bottom-right-radius:var(--devui-border-radius, 2px)!important}:host.embed:not(.disabled) ::ng-deep:hover input[dTextInput]{border-color:var(--devui-form-control-line-hover, #808080);box-shadow:0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08))}:host.embed:not(.disabled) ::ng-deep:has(:focus) input[dTextInput]{border-color:var(--devui-form-control-line-active, #0a59f7)}\n"] }]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { isEmbed: [{
type: Input
}], disabled: [{
type: Input
}], prefixContent: [{
type: Input
}], suffixContent: [{
type: Input
}], spliceType: [{
type: Input
}], container: [{
type: ViewChild,
args: ['container']
}], embed: [{
type: HostBinding,
args: ['class.embed']
}] } });
class InputGroupModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: InputGroupModule, declarations: [InputGroupComponent, InputGroupPipe], imports: [CommonModule], exports: [InputGroupComponent, InputGroupPipe] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupModule, imports: [CommonModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputGroupModule, decorators: [{
type: NgModule,
args: [{
imports: [CommonModule],
declarations: [InputGroupComponent, InputGroupPipe],
exports: [InputGroupComponent, InputGroupPipe],
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { InputGroupComponent, InputGroupModule, InputGroupPipe };
//# sourceMappingURL=ng-devui-input-group.mjs.map