@tedi-design-system/angular 6.2.0-rc.19 → 6.2.0-rc.20
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.
|
@@ -2117,11 +2117,11 @@ class CollapseComponent {
|
|
|
2117
2117
|
}
|
|
2118
2118
|
}
|
|
2119
2119
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollapseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2120
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CollapseComponent, isStandalone: true, selector: "tedi-collapse", inputs: { openText: { classPropertyName: "openText", publicName: "openText", isSignal: true, isRequired: false, transformFunction: null }, closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, hideCollapseText: { classPropertyName: "hideCollapseText", publicName: "hideCollapseText", isSignal: true, isRequired: false, transformFunction: null }, arrowType: { classPropertyName: "arrowType", publicName: "arrowType", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tedi-collapse\" [class.tedi-collapse--open]=\"isOpen() === true\">\n <button\n class=\"tedi-collapse__button\"\n (click)=\"toggleCollapse()\"\n [attr.aria-expanded]=\"isOpen() ? true : false\"\n [attr.aria-controls]=\"collapseContentId\"\n >\n @if (hideCollapseText() === false) {\n <p tedi-text color=\"brand\" class=\"tedi-collapse__button--text\">\n {{\n isOpen()\n ? (closeText() ?? (\"close\" | tediTranslate))\n : (openText() ?? (\"open\" | tediTranslate))\n }}\n </p>\n }\n @if (arrowType() === \"default\") {\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n } @else if (arrowType() === \"secondary\") {\n <div class=\"tedi-collapse__icon--wrapper\">\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n </div>\n }\n </button>\n <div class=\"tedi-collapse__content\" [id]=\"collapseContentId\">\n <div class=\"tedi-collapse__extender\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block}.tedi-collapse__button{display:flex;gap:var(--link-inner-spacing-x);align-items:center;padding:0;font:inherit;color:inherit;text-decoration:none;cursor:pointer;background-color:var(--color-transparent);border:none}.tedi-collapse__button:disabled{cursor:default}.tedi-collapse__button--text{text-decoration:underline}.tedi-collapse__button:focus-visible{outline:2px solid var(--button-main-neutral-text-default);outline-offset:var(--global-outline-offset)}.tedi-collapse__icon{color:var(--button-main-neutral-text-default);transition:transform .3s ease}.tedi-collapse__icon--wrapper{display:flex;align-items:center;justify-content:center;width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);border:var(--borders-01) solid var(--button-main-secondary-border-default);border-radius:100%}.tedi-collapse--open>.tedi-collapse__button .tedi-collapse__icon{transform:rotate(180deg)}.tedi-collapse__extender{visibility:hidden;min-height:0;transition:visibility .3s}.tedi-collapse__content{display:grid;grid-template-rows:0fr;
|
|
2120
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CollapseComponent, isStandalone: true, selector: "tedi-collapse", inputs: { openText: { classPropertyName: "openText", publicName: "openText", isSignal: true, isRequired: false, transformFunction: null }, closeText: { classPropertyName: "closeText", publicName: "closeText", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, hideCollapseText: { classPropertyName: "hideCollapseText", publicName: "hideCollapseText", isSignal: true, isRequired: false, transformFunction: null }, arrowType: { classPropertyName: "arrowType", publicName: "arrowType", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"tedi-collapse\" [class.tedi-collapse--open]=\"isOpen() === true\">\n <button\n class=\"tedi-collapse__button\"\n (click)=\"toggleCollapse()\"\n [attr.aria-expanded]=\"isOpen() ? true : false\"\n [attr.aria-controls]=\"collapseContentId\"\n >\n @if (hideCollapseText() === false) {\n <p tedi-text color=\"brand\" class=\"tedi-collapse__button--text\">\n {{\n isOpen()\n ? (closeText() ?? (\"close\" | tediTranslate))\n : (openText() ?? (\"open\" | tediTranslate))\n }}\n </p>\n }\n @if (arrowType() === \"default\") {\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n } @else if (arrowType() === \"secondary\") {\n <div class=\"tedi-collapse__icon--wrapper\">\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n </div>\n }\n </button>\n <div class=\"tedi-collapse__content\" [id]=\"collapseContentId\">\n <div class=\"tedi-collapse__extender\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block}.tedi-collapse__button{display:flex;gap:var(--link-inner-spacing-x);align-items:center;padding:0;font:inherit;color:inherit;text-decoration:none;cursor:pointer;background-color:var(--color-transparent);border:none}.tedi-collapse__button:disabled{cursor:default}.tedi-collapse__button--text{text-decoration:underline}.tedi-collapse__button:focus-visible{outline:2px solid var(--button-main-neutral-text-default);outline-offset:var(--global-outline-offset)}.tedi-collapse__icon{color:var(--button-main-neutral-text-default);transition:transform .3s ease}.tedi-collapse__icon--wrapper{display:flex;align-items:center;justify-content:center;width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);border:var(--borders-01) solid var(--button-main-secondary-border-default);border-radius:100%}.tedi-collapse--open>.tedi-collapse__button .tedi-collapse__icon{transform:rotate(180deg)}.tedi-collapse__extender{visibility:hidden;min-height:0;padding-top:var(--dimensions-05);transition:visibility .3s}.tedi-collapse__content{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .3s}.tedi-collapse--open>.tedi-collapse__content{grid-template-rows:1fr}.tedi-collapse--open>.tedi-collapse__content .tedi-collapse__extender{visibility:visible}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
2121
2121
|
}
|
|
2122
2122
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CollapseComponent, decorators: [{
|
|
2123
2123
|
type: Component,
|
|
2124
|
-
args: [{ standalone: true, selector: "tedi-collapse", imports: [IconComponent, TextComponent, TediTranslationPipe], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"tedi-collapse\" [class.tedi-collapse--open]=\"isOpen() === true\">\n <button\n class=\"tedi-collapse__button\"\n (click)=\"toggleCollapse()\"\n [attr.aria-expanded]=\"isOpen() ? true : false\"\n [attr.aria-controls]=\"collapseContentId\"\n >\n @if (hideCollapseText() === false) {\n <p tedi-text color=\"brand\" class=\"tedi-collapse__button--text\">\n {{\n isOpen()\n ? (closeText() ?? (\"close\" | tediTranslate))\n : (openText() ?? (\"open\" | tediTranslate))\n }}\n </p>\n }\n @if (arrowType() === \"default\") {\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n } @else if (arrowType() === \"secondary\") {\n <div class=\"tedi-collapse__icon--wrapper\">\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n </div>\n }\n </button>\n <div class=\"tedi-collapse__content\" [id]=\"collapseContentId\">\n <div class=\"tedi-collapse__extender\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block}.tedi-collapse__button{display:flex;gap:var(--link-inner-spacing-x);align-items:center;padding:0;font:inherit;color:inherit;text-decoration:none;cursor:pointer;background-color:var(--color-transparent);border:none}.tedi-collapse__button:disabled{cursor:default}.tedi-collapse__button--text{text-decoration:underline}.tedi-collapse__button:focus-visible{outline:2px solid var(--button-main-neutral-text-default);outline-offset:var(--global-outline-offset)}.tedi-collapse__icon{color:var(--button-main-neutral-text-default);transition:transform .3s ease}.tedi-collapse__icon--wrapper{display:flex;align-items:center;justify-content:center;width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);border:var(--borders-01) solid var(--button-main-secondary-border-default);border-radius:100%}.tedi-collapse--open>.tedi-collapse__button .tedi-collapse__icon{transform:rotate(180deg)}.tedi-collapse__extender{visibility:hidden;min-height:0;transition:visibility .3s}.tedi-collapse__content{display:grid;grid-template-rows:0fr;
|
|
2124
|
+
args: [{ standalone: true, selector: "tedi-collapse", imports: [IconComponent, TextComponent, TediTranslationPipe], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"tedi-collapse\" [class.tedi-collapse--open]=\"isOpen() === true\">\n <button\n class=\"tedi-collapse__button\"\n (click)=\"toggleCollapse()\"\n [attr.aria-expanded]=\"isOpen() ? true : false\"\n [attr.aria-controls]=\"collapseContentId\"\n >\n @if (hideCollapseText() === false) {\n <p tedi-text color=\"brand\" class=\"tedi-collapse__button--text\">\n {{\n isOpen()\n ? (closeText() ?? (\"close\" | tediTranslate))\n : (openText() ?? (\"open\" | tediTranslate))\n }}\n </p>\n }\n @if (arrowType() === \"default\") {\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n } @else if (arrowType() === \"secondary\") {\n <div class=\"tedi-collapse__icon--wrapper\">\n <tedi-icon class=\"tedi-collapse__icon\" name=\"expand_more\" color=\"brand\" />\n </div>\n }\n </button>\n <div class=\"tedi-collapse__content\" [id]=\"collapseContentId\">\n <div class=\"tedi-collapse__extender\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>\n", styles: [":host{display:block}.tedi-collapse__button{display:flex;gap:var(--link-inner-spacing-x);align-items:center;padding:0;font:inherit;color:inherit;text-decoration:none;cursor:pointer;background-color:var(--color-transparent);border:none}.tedi-collapse__button:disabled{cursor:default}.tedi-collapse__button--text{text-decoration:underline}.tedi-collapse__button:focus-visible{outline:2px solid var(--button-main-neutral-text-default);outline-offset:var(--global-outline-offset)}.tedi-collapse__icon{color:var(--button-main-neutral-text-default);transition:transform .3s ease}.tedi-collapse__icon--wrapper{display:flex;align-items:center;justify-content:center;width:var(--button-sm-icon-size);height:var(--button-sm-icon-size);border:var(--borders-01) solid var(--button-main-secondary-border-default);border-radius:100%}.tedi-collapse--open>.tedi-collapse__button .tedi-collapse__icon{transform:rotate(180deg)}.tedi-collapse__extender{visibility:hidden;min-height:0;padding-top:var(--dimensions-05);transition:visibility .3s}.tedi-collapse__content{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .3s}.tedi-collapse--open>.tedi-collapse__content{grid-template-rows:1fr}.tedi-collapse--open>.tedi-collapse__content .tedi-collapse__extender{visibility:visible}\n"] }]
|
|
2125
2125
|
}] });
|
|
2126
2126
|
|
|
2127
2127
|
class ListComponent {
|