mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 18:31:06 +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

14
src/components/SkeletonText/SkeletonText.svelte
View file

@ -10,13 +10,11 @@
import { cx } from '../../lib';
const randoms = [0.973051493507435, 0.15334737213558558, 0.5671034553053769];
const _class = cx('--skeleton__text', heading && '--skeleton__heading', className);
const widthNum = parseInt(width, 10);
const widthPx = width.includes('px');
const widthPercent = width.includes('%');
let lines = [];
$: widthNum = parseInt(width, 10);
$: widthPx = width.includes('px');
$: widthPercent = width.includes('%');
$: if (paragraph) {
for (let i = 0; i < lineCount; i++) {
const min = widthPx ? widthNum - 75 : 0;
@ -30,7 +28,9 @@
{#if paragraph}
<div on:click on:mouseover on:mouseenter on:mouseleave {style}>
{#each lines as { width }}
<p class={_class} style={`width: ${width};`} />
<p
class={cx('--skeleton__text', heading && '--skeleton__heading', className)}
style={`width: ${width};`} />
{/each}
</div>
{:else}
@ -39,7 +39,7 @@
on:mouseover
on:mouseenter
on:mouseleave
class={_class}
class={cx('--skeleton__text', heading && '--skeleton__heading', className)}
style={`width: ${width};`}
{style} />
{/if}