@testgorilla/tgo-ui 6.4.2-beta.3 → 6.4.2-beta.4
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.
|
@@ -97,11 +97,11 @@ class AccordionComponent {
|
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
99
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: AccordionComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
100
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.18", type: AccordionComponent, isStandalone: false, selector: "ui-accordion", inputs: { label: "label", open: ["open", "open", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], showPremiumIcon: ["showPremiumIcon", "showPremiumIcon", booleanAttribute], premiumTooltipText: "premiumTooltipText", applicationTheme: "applicationTheme", labelIcon: "labelIcon", variant: "variant", allowCustomHeader: "allowCustomHeader", noBackgroundColor: "noBackgroundColor", toggleIconPosition: "toggleIconPosition" }, outputs: { closed: "closed", opened: "opened" }, ngImport: i0, template: "<mat-accordion\n class=\"accordion-wrapper\"\n [class.disabled]=\"disabled\"\n [ngClass]=\"variant\"\n [attr.theme]=\"applicationTheme\"\n>\n <mat-expansion-panel\n [expanded]=\"open\"\n [class.bgcolor-none]=\"noBackgroundColor\"\n (opened)=\"toggle(true)\"\n (closed)=\"toggle(false)\"\n >\n <mat-expansion-panel-header\n [tabIndex]=\"disabled ? -1 : 0\"\n [class.custom-height]=\"allowCustomHeader\"\n [class.left-toggle]=\"toggleIconPosition === 'left'\"\n [attr.aria-label]=\"label\"\n >\n <mat-panel-title *ngIf=\"!allowCustomHeader; else customHeader\">\n <div *ngIf=\"variant === 'table' && applicationTheme !== 'classic'; else default\" class=\"table-container\">\n <ui-icon [size]=\"'24'\" [ngClass]=\"{ open }\" [name]=\"'Arrow-chevron-down-filled'\"></ui-icon>\n <div class=\"accordion-label\">\n {{ label }}\n </div>\n </div>\n <ng-template #default>\n <div class=\"accordion-label\">\n {{ label }}\n <ng-content select=\"[subHeader]\"></ng-content>\n <ui-icon\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"premiumTooltipText\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"labelIcon ? labelIcon : applicationTheme === 'classic' ? 'Premium' : 'Premium-circle-in-line'\"\n *ngIf=\"showPremiumIcon || labelIcon\"\n ></ui-icon>\n </div>\n </ng-template>\n </mat-panel-title>\n <ng-template #customHeader>\n <mat-panel-title>\n <ng-content select=\"[customHeader]\"></ng-content>\n </mat-panel-title>\n </ng-template>\n <mat-panel-description>\n <div class=\"accordion-actions\">\n <ng-content select=\"[actions]\"></ng-content>\n </div>\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content></ng-content>\n </mat-expansion-panel>\n</mat-accordion>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap\";.bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.flex-center,.mat-expansion-panel-header .accordion-label,.mat-expansion-panel-header-description .accordion-actions{display:flex;justify-content:center;align-items:center}:host ::ng-deep .mat-expansion-panel-body{background:#ededed;border-radius:8px;width:calc(100% - 32px);padding:0;margin:0 auto}:host ::ng-deep .mat-expansion-panel-content{overflow:hidden}:host ::ng-deep .mat-expansion-panel.bgcolor-none .mat-expansion-panel-body{background:none}:host ::ng-deep .mat-expansion-indicator{height:24px;width:24px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-expansion-indicator:after{color:#000!important;margin-top:-6px}.mat-expansion-panel{box-shadow:unset!important;background:transparent}.accordion-wrapper.disabled{opacity:.5;pointer-events:none}.mat-expansion-panel-header-description{justify-content:end;margin:0 16px 0 8px}.mat-expansion-panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;height:48px!important;border-radius:8px;z-index:1;border:1px solid transparent}.mat-expansion-panel-header.cdk-keyboard-focused{position:relative}.mat-expansion-panel-header.cdk-keyboard-focused:after{content:\"\";width:100%;height:100%;outline:3px solid #242424;position:absolute;left:0;top:0;animation:focus-ring-animation-main .4s forwards;border-radius:10px}.mat-expansion-panel-header.custom-height{height:auto!important;align-items:flex-start}.mat-expansion-panel-header.custom-height ::ng-deep .mat-expansion-panel-header-title{flex-basis:auto;margin-right:0}.mat-expansion-panel-header.custom-height ::ng-deep .mat-expansion-panel-header-description{flex-grow:0;flex-basis:auto}.mat-expansion-panel-header.left-toggle{flex-direction:row-reverse;gap:8px}.mat-expansion-panel-header:focus{border:1px dashed #888888!important}.mat-expansion-panel-header:hover{background:#f6f6f6!important}.mat-expansion-panel-header .accordion-label{font-size:14px;font-weight:700;gap:8px}::ng-deep .mat-mdc-tooltip{background-color:#a9c2c9;font-family:Open Sans,serif;font-weight:400;font-size:12px;border-radius:4px;overflow:visible;max-width:248px;padding:6px 2px;--mdc-plain-tooltip-container-color: none;--mat-tooltip-container-color: none;--mdc-plain-tooltip-supporting-text-color: $tgo-black}.accordion-wrapper[theme=dark],.accordion-wrapper[theme=light]{position:relative;border-radius:10px}.accordion-wrapper[theme=dark] .mat-expansion-panel-header,.accordion-wrapper[theme=light] .mat-expansion-panel-header{border:unset!important}.accordion-wrapper[theme=dark] .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light] .mat-expansion-panel-header:hover{background:transparent!important}.accordion-wrapper[theme=dark].standard .mat-expansion-panel:hover,.accordion-wrapper[theme=light].standard .mat-expansion-panel:hover{box-shadow:0 4px 16px #24242414}.accordion-wrapper[theme=dark].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body{margin:0 16px 12px}.accordion-wrapper[theme=dark] .mat-expansion-panel,.accordion-wrapper[theme=light] .mat-expansion-panel{background:#fff;border-radius:10px;border:1px solid #919191;overflow:visible}.accordion-wrapper[theme=dark] .mat-expansion-panel:hover,.accordion-wrapper[theme=light] .mat-expansion-panel:hover{outline:1px solid #242424;border-color:#242424}.accordion-wrapper[theme=dark] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body{background-color:#f4f4f4}.accordion-wrapper[theme=dark] .mat-expansion-panel *,.accordion-wrapper[theme=light] .mat-expansion-panel *{color:#242424;font-weight:400}.accordion-wrapper[theme=dark] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after,.accordion-wrapper[theme=light] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after{color:#242424!important}.accordion-wrapper[theme=dark]:hover .accordion-label,.accordion-wrapper[theme=light]:hover .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark]:focus,.accordion-wrapper[theme=light]:focus{outline:unset!important;border-color:unset!important}.accordion-wrapper[theme=dark]:focus:after,.accordion-wrapper[theme=light]:focus:after{content:\"\";position:absolute;top:-3px;left:-3px;display:flex;width:calc(100% + 6px);height:calc(100% + 6px);border:1px dashed #919191;border-radius:10px}.accordion-wrapper[theme=dark]:focus .accordion-label,.accordion-wrapper[theme=light]:focus .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark].filter .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter .mat-expansion-panel-header{padding-left:2px;border:1px dashed transparent!important;border-radius:10px;box-shadow:none!important}.accordion-wrapper[theme=dark].filter:focus:after,.accordion-wrapper[theme=light].filter:focus:after{display:none}.accordion-wrapper[theme=dark].filter:focus .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter:focus .mat-expansion-panel-header{border:1px dashed #919191!important}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-header-description,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-header-description{margin-left:0}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].filter .mat-expansion-panel,.accordion-wrapper[theme=light].filter .mat-expansion-panel{border:unset}.accordion-wrapper[theme=dark].filter .mat-expansion-panel:hover,.accordion-wrapper[theme=light].filter .mat-expansion-panel:hover{border:unset;outline:unset}.accordion-wrapper[theme=dark].table .mat-expansion-panel,.accordion-wrapper[theme=light].table .mat-expansion-panel{border-radius:0;border:unset;outline:unset}.accordion-wrapper[theme=dark].table:after,.accordion-wrapper[theme=light].table:after{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{border-radius:0;box-shadow:none!important;height:64px!important}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light].table .mat-expansion-panel-header:hover{background:#fff2fc!important}.accordion-wrapper[theme=dark].table .accordion-label,.accordion-wrapper[theme=light].table .accordion-label{font-weight:400!important;text-decoration:unset}.accordion-wrapper[theme=dark].table .table-container,.accordion-wrapper[theme=light].table .table-container{display:flex;flex-direction:row}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-indicator,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-indicator{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{padding:12px 24px}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].table ui-icon,.accordion-wrapper[theme=light].table ui-icon{border:1px dashed transparent;margin-right:16px}.accordion-wrapper[theme=dark].table ui-icon ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon ::ng-deep mat-icon{transition:transform .3s}.accordion-wrapper[theme=dark].table ui-icon.open ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon.open ::ng-deep mat-icon{transform:rotate(180deg)}.accordion-wrapper[theme=dark].table:focus ui-icon,.accordion-wrapper[theme=light].table:focus ui-icon{border-radius:100%;border:1px dashed #919191}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i4.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i4.MatExpansionPanelDescription, selector: "mat-panel-description" }] }); }
|
|
100
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.18", type: AccordionComponent, isStandalone: false, selector: "ui-accordion", inputs: { label: "label", open: ["open", "open", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], showPremiumIcon: ["showPremiumIcon", "showPremiumIcon", booleanAttribute], premiumTooltipText: "premiumTooltipText", applicationTheme: "applicationTheme", labelIcon: "labelIcon", variant: "variant", allowCustomHeader: "allowCustomHeader", noBackgroundColor: "noBackgroundColor", toggleIconPosition: "toggleIconPosition" }, outputs: { closed: "closed", opened: "opened" }, ngImport: i0, template: "<mat-accordion\n class=\"accordion-wrapper\"\n [class.disabled]=\"disabled\"\n [ngClass]=\"variant\"\n [attr.theme]=\"applicationTheme\"\n>\n <mat-expansion-panel\n [expanded]=\"open\"\n [class.bgcolor-none]=\"noBackgroundColor\"\n (opened)=\"toggle(true)\"\n (closed)=\"toggle(false)\"\n >\n <mat-expansion-panel-header\n [tabIndex]=\"disabled ? -1 : 0\"\n [class.custom-height]=\"allowCustomHeader\"\n [class.left-toggle]=\"toggleIconPosition === 'left'\"\n [attr.aria-label]=\"label\"\n >\n <mat-panel-title *ngIf=\"!allowCustomHeader; else customHeader\">\n <div *ngIf=\"variant === 'table' && applicationTheme !== 'classic'; else default\" class=\"table-container\">\n <ui-icon [size]=\"'24'\" [ngClass]=\"{ open }\" [name]=\"'Arrow-chevron-down-filled'\"></ui-icon>\n <div class=\"accordion-label\">\n {{ label }}\n </div>\n </div>\n <ng-template #default>\n <div class=\"accordion-label\">\n {{ label }}\n <ng-content select=\"[subHeader]\"></ng-content>\n <ui-icon\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"premiumTooltipText\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"labelIcon ? labelIcon : applicationTheme === 'classic' ? 'Premium' : 'Premium-circle-in-line'\"\n *ngIf=\"showPremiumIcon || labelIcon\"\n ></ui-icon>\n </div>\n </ng-template>\n </mat-panel-title>\n <ng-template #customHeader>\n <ng-content select=\"[customHeader]\"></ng-content>\n </ng-template>\n <mat-panel-description>\n <div class=\"accordion-actions\">\n <ng-content select=\"[actions]\"></ng-content>\n </div>\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content></ng-content>\n </mat-expansion-panel>\n</mat-accordion>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap\";.bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.flex-center,.mat-expansion-panel-header .accordion-label,.mat-expansion-panel-header-description .accordion-actions{display:flex;justify-content:center;align-items:center}:host ::ng-deep .mat-expansion-panel-body{background:#ededed;border-radius:8px;width:calc(100% - 32px);padding:0;margin:0 auto}:host ::ng-deep .mat-expansion-panel-content{overflow:hidden}:host ::ng-deep .mat-expansion-panel.bgcolor-none .mat-expansion-panel-body{background:none}:host ::ng-deep .mat-expansion-indicator{height:24px;width:24px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-expansion-indicator:after{color:#000!important;margin-top:-6px}.mat-expansion-panel{box-shadow:unset!important;background:transparent}.accordion-wrapper.disabled{opacity:.5;pointer-events:none}.mat-expansion-panel-header-description{justify-content:end;margin:0 16px 0 8px}.mat-expansion-panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;height:48px!important;border-radius:8px;z-index:1;border:1px solid transparent}.mat-expansion-panel-header.cdk-keyboard-focused{position:relative}.mat-expansion-panel-header.cdk-keyboard-focused:after{content:\"\";width:100%;height:100%;outline:3px solid #242424;position:absolute;left:0;top:0;animation:focus-ring-animation-main .4s forwards;border-radius:10px}.mat-expansion-panel-header.custom-height{height:auto!important;align-items:flex-start}.mat-expansion-panel-header.left-toggle{flex-direction:row-reverse;gap:8px}.mat-expansion-panel-header:focus{border:1px dashed #888888!important}.mat-expansion-panel-header:hover{background:#f6f6f6!important}.mat-expansion-panel-header .accordion-label{font-size:14px;font-weight:700;gap:8px}::ng-deep .mat-mdc-tooltip{background-color:#a9c2c9;font-family:Open Sans,serif;font-weight:400;font-size:12px;border-radius:4px;overflow:visible;max-width:248px;padding:6px 2px;--mdc-plain-tooltip-container-color: none;--mat-tooltip-container-color: none;--mdc-plain-tooltip-supporting-text-color: $tgo-black}.accordion-wrapper[theme=dark],.accordion-wrapper[theme=light]{position:relative;border-radius:10px}.accordion-wrapper[theme=dark] .mat-expansion-panel-header,.accordion-wrapper[theme=light] .mat-expansion-panel-header{border:unset!important}.accordion-wrapper[theme=dark] .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light] .mat-expansion-panel-header:hover{background:transparent!important}.accordion-wrapper[theme=dark].standard .mat-expansion-panel:hover,.accordion-wrapper[theme=light].standard .mat-expansion-panel:hover{box-shadow:0 4px 16px #24242414}.accordion-wrapper[theme=dark].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body{margin:0 16px 12px}.accordion-wrapper[theme=dark] .mat-expansion-panel,.accordion-wrapper[theme=light] .mat-expansion-panel{background:#fff;border-radius:10px;border:1px solid #919191;overflow:visible}.accordion-wrapper[theme=dark] .mat-expansion-panel:hover,.accordion-wrapper[theme=light] .mat-expansion-panel:hover{outline:1px solid #242424;border-color:#242424}.accordion-wrapper[theme=dark] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body{background-color:#f4f4f4}.accordion-wrapper[theme=dark] .mat-expansion-panel *,.accordion-wrapper[theme=light] .mat-expansion-panel *{color:#242424;font-weight:400}.accordion-wrapper[theme=dark] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after,.accordion-wrapper[theme=light] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after{color:#242424!important}.accordion-wrapper[theme=dark]:hover .accordion-label,.accordion-wrapper[theme=light]:hover .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark]:focus,.accordion-wrapper[theme=light]:focus{outline:unset!important;border-color:unset!important}.accordion-wrapper[theme=dark]:focus:after,.accordion-wrapper[theme=light]:focus:after{content:\"\";position:absolute;top:-3px;left:-3px;display:flex;width:calc(100% + 6px);height:calc(100% + 6px);border:1px dashed #919191;border-radius:10px}.accordion-wrapper[theme=dark]:focus .accordion-label,.accordion-wrapper[theme=light]:focus .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark].filter .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter .mat-expansion-panel-header{padding-left:2px;border:1px dashed transparent!important;border-radius:10px;box-shadow:none!important}.accordion-wrapper[theme=dark].filter:focus:after,.accordion-wrapper[theme=light].filter:focus:after{display:none}.accordion-wrapper[theme=dark].filter:focus .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter:focus .mat-expansion-panel-header{border:1px dashed #919191!important}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-header-description,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-header-description{margin-left:0}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].filter .mat-expansion-panel,.accordion-wrapper[theme=light].filter .mat-expansion-panel{border:unset}.accordion-wrapper[theme=dark].filter .mat-expansion-panel:hover,.accordion-wrapper[theme=light].filter .mat-expansion-panel:hover{border:unset;outline:unset}.accordion-wrapper[theme=dark].table .mat-expansion-panel,.accordion-wrapper[theme=light].table .mat-expansion-panel{border-radius:0;border:unset;outline:unset}.accordion-wrapper[theme=dark].table:after,.accordion-wrapper[theme=light].table:after{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{border-radius:0;box-shadow:none!important;height:64px!important}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light].table .mat-expansion-panel-header:hover{background:#fff2fc!important}.accordion-wrapper[theme=dark].table .accordion-label,.accordion-wrapper[theme=light].table .accordion-label{font-weight:400!important;text-decoration:unset}.accordion-wrapper[theme=dark].table .table-container,.accordion-wrapper[theme=light].table .table-container{display:flex;flex-direction:row}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-indicator,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-indicator{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{padding:12px 24px}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].table ui-icon,.accordion-wrapper[theme=light].table ui-icon{border:1px dashed transparent;margin-right:16px}.accordion-wrapper[theme=dark].table ui-icon ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon ::ng-deep mat-icon{transition:transform .3s}.accordion-wrapper[theme=dark].table ui-icon.open ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon.open ::ng-deep mat-icon{transform:rotate(180deg)}.accordion-wrapper[theme=dark].table:focus ui-icon,.accordion-wrapper[theme=light].table:focus ui-icon{border-radius:100%;border:1px dashed #919191}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i4.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i4.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i4.MatExpansionPanelDescription, selector: "mat-panel-description" }] }); }
|
|
101
101
|
}
|
|
102
102
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: AccordionComponent, decorators: [{
|
|
103
103
|
type: Component,
|
|
104
|
-
args: [{ selector: 'ui-accordion', standalone: false, template: "<mat-accordion\n class=\"accordion-wrapper\"\n [class.disabled]=\"disabled\"\n [ngClass]=\"variant\"\n [attr.theme]=\"applicationTheme\"\n>\n <mat-expansion-panel\n [expanded]=\"open\"\n [class.bgcolor-none]=\"noBackgroundColor\"\n (opened)=\"toggle(true)\"\n (closed)=\"toggle(false)\"\n >\n <mat-expansion-panel-header\n [tabIndex]=\"disabled ? -1 : 0\"\n [class.custom-height]=\"allowCustomHeader\"\n [class.left-toggle]=\"toggleIconPosition === 'left'\"\n [attr.aria-label]=\"label\"\n >\n <mat-panel-title *ngIf=\"!allowCustomHeader; else customHeader\">\n <div *ngIf=\"variant === 'table' && applicationTheme !== 'classic'; else default\" class=\"table-container\">\n <ui-icon [size]=\"'24'\" [ngClass]=\"{ open }\" [name]=\"'Arrow-chevron-down-filled'\"></ui-icon>\n <div class=\"accordion-label\">\n {{ label }}\n </div>\n </div>\n <ng-template #default>\n <div class=\"accordion-label\">\n {{ label }}\n <ng-content select=\"[subHeader]\"></ng-content>\n <ui-icon\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"premiumTooltipText\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"labelIcon ? labelIcon : applicationTheme === 'classic' ? 'Premium' : 'Premium-circle-in-line'\"\n *ngIf=\"showPremiumIcon || labelIcon\"\n ></ui-icon>\n </div>\n </ng-template>\n </mat-panel-title>\n <ng-template #customHeader>\n <mat-panel-title>\n <ng-content select=\"[customHeader]\"></ng-content>\n </mat-panel-title>\n </ng-template>\n <mat-panel-description>\n <div class=\"accordion-actions\">\n <ng-content select=\"[actions]\"></ng-content>\n </div>\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content></ng-content>\n </mat-expansion-panel>\n</mat-accordion>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap\";.bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.flex-center,.mat-expansion-panel-header .accordion-label,.mat-expansion-panel-header-description .accordion-actions{display:flex;justify-content:center;align-items:center}:host ::ng-deep .mat-expansion-panel-body{background:#ededed;border-radius:8px;width:calc(100% - 32px);padding:0;margin:0 auto}:host ::ng-deep .mat-expansion-panel-content{overflow:hidden}:host ::ng-deep .mat-expansion-panel.bgcolor-none .mat-expansion-panel-body{background:none}:host ::ng-deep .mat-expansion-indicator{height:24px;width:24px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-expansion-indicator:after{color:#000!important;margin-top:-6px}.mat-expansion-panel{box-shadow:unset!important;background:transparent}.accordion-wrapper.disabled{opacity:.5;pointer-events:none}.mat-expansion-panel-header-description{justify-content:end;margin:0 16px 0 8px}.mat-expansion-panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;height:48px!important;border-radius:8px;z-index:1;border:1px solid transparent}.mat-expansion-panel-header.cdk-keyboard-focused{position:relative}.mat-expansion-panel-header.cdk-keyboard-focused:after{content:\"\";width:100%;height:100%;outline:3px solid #242424;position:absolute;left:0;top:0;animation:focus-ring-animation-main .4s forwards;border-radius:10px}.mat-expansion-panel-header.custom-height{height:auto!important;align-items:flex-start}.mat-expansion-panel-header.custom-height ::ng-deep .mat-expansion-panel-header-title{flex-basis:auto;margin-right:0}.mat-expansion-panel-header.custom-height ::ng-deep .mat-expansion-panel-header-description{flex-grow:0;flex-basis:auto}.mat-expansion-panel-header.left-toggle{flex-direction:row-reverse;gap:8px}.mat-expansion-panel-header:focus{border:1px dashed #888888!important}.mat-expansion-panel-header:hover{background:#f6f6f6!important}.mat-expansion-panel-header .accordion-label{font-size:14px;font-weight:700;gap:8px}::ng-deep .mat-mdc-tooltip{background-color:#a9c2c9;font-family:Open Sans,serif;font-weight:400;font-size:12px;border-radius:4px;overflow:visible;max-width:248px;padding:6px 2px;--mdc-plain-tooltip-container-color: none;--mat-tooltip-container-color: none;--mdc-plain-tooltip-supporting-text-color: $tgo-black}.accordion-wrapper[theme=dark],.accordion-wrapper[theme=light]{position:relative;border-radius:10px}.accordion-wrapper[theme=dark] .mat-expansion-panel-header,.accordion-wrapper[theme=light] .mat-expansion-panel-header{border:unset!important}.accordion-wrapper[theme=dark] .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light] .mat-expansion-panel-header:hover{background:transparent!important}.accordion-wrapper[theme=dark].standard .mat-expansion-panel:hover,.accordion-wrapper[theme=light].standard .mat-expansion-panel:hover{box-shadow:0 4px 16px #24242414}.accordion-wrapper[theme=dark].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body{margin:0 16px 12px}.accordion-wrapper[theme=dark] .mat-expansion-panel,.accordion-wrapper[theme=light] .mat-expansion-panel{background:#fff;border-radius:10px;border:1px solid #919191;overflow:visible}.accordion-wrapper[theme=dark] .mat-expansion-panel:hover,.accordion-wrapper[theme=light] .mat-expansion-panel:hover{outline:1px solid #242424;border-color:#242424}.accordion-wrapper[theme=dark] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body{background-color:#f4f4f4}.accordion-wrapper[theme=dark] .mat-expansion-panel *,.accordion-wrapper[theme=light] .mat-expansion-panel *{color:#242424;font-weight:400}.accordion-wrapper[theme=dark] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after,.accordion-wrapper[theme=light] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after{color:#242424!important}.accordion-wrapper[theme=dark]:hover .accordion-label,.accordion-wrapper[theme=light]:hover .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark]:focus,.accordion-wrapper[theme=light]:focus{outline:unset!important;border-color:unset!important}.accordion-wrapper[theme=dark]:focus:after,.accordion-wrapper[theme=light]:focus:after{content:\"\";position:absolute;top:-3px;left:-3px;display:flex;width:calc(100% + 6px);height:calc(100% + 6px);border:1px dashed #919191;border-radius:10px}.accordion-wrapper[theme=dark]:focus .accordion-label,.accordion-wrapper[theme=light]:focus .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark].filter .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter .mat-expansion-panel-header{padding-left:2px;border:1px dashed transparent!important;border-radius:10px;box-shadow:none!important}.accordion-wrapper[theme=dark].filter:focus:after,.accordion-wrapper[theme=light].filter:focus:after{display:none}.accordion-wrapper[theme=dark].filter:focus .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter:focus .mat-expansion-panel-header{border:1px dashed #919191!important}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-header-description,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-header-description{margin-left:0}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].filter .mat-expansion-panel,.accordion-wrapper[theme=light].filter .mat-expansion-panel{border:unset}.accordion-wrapper[theme=dark].filter .mat-expansion-panel:hover,.accordion-wrapper[theme=light].filter .mat-expansion-panel:hover{border:unset;outline:unset}.accordion-wrapper[theme=dark].table .mat-expansion-panel,.accordion-wrapper[theme=light].table .mat-expansion-panel{border-radius:0;border:unset;outline:unset}.accordion-wrapper[theme=dark].table:after,.accordion-wrapper[theme=light].table:after{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{border-radius:0;box-shadow:none!important;height:64px!important}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light].table .mat-expansion-panel-header:hover{background:#fff2fc!important}.accordion-wrapper[theme=dark].table .accordion-label,.accordion-wrapper[theme=light].table .accordion-label{font-weight:400!important;text-decoration:unset}.accordion-wrapper[theme=dark].table .table-container,.accordion-wrapper[theme=light].table .table-container{display:flex;flex-direction:row}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-indicator,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-indicator{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{padding:12px 24px}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].table ui-icon,.accordion-wrapper[theme=light].table ui-icon{border:1px dashed transparent;margin-right:16px}.accordion-wrapper[theme=dark].table ui-icon ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon ::ng-deep mat-icon{transition:transform .3s}.accordion-wrapper[theme=dark].table ui-icon.open ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon.open ::ng-deep mat-icon{transform:rotate(180deg)}.accordion-wrapper[theme=dark].table:focus ui-icon,.accordion-wrapper[theme=light].table:focus ui-icon{border-radius:100%;border:1px dashed #919191}\n"] }]
|
|
104
|
+
args: [{ selector: 'ui-accordion', standalone: false, template: "<mat-accordion\n class=\"accordion-wrapper\"\n [class.disabled]=\"disabled\"\n [ngClass]=\"variant\"\n [attr.theme]=\"applicationTheme\"\n>\n <mat-expansion-panel\n [expanded]=\"open\"\n [class.bgcolor-none]=\"noBackgroundColor\"\n (opened)=\"toggle(true)\"\n (closed)=\"toggle(false)\"\n >\n <mat-expansion-panel-header\n [tabIndex]=\"disabled ? -1 : 0\"\n [class.custom-height]=\"allowCustomHeader\"\n [class.left-toggle]=\"toggleIconPosition === 'left'\"\n [attr.aria-label]=\"label\"\n >\n <mat-panel-title *ngIf=\"!allowCustomHeader; else customHeader\">\n <div *ngIf=\"variant === 'table' && applicationTheme !== 'classic'; else default\" class=\"table-container\">\n <ui-icon [size]=\"'24'\" [ngClass]=\"{ open }\" [name]=\"'Arrow-chevron-down-filled'\"></ui-icon>\n <div class=\"accordion-label\">\n {{ label }}\n </div>\n </div>\n <ng-template #default>\n <div class=\"accordion-label\">\n {{ label }}\n <ng-content select=\"[subHeader]\"></ng-content>\n <ui-icon\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"premiumTooltipText\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"labelIcon ? labelIcon : applicationTheme === 'classic' ? 'Premium' : 'Premium-circle-in-line'\"\n *ngIf=\"showPremiumIcon || labelIcon\"\n ></ui-icon>\n </div>\n </ng-template>\n </mat-panel-title>\n <ng-template #customHeader>\n <ng-content select=\"[customHeader]\"></ng-content>\n </ng-template>\n <mat-panel-description>\n <div class=\"accordion-actions\">\n <ng-content select=\"[actions]\"></ng-content>\n </div>\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content></ng-content>\n </mat-expansion-panel>\n</mat-accordion>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap\";.bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.flex-center,.mat-expansion-panel-header .accordion-label,.mat-expansion-panel-header-description .accordion-actions{display:flex;justify-content:center;align-items:center}:host ::ng-deep .mat-expansion-panel-body{background:#ededed;border-radius:8px;width:calc(100% - 32px);padding:0;margin:0 auto}:host ::ng-deep .mat-expansion-panel-content{overflow:hidden}:host ::ng-deep .mat-expansion-panel.bgcolor-none .mat-expansion-panel-body{background:none}:host ::ng-deep .mat-expansion-indicator{height:24px;width:24px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-expansion-indicator:after{color:#000!important;margin-top:-6px}.mat-expansion-panel{box-shadow:unset!important;background:transparent}.accordion-wrapper.disabled{opacity:.5;pointer-events:none}.mat-expansion-panel-header-description{justify-content:end;margin:0 16px 0 8px}.mat-expansion-panel-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;height:48px!important;border-radius:8px;z-index:1;border:1px solid transparent}.mat-expansion-panel-header.cdk-keyboard-focused{position:relative}.mat-expansion-panel-header.cdk-keyboard-focused:after{content:\"\";width:100%;height:100%;outline:3px solid #242424;position:absolute;left:0;top:0;animation:focus-ring-animation-main .4s forwards;border-radius:10px}.mat-expansion-panel-header.custom-height{height:auto!important;align-items:flex-start}.mat-expansion-panel-header.left-toggle{flex-direction:row-reverse;gap:8px}.mat-expansion-panel-header:focus{border:1px dashed #888888!important}.mat-expansion-panel-header:hover{background:#f6f6f6!important}.mat-expansion-panel-header .accordion-label{font-size:14px;font-weight:700;gap:8px}::ng-deep .mat-mdc-tooltip{background-color:#a9c2c9;font-family:Open Sans,serif;font-weight:400;font-size:12px;border-radius:4px;overflow:visible;max-width:248px;padding:6px 2px;--mdc-plain-tooltip-container-color: none;--mat-tooltip-container-color: none;--mdc-plain-tooltip-supporting-text-color: $tgo-black}.accordion-wrapper[theme=dark],.accordion-wrapper[theme=light]{position:relative;border-radius:10px}.accordion-wrapper[theme=dark] .mat-expansion-panel-header,.accordion-wrapper[theme=light] .mat-expansion-panel-header{border:unset!important}.accordion-wrapper[theme=dark] .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light] .mat-expansion-panel-header:hover{background:transparent!important}.accordion-wrapper[theme=dark].standard .mat-expansion-panel:hover,.accordion-wrapper[theme=light].standard .mat-expansion-panel:hover{box-shadow:0 4px 16px #24242414}.accordion-wrapper[theme=dark].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].standard .mat-expansion-panel ::ng-deep .mat-expansion-panel-body{margin:0 16px 12px}.accordion-wrapper[theme=dark] .mat-expansion-panel,.accordion-wrapper[theme=light] .mat-expansion-panel{background:#fff;border-radius:10px;border:1px solid #919191;overflow:visible}.accordion-wrapper[theme=dark] .mat-expansion-panel:hover,.accordion-wrapper[theme=light] .mat-expansion-panel:hover{outline:1px solid #242424;border-color:#242424}.accordion-wrapper[theme=dark] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light] .mat-expansion-panel:not(.bgcolor-none) ::ng-deep .mat-expansion-panel-body{background-color:#f4f4f4}.accordion-wrapper[theme=dark] .mat-expansion-panel *,.accordion-wrapper[theme=light] .mat-expansion-panel *{color:#242424;font-weight:400}.accordion-wrapper[theme=dark] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after,.accordion-wrapper[theme=light] .mat-expansion-panel ::ng-deep .mat-expansion-indicator:after{color:#242424!important}.accordion-wrapper[theme=dark]:hover .accordion-label,.accordion-wrapper[theme=light]:hover .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark]:focus,.accordion-wrapper[theme=light]:focus{outline:unset!important;border-color:unset!important}.accordion-wrapper[theme=dark]:focus:after,.accordion-wrapper[theme=light]:focus:after{content:\"\";position:absolute;top:-3px;left:-3px;display:flex;width:calc(100% + 6px);height:calc(100% + 6px);border:1px dashed #919191;border-radius:10px}.accordion-wrapper[theme=dark]:focus .accordion-label,.accordion-wrapper[theme=light]:focus .accordion-label{font-weight:700!important;text-decoration:underline}.accordion-wrapper[theme=dark].filter .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter .mat-expansion-panel-header{padding-left:2px;border:1px dashed transparent!important;border-radius:10px;box-shadow:none!important}.accordion-wrapper[theme=dark].filter:focus:after,.accordion-wrapper[theme=light].filter:focus:after{display:none}.accordion-wrapper[theme=dark].filter:focus .mat-expansion-panel-header,.accordion-wrapper[theme=light].filter:focus .mat-expansion-panel-header{border:1px dashed #919191!important}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-header-description,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-header-description{margin-left:0}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].filter ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].filter ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].filter .mat-expansion-panel,.accordion-wrapper[theme=light].filter .mat-expansion-panel{border:unset}.accordion-wrapper[theme=dark].filter .mat-expansion-panel:hover,.accordion-wrapper[theme=light].filter .mat-expansion-panel:hover{border:unset;outline:unset}.accordion-wrapper[theme=dark].table .mat-expansion-panel,.accordion-wrapper[theme=light].table .mat-expansion-panel{border-radius:0;border:unset;outline:unset}.accordion-wrapper[theme=dark].table:after,.accordion-wrapper[theme=light].table:after{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{border-radius:0;box-shadow:none!important;height:64px!important}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header:hover,.accordion-wrapper[theme=light].table .mat-expansion-panel-header:hover{background:#fff2fc!important}.accordion-wrapper[theme=dark].table .accordion-label,.accordion-wrapper[theme=light].table .accordion-label{font-weight:400!important;text-decoration:unset}.accordion-wrapper[theme=dark].table .table-container,.accordion-wrapper[theme=light].table .table-container{display:flex;flex-direction:row}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-indicator,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-indicator{display:none}.accordion-wrapper[theme=dark].table .mat-expansion-panel-header,.accordion-wrapper[theme=light].table .mat-expansion-panel-header{padding:12px 24px}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body{background-color:transparent!important;margin:0;width:100%}.accordion-wrapper[theme=dark].table ::ng-deep .mat-expansion-panel-body div,.accordion-wrapper[theme=light].table ::ng-deep .mat-expansion-panel-body div{padding:0!important}.accordion-wrapper[theme=dark].table ui-icon,.accordion-wrapper[theme=light].table ui-icon{border:1px dashed transparent;margin-right:16px}.accordion-wrapper[theme=dark].table ui-icon ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon ::ng-deep mat-icon{transition:transform .3s}.accordion-wrapper[theme=dark].table ui-icon.open ::ng-deep mat-icon,.accordion-wrapper[theme=light].table ui-icon.open ::ng-deep mat-icon{transform:rotate(180deg)}.accordion-wrapper[theme=dark].table:focus ui-icon,.accordion-wrapper[theme=light].table:focus ui-icon{border-radius:100%;border:1px dashed #919191}\n"] }]
|
|
105
105
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
106
106
|
type: Optional
|
|
107
107
|
}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"testgorilla-tgo-ui-components-accordion.mjs","sources":["../../../components/accordion/accordion.component.ts","../../../components/accordion/accordion.component.html","../../../components/accordion/accordion.component.module.ts","../../../components/accordion/testgorilla-tgo-ui-components-accordion.ts"],"sourcesContent":["import { booleanAttribute, Component, EventEmitter, Inject, Input, Optional, Output } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { AccordionVariant, ToggleIconPosition } from './accordion.model';\nimport { IconName } from '@testgorilla/tgo-ui/components/icon';\n\n@Component({\n selector: 'ui-accordion',\n templateUrl: './accordion.component.html',\n styleUrls: ['./accordion.component.scss'],\n standalone: false,\n})\nexport class AccordionComponent {\n /**\n * The label displayed for the accordion.\n * @type {string}\n * @required\n * @memberof AccordionComponent\n */\n @Input({ required: true }) label: string;\n\n /**\n * Determines whether the accordion is initially open.\n * @type {boolean}\n * @default false\n * @memberof AccordionComponent\n */\n @Input({ transform: booleanAttribute }) open = false;\n\n /**\n * Disables the accordion if set to true.\n * @type {boolean}\n * @default false\n * @memberof AccordionComponent\n */\n @Input({ transform: booleanAttribute }) disabled = false;\n\n /**\n * Indicates whether to show a premium icon.\n * @type {boolean}\n * @default false\n * @memberof AccordionComponent\n */\n @Input({ transform: booleanAttribute }) showPremiumIcon = false;\n\n /**\n * The tooltip text for the premium icon.\n * @type {string}\n * @default ''\n * @memberof AccordionComponent\n */\n @Input() premiumTooltipText = '';\n\n /**\n *\n * Defines the application theme where accordion is used\n *\n * @type {ApplicationTheme}\n * @memberof AccordionComponent\n */\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /**\n *\n * Changed premium icon on this icon\n *\n * @type {IconName}\n * @memberof AccordionComponent\n */\n @Input() labelIcon: IconName;\n\n /**\n *\n * Select accordion variant. Don`t work on Classic theme\n *\n * @type {AccordionVariant}\n * @memberof AccordionComponent\n */\n @Input() variant: AccordionVariant = 'standard';\n\n /**\n *\n * Projects content with attribute 'customHeader'\n *\n * @type {boolean}\n * @memberof AccordionComponent\n */\n @Input() allowCustomHeader = false;\n\n /**\n *\n * Sets background color of content to none\n *\n * @type {boolean}\n * @memberof AccordionComponent\n */\n @Input() noBackgroundColor = false;\n\n /**\n *\n * Defines the toggle icon position\n *\n * @type {boolean}\n * @memberof AccordionComponent\n */\n @Input() toggleIconPosition: ToggleIconPosition = 'right';\n\n @Output() closed = new EventEmitter<void>();\n @Output() opened = new EventEmitter<void>();\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n protected toggle(open: boolean): void {\n this.open = open;\n\n if (this.open) {\n this.opened.emit();\n } else {\n this.closed.emit();\n }\n }\n}\n","<mat-accordion\n class=\"accordion-wrapper\"\n [class.disabled]=\"disabled\"\n [ngClass]=\"variant\"\n [attr.theme]=\"applicationTheme\"\n>\n <mat-expansion-panel\n [expanded]=\"open\"\n [class.bgcolor-none]=\"noBackgroundColor\"\n (opened)=\"toggle(true)\"\n (closed)=\"toggle(false)\"\n >\n <mat-expansion-panel-header\n [tabIndex]=\"disabled ? -1 : 0\"\n [class.custom-height]=\"allowCustomHeader\"\n [class.left-toggle]=\"toggleIconPosition === 'left'\"\n [attr.aria-label]=\"label\"\n >\n <mat-panel-title *ngIf=\"!allowCustomHeader; else customHeader\">\n <div *ngIf=\"variant === 'table' && applicationTheme !== 'classic'; else default\" class=\"table-container\">\n <ui-icon [size]=\"'24'\" [ngClass]=\"{ open }\" [name]=\"'Arrow-chevron-down-filled'\"></ui-icon>\n <div class=\"accordion-label\">\n {{ label }}\n </div>\n </div>\n <ng-template #default>\n <div class=\"accordion-label\">\n {{ label }}\n <ng-content select=\"[subHeader]\"></ng-content>\n <ui-icon\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"premiumTooltipText\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"labelIcon ? labelIcon : applicationTheme === 'classic' ? 'Premium' : 'Premium-circle-in-line'\"\n *ngIf=\"showPremiumIcon || labelIcon\"\n ></ui-icon>\n </div>\n </ng-template>\n </mat-panel-title>\n <ng-template #customHeader>\n <mat-panel-title>\n <ng-content select=\"[customHeader]\"></ng-content>\n </mat-panel-title>\n </ng-template>\n <mat-panel-description>\n <div class=\"accordion-actions\">\n <ng-content select=\"[actions]\"></ng-content>\n </div>\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content></ng-content>\n </mat-expansion-panel>\n</mat-accordion>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AccordionComponent } from './accordion.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { MatExpansionModule } from '@angular/material/expansion';\n\n@NgModule({\n declarations: [AccordionComponent],\n exports: [AccordionComponent],\n imports: [CommonModule, IconComponentModule, ButtonComponentModule, MatTooltipModule, MatExpansionModule],\n})\nexport class AccordionComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"testgorilla-tgo-ui-components-accordion.mjs","sources":["../../../components/accordion/accordion.component.ts","../../../components/accordion/accordion.component.html","../../../components/accordion/accordion.component.module.ts","../../../components/accordion/testgorilla-tgo-ui-components-accordion.ts"],"sourcesContent":["import { booleanAttribute, Component, EventEmitter, Inject, Input, Optional, Output } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { AccordionVariant, ToggleIconPosition } from './accordion.model';\nimport { IconName } from '@testgorilla/tgo-ui/components/icon';\n\n@Component({\n selector: 'ui-accordion',\n templateUrl: './accordion.component.html',\n styleUrls: ['./accordion.component.scss'],\n standalone: false,\n})\nexport class AccordionComponent {\n /**\n * The label displayed for the accordion.\n * @type {string}\n * @required\n * @memberof AccordionComponent\n */\n @Input({ required: true }) label: string;\n\n /**\n * Determines whether the accordion is initially open.\n * @type {boolean}\n * @default false\n * @memberof AccordionComponent\n */\n @Input({ transform: booleanAttribute }) open = false;\n\n /**\n * Disables the accordion if set to true.\n * @type {boolean}\n * @default false\n * @memberof AccordionComponent\n */\n @Input({ transform: booleanAttribute }) disabled = false;\n\n /**\n * Indicates whether to show a premium icon.\n * @type {boolean}\n * @default false\n * @memberof AccordionComponent\n */\n @Input({ transform: booleanAttribute }) showPremiumIcon = false;\n\n /**\n * The tooltip text for the premium icon.\n * @type {string}\n * @default ''\n * @memberof AccordionComponent\n */\n @Input() premiumTooltipText = '';\n\n /**\n *\n * Defines the application theme where accordion is used\n *\n * @type {ApplicationTheme}\n * @memberof AccordionComponent\n */\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /**\n *\n * Changed premium icon on this icon\n *\n * @type {IconName}\n * @memberof AccordionComponent\n */\n @Input() labelIcon: IconName;\n\n /**\n *\n * Select accordion variant. Don`t work on Classic theme\n *\n * @type {AccordionVariant}\n * @memberof AccordionComponent\n */\n @Input() variant: AccordionVariant = 'standard';\n\n /**\n *\n * Projects content with attribute 'customHeader'\n *\n * @type {boolean}\n * @memberof AccordionComponent\n */\n @Input() allowCustomHeader = false;\n\n /**\n *\n * Sets background color of content to none\n *\n * @type {boolean}\n * @memberof AccordionComponent\n */\n @Input() noBackgroundColor = false;\n\n /**\n *\n * Defines the toggle icon position\n *\n * @type {boolean}\n * @memberof AccordionComponent\n */\n @Input() toggleIconPosition: ToggleIconPosition = 'right';\n\n @Output() closed = new EventEmitter<void>();\n @Output() opened = new EventEmitter<void>();\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n protected toggle(open: boolean): void {\n this.open = open;\n\n if (this.open) {\n this.opened.emit();\n } else {\n this.closed.emit();\n }\n }\n}\n","<mat-accordion\n class=\"accordion-wrapper\"\n [class.disabled]=\"disabled\"\n [ngClass]=\"variant\"\n [attr.theme]=\"applicationTheme\"\n>\n <mat-expansion-panel\n [expanded]=\"open\"\n [class.bgcolor-none]=\"noBackgroundColor\"\n (opened)=\"toggle(true)\"\n (closed)=\"toggle(false)\"\n >\n <mat-expansion-panel-header\n [tabIndex]=\"disabled ? -1 : 0\"\n [class.custom-height]=\"allowCustomHeader\"\n [class.left-toggle]=\"toggleIconPosition === 'left'\"\n [attr.aria-label]=\"label\"\n >\n <mat-panel-title *ngIf=\"!allowCustomHeader; else customHeader\">\n <div *ngIf=\"variant === 'table' && applicationTheme !== 'classic'; else default\" class=\"table-container\">\n <ui-icon [size]=\"'24'\" [ngClass]=\"{ open }\" [name]=\"'Arrow-chevron-down-filled'\"></ui-icon>\n <div class=\"accordion-label\">\n {{ label }}\n </div>\n </div>\n <ng-template #default>\n <div class=\"accordion-label\">\n {{ label }}\n <ng-content select=\"[subHeader]\"></ng-content>\n <ui-icon\n [matTooltipClass]=\"applicationTheme\"\n [matTooltip]=\"premiumTooltipText\"\n [applicationTheme]=\"applicationTheme\"\n [name]=\"labelIcon ? labelIcon : applicationTheme === 'classic' ? 'Premium' : 'Premium-circle-in-line'\"\n *ngIf=\"showPremiumIcon || labelIcon\"\n ></ui-icon>\n </div>\n </ng-template>\n </mat-panel-title>\n <ng-template #customHeader>\n <ng-content select=\"[customHeader]\"></ng-content>\n </ng-template>\n <mat-panel-description>\n <div class=\"accordion-actions\">\n <ng-content select=\"[actions]\"></ng-content>\n </div>\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content></ng-content>\n </mat-expansion-panel>\n</mat-accordion>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { AccordionComponent } from './accordion.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { MatExpansionModule } from '@angular/material/expansion';\n\n@NgModule({\n declarations: [AccordionComponent],\n exports: [AccordionComponent],\n imports: [CommonModule, IconComponentModule, ButtonComponentModule, MatTooltipModule, MatExpansionModule],\n})\nexport class AccordionComponentModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|