@synergy-design-system/angular
Version:
Angular wrappers for the Synergy Design System
118 lines (114 loc) • 4.67 kB
JavaScript
import * as i0 from '@angular/core';
import { Input, Component } from '@angular/core';
import '@synergy-design-system/components/components/menu-item/menu-item.js';
// ---------------------------------------------------------------------
// 🔒 AUTOGENERATED @synergy-design-system/angular wrappers for @synergy-design-system/components
// Please do not edit this file directly!
// It will get recreated when running pnpm build.
// ---------------------------------------------------------------------
/**
* @summary Menu items provide options for the user to pick from in a menu.
* @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-menu-item--docs
* @status stable
* @since 2.0
*
* @dependency syn-icon
* @dependency syn-popup
* @dependency syn-spinner
*
* @slot - The menu item's label.
* @slot prefix - Used to prepend an icon or similar element to the menu item.
* @slot suffix - Used to append an icon or similar element to the menu item.
* @slot submenu - Used to denote a nested menu.
*
* @csspart base - The component's base wrapper.
* @csspart checked-icon - The checked icon, which is only visible when the menu item is checked.
* @csspart prefix - The prefix container.
* @csspart label - The menu item label.
* @csspart suffix - The suffix container.
* @csspart spinner - The spinner that shows when the menu item is in the loading state.
* @csspart spinner__base - The spinner's base part.
* @csspart submenu-icon - The submenu icon, visible only when the menu item has a submenu (not yet implemented).
*
* @cssproperty [--submenu-offset=-2px] - The distance submenus shift to overlap the parent menu.
*/
class SynMenuItemComponent {
nativeElement;
_ngZone;
constructor(e, ngZone) {
this.nativeElement = e.nativeElement;
this._ngZone = ngZone;
}
/**
* The type of menu item to render.
* To use `checked`, this value must be set to `checkbox`.
*/
set type(v) {
this._ngZone.runOutsideAngular(() => (this.nativeElement.type = v));
}
get type() {
return this.nativeElement.type;
}
/**
* Draws the item in a checked state.
*/
set checked(v) {
this._ngZone.runOutsideAngular(() => (this.nativeElement.checked = v === '' || v));
}
get checked() {
return this.nativeElement.checked;
}
/**
* A unique value to store in the menu item.
* This can be used as a way to identify menu items when selected.
*/
set value(v) {
this._ngZone.runOutsideAngular(() => (this.nativeElement.value = v));
}
get value() {
return this.nativeElement.value;
}
/**
* Draws the menu item in a loading state.
*/
set loading(v) {
this._ngZone.runOutsideAngular(() => (this.nativeElement.loading = v === '' || v));
}
get loading() {
return this.nativeElement.loading;
}
/**
* Draws the menu item in a disabled state, preventing selection.
*/
set disabled(v) {
this._ngZone.runOutsideAngular(() => (this.nativeElement.disabled = v === '' || v));
}
get disabled() {
return this.nativeElement.disabled;
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.1", ngImport: i0, type: SynMenuItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.1", type: SynMenuItemComponent, isStandalone: true, selector: "syn-menu-item", inputs: { type: "type", checked: "checked", value: "value", loading: "loading", disabled: "disabled" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.1", ngImport: i0, type: SynMenuItemComponent, decorators: [{
type: Component,
args: [{
selector: 'syn-menu-item',
standalone: true,
template: '<ng-content></ng-content>',
}]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { type: [{
type: Input
}], checked: [{
type: Input
}], value: [{
type: Input
}], loading: [{
type: Input
}], disabled: [{
type: Input
}] } });
/**
* Generated bundle index. Do not edit.
*/
export { SynMenuItemComponent };
//# sourceMappingURL=synergy-design-system-angular-components-menu-item.mjs.map