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

refactor(components): convert const to reactive where appropriate

Browse source 
- Inline class assignments to avoid script-level clutter
- Ignore a11y-missing-attribute instead of redundant href
This commit is contained in:
Eric Liu 2019-12-24 09:41:12 -08:00
commit c446fc74f4
94 changed files with 469 additions and 598 deletions
Download patch file Download diff file Expand all files Collapse all files

18
src/components/ComposedModal/ModalHeader.svelte
View file

@ -10,34 +10,28 @@
export let iconDescription = 'Close';
export let style = undefined;
import Close20 from 'carbon-icons-svelte/lib/Close20';
import { getContext } from 'svelte';
import Close20 from 'carbon-icons-svelte/lib/Close20';
import { cx } from '../../lib';
const { closeModal } = getContext('ComposedModal');
const _class = cx('--modal-header', className);
const _labelClass = cx('--modal-header__label', '--type-delta', labelClass);
const _titleClass = cx('--modal-header__heading', '--type-beta', titleClass);
const _closeClass = cx('--modal-close', closeClass);
const _closeIconClass = cx('--modal-close__icon', closeIconClass);
</script>
<div class={_class} {style}>
<div class={cx('--modal-header', className)} {style}>
{#if label}
<p class={_labelClass}>{label}</p>
<p class={cx('--modal-header__label', '--type-delta', labelClass)}>{label}</p>
{/if}
{#if title}
<p class={_titleClass}>{title}</p>
<p class={cx('--modal-header__heading', '--type-beta', titleClass)}>{title}</p>
{/if}
<slot />
<button
type="button"
title={iconDescription}
aria-label={iconDescription}
class={_closeClass}
class={cx('--modal-close', closeClass)}
on:click
on:click={closeModal}>
<Close20 class={_closeIconClass} />
<Close20 class={cx('--modal-close__icon', closeIconClass)} />
</button>
</div>