NavbarVerticalItemAction Type documentation¶

AVOID USING THIS TYPE! Actions inside the navbar are an indication for a code smell.

Use NavbarVerticalItemRouterLink instead whenever possible.

Properties
Action that is called when the navbar item is triggered. action: (source: `this`) => `void`¶
The active state of the item. Note: It must be set manually. active?: `boolean`¶
Badge that is rendered after the label or as a red dot in the collapsed state. badge?: (`string` \| `number`) from `badge`¶
Color of the badge. Use any color shown here https://element.siemens.io/components/status-notifications/badges/#example without `bg-` prefix. badgeColor?: `string` from `badgeColor`¶
Optional icon that will be rendered before the label. icon?: `string` from `icon`¶
The ID is required if the navbar is used with UIState. id?: `string` from `id`¶
Label that is shown to the user. label: `TranslatableString` from `label`¶
type: `"action"`¶

Common properties shared among navbar item types.

Properties
Badge that is rendered after the label or as a red dot in the collapsed state. badge?: (`string` \| `number`)¶
Color of the badge. Use any color shown here https://element.siemens.io/components/status-notifications/badges/#example without `bg-` prefix. badgeColor?: `string`¶
Optional icon that will be rendered before the label. icon?: `string`¶
The ID is required if the navbar is used with UIState. id?: `string`¶
Label that is shown to the user. label: `TranslatableString`¶

Use this type to create a routerLink item.

Properties
Active match options for routerLinkActive activeMatchOptions?: (`IsActiveMatchOptions` \| { exact: `boolean` })¶
Badge that is rendered after the label or as a red dot in the collapsed state. badge?: (`string` \| `number`) from `badge`¶
Color of the badge. Use any color shown here https://element.siemens.io/components/status-notifications/badges/#example without `bg-` prefix. badgeColor?: `string` from `badgeColor`¶
Navigation extras that are passed to the `RouterLink` . extras?: `NavigationExtras`¶
Optional icon that will be rendered before the label. icon?: `string` from `icon`¶
The ID is required if the navbar is used with UIState. id?: `string` from `id`¶
Label that is shown to the user. label: `TranslatableString` from `label`¶
Link for the angular router. Accepts the same values as `RouterLink` . routerLink: (`string` \| `any`[])¶
type: `"router-link"`¶

badge? (`string` \| `number`)¶ Property Badge that is rendered after the label or as a red dot in the collapsed state.

badgeColor? `string`¶ Property Color of the badge. Use any color shown here https://element.siemens.io/components/status-notifications/badges/#example without `bg-` prefix.

icon? `string`¶ Property Optional icon that will be rendered before the label.

id? `string`¶ Property The ID is required if the navbar is used with UIState.

TranslatableString (`string` & `Translatable`)¶ Type alias Represents a translatable string. This can either be a translation key, e.g. `ACTIONS.EDIT` that will be automatically translated when displayed on the UI or a pre-translated string, e.g. `Edit` . Equivalent to a normal string in usage and functionality.

label `TranslatableString`¶ Property Label that is shown to the user.

Translatable ¶ import imported from @siemens/element-translate-ng

Except where otherwise noted, content on this site is licensed under MIT License.