Add closeIcon option and remove stopPropagation on:click in HeaderAction (#840)

* Remove stopPropagation on:click

Remove stopPropagation on:click helps when you have more then one acction to switch between actions tabs

* fix bug for default icon

* add closeIcon attribute to HeaderAction
This commit is contained in:
Daniel Miedzik 2021-10-16 01:23:34 +02:00 committed by GitHub
commit 1581bc0122
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 48 additions and 5 deletions

View file

@ -10,7 +10,13 @@
* Specify the icon from `carbon-icons-svelte` to render
* @type {typeof import("carbon-icons-svelte").CarbonIcon}
*/
export let icon = undefined;
export let icon = AppSwitcher20;
/**
* Specify the close icon from `carbon-icons-svelte` to render
* @type {typeof import("carbon-icons-svelte").CarbonIcon}
*/
export let closeIcon = Close20;
/**
* Specify the text
@ -58,12 +64,13 @@
class:action-text="{text}"
{...$$restProps}
on:click
on:click|stopPropagation="{() => {
on:click="{() => {
isOpen = !isOpen;
dispatch(isOpen ? 'open' : 'close');
}}"
>
<Icon render="{icon || (isOpen ? Close20 : AppSwitcher20)}" />
<Icon render="{icon}" style="{isOpen ? 'display: none' : ''}" />
<Icon render="{closeIcon}" style="{!isOpen ? 'display: none' : ''}" />
<slot name="text">
{#if text}<span>{text}</span>{/if}
</slot>