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

chore: lift components folder

Browse source
This commit is contained in:
Eric Liu 2020-07-19 09:06:08 -07:00
commit 2200b29b92
301 changed files with 57 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,41 +0,0 @@
<script>
export let lines = 3;
export let heading = false;
export let paragraph = false;
export let width = "100%";
const randoms = [0.973, 0.153, 0.567];
$: rows = [];
$: widthNum = parseInt(width, 10);
$: widthPx = width.includes("px");
$: if (paragraph) {
for (let i = 0; i < lines; i++) {
const min = widthPx ? widthNum - 75 : 0;
const max = widthPx ? widthNum : 75;
const rand = Math.floor(randoms[i % 3] * (max - min + 1)) + min + "px";
rows = [...rows, { width: widthPx ? rand : `calc(${width} - ${rand})` }];
}
}
</script>
{#if paragraph}
<div {...$$restProps} on:click on:mouseover on:mouseenter on:mouseleave>
{#each rows as { width }, i (width)}
<p
class:bx--skeleton__text={true}
class:bx--skeleton__heading={heading}
style="width: {width}" />
{/each}
</div>
{:else}
<p
class:bx--skeleton__text={true}
class:bx--skeleton__heading={heading}
{...$$restProps}
style="width: {width};{$$restProps.style}"
on:click
on:mouseover
on:mouseenter
on:mouseleave />
{/if}