myrta-ui 1.1.99 → 1.1.100
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.
|
@@ -76,10 +76,10 @@ export class DropdownComponent {
|
|
|
76
76
|
}
|
|
77
77
|
}
|
|
78
78
|
DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
79
|
-
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DropdownComponent, selector: "mrx-dropdown", inputs: { mainPlacement: "mainPlacement", fallbackPlacements: "fallbackPlacements", closeOnClick: "closeOnClick", customClasses: "customClasses" }, queries: [{ propertyName: "dropdownToggle", first: true, predicate: ["dropdownToggle"], descendants: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }], viewQueries: [{ propertyName: "dropdownToggleEl", first: true, predicate: ["dropdownToggleEl"], descendants: true }, { propertyName: "dropdownContent", first: true, predicate: ["dropdownContent"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding
|
|
79
|
+
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DropdownComponent, selector: "mrx-dropdown", inputs: { mainPlacement: "mainPlacement", fallbackPlacements: "fallbackPlacements", closeOnClick: "closeOnClick", customClasses: "customClasses" }, queries: [{ propertyName: "dropdownToggle", first: true, predicate: ["dropdownToggle"], descendants: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }], viewQueries: [{ propertyName: "dropdownToggleEl", first: true, predicate: ["dropdownToggleEl"], descendants: true }, { propertyName: "dropdownContent", first: true, predicate: ["dropdownContent"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding:10px 8px 10px 16px;clear:both;text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626);display:flex;align-items:center;cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button:hover{color:var(--neutral-text-primary, #262626);background-color:var(--brand-bg-tertiary-hover, #edf5ff)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button svg{margin-right:10px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button span{font-weight:400;font-size:14px;line-height:20px}.mrx-dropdown-toggle.mrx-dropdown-toggle{cursor:pointer}\n"], directives: [{ type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
80
80
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
81
81
|
type: Component,
|
|
82
|
-
args: [{ selector: 'mrx-dropdown', template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding
|
|
82
|
+
args: [{ selector: 'mrx-dropdown', template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding:10px 8px 10px 16px;clear:both;text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626);display:flex;align-items:center;cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button:hover{color:var(--neutral-text-primary, #262626);background-color:var(--brand-bg-tertiary-hover, #edf5ff)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button svg{margin-right:10px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button span{font-weight:400;font-size:14px;line-height:20px}.mrx-dropdown-toggle.mrx-dropdown-toggle{cursor:pointer}\n"] }]
|
|
83
83
|
}], propDecorators: { dropdownToggleEl: [{
|
|
84
84
|
type: ViewChild,
|
|
85
85
|
args: ['dropdownToggleEl']
|
package/fesm2015/myrta-ui.mjs
CHANGED
|
@@ -1670,10 +1670,10 @@ class DropdownComponent {
|
|
|
1670
1670
|
}
|
|
1671
1671
|
}
|
|
1672
1672
|
DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1673
|
-
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DropdownComponent, selector: "mrx-dropdown", inputs: { mainPlacement: "mainPlacement", fallbackPlacements: "fallbackPlacements", closeOnClick: "closeOnClick", customClasses: "customClasses" }, queries: [{ propertyName: "dropdownToggle", first: true, predicate: ["dropdownToggle"], descendants: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }], viewQueries: [{ propertyName: "dropdownToggleEl", first: true, predicate: ["dropdownToggleEl"], descendants: true }, { propertyName: "dropdownContent", first: true, predicate: ["dropdownContent"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding
|
|
1673
|
+
DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: DropdownComponent, selector: "mrx-dropdown", inputs: { mainPlacement: "mainPlacement", fallbackPlacements: "fallbackPlacements", closeOnClick: "closeOnClick", customClasses: "customClasses" }, queries: [{ propertyName: "dropdownToggle", first: true, predicate: ["dropdownToggle"], descendants: true }, { propertyName: "dropdownMenu", first: true, predicate: ["dropdownMenu"], descendants: true }], viewQueries: [{ propertyName: "dropdownToggleEl", first: true, predicate: ["dropdownToggleEl"], descendants: true }, { propertyName: "dropdownContent", first: true, predicate: ["dropdownContent"], descendants: true }], ngImport: i0, template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding:10px 8px 10px 16px;clear:both;text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626);display:flex;align-items:center;cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button:hover{color:var(--neutral-text-primary, #262626);background-color:var(--brand-bg-tertiary-hover, #edf5ff)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button svg{margin-right:10px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button span{font-weight:400;font-size:14px;line-height:20px}.mrx-dropdown-toggle.mrx-dropdown-toggle{cursor:pointer}\n"], directives: [{ type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
1674
1674
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: DropdownComponent, decorators: [{
|
|
1675
1675
|
type: Component,
|
|
1676
|
-
args: [{ selector: 'mrx-dropdown', template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-primary)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding
|
|
1676
|
+
args: [{ selector: 'mrx-dropdown', template: "<div class=\"mrx-dropdown d-flex\" [class]=\"customClasses\">\r\n <div class=\"mrx-dropdown-toggle\" #dropdownToggleEl>\r\n <ng-container *ngTemplateOutlet=\"dropdownToggle\"></ng-container>\r\n </div>\r\n\r\n <div class=\"mrx-dropdown-content\" #dropdownContent>\r\n\r\n <div class=\"mrx-dropdown-wrapper\">\r\n <div class=\"mrx-dropdown-menu\" *ngIf=\"dropdownMenu\">\r\n <ng-container *ngTemplateOutlet=\"dropdownMenu\"></ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".mrx-dropdown.mrx-dropdown .mrx-dropdown-content{border-radius:4px;z-index:1000;display:none}.mrx-dropdown.mrx-dropdown .mrx-dropdown-content[data-show]{display:block}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu{display:flex;flex-direction:column;border-radius:4px;background-color:#fff;background-clip:padding-box;box-shadow:0 1px 4px #3a3a3a4d;min-width:240px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item{display:flex;align-items:flex-start;justify-content:space-between;padding:var(--spacing-2);padding-left:var(--spacing-4);cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item:hover{background-color:var(--brand-bg-tertiary-hover)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content{display:flex;align-items:flex-start;gap:var(--spacing-2)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-content .mrx-icon{transform:translateY(2px)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu .dropdown-item-text{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button{width:100%;padding:10px 8px 10px 16px;clear:both;text-align:inherit;text-decoration:none;white-space:nowrap;background-color:transparent;border:0;font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px);color:var(--neutral-text-primary, #262626);display:flex;align-items:center;cursor:pointer}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button:hover{color:var(--neutral-text-primary, #262626);background-color:var(--brand-bg-tertiary-hover, #edf5ff)}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button svg{margin-right:10px}:host::ng-deep .mrx-dropdown-menu.mrx-dropdown-menu button span{font-weight:400;font-size:14px;line-height:20px}.mrx-dropdown-toggle.mrx-dropdown-toggle{cursor:pointer}\n"] }]
|
|
1677
1677
|
}], propDecorators: { dropdownToggleEl: [{
|
|
1678
1678
|
type: ViewChild,
|
|
1679
1679
|
args: ['dropdownToggleEl']
|