carbon-components-svelte/src/UIShell/GlobalHeader/HeaderActionLink.svelte

40 lines
811 B
Svelte

<script>
/**
* Set to `true` to use the active state
* @type {boolean} [linkIsActive=false]
*/
export let linkIsActive = false;
/**
* Specify the `href` attribute
* @type {string} [href]
*/
export let href = undefined;
/**
* Specify the icon props
* @type {{ render: typeof import("carbon-icons-svelte/lib/Add16").default; skeleton: boolean; }} [icon]
*/
export let icon = undefined;
import { Icon } from "../../Icon";
</script>
<style>
.action-link {
text-align: center;
align-items: center;
vertical-align: middle;
justify-content: center;
padding-top: 10px;
}
</style>
<a
class:bx--header__action={true}
class:bx--header__action--active={linkIsActive}
class:action-link={true}
{...$$restProps}
{href}>
<Icon {...icon} />
</a>