Navigation Item

<gstock-navigation-item> | GstockNavigationItem

API

Propiedades

Nombre	Descripción	Reflects	Tipo	Por defecto
`disabled`	Draws the menu item in a disabled state, preventing selection.		`boolean`	`false`
`distance`	The distance in pixels from which to offset the menu away from its trigger.		`number`	`1`
`download`	Tells the browser to download the linked file as this filename. Only used when `href` is present.		`string \| undefined`	`-`
`href`	When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`.		`string`	`''`
`hoist`	Enable this option to prevent the menu from being clipped when the component is placed inside a container with `overflow: auto\|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.		`boolean`	`false`
`icon`	The icon name.		`string \| undefined`	`-`
`label`	A label to use to describe the avatar to assistive devices.		`string`	`''`
`open`	Indicates whether or not the dropdown is open. You can toggle this attribute to show and hide the dropdown, or you can use the `show()` and `hide()` methods and this attribute will reflect the dropdown’s open state.		`boolean`	`false`
`orientation`	The orientation for display the navigation item.		`'horizontal' \| 'vertical'`	`'horizontal'`
`rel`	When using `href`, this attribute will map to the underlying link’s `rel` attribute. Unlike regular links, the default is `noreferrer noopener` to prevent security exploits. However, if you’re using `target` to point to a specific tab/window, this will prevent that from working correctly. You can remove or change the default value by setting the attribute to an empty string or a value of your choice, respectively.		`string`	`'noreferrer noopener'`
`skidding`	The distance in pixels from which to offset the panel along its trigger.		`number`	`0`
`sync`	Syncs the popup width or height to that of the trigger element.		`'width' \| 'height' \| 'both' \| undefined`	`undefined`
`target`	Tells the browser where to open the link. Only used when `href` is present.		`'_blank' \| '_parent' \| '_self' \| '_top'`	`-`
`value`	A unique value to store in the menu item. This can be used as a way to identify menu items when selected.		`string`	`''`
`updateComplete`	A read-only promise that resolves when the component has finished updating.

Aprende más sobre atributos y propiedades .

Slots

Nombre	Descripción
`default`	The label of the menu item.
`icon`	Used to prepend an icon or similar element to the menu item.
`menu`	Used to denote a nested menu.

Aprende más sobre slots .

Métodos

Nombre	Descripción
`show( )`	Shows the dropdown menu.
`hide( )`	Hides the dropdown menu
`getTextLabel( )`	Returns a text label based on the contents of the menu item’s default slot.

Aprende más sobre métodos .

Propiedades personalizadas

Nombre	Descripción	Default
`--menu-offset`	The distance menus shift to overlap the parent menu.	-2px

Aprende más sobre propiedades personalizadas .

Partes

Nombre	Descripción
`base`	The component’s base wrapper.
`icon`	The icon container.
`label`	The menu item label.
`menu-icon`	The menu icon, visible only when the menu item has a menu (not yet implemented).

Aprende más sobre partes CSS .

Dependencias

Este componente importa automáticamente las siguientes dependencias.