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

Alignment with Carbon version 10.28 (#505)

Browse source 
* chore(deps-dev): remove @carbon/themes

* chore(deps-dev): bump devDependencies

* fix(tabs): forward click event to Tab

* feat(toggle): dispatch toggle event

* feat(tag): dispatch close event

* feat(tooltip-icon): make tooltipText slottable

* feat(dropdown): add hideLabel prop

* docs(select): add "Hidden label" example

* refactor(modal): use class directive

* feat(modal): dispatch transitionend event

* chore(deps-dev): upgrade carbon-components to 10.28.0-rc.0

* feat(date-picker): add warn state

* feat(tag): support small size variant

* fix(search): add semantic role

* feat(toolbar-search): add disabled state

* fix(composed-modal): add aria-label prop, update header semantic tags

* chore(deps-dev): upgrade carbon-components to v10.28

* docs(overflow-menu): add light variant example

* docs(link): document OutboundLink in Component API

* chore(tooltip-icon): rename slot to "tooltipText"

* docs(component-api): wrap code blocks to minimize width

* docs(aspect-ratio): remove inline outline style

* fix(tab): do not trigger focus when mounting

* docs(tabs): add reactive example

Closes #438
This commit is contained in:
Eric Liu 2021-02-05 05:59:10 -08:00 • committed by GitHub
commit 7cd3723960
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
47 changed files with 549 additions and 240 deletions
Download patch file Download diff file Expand all files Collapse all files

20
src/Tabs/Tab.svelte
View file

@ -20,16 +20,27 @@
/** Obtain a reference to the anchor HTML element */
export let ref = null;
import { getContext } from "svelte";
import { onMount, afterUpdate, getContext, tick } from "svelte";
const { selectedTab, add, update, change } = getContext("Tabs");
add({ id, label, disabled });
let didMount = false;
$: selected = $selectedTab === id;
$: if (selected && ref) {
ref.focus();
}
onMount(() => {
tick().then(() => {
didMount = true;
});
});
afterUpdate(() => {
if (didMount && selected && ref) {
ref.focus();
}
});
</script>
<li
@ -39,6 +50,7 @@
class:bx--tabs__nav-item--disabled="{disabled}"
class:bx--tabs__nav-item--selected="{selected}"
{...$$restProps}
on:click|preventDefault
on:click|preventDefault="{() => {
if (!disabled) {
update(id);