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

refactor: use $$restProps API

Browse source 
- add ref prop for applicable components (#196)
- add slot to Content Switcher `Switch` component (#183)
- remove fillArray, css utilities
This commit is contained in:
Eric Liu 2020-07-18 20:00:20 -07:00
commit e886d772c7
288 changed files with 4681 additions and 4498 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/components/StructuredList/StructuredList.Skeleton.svelte
View file

@ -1,39 +1,38 @@
<script>
let className = undefined;
export { className as class };
export let border = false;
export let rows = 5;
export let style = undefined;
import { cx, fillArray } from '../../lib';
</script>
<section
class:bx--skeleton={true}
class:bx--structured-list={true}
class:bx--structured-list--border={border}
{...$$restProps}
on:click
on:mouseover
on:mouseenter
on:mouseleave
class={cx('--skeleton', '--structured-list', border && '--structured-list--border', className)}
{style}>
<div class={cx('--structured-list-thead')}>
<div class={cx('--structured-list-row', '--structured-list-row--header-row')}>
<div class={cx('--structured-list-th')}>
on:mouseleave>
<div class:bx--structured-list-thead={true}>
<div
class:bx--structured-list-row={true}
class:bx--structured-list-row--header-row={true}>
<div class:bx--structured-list-th={true}>
<span />
</div>
<div class={cx('--structured-list-th')}>
<div class:bx--structured-list-th={true}>
<span />
</div>
<div class={cx('--structured-list-th')}>
<div class:bx--structured-list-th={true}>
<span />
</div>
</div>
</div>
<div class={cx('--structured-list-tbody')}>
{#each fillArray(rows) as row, i (row)}
<div class={cx('--structured-list-row')}>
<div class={cx('--structured-list-td')} />
<div class={cx('--structured-list-td')} />
<div class={cx('--structured-list-td')} />
<div class:bx--structured-list-tbody={true}>
{#each Array.from({ length: rows }, (_, i) => i) as row, i (row)}
<div class:bx--structured-list-row={true}>
<div class:bx--structured-list-td={true} />
<div class:bx--structured-list-td={true} />
<div class:bx--structured-list-td={true} />
</div>
{/each}
</div>