@alauda-fe/common
Version:
Alauda frontend team common codes.
110 lines • 14.3 kB
JavaScript
import { ButtonModule, IconModule } from '@alauda/ui';
import { CommonModule, NgClass } from '@angular/common';
import { ChangeDetectionStrategy, Component, Input, EventEmitter, Output, ContentChild, TemplateRef, } from '@angular/core';
import { DisabledContainerComponent } from '../../disabled-container/public-api';
import { EffectDirectiveModule } from '../../effect-directive/public-api';
import { TranslatePipe } from '../../translate/public-api';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@alauda/ui";
import * as i3 from "../../effect-directive/e2e-attribute-binding.directive";
const _c0 = ["foldedContent"];
const _c1 = ["*"];
const _c2 = (a0, a1) => ({ folded: a0, noPadding: a1 });
const _c3 = a0 => ({ folded: a0 });
function FoldableBlockComponent_div_3_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 1);
i0.ɵɵelementContainer(1, 6);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵproperty("hidden", !ctx_r0.folded);
i0.ɵɵadvance();
i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.foldedContent);
} }
export class FoldableBlockComponent {
constructor() {
this.hiddenButton = false;
this.folded = true;
this.isDisabled = false;
this.tooltip = '';
this.padding = true;
this.foldedChange = new EventEmitter();
this.toggleFoldable = () => {
this.folded = !this.folded;
this.foldedChange.emit(this.folded);
};
}
static { this.ɵfac = function FoldableBlockComponent_Factory(t) { return new (t || FoldableBlockComponent)(); }; }
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FoldableBlockComponent, selectors: [["acl-foldable-block"]], contentQueries: function FoldableBlockComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
i0.ɵɵcontentQuery(dirIndex, _c0, 5);
} if (rf & 2) {
let _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.foldedContent = _t.first);
} }, inputs: { hint: "hint", collapseHint: "collapseHint", hiddenButton: "hiddenButton", expandHint: "expandHint", folded: "folded", isDisabled: "isDisabled", tooltip: "tooltip", padding: "padding" }, outputs: { foldedChange: "foldedChange" }, standalone: true, features: [i0.ɵɵStandaloneFeature], ngContentSelectors: _c1, decls: 10, vars: 21, consts: [[1, "foldable", 3, "ngClass"], [1, "foldable-content", 3, "hidden"], ["class", "foldable-content", 3, "hidden", 4, "ngIf"], [3, "hidden", "isAllowed", "isDisabled", "tooltip"], ["aui-button", "primary", "size", "mini", "type", "button", 3, "click", "ngClass", "round", "plain"], [3, "icon"], [3, "ngTemplateOutlet"]], template: function FoldableBlockComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef();
i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
i0.ɵɵprojection(2);
i0.ɵɵelementEnd();
i0.ɵɵtemplate(3, FoldableBlockComponent_div_3_Template, 2, 2, "div", 2);
i0.ɵɵelementStart(4, "acl-disabled-container", 3)(5, "button", 4);
i0.ɵɵlistener("click", function FoldableBlockComponent_Template_button_click_5_listener() { return ctx.toggleFoldable(); });
i0.ɵɵtext(6);
i0.ɵɵpipe(7, "translate");
i0.ɵɵpipe(8, "translate");
i0.ɵɵelement(9, "aui-icon", 5);
i0.ɵɵelementEnd()()();
} if (rf & 2) {
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction2(16, _c2, ctx.folded && !ctx.foldedContent, !ctx.padding));
i0.ɵɵadvance();
i0.ɵɵproperty("hidden", ctx.folded);
i0.ɵɵadvance(2);
i0.ɵɵproperty("ngIf", ctx.foldedContent);
i0.ɵɵadvance();
i0.ɵɵproperty("hidden", ctx.hiddenButton)("isAllowed", true)("isDisabled", ctx.isDisabled)("tooltip", ctx.tooltip);
i0.ɵɵadvance();
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(19, _c3, !ctx.folded))("round", true)("plain", ctx.folded);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate1(" ", ctx.hint || (ctx.folded ? ctx.expandHint || i0.ɵɵpipeBind1(7, 12, "more") : ctx.collapseHint || i0.ɵɵpipeBind1(8, 14, "collapse")), " ");
i0.ɵɵadvance(3);
i0.ɵɵproperty("icon", ctx.folded ? "angles_down" : "angles_up");
} }, dependencies: [NgClass,
DisabledContainerComponent,
CommonModule, i1.NgIf, i1.NgTemplateOutlet, ButtonModule, i2.ButtonComponent, IconModule, i2.IconComponent, TranslatePipe,
EffectDirectiveModule, i3.E2eAttributeBindingDirective], styles: [".foldable[_ngcontent-%COMP%]{min-height:20px;background:rgb(var(--aui-color-n-9));padding:12px 12px 22px;border-radius:4px;margin-bottom:10px;border:1px solid rgb(var(--aui-color-primary));position:relative}.foldable.folded[_ngcontent-%COMP%]{padding:0;height:20px;border:unset}.foldable.noPadding[_ngcontent-%COMP%]{padding:0 0 10px}.foldable.noPadding[_ngcontent-%COMP%] .foldable-content[_ngcontent-%COMP%]{padding:0}.foldable-content[_ngcontent-%COMP%]{border-radius:4px;background:rgb(var(--aui-color-n-10));padding:20px;overflow:hidden}.foldable[_ngcontent-%COMP%] .aui-button[_ngcontent-%COMP%]{height:24px;font-size:12px;position:absolute;left:20px;bottom:-12px;border:2px solid rgb(var(--aui-color-n-10))}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FoldableBlockComponent, [{
type: Component,
args: [{ selector: 'acl-foldable-block', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
NgClass,
DisabledContainerComponent,
CommonModule,
ButtonModule,
IconModule,
TranslatePipe,
EffectDirectiveModule,
], standalone: true, template: "<div\n class=\"foldable\"\n [ngClass]=\"{ folded: folded && !foldedContent, noPadding: !padding }\"\n>\n <div\n [hidden]=\"folded\"\n class=\"foldable-content\"\n >\n <ng-content></ng-content>\n </div>\n <div\n *ngIf=\"foldedContent\"\n [hidden]=\"!folded\"\n class=\"foldable-content\"\n >\n <ng-container [ngTemplateOutlet]=\"foldedContent\"></ng-container>\n </div>\n\n <acl-disabled-container\n [hidden]=\"hiddenButton\"\n [isAllowed]=\"true\"\n [isDisabled]=\"isDisabled\"\n [tooltip]=\"tooltip\"\n >\n <button\n (click)=\"toggleFoldable()\"\n [ngClass]=\"{ folded: !folded }\"\n aui-button=\"primary\"\n [round]=\"true\"\n [plain]=\"folded\"\n size=\"mini\"\n type=\"button\"\n >\n {{\n hint ||\n (folded\n ? expandHint || ('more' | translate)\n : collapseHint || ('collapse' | translate))\n }}\n <aui-icon [icon]=\"folded ? 'angles_down' : 'angles_up'\"></aui-icon>\n </button>\n </acl-disabled-container>\n</div>\n", styles: [".foldable{min-height:20px;background:rgb(var(--aui-color-n-9));padding:12px 12px 22px;border-radius:4px;margin-bottom:10px;border:1px solid rgb(var(--aui-color-primary));position:relative}.foldable.folded{padding:0;height:20px;border:unset}.foldable.noPadding{padding:0 0 10px}.foldable.noPadding .foldable-content{padding:0}.foldable-content{border-radius:4px;background:rgb(var(--aui-color-n-10));padding:20px;overflow:hidden}.foldable .aui-button{height:24px;font-size:12px;position:absolute;left:20px;bottom:-12px;border:2px solid rgb(var(--aui-color-n-10))}\n"] }]
}], null, { hint: [{
type: Input
}], collapseHint: [{
type: Input
}], hiddenButton: [{
type: Input
}], expandHint: [{
type: Input
}], folded: [{
type: Input
}], isDisabled: [{
type: Input
}], tooltip: [{
type: Input
}], padding: [{
type: Input
}], foldedChange: [{
type: Output
}], foldedContent: [{
type: ContentChild,
args: ['foldedContent']
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FoldableBlockComponent, { className: "FoldableBlockComponent" }); })();
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21tb24vc3JjL3dpZGdldC9mb2xkYWJsZS1ibG9jay9jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbW1vbi9zcmMvd2lkZ2V0L2ZvbGRhYmxlLWJsb2NrL3RlbXBsYXRlLmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxVQUFVLEVBQUUsTUFBTSxZQUFZLENBQUM7QUFDdEQsT0FBTyxFQUFFLFlBQVksRUFBRSxPQUFPLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUN4RCxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxLQUFLLEVBQ0wsWUFBWSxFQUNaLE1BQU0sRUFDTixZQUFZLEVBQ1osV0FBVyxHQUNaLE1BQU0sZUFBZSxDQUFDO0FBRXZCLE9BQU8sRUFBRSwwQkFBMEIsRUFBRSxNQUFNLHFDQUFxQyxDQUFDO0FBQ2pGLE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLG1DQUFtQyxDQUFDO0FBQzFFLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSw0QkFBNEIsQ0FBQzs7Ozs7Ozs7OztJQ0p6RCw4QkFJQztJQUNDLDJCQUFnRTtJQUNsRSxpQkFBTTs7O0lBSkosdUNBQWtCO0lBR0osY0FBa0M7SUFBbEMsdURBQWtDOztBRGlCcEQsTUFBTSxPQUFPLHNCQUFzQjtJQWhCbkM7UUF3QkUsaUJBQVksR0FBWSxLQUFLLENBQUM7UUFLckIsV0FBTSxHQUFHLElBQUksQ0FBQztRQUVkLGVBQVUsR0FBRyxLQUFLLENBQUM7UUFFbkIsWUFBTyxHQUFHLEVBQUUsQ0FBQztRQUd0QixZQUFPLEdBQUcsSUFBSSxDQUFDO1FBRUwsaUJBQVksR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBS3JELG1CQUFjLEdBQUcsR0FBRyxFQUFFO1lBQ3BCLElBQUksQ0FBQyxNQUFNLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDO1lBQzNCLElBQUksQ0FBQyxZQUFZLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQztRQUN0QyxDQUFDLENBQUM7S0FDSDt1RkEvQlksc0JBQXNCO29FQUF0QixzQkFBc0I7Ozs7Ozs7WUM1QmpDLEFBSkYsOEJBR0MsYUFJRTtZQUNDLGtCQUF5QjtZQUMzQixpQkFBTTtZQUNOLHVFQUlDO1lBVUMsQUFORixpREFLQyxnQkFTRTtZQVBDLG1HQUFTLG9CQUFnQixJQUFDO1lBUTFCLFlBTUE7OztZQUFBLDhCQUFtRTtZQUd6RSxBQURFLEFBREUsaUJBQVMsRUFDYyxFQUNyQjs7WUF4Q0oscUdBQXFFO1lBR25FLGNBQWlCO1lBQWpCLG1DQUFpQjtZQU1oQixlQUFtQjtZQUFuQix3Q0FBbUI7WUFRcEIsY0FBdUI7WUFHdkIsQUFEQSxBQURBLEFBREEseUNBQXVCLG1CQUNMLDhCQUNPLHdCQUNOO1lBSWpCLGNBQStCO1lBRy9CLEFBREEsQUFGQSxrRUFBK0IsZUFFakIscUJBQ0U7WUFJaEIsY0FNQTtZQU5BLG1LQU1BO1lBQVUsZUFBNkM7WUFBN0MsK0RBQTZDOzRCRGpCekQsT0FBTztZQUNQLDBCQUEwQjtZQUMxQixZQUFZLGdDQUNaLFlBQVksc0JBQ1osVUFBVSxvQkFDVixhQUFhO1lBQ2IscUJBQXFCOztpRkFJWixzQkFBc0I7Y0FoQmxDLFNBQVM7MkJBQ0Usb0JBQW9CLG1CQUdiLHVCQUF1QixDQUFDLE1BQU0sV0FDdEM7b0JBQ1AsT0FBTztvQkFDUCwwQkFBMEI7b0JBQzFCLFlBQVk7b0JBQ1osWUFBWTtvQkFDWixVQUFVO29CQUNWLGFBQWE7b0JBQ2IscUJBQXFCO2lCQUN0QixjQUNXLElBQUk7Z0JBSWhCLElBQUk7a0JBREgsS0FBSztZQUlOLFlBQVk7a0JBRFgsS0FBSztZQUlOLFlBQVk7a0JBRFgsS0FBSztZQUlOLFVBQVU7a0JBRFQsS0FBSztZQUdHLE1BQU07a0JBQWQsS0FBSztZQUVHLFVBQVU7a0JBQWxCLEtBQUs7WUFFRyxPQUFPO2tCQUFmLEtBQUs7WUFHTixPQUFPO2tCQUROLEtBQUs7WUFHSSxZQUFZO2tCQUFyQixNQUFNO1lBR1AsYUFBYTtrQkFEWixZQUFZO21CQUFDLGVBQWU7O2tGQXhCbEIsc0JBQXNCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQnV0dG9uTW9kdWxlLCBJY29uTW9kdWxlIH0gZnJvbSAnQGFsYXVkYS91aSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUsIE5nQ2xhc3MgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgSW5wdXQsXG4gIEV2ZW50RW1pdHRlcixcbiAgT3V0cHV0LFxuICBDb250ZW50Q2hpbGQsXG4gIFRlbXBsYXRlUmVmLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuaW1wb3J0IHsgRGlzYWJsZWRDb250YWluZXJDb21wb25lbnQgfSBmcm9tICcuLi8uLi9kaXNhYmxlZC1jb250YWluZXIvcHVibGljLWFwaSc7XG5pbXBvcnQgeyBFZmZlY3REaXJlY3RpdmVNb2R1bGUgfSBmcm9tICcuLi8uLi9lZmZlY3QtZGlyZWN0aXZlL3B1YmxpYy1hcGknO1xuaW1wb3J0IHsgVHJhbnNsYXRlUGlwZSB9IGZyb20gJy4uLy4uL3RyYW5zbGF0ZS9wdWJsaWMtYXBpJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYWNsLWZvbGRhYmxlLWJsb2NrJyxcbiAgdGVtcGxhdGVVcmw6ICd0ZW1wbGF0ZS5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJ3N0eWxlcy5zY3NzJ10sXG4gIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICBpbXBvcnRzOiBbXG4gICAgTmdDbGFzcyxcbiAgICBEaXNhYmxlZENvbnRhaW5lckNvbXBvbmVudCxcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgQnV0dG9uTW9kdWxlLFxuICAgIEljb25Nb2R1bGUsXG4gICAgVHJhbnNsYXRlUGlwZSxcbiAgICBFZmZlY3REaXJlY3RpdmVNb2R1bGUsXG4gIF0sXG4gIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIEZvbGRhYmxlQmxvY2tDb21wb25lbnQge1xuICBASW5wdXQoKVxuICBoaW50OiBzdHJpbmc7XG5cbiAgQElucHV0KClcbiAgY29sbGFwc2VIaW50OiBzdHJpbmc7XG5cbiAgQElucHV0KClcbiAgaGlkZGVuQnV0dG9uOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQElucHV0KClcbiAgZXhwYW5kSGludDogc3RyaW5nO1xuXG4gIEBJbnB1dCgpIGZvbGRlZCA9IHRydWU7XG5cbiAgQElucHV0KCkgaXNEaXNhYmxlZCA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpIHRvb2x0aXAgPSAnJztcblxuICBASW5wdXQoKVxuICBwYWRkaW5nID0gdHJ1ZTtcblxuICBAT3V0cHV0KCkgZm9sZGVkQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIEBDb250ZW50Q2hpbGQoJ2ZvbGRlZENvbnRlbnQnKVxuICBmb2xkZWRDb250ZW50OiBUZW1wbGF0ZVJlZjx1bmtub3duPjtcblxuICB0b2dnbGVGb2xkYWJsZSA9ICgpID0+IHtcbiAgICB0aGlzLmZvbGRlZCA9ICF0aGlzLmZvbGRlZDtcbiAgICB0aGlzLmZvbGRlZENoYW5nZS5lbWl0KHRoaXMuZm9sZGVkKTtcbiAgfTtcbn1cbiIsIjxkaXZcbiAgY2xhc3M9XCJmb2xkYWJsZVwiXG4gIFtuZ0NsYXNzXT1cInsgZm9sZGVkOiBmb2xkZWQgJiYgIWZvbGRlZENvbnRlbnQsIG5vUGFkZGluZzogIXBhZGRpbmcgfVwiXG4+XG4gIDxkaXZcbiAgICBbaGlkZGVuXT1cImZvbGRlZFwiXG4gICAgY2xhc3M9XCJmb2xkYWJsZS1jb250ZW50XCJcbiAgPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9kaXY+XG4gIDxkaXZcbiAgICAqbmdJZj1cImZvbGRlZENvbnRlbnRcIlxuICAgIFtoaWRkZW5dPVwiIWZvbGRlZFwiXG4gICAgY2xhc3M9XCJmb2xkYWJsZS1jb250ZW50XCJcbiAgPlxuICAgIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwiZm9sZGVkQ29udGVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cblxuICA8YWNsLWRpc2FibGVkLWNvbnRhaW5lclxuICAgIFtoaWRkZW5dPVwiaGlkZGVuQnV0dG9uXCJcbiAgICBbaXNBbGxvd2VkXT1cInRydWVcIlxuICAgIFtpc0Rpc2FibGVkXT1cImlzRGlzYWJsZWRcIlxuICAgIFt0b29sdGlwXT1cInRvb2x0aXBcIlxuICA+XG4gICAgPGJ1dHRvblxuICAgICAgKGNsaWNrKT1cInRvZ2dsZUZvbGRhYmxlKClcIlxuICAgICAgW25nQ2xhc3NdPVwieyBmb2xkZWQ6ICFmb2xkZWQgfVwiXG4gICAgICBhdWktYnV0dG9uPVwicHJpbWFyeVwiXG4gICAgICBbcm91bmRdPVwidHJ1ZVwiXG4gICAgICBbcGxhaW5dPVwiZm9sZGVkXCJcbiAgICAgIHNpemU9XCJtaW5pXCJcbiAgICAgIHR5cGU9XCJidXR0b25cIlxuICAgID5cbiAgICAgIHt7XG4gICAgICAgIGhpbnQgfHxcbiAgICAgICAgICAoZm9sZGVkXG4gICAgICAgICAgICA/IGV4cGFuZEhpbnQgfHwgKCdtb3JlJyB8IHRyYW5zbGF0ZSlcbiAgICAgICAgICAgIDogY29sbGFwc2VIaW50IHx8ICgnY29sbGFwc2UnIHwgdHJhbnNsYXRlKSlcbiAgICAgIH19XG4gICAgICA8YXVpLWljb24gW2ljb25dPVwiZm9sZGVkID8gJ2FuZ2xlc19kb3duJyA6ICdhbmdsZXNfdXAnXCI+PC9hdWktaWNvbj5cbiAgICA8L2J1dHRvbj5cbiAgPC9hY2wtZGlzYWJsZWQtY29udGFpbmVyPlxuPC9kaXY+XG4iXX0=