@alauda/ui 6.3.1 → 6.3.3-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/accordion/accordion-item/accordion-item.component.mjs +3 -3
- package/esm2020/accordion/accordion.component.mjs +2 -2
- package/esm2020/anchor/anchor.component.mjs +3 -3
- package/esm2020/autocomplete/autocomplete.component.mjs +2 -2
- package/esm2020/autocomplete/suggestion/suggestion.component.mjs +2 -2
- package/esm2020/autocomplete/suggestion-group/suggestion-group.component.mjs +2 -2
- package/esm2020/back-top/back-top.component.mjs +2 -2
- package/esm2020/breadcrumb/breadcrumb-item.component.mjs +2 -2
- package/esm2020/breadcrumb/breadcrumb.component.mjs +2 -2
- package/esm2020/button/button-group/button-group.component.mjs +2 -2
- package/esm2020/button/button.component.mjs +2 -2
- package/esm2020/card/card.component.mjs +2 -2
- package/esm2020/card/section.component.mjs +2 -2
- package/esm2020/checkbox/checkbox.component.mjs +2 -2
- package/esm2020/color-picker/color-picker.component.mjs +2 -2
- package/esm2020/date-picker/calendar/date-picker-panel/component.mjs +2 -2
- package/esm2020/date-picker/calendar/footer/component.mjs +2 -2
- package/esm2020/date-picker/calendar/header/component.mjs +2 -2
- package/esm2020/date-picker/calendar/panel/picker-panel.mjs +2 -2
- package/esm2020/date-picker/calendar/range-picker-panel/component.mjs +2 -2
- package/esm2020/date-picker/trigger/trigger.component.mjs +2 -2
- package/esm2020/dialog/confirm-dialog/confirm-dialog.component.mjs +2 -2
- package/esm2020/dialog/dialog.component.mjs +2 -2
- package/esm2020/drawer/component/drawer.component.mjs +2 -2
- package/esm2020/dropdown/dropdown-button/dropdown-button.component.mjs +2 -2
- package/esm2020/dropdown/menu/menu.component.mjs +2 -2
- package/esm2020/dropdown/menu-group/menu-group.component.mjs +2 -2
- package/esm2020/dropdown/menu-item/menu-item.component.mjs +2 -2
- package/esm2020/dropdown/submenu/submenu.component.mjs +2 -2
- package/esm2020/form/form-item/form-item.component.mjs +2 -2
- package/esm2020/icon/icon.component.mjs +2 -2
- package/esm2020/inline-alert/inline-alert.component.mjs +2 -2
- package/esm2020/input/input-group/input-group.component.mjs +2 -2
- package/esm2020/input/input.component.mjs +2 -2
- package/esm2020/input/number-input/number-input.component.mjs +2 -2
- package/esm2020/input/search/search.component.mjs +2 -2
- package/esm2020/input/tags-input/tags-input.component.mjs +2 -2
- package/esm2020/message/message-wrapper.component.mjs +2 -2
- package/esm2020/message/message.component.mjs +3 -3
- package/esm2020/notification/notification-wrapper.component.mjs +2 -2
- package/esm2020/notification/notification.component.mjs +3 -3
- package/esm2020/paginator/paginator.component.mjs +2 -2
- package/esm2020/radio/radio-button/radio-button.component.mjs +2 -2
- package/esm2020/radio/radio.component.mjs +2 -2
- package/esm2020/select/multi-select/multi-select.component.mjs +2 -2
- package/esm2020/select/option/option.component.mjs +2 -2
- package/esm2020/select/option-group/option-group.component.mjs +2 -2
- package/esm2020/select/select.component.mjs +2 -2
- package/esm2020/sort/sort-header.component.mjs +2 -2
- package/esm2020/status-bar/status-bar.component.mjs +2 -2
- package/esm2020/steps/steps.component.mjs +2 -2
- package/esm2020/switch/switch.component.mjs +2 -2
- package/esm2020/table/table.component.mjs +2 -2
- package/esm2020/tabs/tab-group.component.mjs +2 -2
- package/esm2020/tabs/tab-header.component.mjs +2 -2
- package/esm2020/tag/check-tag/check-tag.component.mjs +2 -2
- package/esm2020/tag/tag.component.mjs +2 -2
- package/esm2020/time-picker/component.mjs +2 -2
- package/esm2020/time-picker/panel/panel.component.mjs +2 -2
- package/esm2020/tooltip/tooltip.component.mjs +2 -2
- package/esm2020/tree-select/tree-select.component.mjs +5 -5
- package/fesm2015/alauda-ui.mjs +124 -124
- package/fesm2015/alauda-ui.mjs.map +1 -1
- package/fesm2020/alauda-ui.mjs +124 -124
- package/fesm2020/alauda-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/theme/_base-var.scss +1 -112
- package/theme/_mixin.scss +5 -5
- package/theme/_var.scss +23 -295
- package/theme/style.css +0 -16
|
@@ -66,10 +66,10 @@ export class FormItemComponent {
|
|
|
66
66
|
}
|
|
67
67
|
}
|
|
68
68
|
FormItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: FormItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.FormDirective, optional: true }, { token: i2.NgForm, optional: true }, { token: i2.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
69
|
-
FormItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: FormItemComponent, selector: "aui-form-item", inputs: { labelWidth: "labelWidth", width: "width", labelPosition: "labelPosition", emptyAddon: "emptyAddon" }, queries: [{ propertyName: "itemLabel", first: true, predicate: FormItemLabelDirective, descendants: true }, { propertyName: "itemControl", first: true, predicate: FormItemControlDirective, descendants: true }, { propertyName: "ngControls", predicate: NgControl, descendants: true }, { propertyName: "addons", predicate: FormItemAddonDirective }, { propertyName: "errors", predicate: FormItemErrorDirective }, { propertyName: "hints", predicate: FormItemHintDirective }], ngImport: i0, template: "<div [class]=\"bem.block(labelPosition)\" [class.hasError]=\"hasError$ | async\">\n <div\n [ngClass]=\"\n bem.element(\n 'label-wrapper',\n { required: !!itemControl?.required },\n labelPosition\n )\n \"\n [class.hasLabel]=\"!!itemLabel\"\n [style.width]=\"labelWidth\"\n >\n <ng-content select=\"label[auiFormItemLabel]\"></ng-content>\n </div>\n <div class=\"aui-form-item__container\">\n <div class=\"aui-form-item__content\" [ngClass]=\"formItemWidthClass\">\n <ng-content></ng-content>\n <div\n *ngIf=\"emptyAddon || addons?.length\"\n class=\"aui-form-item__addon-wrapper\"\n >\n <ng-content select=\"[auiFormItemAddon]\"></ng-content>\n </div>\n </div>\n <div\n *ngIf=\"(hasError$ | async) && (errorCount$ | async)\"\n class=\"aui-form-item__error-wrapper\"\n >\n <ng-content select=\"[auiFormItemError]\"></ng-content>\n </div>\n <div *ngIf=\"hintCount$ | async\" class=\"aui-form-item__hint-wrapper\">\n <ng-content select=\"[auiFormItemHint]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
69
|
+
FormItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: FormItemComponent, selector: "aui-form-item", inputs: { labelWidth: "labelWidth", width: "width", labelPosition: "labelPosition", emptyAddon: "emptyAddon" }, queries: [{ propertyName: "itemLabel", first: true, predicate: FormItemLabelDirective, descendants: true }, { propertyName: "itemControl", first: true, predicate: FormItemControlDirective, descendants: true }, { propertyName: "ngControls", predicate: NgControl, descendants: true }, { propertyName: "addons", predicate: FormItemAddonDirective }, { propertyName: "errors", predicate: FormItemErrorDirective }, { propertyName: "hints", predicate: FormItemHintDirective }], ngImport: i0, template: "<div [class]=\"bem.block(labelPosition)\" [class.hasError]=\"hasError$ | async\">\n <div\n [ngClass]=\"\n bem.element(\n 'label-wrapper',\n { required: !!itemControl?.required },\n labelPosition\n )\n \"\n [class.hasLabel]=\"!!itemLabel\"\n [style.width]=\"labelWidth\"\n >\n <ng-content select=\"label[auiFormItemLabel]\"></ng-content>\n </div>\n <div class=\"aui-form-item__container\">\n <div class=\"aui-form-item__content\" [ngClass]=\"formItemWidthClass\">\n <ng-content></ng-content>\n <div\n *ngIf=\"emptyAddon || addons?.length\"\n class=\"aui-form-item__addon-wrapper\"\n >\n <ng-content select=\"[auiFormItemAddon]\"></ng-content>\n </div>\n </div>\n <div\n *ngIf=\"(hasError$ | async) && (errorCount$ | async)\"\n class=\"aui-form-item__error-wrapper\"\n >\n <ng-content select=\"[auiFormItemError]\"></ng-content>\n </div>\n <div *ngIf=\"hintCount$ | async\" class=\"aui-form-item__hint-wrapper\">\n <ng-content select=\"[auiFormItemHint]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [".aui-form-item{display:flex;align-items:flex-start;margin-bottom:var(--aui-spacing-xl);color:rgb(var(--aui-color-n-1));font-size:var(--aui-font-size-m)}.aui-form-item--top{flex-direction:column}.aui-form-item--top .aui-form-item__label-wrapper{line-height:var(--aui-line-height-m);margin-bottom:var(--aui-spacing-xs)}.aui-form-item--top .aui-form-item__label-wrapper:after{display:none}.aui-form-item__label-wrapper{display:flex;align-items:center;line-height:var(--aui-inline-height-m);flex-shrink:0;padding-right:var(--aui-spacing-m);overflow:hidden}.aui-form-item__label-wrapper--required .aui-form-item__label:before{content:\"*\";color:rgb(var(--aui-color-red));margin-right:var(--aui-spacing-s)}.aui-form-item__label-wrapper.hasLabel:after{content:\":\";align-self:flex-start;margin-left:var(--aui-spacing-xs);line-height:var(--aui-inline-height-m)}.aui-form-item__label-wrapper--left{justify-content:flex-start}.aui-form-item__label-wrapper--left .aui-form-item__label{text-align:start}.aui-form-item__label-wrapper--right{justify-content:flex-end}.aui-form-item__label-wrapper--right .aui-form-item__label{text-align:end}.aui-form-item__label{display:block;line-height:var(--aui-line-height-s)}.aui-form-item__container{width:100%;min-width:0}.aui-form-item__content{display:flex;align-items:center;min-height:var(--aui-inline-height-m)}.aui-form-item__content--large .aui-form-item__control{flex:1;max-width:var(--aui-form-item-width-l)}.aui-form-item__content--medium .aui-form-item__control{flex:1;max-width:var(--aui-form-item-width-m)}.aui-form-item__content--small .aui-form-item__control{flex:1;max-width:var(--aui-form-item-width-s)}.aui-form-item__content+.aui-form-item__hint-wrapper,.aui-form-item__content+.aui-form-item__error-wrapper{margin-top:var(--aui-spacing-s)}.aui-form-item__hint-wrapper,.aui-form-item__error-wrapper{font-size:var(--aui-font-size-s);line-height:var(--aui-line-height-s)}.aui-form-item__hint-wrapper{color:rgb(var(--aui-color-n-4))}.aui-form-item__error-wrapper{color:rgb(var(--aui-color-red))}.aui-form-item__addon-wrapper{align-self:flex-start;display:flex;align-items:center;flex-shrink:0;box-sizing:content-box;height:var(--aui-inline-height-m);min-width:var(--aui-icon-size-m);padding-left:var(--aui-spacing-m);color:rgb(var(--aui-color-n-4));font-size:var(--aui-font-size-m)}.aui-form-item__addon-wrapper aui-icon{font-size:var(--aui-icon-size-m)}.aui-form--inline{display:flex}.aui-form--inline .aui-form-item{margin-bottom:0;margin-right:var(--aui-spacing-m)}\n"], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i3.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
70
70
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: FormItemComponent, decorators: [{
|
|
71
71
|
type: Component,
|
|
72
|
-
args: [{ selector: 'aui-form-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div [class]=\"bem.block(labelPosition)\" [class.hasError]=\"hasError$ | async\">\n <div\n [ngClass]=\"\n bem.element(\n 'label-wrapper',\n { required: !!itemControl?.required },\n labelPosition\n )\n \"\n [class.hasLabel]=\"!!itemLabel\"\n [style.width]=\"labelWidth\"\n >\n <ng-content select=\"label[auiFormItemLabel]\"></ng-content>\n </div>\n <div class=\"aui-form-item__container\">\n <div class=\"aui-form-item__content\" [ngClass]=\"formItemWidthClass\">\n <ng-content></ng-content>\n <div\n *ngIf=\"emptyAddon || addons?.length\"\n class=\"aui-form-item__addon-wrapper\"\n >\n <ng-content select=\"[auiFormItemAddon]\"></ng-content>\n </div>\n </div>\n <div\n *ngIf=\"(hasError$ | async) && (errorCount$ | async)\"\n class=\"aui-form-item__error-wrapper\"\n >\n <ng-content select=\"[auiFormItemError]\"></ng-content>\n </div>\n <div *ngIf=\"hintCount$ | async\" class=\"aui-form-item__hint-wrapper\">\n <ng-content select=\"[auiFormItemHint]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
72
|
+
args: [{ selector: 'aui-form-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div [class]=\"bem.block(labelPosition)\" [class.hasError]=\"hasError$ | async\">\n <div\n [ngClass]=\"\n bem.element(\n 'label-wrapper',\n { required: !!itemControl?.required },\n labelPosition\n )\n \"\n [class.hasLabel]=\"!!itemLabel\"\n [style.width]=\"labelWidth\"\n >\n <ng-content select=\"label[auiFormItemLabel]\"></ng-content>\n </div>\n <div class=\"aui-form-item__container\">\n <div class=\"aui-form-item__content\" [ngClass]=\"formItemWidthClass\">\n <ng-content></ng-content>\n <div\n *ngIf=\"emptyAddon || addons?.length\"\n class=\"aui-form-item__addon-wrapper\"\n >\n <ng-content select=\"[auiFormItemAddon]\"></ng-content>\n </div>\n </div>\n <div\n *ngIf=\"(hasError$ | async) && (errorCount$ | async)\"\n class=\"aui-form-item__error-wrapper\"\n >\n <ng-content select=\"[auiFormItemError]\"></ng-content>\n </div>\n <div *ngIf=\"hintCount$ | async\" class=\"aui-form-item__hint-wrapper\">\n <ng-content select=\"[auiFormItemHint]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [".aui-form-item{display:flex;align-items:flex-start;margin-bottom:var(--aui-spacing-xl);color:rgb(var(--aui-color-n-1));font-size:var(--aui-font-size-m)}.aui-form-item--top{flex-direction:column}.aui-form-item--top .aui-form-item__label-wrapper{line-height:var(--aui-line-height-m);margin-bottom:var(--aui-spacing-xs)}.aui-form-item--top .aui-form-item__label-wrapper:after{display:none}.aui-form-item__label-wrapper{display:flex;align-items:center;line-height:var(--aui-inline-height-m);flex-shrink:0;padding-right:var(--aui-spacing-m);overflow:hidden}.aui-form-item__label-wrapper--required .aui-form-item__label:before{content:\"*\";color:rgb(var(--aui-color-red));margin-right:var(--aui-spacing-s)}.aui-form-item__label-wrapper.hasLabel:after{content:\":\";align-self:flex-start;margin-left:var(--aui-spacing-xs);line-height:var(--aui-inline-height-m)}.aui-form-item__label-wrapper--left{justify-content:flex-start}.aui-form-item__label-wrapper--left .aui-form-item__label{text-align:start}.aui-form-item__label-wrapper--right{justify-content:flex-end}.aui-form-item__label-wrapper--right .aui-form-item__label{text-align:end}.aui-form-item__label{display:block;line-height:var(--aui-line-height-s)}.aui-form-item__container{width:100%;min-width:0}.aui-form-item__content{display:flex;align-items:center;min-height:var(--aui-inline-height-m)}.aui-form-item__content--large .aui-form-item__control{flex:1;max-width:var(--aui-form-item-width-l)}.aui-form-item__content--medium .aui-form-item__control{flex:1;max-width:var(--aui-form-item-width-m)}.aui-form-item__content--small .aui-form-item__control{flex:1;max-width:var(--aui-form-item-width-s)}.aui-form-item__content+.aui-form-item__hint-wrapper,.aui-form-item__content+.aui-form-item__error-wrapper{margin-top:var(--aui-spacing-s)}.aui-form-item__hint-wrapper,.aui-form-item__error-wrapper{font-size:var(--aui-font-size-s);line-height:var(--aui-line-height-s)}.aui-form-item__hint-wrapper{color:rgb(var(--aui-color-n-4))}.aui-form-item__error-wrapper{color:rgb(var(--aui-color-red))}.aui-form-item__addon-wrapper{align-self:flex-start;display:flex;align-items:center;flex-shrink:0;box-sizing:content-box;height:var(--aui-inline-height-m);min-width:var(--aui-icon-size-m);padding-left:var(--aui-spacing-m);color:rgb(var(--aui-color-n-4));font-size:var(--aui-font-size-m)}.aui-form-item__addon-wrapper aui-icon{font-size:var(--aui-icon-size-m)}.aui-form--inline{display:flex}.aui-form--inline .aui-form-item{margin-bottom:0;margin-right:var(--aui-spacing-m)}\n"] }]
|
|
73
73
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.FormDirective, decorators: [{
|
|
74
74
|
type: Optional
|
|
75
75
|
}] }, { type: i2.NgForm, decorators: [{
|
|
@@ -39,10 +39,10 @@ export class IconComponent {
|
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: IconComponent, deps: [{ token: i1.IconRegisterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
-
IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: IconComponent, selector: "aui-icon", inputs: { icon: "icon", light: "light", dark: "dark", link: "link", margin: "margin", size: "size", color: "color", background: "background", backgroundColor: "backgroundColor" }, ngImport: i0, template: "<svg\n *ngIf=\"icon === 'spinner'; else icons\"\n [attr.class]=\"getClass('aui-icon-spinner')\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n viewBox=\"0 0 200 200\"\n>\n <defs>\n <linearGradient\n [attr.id]=\"'right-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"150\"\n y1=\"20\"\n x2=\"150\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #000\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <linearGradient\n [attr.id]=\"'left-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"50\"\n y1=\"0\"\n x2=\"50\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #fff\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <mask [attr.id]=\"'mask-' + id\">\n <g>\n <path\n [attr.fill]=\"'url(#right-' + id + ')'\"\n d=\"M100,0v20c44.1,0,80,35.9,80,80c0,44.1-35.9,80-80,80v20c55.2,0,100-44.8,100-100S155.2,0,100,0z\"\n />\n <path\n [attr.fill]=\"'url(#left-' + id + ')'\"\n d=\"M20,100c0-44.1,35.9-80,80-80V0C44.8,0,0,44.8,0,100s44.8,100,100,100v-20C55.9,180,20,144.1,20,100z\"\n />\n </g>\n </mask>\n </defs>\n <rect\n x=\"0\"\n y=\"0\"\n width=\"200\"\n height=\"200\"\n [attr.mask]=\"'url(#mask-' + id + ')'\"\n />\n</svg>\n\n<ng-template #icons>\n <svg\n *ngIf=\"getIconId(icon ? icon : ([light, dark] | auiThemePicker)) as iconId\"\n [ngClass]=\"getClass(iconId)\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n >\n <rect\n *ngIf=\"background\"\n class=\"aui-icon__background\"\n [ngClass]=\"background\"\n [attr.fill]=\"backgroundColor\"\n x=\"0\"\n y=\"0\"\n ></rect>\n <use [attr.xlink:href]=\"link + '#' + iconId\"></use>\n </svg>\n</ng-template>\n", styles: ["
|
|
42
|
+
IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: IconComponent, selector: "aui-icon", inputs: { icon: "icon", light: "light", dark: "dark", link: "link", margin: "margin", size: "size", color: "color", background: "background", backgroundColor: "backgroundColor" }, ngImport: i0, template: "<svg\n *ngIf=\"icon === 'spinner'; else icons\"\n [attr.class]=\"getClass('aui-icon-spinner')\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n viewBox=\"0 0 200 200\"\n>\n <defs>\n <linearGradient\n [attr.id]=\"'right-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"150\"\n y1=\"20\"\n x2=\"150\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #000\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <linearGradient\n [attr.id]=\"'left-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"50\"\n y1=\"0\"\n x2=\"50\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #fff\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <mask [attr.id]=\"'mask-' + id\">\n <g>\n <path\n [attr.fill]=\"'url(#right-' + id + ')'\"\n d=\"M100,0v20c44.1,0,80,35.9,80,80c0,44.1-35.9,80-80,80v20c55.2,0,100-44.8,100-100S155.2,0,100,0z\"\n />\n <path\n [attr.fill]=\"'url(#left-' + id + ')'\"\n d=\"M20,100c0-44.1,35.9-80,80-80V0C44.8,0,0,44.8,0,100s44.8,100,100,100v-20C55.9,180,20,144.1,20,100z\"\n />\n </g>\n </mask>\n </defs>\n <rect\n x=\"0\"\n y=\"0\"\n width=\"200\"\n height=\"200\"\n [attr.mask]=\"'url(#mask-' + id + ')'\"\n />\n</svg>\n\n<ng-template #icons>\n <svg\n *ngIf=\"getIconId(icon ? icon : ([light, dark] | auiThemePicker)) as iconId\"\n [ngClass]=\"getClass(iconId)\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n >\n <rect\n *ngIf=\"background\"\n class=\"aui-icon__background\"\n [ngClass]=\"background\"\n [attr.fill]=\"backgroundColor\"\n x=\"0\"\n y=\"0\"\n ></rect>\n <use [attr.xlink:href]=\"link + '#' + iconId\"></use>\n </svg>\n</ng-template>\n", styles: ["aui-icon{vertical-align:bottom}.aui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.125em;fill:currentColor}.aui-icon__background{width:1em;height:1em;fill:#fff}.aui-icon__background.circle{-webkit-clip-path:circle(45%);clip-path:circle(45%)}.aui-icon__background.triangle{-webkit-clip-path:polygon(50% 10%,90% 90%,10% 90%);clip-path:polygon(50% 10%,90% 90%,10% 90%)}.aui-icon--left{margin-left:var(--aui-spacing-s)}.aui-icon--right{margin-right:var(--aui-spacing-s)}.aui-icon-spinner{animation:rotating .5s linear infinite}aui-icon+aui-icon>.aui-icon{margin-left:var(--aui-spacing-s)}@keyframes rotating{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "auiThemePicker": i3.ThemePickerPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
43
43
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: IconComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
45
|
-
args: [{ selector: 'aui-icon', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<svg\n *ngIf=\"icon === 'spinner'; else icons\"\n [attr.class]=\"getClass('aui-icon-spinner')\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n viewBox=\"0 0 200 200\"\n>\n <defs>\n <linearGradient\n [attr.id]=\"'right-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"150\"\n y1=\"20\"\n x2=\"150\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #000\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <linearGradient\n [attr.id]=\"'left-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"50\"\n y1=\"0\"\n x2=\"50\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #fff\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <mask [attr.id]=\"'mask-' + id\">\n <g>\n <path\n [attr.fill]=\"'url(#right-' + id + ')'\"\n d=\"M100,0v20c44.1,0,80,35.9,80,80c0,44.1-35.9,80-80,80v20c55.2,0,100-44.8,100-100S155.2,0,100,0z\"\n />\n <path\n [attr.fill]=\"'url(#left-' + id + ')'\"\n d=\"M20,100c0-44.1,35.9-80,80-80V0C44.8,0,0,44.8,0,100s44.8,100,100,100v-20C55.9,180,20,144.1,20,100z\"\n />\n </g>\n </mask>\n </defs>\n <rect\n x=\"0\"\n y=\"0\"\n width=\"200\"\n height=\"200\"\n [attr.mask]=\"'url(#mask-' + id + ')'\"\n />\n</svg>\n\n<ng-template #icons>\n <svg\n *ngIf=\"getIconId(icon ? icon : ([light, dark] | auiThemePicker)) as iconId\"\n [ngClass]=\"getClass(iconId)\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n >\n <rect\n *ngIf=\"background\"\n class=\"aui-icon__background\"\n [ngClass]=\"background\"\n [attr.fill]=\"backgroundColor\"\n x=\"0\"\n y=\"0\"\n ></rect>\n <use [attr.xlink:href]=\"link + '#' + iconId\"></use>\n </svg>\n</ng-template>\n", styles: ["
|
|
45
|
+
args: [{ selector: 'aui-icon', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<svg\n *ngIf=\"icon === 'spinner'; else icons\"\n [attr.class]=\"getClass('aui-icon-spinner')\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n viewBox=\"0 0 200 200\"\n>\n <defs>\n <linearGradient\n [attr.id]=\"'right-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"150\"\n y1=\"20\"\n x2=\"150\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #000\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <linearGradient\n [attr.id]=\"'left-' + id\"\n gradientUnits=\"userSpaceOnUse\"\n x1=\"50\"\n y1=\"0\"\n x2=\"50\"\n y2=\"180\"\n >\n <stop offset=\"0\" style=\"stop-color: #fff\" />\n <stop offset=\"1\" style=\"stop-color: #808080\" />\n </linearGradient>\n <mask [attr.id]=\"'mask-' + id\">\n <g>\n <path\n [attr.fill]=\"'url(#right-' + id + ')'\"\n d=\"M100,0v20c44.1,0,80,35.9,80,80c0,44.1-35.9,80-80,80v20c55.2,0,100-44.8,100-100S155.2,0,100,0z\"\n />\n <path\n [attr.fill]=\"'url(#left-' + id + ')'\"\n d=\"M20,100c0-44.1,35.9-80,80-80V0C44.8,0,0,44.8,0,100s44.8,100,100,100v-20C55.9,180,20,144.1,20,100z\"\n />\n </g>\n </mask>\n </defs>\n <rect\n x=\"0\"\n y=\"0\"\n width=\"200\"\n height=\"200\"\n [attr.mask]=\"'url(#mask-' + id + ')'\"\n />\n</svg>\n\n<ng-template #icons>\n <svg\n *ngIf=\"getIconId(icon ? icon : ([light, dark] | auiThemePicker)) as iconId\"\n [ngClass]=\"getClass(iconId)\"\n [style.fill]=\"color\"\n [style.width]=\"getWidth()\"\n [style.height]=\"getHeight()\"\n >\n <rect\n *ngIf=\"background\"\n class=\"aui-icon__background\"\n [ngClass]=\"background\"\n [attr.fill]=\"backgroundColor\"\n x=\"0\"\n y=\"0\"\n ></rect>\n <use [attr.xlink:href]=\"link + '#' + iconId\"></use>\n </svg>\n</ng-template>\n", styles: ["aui-icon{vertical-align:bottom}.aui-icon{display:inline-block;width:1em;height:1em;vertical-align:-.125em;fill:currentColor}.aui-icon__background{width:1em;height:1em;fill:#fff}.aui-icon__background.circle{-webkit-clip-path:circle(45%);clip-path:circle(45%)}.aui-icon__background.triangle{-webkit-clip-path:polygon(50% 10%,90% 90%,10% 90%);clip-path:polygon(50% 10%,90% 90%,10% 90%)}.aui-icon--left{margin-left:var(--aui-spacing-s)}.aui-icon--right{margin-right:var(--aui-spacing-s)}.aui-icon-spinner{animation:rotating .5s linear infinite}aui-icon+aui-icon>.aui-icon{margin-left:var(--aui-spacing-s)}@keyframes rotating{0%{transform:rotate(0)}to{transform:rotate(360deg)}}\n"] }]
|
|
46
46
|
}], ctorParameters: function () { return [{ type: i1.IconRegisterService }]; }, propDecorators: { icon: [{
|
|
47
47
|
type: Input
|
|
48
48
|
}], light: [{
|
|
@@ -34,10 +34,10 @@ export class InlineAlertComponent {
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
InlineAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: InlineAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
37
|
-
InlineAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: InlineAlertComponent, selector: "aui-inline-alert", inputs: { title: "title", content: "content", closable: "closable", type: "type" }, outputs: { close: "close" }, queries: [{ propertyName: "titleRef", first: true, predicate: InlineAlertTitleDirective, descendants: true }], ngImport: i0, template: "<div\n *ngIf=\"visible\"\n [class]=\"bem.block(type)\"\n [class.hasTitle]=\"title || titleRef\"\n>\n <aui-icon\n class=\"aui-inline-alert__icon\"\n [icon]=\"iconMap(type)\"\n [background]=\"iconMap(type).endsWith('_triangle_s') ? 'triangle' : 'circle'\"\n ></aui-icon>\n <div class=\"aui-inline-alert__body\">\n <div class=\"aui-inline-alert__title\" *ngIf=\"title || titleRef\">\n <ng-container *ngIf=\"title\">{{ title }}</ng-container>\n <ng-content select=\"[auiInlineAlertTitle]\"></ng-content>\n </div>\n <div class=\"aui-inline-alert__content\">\n <ng-container *ngIf=\"content\">{{ content }}</ng-container>\n <ng-content></ng-content>\n </div>\n </div>\n <aui-icon\n *ngIf=\"closable\"\n class=\"aui-inline-alert__close\"\n icon=\"close\"\n (click)=\"closeSelf()\"\n ></aui-icon>\n</div>\n", styles: ["
|
|
37
|
+
InlineAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: InlineAlertComponent, selector: "aui-inline-alert", inputs: { title: "title", content: "content", closable: "closable", type: "type" }, outputs: { close: "close" }, queries: [{ propertyName: "titleRef", first: true, predicate: InlineAlertTitleDirective, descendants: true }], ngImport: i0, template: "<div\n *ngIf=\"visible\"\n [class]=\"bem.block(type)\"\n [class.hasTitle]=\"title || titleRef\"\n>\n <aui-icon\n class=\"aui-inline-alert__icon\"\n [icon]=\"iconMap(type)\"\n [background]=\"iconMap(type).endsWith('_triangle_s') ? 'triangle' : 'circle'\"\n ></aui-icon>\n <div class=\"aui-inline-alert__body\">\n <div class=\"aui-inline-alert__title\" *ngIf=\"title || titleRef\">\n <ng-container *ngIf=\"title\">{{ title }}</ng-container>\n <ng-content select=\"[auiInlineAlertTitle]\"></ng-content>\n </div>\n <div class=\"aui-inline-alert__content\">\n <ng-container *ngIf=\"content\">{{ content }}</ng-container>\n <ng-content></ng-content>\n </div>\n </div>\n <aui-icon\n *ngIf=\"closable\"\n class=\"aui-inline-alert__close\"\n icon=\"close\"\n (click)=\"closeSelf()\"\n ></aui-icon>\n</div>\n", styles: [".aui-inline-alert{display:flex;margin:0 0 var(--aui-spacing-xl);padding:11px 15px;border-radius:var(--aui-border-radius-m);border-width:1px;border-style:solid}.aui-inline-alert--primary{border-color:rgb(var(--aui-color-blue))}:root .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-7))}html[aui-theme-mode=light] .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-6))}}html[aui-theme-mode=dark] .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-6))}.aui-inline-alert--primary .aui-inline-alert__icon{color:rgb(var(--aui-color-blue))}.aui-inline-alert--success{border-color:rgb(var(--aui-color-green))}:root .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-7))}html[aui-theme-mode=light] .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-6))}}html[aui-theme-mode=dark] .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-6))}.aui-inline-alert--success .aui-inline-alert__icon{color:rgb(var(--aui-color-green))}.aui-inline-alert--warning{border-color:rgb(var(--aui-color-yellow))}:root .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-7))}html[aui-theme-mode=light] .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-6))}}html[aui-theme-mode=dark] .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-6))}.aui-inline-alert--warning .aui-inline-alert__icon{color:rgb(var(--aui-color-yellow))}.aui-inline-alert--danger{border-color:rgb(var(--aui-color-red))}:root .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-7))}html[aui-theme-mode=light] .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-6))}}html[aui-theme-mode=dark] .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-6))}.aui-inline-alert--danger .aui-inline-alert__icon{color:rgb(var(--aui-color-red))}.aui-inline-alert--error{border-color:rgb(var(--aui-color-red))}:root .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-7))}html[aui-theme-mode=light] .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-6))}}html[aui-theme-mode=dark] .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-6))}.aui-inline-alert--error .aui-inline-alert__icon{color:rgb(var(--aui-color-red))}.aui-inline-alert--info{border-color:rgb(var(--aui-color-blue))}:root .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-7))}html[aui-theme-mode=light] .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-6))}}html[aui-theme-mode=dark] .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-6))}.aui-inline-alert--info .aui-inline-alert__icon{color:rgb(var(--aui-color-blue))}.aui-inline-alert__icon{display:flex;margin:0 8px 0 0;align-items:center;height:var(--aui-line-height-m);font-size:var(--aui-icon-size-m)}.aui-inline-alert.hasTitle .aui-inline-alert__icon{height:var(--aui-line-height-xl)}.aui-inline-alert__body{flex:1;width:100%;overflow:hidden}.aui-inline-alert__close{display:block;margin:4px 0 0 15px;height:1em;line-height:1em;font-size:var(--aui-font-size-s);color:rgb(var(--aui-color-n-4));cursor:pointer}.aui-inline-alert__close:hover{color:rgb(var(--aui-color-n-2))}.aui-inline-alert__title{font-size:var(--aui-font-size-xl);line-height:var(--aui-line-height-xl);color:rgb(var(--aui-color-main-text));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aui-inline-alert__content{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);color:rgb(var(--aui-color-main-text))}.aui-inline-alert.hasTitle .aui-inline-alert__content{color:rgb(var(--aui-color-secondary-text))}.aui-inline-alert__title+.aui-inline-alert__content{margin-top:4px}\n"], components: [{ type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
38
38
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: InlineAlertComponent, decorators: [{
|
|
39
39
|
type: Component,
|
|
40
|
-
args: [{ selector: 'aui-inline-alert', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n *ngIf=\"visible\"\n [class]=\"bem.block(type)\"\n [class.hasTitle]=\"title || titleRef\"\n>\n <aui-icon\n class=\"aui-inline-alert__icon\"\n [icon]=\"iconMap(type)\"\n [background]=\"iconMap(type).endsWith('_triangle_s') ? 'triangle' : 'circle'\"\n ></aui-icon>\n <div class=\"aui-inline-alert__body\">\n <div class=\"aui-inline-alert__title\" *ngIf=\"title || titleRef\">\n <ng-container *ngIf=\"title\">{{ title }}</ng-container>\n <ng-content select=\"[auiInlineAlertTitle]\"></ng-content>\n </div>\n <div class=\"aui-inline-alert__content\">\n <ng-container *ngIf=\"content\">{{ content }}</ng-container>\n <ng-content></ng-content>\n </div>\n </div>\n <aui-icon\n *ngIf=\"closable\"\n class=\"aui-inline-alert__close\"\n icon=\"close\"\n (click)=\"closeSelf()\"\n ></aui-icon>\n</div>\n", styles: ["
|
|
40
|
+
args: [{ selector: 'aui-inline-alert', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n *ngIf=\"visible\"\n [class]=\"bem.block(type)\"\n [class.hasTitle]=\"title || titleRef\"\n>\n <aui-icon\n class=\"aui-inline-alert__icon\"\n [icon]=\"iconMap(type)\"\n [background]=\"iconMap(type).endsWith('_triangle_s') ? 'triangle' : 'circle'\"\n ></aui-icon>\n <div class=\"aui-inline-alert__body\">\n <div class=\"aui-inline-alert__title\" *ngIf=\"title || titleRef\">\n <ng-container *ngIf=\"title\">{{ title }}</ng-container>\n <ng-content select=\"[auiInlineAlertTitle]\"></ng-content>\n </div>\n <div class=\"aui-inline-alert__content\">\n <ng-container *ngIf=\"content\">{{ content }}</ng-container>\n <ng-content></ng-content>\n </div>\n </div>\n <aui-icon\n *ngIf=\"closable\"\n class=\"aui-inline-alert__close\"\n icon=\"close\"\n (click)=\"closeSelf()\"\n ></aui-icon>\n</div>\n", styles: [".aui-inline-alert{display:flex;margin:0 0 var(--aui-spacing-xl);padding:11px 15px;border-radius:var(--aui-border-radius-m);border-width:1px;border-style:solid}.aui-inline-alert--primary{border-color:rgb(var(--aui-color-blue))}:root .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-7))}html[aui-theme-mode=light] .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-6))}}html[aui-theme-mode=dark] .aui-inline-alert--primary{background-color:rgb(var(--aui-color-b-6))}.aui-inline-alert--primary .aui-inline-alert__icon{color:rgb(var(--aui-color-blue))}.aui-inline-alert--success{border-color:rgb(var(--aui-color-green))}:root .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-7))}html[aui-theme-mode=light] .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-6))}}html[aui-theme-mode=dark] .aui-inline-alert--success{background-color:rgb(var(--aui-color-g-6))}.aui-inline-alert--success .aui-inline-alert__icon{color:rgb(var(--aui-color-green))}.aui-inline-alert--warning{border-color:rgb(var(--aui-color-yellow))}:root .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-7))}html[aui-theme-mode=light] .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-6))}}html[aui-theme-mode=dark] .aui-inline-alert--warning{background-color:rgb(var(--aui-color-y-6))}.aui-inline-alert--warning .aui-inline-alert__icon{color:rgb(var(--aui-color-yellow))}.aui-inline-alert--danger{border-color:rgb(var(--aui-color-red))}:root .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-7))}html[aui-theme-mode=light] .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-6))}}html[aui-theme-mode=dark] .aui-inline-alert--danger{background-color:rgb(var(--aui-color-r-6))}.aui-inline-alert--danger .aui-inline-alert__icon{color:rgb(var(--aui-color-red))}.aui-inline-alert--error{border-color:rgb(var(--aui-color-red))}:root .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-7))}html[aui-theme-mode=light] .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-6))}}html[aui-theme-mode=dark] .aui-inline-alert--error{background-color:rgb(var(--aui-color-r-6))}.aui-inline-alert--error .aui-inline-alert__icon{color:rgb(var(--aui-color-red))}.aui-inline-alert--info{border-color:rgb(var(--aui-color-blue))}:root .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-7))}html[aui-theme-mode=light] .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-7))}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-6))}}html[aui-theme-mode=dark] .aui-inline-alert--info{background-color:rgb(var(--aui-color-b-6))}.aui-inline-alert--info .aui-inline-alert__icon{color:rgb(var(--aui-color-blue))}.aui-inline-alert__icon{display:flex;margin:0 8px 0 0;align-items:center;height:var(--aui-line-height-m);font-size:var(--aui-icon-size-m)}.aui-inline-alert.hasTitle .aui-inline-alert__icon{height:var(--aui-line-height-xl)}.aui-inline-alert__body{flex:1;width:100%;overflow:hidden}.aui-inline-alert__close{display:block;margin:4px 0 0 15px;height:1em;line-height:1em;font-size:var(--aui-font-size-s);color:rgb(var(--aui-color-n-4));cursor:pointer}.aui-inline-alert__close:hover{color:rgb(var(--aui-color-n-2))}.aui-inline-alert__title{font-size:var(--aui-font-size-xl);line-height:var(--aui-line-height-xl);color:rgb(var(--aui-color-main-text));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.aui-inline-alert__content{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);color:rgb(var(--aui-color-main-text))}.aui-inline-alert.hasTitle .aui-inline-alert__content{color:rgb(var(--aui-color-secondary-text))}.aui-inline-alert__title+.aui-inline-alert__content{margin-top:4px}\n"] }]
|
|
41
41
|
}], propDecorators: { title: [{
|
|
42
42
|
type: Input
|
|
43
43
|
}], content: [{
|
|
@@ -16,10 +16,10 @@ export class InputGroupComponent {
|
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
18
|
InputGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: InputGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
19
|
-
InputGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: InputGroupComponent, selector: "aui-input-group", queries: [{ propertyName: "inputRef", first: true, predicate: InputComponent, descendants: true }, { propertyName: "addonBeforeRefs", predicate: InputAddonBeforeDirective }, { propertyName: "addonAfterRefs", predicate: InputAddonAfterDirective }, { propertyName: "prefixRefs", predicate: InputPrefixDirective }, { propertyName: "suffixRefs", predicate: InputSuffixDirective }], ngImport: i0, template: "<div\n [ngClass]=\"bem.block(inputRef.size$ | async)\"\n [class.isDisabled]=\"inputRef.disabled$ | async\"\n [class.hasAddonBefore]=\"hasAddonBefore$ | async\"\n [class.hasAddonAfter]=\"hasAddonAfter$ | async\"\n [class.hasPrefix]=\"hasPrefix$ | async\"\n [class.hasSuffix]=\"hasSuffix$ | async\"\n>\n <div [class]=\"bem.element('inner-wrapper')\">\n <div\n *ngIf=\"hasAddonBefore$ | async\"\n [class]=\"bem.element('addon', 'before')\"\n >\n <ng-content select=\"[auiInputAddonBefore]\"></ng-content>\n </div>\n <div [class]=\"bem.element('input-wrapper')\">\n <span *ngIf=\"hasPrefix$ | async\" [class]=\"bem.element('prefix')\">\n <ng-content select=\"[auiInputPrefix]\"></ng-content>\n </span>\n <ng-content></ng-content>\n <span *ngIf=\"hasSuffix$ | async\" [class]=\"bem.element('suffix')\">\n <ng-content select=\"[auiInputSuffix]\"></ng-content>\n </span>\n </div>\n <div *ngIf=\"hasAddonAfter$ | async\" [class]=\"bem.element('addon', 'after')\">\n <ng-content select=\"[auiInputAddonAfter]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
19
|
+
InputGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: InputGroupComponent, selector: "aui-input-group", queries: [{ propertyName: "inputRef", first: true, predicate: InputComponent, descendants: true }, { propertyName: "addonBeforeRefs", predicate: InputAddonBeforeDirective }, { propertyName: "addonAfterRefs", predicate: InputAddonAfterDirective }, { propertyName: "prefixRefs", predicate: InputPrefixDirective }, { propertyName: "suffixRefs", predicate: InputSuffixDirective }], ngImport: i0, template: "<div\n [ngClass]=\"bem.block(inputRef.size$ | async)\"\n [class.isDisabled]=\"inputRef.disabled$ | async\"\n [class.hasAddonBefore]=\"hasAddonBefore$ | async\"\n [class.hasAddonAfter]=\"hasAddonAfter$ | async\"\n [class.hasPrefix]=\"hasPrefix$ | async\"\n [class.hasSuffix]=\"hasSuffix$ | async\"\n>\n <div [class]=\"bem.element('inner-wrapper')\">\n <div\n *ngIf=\"hasAddonBefore$ | async\"\n [class]=\"bem.element('addon', 'before')\"\n >\n <ng-content select=\"[auiInputAddonBefore]\"></ng-content>\n </div>\n <div [class]=\"bem.element('input-wrapper')\">\n <span *ngIf=\"hasPrefix$ | async\" [class]=\"bem.element('prefix')\">\n <ng-content select=\"[auiInputPrefix]\"></ng-content>\n </span>\n <ng-content></ng-content>\n <span *ngIf=\"hasSuffix$ | async\" [class]=\"bem.element('suffix')\">\n <ng-content select=\"[auiInputSuffix]\"></ng-content>\n </span>\n </div>\n <div *ngIf=\"hasAddonAfter$ | async\" [class]=\"bem.element('addon', 'after')\">\n <ng-content select=\"[auiInputAddonAfter]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [".aui-input-group{display:inline-block;width:100%;color:rgb(var(--aui-color-main-text))}.aui-input-group.isDisabled{color:rgb(var(--aui-color-disabled-text));cursor:not-allowed}.aui-input-group--large{height:var(--aui-inline-height-l);font-size:var(--aui-font-size-l);line-height:var(--aui-line-height-l)}.aui-input-group--large .aui-input-group__prefix aui-icon,.aui-input-group--large .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-l)}.aui-input-group--large.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-l) + 1px)}.aui-input-group--large.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-l) + 1px)}.aui-input-group--medium{height:var(--aui-inline-height-m);font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-input-group--medium .aui-input-group__prefix aui-icon,.aui-input-group--medium .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-m)}.aui-input-group--medium.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--medium.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--small{height:var(--aui-inline-height-s);font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-input-group--small .aui-input-group__prefix aui-icon,.aui-input-group--small .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-m)}.aui-input-group--small.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--small.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--mini{height:var(--aui-inline-height-xs);font-size:var(--aui-font-size-s);line-height:var(--aui-line-height-s)}.aui-input-group--mini .aui-input-group__prefix aui-icon,.aui-input-group--mini .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-s)}.aui-input-group--mini.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-s) + 1px)}.aui-input-group--mini.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-s) + 1px)}.aui-input-group__inner-wrapper{display:flex;height:100%}.aui-input-group__input-wrapper{width:100%;position:relative}.aui-input-group__input-wrapper:hover .aui-input{border-color:rgb(var(--aui-color-primary))}.aui-input-group__addon{display:flex;align-items:center;flex-shrink:0;height:100%;padding:0 var(--aui-inline-padding-xs);border:1px solid rgb(var(--aui-color-n-7));background-color:rgb(var(--aui-color-n-8))}.aui-input-group__addon--before{border-right:none;border-radius:var(--aui-border-radius-m) 0 0 var(--aui-border-radius-m)}.aui-input-group__addon--after{border-left:none;border-radius:0 var(--aui-border-radius-m) var(--aui-border-radius-m) 0}.aui-input-group__prefix{position:absolute;top:50%;left:calc(var(--aui-inline-padding-xs) + 1px);transform:translateY(-50%);color:rgb(var(--aui-color-placeholder-text))}.aui-input-group__suffix{position:absolute;top:50%;right:calc(var(--aui-inline-padding-xs) + 1px);transform:translateY(-50%);color:rgb(var(--aui-color-placeholder-text))}.aui-input-group.hasAddonBefore .aui-input{border-top-left-radius:0;border-bottom-left-radius:0}.aui-input-group.hasAddonAfter .aui-input{border-top-right-radius:0;border-bottom-right-radius:0}\n"], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "async": i1.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
20
20
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: InputGroupComponent, decorators: [{
|
|
21
21
|
type: Component,
|
|
22
|
-
args: [{ selector: 'aui-input-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n [ngClass]=\"bem.block(inputRef.size$ | async)\"\n [class.isDisabled]=\"inputRef.disabled$ | async\"\n [class.hasAddonBefore]=\"hasAddonBefore$ | async\"\n [class.hasAddonAfter]=\"hasAddonAfter$ | async\"\n [class.hasPrefix]=\"hasPrefix$ | async\"\n [class.hasSuffix]=\"hasSuffix$ | async\"\n>\n <div [class]=\"bem.element('inner-wrapper')\">\n <div\n *ngIf=\"hasAddonBefore$ | async\"\n [class]=\"bem.element('addon', 'before')\"\n >\n <ng-content select=\"[auiInputAddonBefore]\"></ng-content>\n </div>\n <div [class]=\"bem.element('input-wrapper')\">\n <span *ngIf=\"hasPrefix$ | async\" [class]=\"bem.element('prefix')\">\n <ng-content select=\"[auiInputPrefix]\"></ng-content>\n </span>\n <ng-content></ng-content>\n <span *ngIf=\"hasSuffix$ | async\" [class]=\"bem.element('suffix')\">\n <ng-content select=\"[auiInputSuffix]\"></ng-content>\n </span>\n </div>\n <div *ngIf=\"hasAddonAfter$ | async\" [class]=\"bem.element('addon', 'after')\">\n <ng-content select=\"[auiInputAddonAfter]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: ["
|
|
22
|
+
args: [{ selector: 'aui-input-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n [ngClass]=\"bem.block(inputRef.size$ | async)\"\n [class.isDisabled]=\"inputRef.disabled$ | async\"\n [class.hasAddonBefore]=\"hasAddonBefore$ | async\"\n [class.hasAddonAfter]=\"hasAddonAfter$ | async\"\n [class.hasPrefix]=\"hasPrefix$ | async\"\n [class.hasSuffix]=\"hasSuffix$ | async\"\n>\n <div [class]=\"bem.element('inner-wrapper')\">\n <div\n *ngIf=\"hasAddonBefore$ | async\"\n [class]=\"bem.element('addon', 'before')\"\n >\n <ng-content select=\"[auiInputAddonBefore]\"></ng-content>\n </div>\n <div [class]=\"bem.element('input-wrapper')\">\n <span *ngIf=\"hasPrefix$ | async\" [class]=\"bem.element('prefix')\">\n <ng-content select=\"[auiInputPrefix]\"></ng-content>\n </span>\n <ng-content></ng-content>\n <span *ngIf=\"hasSuffix$ | async\" [class]=\"bem.element('suffix')\">\n <ng-content select=\"[auiInputSuffix]\"></ng-content>\n </span>\n </div>\n <div *ngIf=\"hasAddonAfter$ | async\" [class]=\"bem.element('addon', 'after')\">\n <ng-content select=\"[auiInputAddonAfter]\"></ng-content>\n </div>\n </div>\n</div>\n", styles: [".aui-input-group{display:inline-block;width:100%;color:rgb(var(--aui-color-main-text))}.aui-input-group.isDisabled{color:rgb(var(--aui-color-disabled-text));cursor:not-allowed}.aui-input-group--large{height:var(--aui-inline-height-l);font-size:var(--aui-font-size-l);line-height:var(--aui-line-height-l)}.aui-input-group--large .aui-input-group__prefix aui-icon,.aui-input-group--large .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-l)}.aui-input-group--large.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-l) + 1px)}.aui-input-group--large.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-l) + 1px)}.aui-input-group--medium{height:var(--aui-inline-height-m);font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-input-group--medium .aui-input-group__prefix aui-icon,.aui-input-group--medium .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-m)}.aui-input-group--medium.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--medium.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--small{height:var(--aui-inline-height-s);font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-input-group--small .aui-input-group__prefix aui-icon,.aui-input-group--small .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-m)}.aui-input-group--small.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--small.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-m) + 1px)}.aui-input-group--mini{height:var(--aui-inline-height-xs);font-size:var(--aui-font-size-s);line-height:var(--aui-line-height-s)}.aui-input-group--mini .aui-input-group__prefix aui-icon,.aui-input-group--mini .aui-input-group__suffix aui-icon{font-size:var(--aui-icon-size-s)}.aui-input-group--mini.hasPrefix .aui-input{padding-left:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-s) + 1px)}.aui-input-group--mini.hasSuffix .aui-input{padding-right:calc(var(--aui-inline-padding-xs) * 2 + var(--aui-icon-size-s) + 1px)}.aui-input-group__inner-wrapper{display:flex;height:100%}.aui-input-group__input-wrapper{width:100%;position:relative}.aui-input-group__input-wrapper:hover .aui-input{border-color:rgb(var(--aui-color-primary))}.aui-input-group__addon{display:flex;align-items:center;flex-shrink:0;height:100%;padding:0 var(--aui-inline-padding-xs);border:1px solid rgb(var(--aui-color-n-7));background-color:rgb(var(--aui-color-n-8))}.aui-input-group__addon--before{border-right:none;border-radius:var(--aui-border-radius-m) 0 0 var(--aui-border-radius-m)}.aui-input-group__addon--after{border-left:none;border-radius:0 var(--aui-border-radius-m) var(--aui-border-radius-m) 0}.aui-input-group__prefix{position:absolute;top:50%;left:calc(var(--aui-inline-padding-xs) + 1px);transform:translateY(-50%);color:rgb(var(--aui-color-placeholder-text))}.aui-input-group__suffix{position:absolute;top:50%;right:calc(var(--aui-inline-padding-xs) + 1px);transform:translateY(-50%);color:rgb(var(--aui-color-placeholder-text))}.aui-input-group.hasAddonBefore .aui-input{border-top-left-radius:0;border-bottom-left-radius:0}.aui-input-group.hasAddonAfter .aui-input{border-top-right-radius:0;border-bottom-right-radius:0}\n"] }]
|
|
23
23
|
}], propDecorators: { addonBeforeRefs: [{
|
|
24
24
|
type: ContentChildren,
|
|
25
25
|
args: [InputAddonBeforeDirective]
|
|
@@ -49,10 +49,10 @@ export class InputComponent {
|
|
|
49
49
|
}
|
|
50
50
|
}
|
|
51
51
|
InputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: InputComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
52
|
-
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: { size: "size", disabled: "disabled" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["
|
|
52
|
+
InputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: { size: "size", disabled: "disabled" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".aui-input{display:inline-block;padding:0 var(--aui-inline-padding-xs);width:100%;min-width:0;border:1px solid rgb(var(--aui-color-n-7));border-radius:var(--aui-border-radius-m);background-color:rgb(var(--aui-color-main-bg));color:rgb(var(--aui-color-main-text));outline:none;text-overflow:ellipsis}@keyframes cdk-text-field-autofill-color-0{to{background:rgb(var(--aui-color-n-9));color:rgb(var(--aui-color-main-text))}}.aui-input:-webkit-autofill{animation:cdk-text-field-autofill-color-0 both}.aui-input.cdk-text-field-autofill-monitored:-webkit-autofill{animation:cdk-text-field-autofill-start 0s 1ms,cdk-text-field-autofill-color-0 both}.aui-input::-webkit-outer-spin-button,.aui-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.aui-input[type=number]{-moz-appearance:textfield}.aui-input::placeholder{color:rgb(var(--aui-color-placeholder-text))}.aui-input:invalid,.aui-input:required{box-shadow:none}.aui-input:hover{border-color:rgb(var(--aui-color-primary))}.aui-input:focus,.aui-input.isFocused{border-color:rgb(var(--aui-color-primary))}:root .aui-input:focus,:root .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}html[aui-theme-mode=light] .aui-input:focus,html[aui-theme-mode=light] .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-input:focus,html[aui-theme-mode=system] .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}}html[aui-theme-mode=dark] .aui-input:focus,html[aui-theme-mode=dark] .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}.aui-input[readonly]{background-color:rgb(var(--aui-color-n-8));border-color:rgb(var(--aui-color-n-7))!important;cursor:default}.aui-input[disabled]{background-color:rgb(var(--aui-color-n-8));border-color:rgb(var(--aui-color-n-7))!important;color:rgb(var(--aui-color-disabled-text));cursor:not-allowed}.aui-input--large{height:var(--aui-inline-height-l);font-size:var(--aui-font-size-l)}.aui-input--medium{height:var(--aui-inline-height-m);font-size:var(--aui-font-size-m)}.aui-input--small{height:var(--aui-inline-height-s);font-size:var(--aui-font-size-m)}.aui-input--mini{height:var(--aui-inline-height-xs);font-size:var(--aui-font-size-s)}textarea.aui-input{padding:var(--aui-inline-padding-xxs) var(--aui-inline-padding-xs);height:calc(var(--aui-inline-padding-xxs) * 2 + var(--aui-line-height-m) * 3 + 2px);max-height:calc(var(--aui-inline-padding-xxs) * 2 + var(--aui-line-height-m) * 6 + 2px);min-height:var(--aui-inline-height-m);font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);color:rgb(var(--aui-color-main-text));resize:vertical;overflow:auto}.aui-input.ng-invalid.ng-dirty,.ng-submitted .aui-input.ng-invalid{border-color:rgb(var(--aui-color-red))!important}:root .aui-input.ng-invalid.ng-dirty:focus,:root .aui-input.ng-invalid.ng-dirty.isFocused,:root .ng-submitted .aui-input.ng-invalid:focus,:root .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.16)}html[aui-theme-mode=light] .aui-input.ng-invalid.ng-dirty:focus,html[aui-theme-mode=light] .aui-input.ng-invalid.ng-dirty.isFocused,html[aui-theme-mode=light] .ng-submitted .aui-input.ng-invalid:focus,html[aui-theme-mode=light] .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-input.ng-invalid.ng-dirty:focus,html[aui-theme-mode=system] .aui-input.ng-invalid.ng-dirty.isFocused,html[aui-theme-mode=system] .ng-submitted .aui-input.ng-invalid:focus,html[aui-theme-mode=system] .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.3)}}html[aui-theme-mode=dark] .aui-input.ng-invalid.ng-dirty:focus,html[aui-theme-mode=dark] .aui-input.ng-invalid.ng-dirty.isFocused,html[aui-theme-mode=dark] .ng-submitted .aui-input.ng-invalid:focus,html[aui-theme-mode=dark] .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.3)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
53
53
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: InputComponent, decorators: [{
|
|
54
54
|
type: Component,
|
|
55
|
-
args: [{ selector: 'input[aui-input],textarea[aui-input]', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, styles: ["
|
|
55
|
+
args: [{ selector: 'input[aui-input],textarea[aui-input]', template: '<ng-content></ng-content>', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, styles: [".aui-input{display:inline-block;padding:0 var(--aui-inline-padding-xs);width:100%;min-width:0;border:1px solid rgb(var(--aui-color-n-7));border-radius:var(--aui-border-radius-m);background-color:rgb(var(--aui-color-main-bg));color:rgb(var(--aui-color-main-text));outline:none;text-overflow:ellipsis}@keyframes cdk-text-field-autofill-color-0{to{background:rgb(var(--aui-color-n-9));color:rgb(var(--aui-color-main-text))}}.aui-input:-webkit-autofill{animation:cdk-text-field-autofill-color-0 both}.aui-input.cdk-text-field-autofill-monitored:-webkit-autofill{animation:cdk-text-field-autofill-start 0s 1ms,cdk-text-field-autofill-color-0 both}.aui-input::-webkit-outer-spin-button,.aui-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.aui-input[type=number]{-moz-appearance:textfield}.aui-input::placeholder{color:rgb(var(--aui-color-placeholder-text))}.aui-input:invalid,.aui-input:required{box-shadow:none}.aui-input:hover{border-color:rgb(var(--aui-color-primary))}.aui-input:focus,.aui-input.isFocused{border-color:rgb(var(--aui-color-primary))}:root .aui-input:focus,:root .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}html[aui-theme-mode=light] .aui-input:focus,html[aui-theme-mode=light] .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-input:focus,html[aui-theme-mode=system] .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}}html[aui-theme-mode=dark] .aui-input:focus,html[aui-theme-mode=dark] .aui-input.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}.aui-input[readonly]{background-color:rgb(var(--aui-color-n-8));border-color:rgb(var(--aui-color-n-7))!important;cursor:default}.aui-input[disabled]{background-color:rgb(var(--aui-color-n-8));border-color:rgb(var(--aui-color-n-7))!important;color:rgb(var(--aui-color-disabled-text));cursor:not-allowed}.aui-input--large{height:var(--aui-inline-height-l);font-size:var(--aui-font-size-l)}.aui-input--medium{height:var(--aui-inline-height-m);font-size:var(--aui-font-size-m)}.aui-input--small{height:var(--aui-inline-height-s);font-size:var(--aui-font-size-m)}.aui-input--mini{height:var(--aui-inline-height-xs);font-size:var(--aui-font-size-s)}textarea.aui-input{padding:var(--aui-inline-padding-xxs) var(--aui-inline-padding-xs);height:calc(var(--aui-inline-padding-xxs) * 2 + var(--aui-line-height-m) * 3 + 2px);max-height:calc(var(--aui-inline-padding-xxs) * 2 + var(--aui-line-height-m) * 6 + 2px);min-height:var(--aui-inline-height-m);font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m);color:rgb(var(--aui-color-main-text));resize:vertical;overflow:auto}.aui-input.ng-invalid.ng-dirty,.ng-submitted .aui-input.ng-invalid{border-color:rgb(var(--aui-color-red))!important}:root .aui-input.ng-invalid.ng-dirty:focus,:root .aui-input.ng-invalid.ng-dirty.isFocused,:root .ng-submitted .aui-input.ng-invalid:focus,:root .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.16)}html[aui-theme-mode=light] .aui-input.ng-invalid.ng-dirty:focus,html[aui-theme-mode=light] .aui-input.ng-invalid.ng-dirty.isFocused,html[aui-theme-mode=light] .ng-submitted .aui-input.ng-invalid:focus,html[aui-theme-mode=light] .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-input.ng-invalid.ng-dirty:focus,html[aui-theme-mode=system] .aui-input.ng-invalid.ng-dirty.isFocused,html[aui-theme-mode=system] .ng-submitted .aui-input.ng-invalid:focus,html[aui-theme-mode=system] .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.3)}}html[aui-theme-mode=dark] .aui-input.ng-invalid.ng-dirty:focus,html[aui-theme-mode=dark] .aui-input.ng-invalid.ng-dirty.isFocused,html[aui-theme-mode=dark] .ng-submitted .aui-input.ng-invalid:focus,html[aui-theme-mode=dark] .ng-submitted .aui-input.ng-invalid.isFocused{box-shadow:0 0 0 2px rgba(var(--aui-color-red),.3)}\n"] }]
|
|
56
56
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { size: [{
|
|
57
57
|
type: Input
|
|
58
58
|
}], disabled: [{
|
|
@@ -61,7 +61,7 @@ NumberInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", v
|
|
|
61
61
|
useExisting: forwardRef(() => NumberInputComponent),
|
|
62
62
|
multi: true,
|
|
63
63
|
},
|
|
64
|
-
], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div\n [class]=\"bem.block(size)\"\n [ngClass]=\"{\n isFocus: isFocus,\n isDisabled: disabled\n }\"\n auiClickOutside\n (auiClickOutside)=\"isFocus = false\"\n>\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('decrease')\"\n [disabled]=\"disabled || model <= min\"\n (click)=\"takeOneStep(false); isFocus = true\"\n >\n <aui-icon icon=\"minus\"></aui-icon>\n </button>\n <input\n #inputRef\n autocomplete=\"off\"\n (change)=\"inputChanged($any($event).target.value)\"\n [disabled]=\"disabled\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n (focus)=\"isFocus = true\"\n (blur)=\"isFocus = false\"\n />\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('increase')\"\n [disabled]=\"disabled || model >= max\"\n (click)=\"takeOneStep(true); isFocus = true\"\n >\n <aui-icon icon=\"plus\"></aui-icon>\n </button>\n</div>\n", styles: ["
|
|
64
|
+
], viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div\n [class]=\"bem.block(size)\"\n [ngClass]=\"{\n isFocus: isFocus,\n isDisabled: disabled\n }\"\n auiClickOutside\n (auiClickOutside)=\"isFocus = false\"\n>\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('decrease')\"\n [disabled]=\"disabled || model <= min\"\n (click)=\"takeOneStep(false); isFocus = true\"\n >\n <aui-icon icon=\"minus\"></aui-icon>\n </button>\n <input\n #inputRef\n autocomplete=\"off\"\n (change)=\"inputChanged($any($event).target.value)\"\n [disabled]=\"disabled\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n (focus)=\"isFocus = true\"\n (blur)=\"isFocus = false\"\n />\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('increase')\"\n [disabled]=\"disabled || model >= max\"\n (click)=\"takeOneStep(true); isFocus = true\"\n >\n <aui-icon icon=\"plus\"></aui-icon>\n </button>\n</div>\n", styles: [".aui-number-input{display:flex;padding:3px;width:var(--aui-form-item-width-s);border:1px solid rgb(var(--aui-color-n-7));border-radius:var(--aui-border-radius-m);background-color:rgb(var(--aui-color-main-bg));color:rgb(var(--aui-color-main-text))}.aui-number-input--small .aui-number-input__decrease.aui-button,.aui-number-input--small .aui-number-input__increase.aui-button{width:var(--aui-line-height-m);height:var(--aui-line-height-m)}.aui-number-input:hover,.aui-number-input.isFocus{border-color:rgb(var(--aui-color-primary))}:root .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}html[aui-theme-mode=light] .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}}html[aui-theme-mode=dark] .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}.aui-number-input.isDisabled{border:1px solid rgb(var(--aui-color-n-7))}.aui-number-input.isDisabled:hover{cursor:not-allowed}.aui-number-input.isDisabled .aui-number-input__input{color:rgb(var(--aui-color-n-6))}.aui-number-input.isDisabled .aui-number-input__input:hover{cursor:not-allowed}.aui-number-input__decrease.aui-button,.aui-number-input__increase.aui-button{background-color:rgb(var(--aui-color-n-8));border:unset;width:var(--aui-icon-size-xl);height:var(--aui-icon-size-xl)}.aui-number-input__decrease.aui-button aui-icon,.aui-number-input__increase.aui-button aui-icon{font-size:var(--aui-font-size-s)}.aui-number-input__decrease.aui-button .aui-button__content,.aui-number-input__increase.aui-button .aui-button__content{padding:unset}.aui-number-input__input{min-width:0;line-height:var(--aui-line-height-m);border:unset;padding:unset;margin:0 var(--aui-spacing-s);background-color:transparent;color:rgb(var(--aui-color-main-text));text-align:center}.aui-number-input__input:focus{border:unset}.aui-number-input__input:focus-visible{outline:unset}aui-number-input.ng-invalid.ng-dirty,.ng-submitted aui-number-input.ng-invalid{border-color:rgb(var(--aui-color-red))}\n"], components: [{ type: i1.ButtonComponent, selector: "button[aui-button]", inputs: ["aui-button", "size", "plain", "loading", "round", "square"] }, { type: i2.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }], directives: [{ type: i3.ClickOutsideDirective, selector: "[auiClickOutside]", outputs: ["auiClickOutside"], exportAs: ["auiClickOutside"] }, { type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
65
65
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: NumberInputComponent, decorators: [{
|
|
66
66
|
type: Component,
|
|
67
67
|
args: [{ selector: 'aui-number-input', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, providers: [
|
|
@@ -70,7 +70,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImpor
|
|
|
70
70
|
useExisting: forwardRef(() => NumberInputComponent),
|
|
71
71
|
multi: true,
|
|
72
72
|
},
|
|
73
|
-
], template: "<div\n [class]=\"bem.block(size)\"\n [ngClass]=\"{\n isFocus: isFocus,\n isDisabled: disabled\n }\"\n auiClickOutside\n (auiClickOutside)=\"isFocus = false\"\n>\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('decrease')\"\n [disabled]=\"disabled || model <= min\"\n (click)=\"takeOneStep(false); isFocus = true\"\n >\n <aui-icon icon=\"minus\"></aui-icon>\n </button>\n <input\n #inputRef\n autocomplete=\"off\"\n (change)=\"inputChanged($any($event).target.value)\"\n [disabled]=\"disabled\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n (focus)=\"isFocus = true\"\n (blur)=\"isFocus = false\"\n />\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('increase')\"\n [disabled]=\"disabled || model >= max\"\n (click)=\"takeOneStep(true); isFocus = true\"\n >\n <aui-icon icon=\"plus\"></aui-icon>\n </button>\n</div>\n", styles: ["
|
|
73
|
+
], template: "<div\n [class]=\"bem.block(size)\"\n [ngClass]=\"{\n isFocus: isFocus,\n isDisabled: disabled\n }\"\n auiClickOutside\n (auiClickOutside)=\"isFocus = false\"\n>\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('decrease')\"\n [disabled]=\"disabled || model <= min\"\n (click)=\"takeOneStep(false); isFocus = true\"\n >\n <aui-icon icon=\"minus\"></aui-icon>\n </button>\n <input\n #inputRef\n autocomplete=\"off\"\n (change)=\"inputChanged($any($event).target.value)\"\n [disabled]=\"disabled\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n (focus)=\"isFocus = true\"\n (blur)=\"isFocus = false\"\n />\n <button\n *ngIf=\"controls\"\n aui-button\n type=\"button\"\n [ngClass]=\"bem.element('increase')\"\n [disabled]=\"disabled || model >= max\"\n (click)=\"takeOneStep(true); isFocus = true\"\n >\n <aui-icon icon=\"plus\"></aui-icon>\n </button>\n</div>\n", styles: [".aui-number-input{display:flex;padding:3px;width:var(--aui-form-item-width-s);border:1px solid rgb(var(--aui-color-n-7));border-radius:var(--aui-border-radius-m);background-color:rgb(var(--aui-color-main-bg));color:rgb(var(--aui-color-main-text))}.aui-number-input--small .aui-number-input__decrease.aui-button,.aui-number-input--small .aui-number-input__increase.aui-button{width:var(--aui-line-height-m);height:var(--aui-line-height-m)}.aui-number-input:hover,.aui-number-input.isFocus{border-color:rgb(var(--aui-color-primary))}:root .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}html[aui-theme-mode=light] .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.16)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}}html[aui-theme-mode=dark] .aui-number-input.isFocus{box-shadow:0 0 0 2px rgba(var(--aui-color-primary),.3)}.aui-number-input.isDisabled{border:1px solid rgb(var(--aui-color-n-7))}.aui-number-input.isDisabled:hover{cursor:not-allowed}.aui-number-input.isDisabled .aui-number-input__input{color:rgb(var(--aui-color-n-6))}.aui-number-input.isDisabled .aui-number-input__input:hover{cursor:not-allowed}.aui-number-input__decrease.aui-button,.aui-number-input__increase.aui-button{background-color:rgb(var(--aui-color-n-8));border:unset;width:var(--aui-icon-size-xl);height:var(--aui-icon-size-xl)}.aui-number-input__decrease.aui-button aui-icon,.aui-number-input__increase.aui-button aui-icon{font-size:var(--aui-font-size-s)}.aui-number-input__decrease.aui-button .aui-button__content,.aui-number-input__increase.aui-button .aui-button__content{padding:unset}.aui-number-input__input{min-width:0;line-height:var(--aui-line-height-m);border:unset;padding:unset;margin:0 var(--aui-spacing-s);background-color:transparent;color:rgb(var(--aui-color-main-text));text-align:center}.aui-number-input__input:focus{border:unset}.aui-number-input__input:focus-visible{outline:unset}aui-number-input.ng-invalid.ng-dirty,.ng-submitted aui-number-input.ng-invalid{border-color:rgb(var(--aui-color-red))}\n"] }]
|
|
74
74
|
}], propDecorators: { size: [{
|
|
75
75
|
type: Input
|
|
76
76
|
}], min: [{
|
|
@@ -53,10 +53,10 @@ export class SearchComponent {
|
|
|
53
53
|
}
|
|
54
54
|
}
|
|
55
55
|
SearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: SearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
56
|
-
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: SearchComponent, selector: "aui-search", inputs: { size: "size", searchButton: "searchButton", clearable: "clearable", searching: "searching", placeholder: "placeholder", disabled: "disabled", keyword: "keyword" }, outputs: { keywordChange: "keywordChange", search: "search", clear: "clear" }, ngImport: i0, template: "<div\n [ngClass]=\"bem.block(size)\"\n [class.hasIcon]=\"!searchButton\"\n [class.hasButton]=\"searchButton\"\n [class.isClearable]=\"clearable\"\n [class.isSearching]=\"searching\"\n [class.isDisabled]=\"disabled\"\n>\n <div *ngIf=\"!searchButton\" [class]=\"bem.element('icon')\">\n <aui-icon icon=\"search_s\"></aui-icon>\n </div>\n <input\n aui-input\n autocomplete=\"off\"\n [ngModel]=\"value\"\n (ngModelChange)=\"emitChange($event)\"\n [disabled]=\"disabled\"\n (keyup.enter)=\"emitSearch()\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n [size]=\"size\"\n />\n <div *ngIf=\"showSpinner\" [class]=\"bem.element('spinner')\">\n <aui-icon icon=\"spinner\"></aui-icon>\n </div>\n <div\n [hidden]=\"!showClear\"\n [class]=\"bem.element('clear')\"\n (click)=\"emitClear()\"\n >\n <aui-icon icon=\"close_small\"></aui-icon>\n </div>\n <div\n *ngIf=\"searchButton\"\n [class]=\"bem.element('button')\"\n (click)=\"emitSearch()\"\n >\n <div [class]=\"bem.element('button-icon')\">\n <aui-icon [icon]=\"searching ? 'spinner' : 'search_s'\"></aui-icon>\n </div>\n </div>\n</div>\n", styles: ["
|
|
56
|
+
SearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: SearchComponent, selector: "aui-search", inputs: { size: "size", searchButton: "searchButton", clearable: "clearable", searching: "searching", placeholder: "placeholder", disabled: "disabled", keyword: "keyword" }, outputs: { keywordChange: "keywordChange", search: "search", clear: "clear" }, ngImport: i0, template: "<div\n [ngClass]=\"bem.block(size)\"\n [class.hasIcon]=\"!searchButton\"\n [class.hasButton]=\"searchButton\"\n [class.isClearable]=\"clearable\"\n [class.isSearching]=\"searching\"\n [class.isDisabled]=\"disabled\"\n>\n <div *ngIf=\"!searchButton\" [class]=\"bem.element('icon')\">\n <aui-icon icon=\"search_s\"></aui-icon>\n </div>\n <input\n aui-input\n autocomplete=\"off\"\n [ngModel]=\"value\"\n (ngModelChange)=\"emitChange($event)\"\n [disabled]=\"disabled\"\n (keyup.enter)=\"emitSearch()\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n [size]=\"size\"\n />\n <div *ngIf=\"showSpinner\" [class]=\"bem.element('spinner')\">\n <aui-icon icon=\"spinner\"></aui-icon>\n </div>\n <div\n [hidden]=\"!showClear\"\n [class]=\"bem.element('clear')\"\n (click)=\"emitClear()\"\n >\n <aui-icon icon=\"close_small\"></aui-icon>\n </div>\n <div\n *ngIf=\"searchButton\"\n [class]=\"bem.element('button')\"\n (click)=\"emitSearch()\"\n >\n <div [class]=\"bem.element('button-icon')\">\n <aui-icon [icon]=\"searching ? 'spinner' : 'search_s'\"></aui-icon>\n </div>\n </div>\n</div>\n", styles: [".aui-search{display:inline-block;width:100%;position:relative;color:rgb(var(--aui-color-n-4))}.aui-search.isDisabled{color:rgb(var(--aui-color-disabled-text));cursor:not-allowed}.aui-search--large{font-size:var(--aui-font-size-l);line-height:var(--aui-line-height-l)}.aui-search--large aui-icon{font-size:var(--aui-icon-size-l)}.aui-search--large .aui-search__clear,.aui-search--large .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--large .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--large .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--large.isClearable .aui-search__input,.aui-search--large.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--large.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-l) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--large.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-l) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--large.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-l) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--large.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-l) * 2)}.aui-search--medium{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-search--medium aui-icon{font-size:var(--aui-icon-size-m)}.aui-search--medium .aui-search__clear,.aui-search--medium .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--medium .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--medium .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--medium.isClearable .aui-search__input,.aui-search--medium.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--medium.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--medium.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--medium.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--medium.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-m) * 2)}.aui-search--small{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-search--small aui-icon{font-size:var(--aui-icon-size-m)}.aui-search--small .aui-search__clear,.aui-search--small .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--small .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--small .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--small.isClearable .aui-search__input,.aui-search--small.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--small.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--small.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--small.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--small.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-m) * 2)}.aui-search--mini{font-size:var(--aui-font-size-s);line-height:var(--aui-line-height-s)}.aui-search--mini aui-icon{font-size:var(--aui-icon-size-s)}.aui-search--mini .aui-search__clear,.aui-search--mini .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--mini .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--mini .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--mini.isClearable .aui-search__input,.aui-search--mini.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--mini.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-s) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--mini.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-s) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--mini.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-s) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--mini.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-s) * 2)}.aui-search__icon{position:absolute;top:50%;transform:translateY(-50%);color:rgb(var(--aui-color-placeholder-text))}.aui-search__button{position:absolute;top:0;right:1px;height:100%;display:flex;align-items:center}.aui-search:not(.isDisabled):not(.isSearching) .aui-search__button{cursor:pointer}.aui-search:not(.isDisabled):not(.isSearching) .aui-search__button:hover{color:rgb(var(--aui-color-primary))}.aui-search__button-icon{border-left:1px solid rgb(var(--aui-color-n-7))}.aui-search__clear,.aui-search__spinner{position:absolute;top:50%;transform:translateY(-50%)}.aui-search__clear .aui-icon{border-radius:50%;color:rgb(var(--aui-color-help-text));cursor:pointer;transition:all .3s ease}.aui-search__clear .aui-icon:hover{color:rgb(var(--aui-color-main-bg));background-color:rgb(var(--aui-color-help-text))}\n"], components: [{ type: i1.IconComponent, selector: "aui-icon", inputs: ["icon", "light", "dark", "link", "margin", "size", "color", "background", "backgroundColor"] }, { type: i2.InputComponent, selector: "input[aui-input],textarea[aui-input]", inputs: ["size", "disabled"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
57
57
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: SearchComponent, decorators: [{
|
|
58
58
|
type: Component,
|
|
59
|
-
args: [{ selector: 'aui-search', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n [ngClass]=\"bem.block(size)\"\n [class.hasIcon]=\"!searchButton\"\n [class.hasButton]=\"searchButton\"\n [class.isClearable]=\"clearable\"\n [class.isSearching]=\"searching\"\n [class.isDisabled]=\"disabled\"\n>\n <div *ngIf=\"!searchButton\" [class]=\"bem.element('icon')\">\n <aui-icon icon=\"search_s\"></aui-icon>\n </div>\n <input\n aui-input\n autocomplete=\"off\"\n [ngModel]=\"value\"\n (ngModelChange)=\"emitChange($event)\"\n [disabled]=\"disabled\"\n (keyup.enter)=\"emitSearch()\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n [size]=\"size\"\n />\n <div *ngIf=\"showSpinner\" [class]=\"bem.element('spinner')\">\n <aui-icon icon=\"spinner\"></aui-icon>\n </div>\n <div\n [hidden]=\"!showClear\"\n [class]=\"bem.element('clear')\"\n (click)=\"emitClear()\"\n >\n <aui-icon icon=\"close_small\"></aui-icon>\n </div>\n <div\n *ngIf=\"searchButton\"\n [class]=\"bem.element('button')\"\n (click)=\"emitSearch()\"\n >\n <div [class]=\"bem.element('button-icon')\">\n <aui-icon [icon]=\"searching ? 'spinner' : 'search_s'\"></aui-icon>\n </div>\n </div>\n</div>\n", styles: ["
|
|
59
|
+
args: [{ selector: 'aui-search', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n [ngClass]=\"bem.block(size)\"\n [class.hasIcon]=\"!searchButton\"\n [class.hasButton]=\"searchButton\"\n [class.isClearable]=\"clearable\"\n [class.isSearching]=\"searching\"\n [class.isDisabled]=\"disabled\"\n>\n <div *ngIf=\"!searchButton\" [class]=\"bem.element('icon')\">\n <aui-icon icon=\"search_s\"></aui-icon>\n </div>\n <input\n aui-input\n autocomplete=\"off\"\n [ngModel]=\"value\"\n (ngModelChange)=\"emitChange($event)\"\n [disabled]=\"disabled\"\n (keyup.enter)=\"emitSearch()\"\n [ngClass]=\"bem.element('input')\"\n [placeholder]=\"placeholder\"\n [size]=\"size\"\n />\n <div *ngIf=\"showSpinner\" [class]=\"bem.element('spinner')\">\n <aui-icon icon=\"spinner\"></aui-icon>\n </div>\n <div\n [hidden]=\"!showClear\"\n [class]=\"bem.element('clear')\"\n (click)=\"emitClear()\"\n >\n <aui-icon icon=\"close_small\"></aui-icon>\n </div>\n <div\n *ngIf=\"searchButton\"\n [class]=\"bem.element('button')\"\n (click)=\"emitSearch()\"\n >\n <div [class]=\"bem.element('button-icon')\">\n <aui-icon [icon]=\"searching ? 'spinner' : 'search_s'\"></aui-icon>\n </div>\n </div>\n</div>\n", styles: [".aui-search{display:inline-block;width:100%;position:relative;color:rgb(var(--aui-color-n-4))}.aui-search.isDisabled{color:rgb(var(--aui-color-disabled-text));cursor:not-allowed}.aui-search--large{font-size:var(--aui-font-size-l);line-height:var(--aui-line-height-l)}.aui-search--large aui-icon{font-size:var(--aui-icon-size-l)}.aui-search--large .aui-search__clear,.aui-search--large .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--large .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--large .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--large.isClearable .aui-search__input,.aui-search--large.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--large.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-l) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--large.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-l) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--large.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-l) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--large.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-l) * 2)}.aui-search--medium{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-search--medium aui-icon{font-size:var(--aui-icon-size-m)}.aui-search--medium .aui-search__clear,.aui-search--medium .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--medium .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--medium .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--medium.isClearable .aui-search__input,.aui-search--medium.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--medium.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--medium.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--medium.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--medium.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-m) * 2)}.aui-search--small{font-size:var(--aui-font-size-m);line-height:var(--aui-line-height-m)}.aui-search--small aui-icon{font-size:var(--aui-icon-size-m)}.aui-search--small .aui-search__clear,.aui-search--small .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--small .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--small .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--small.isClearable .aui-search__input,.aui-search--small.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--small.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--small.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--small.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-m) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--small.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-m) * 2)}.aui-search--mini{font-size:var(--aui-font-size-s);line-height:var(--aui-line-height-s)}.aui-search--mini aui-icon{font-size:var(--aui-icon-size-s)}.aui-search--mini .aui-search__clear,.aui-search--mini .aui-search__spinner{right:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--mini .aui-search__icon{left:calc(var(--aui-inline-padding-xs) + 1px)}.aui-search--mini .aui-search__button-icon{padding:0 var(--aui-inline-padding-xs)}.aui-search--mini.isClearable .aui-search__input,.aui-search--mini.isSearching .aui-search__input{padding-right:var(--aui-inline-padding-xs)}.aui-search--mini.hasIcon .aui-search__input{padding-left:calc(var(--aui-icon-size-s) + var(--aui-inline-padding-xs) * 2 + 1px)}.aui-search--mini.hasButton .aui-search__input{padding-right:calc(var(--aui-icon-size-s) + var(--aui-inline-padding-xs) * 3 + 1px)}.aui-search--mini.hasButton .aui-search__clear{right:calc(var(--aui-icon-size-s) + var(--aui-inline-padding-xs) * 3 + 1px * 2)}.aui-search--mini.hasButton.isClearable .aui-search__input{padding-right:calc(var(--aui-icon-size-s) * 2)}.aui-search__icon{position:absolute;top:50%;transform:translateY(-50%);color:rgb(var(--aui-color-placeholder-text))}.aui-search__button{position:absolute;top:0;right:1px;height:100%;display:flex;align-items:center}.aui-search:not(.isDisabled):not(.isSearching) .aui-search__button{cursor:pointer}.aui-search:not(.isDisabled):not(.isSearching) .aui-search__button:hover{color:rgb(var(--aui-color-primary))}.aui-search__button-icon{border-left:1px solid rgb(var(--aui-color-n-7))}.aui-search__clear,.aui-search__spinner{position:absolute;top:50%;transform:translateY(-50%)}.aui-search__clear .aui-icon{border-radius:50%;color:rgb(var(--aui-color-help-text));cursor:pointer;transition:all .3s ease}.aui-search__clear .aui-icon:hover{color:rgb(var(--aui-color-main-bg));background-color:rgb(var(--aui-color-help-text))}\n"] }]
|
|
60
60
|
}], propDecorators: { size: [{
|
|
61
61
|
type: Input
|
|
62
62
|
}], searchButton: [{
|