mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 11:36:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

HeaderGlobalAction now uses Button component instead of native button

Browse source
This commit is contained in:
militant_gnome 2024-01-15 18:07:56 +02:00 • committed by Eric Liu
commit cf2aa24552
1 changed files with 17 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/UIShell/HeaderGlobalAction.svelte
View file

@ -1,4 +1,8 @@
<script> <script>
/**
* @extends {"../Button/Button.svelte"} ButtonProps
*/
/** Set to `true` to use the active variant */ /** Set to `true` to use the active variant */
export let isActive = false; export let isActive = false;
@ -10,17 +14,18 @@
/** Obtain a reference to the HTML button element */ /** Obtain a reference to the HTML button element */
export let ref = null; export let ref = null;
import Button from "../Button/Button.svelte";
$: buttonClass = [
"bx--header__action",
isActive && " bx--header__action--active",
$$restProps.class,
]
.filter(Boolean)
.join(" ");
</script> </script>
<button <Button bind:this="{ref}" class="{buttonClass}" {...$$restProps} on:click>
type="button" <svelte:component this="{icon}" slot="icon" size="{20}" />
bind:this="{ref}" </Button>
class:bx--header__action="{true}"
class:bx--header__action--active="{isActive}"
{...$$restProps}
on:click
>
<slot>
<svelte:component this="{icon}" size="{20}" />
</slot>
</button>