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

53
src/components/DataTable/TableHeader.svelte
View file

@ -1,53 +0,0 @@
<script>
export let scope = "col";
export let translateWithId = () => "";
export let id = "ccs-" + Math.random().toString(36);
import { getContext } from "svelte";
import ArrowUp20 from "carbon-icons-svelte/lib/ArrowUp20";
import ArrowsVertical20 from "carbon-icons-svelte/lib/ArrowsVertical20";
const { sortHeader, tableSortable, add } = getContext("DataTable");
add(id);
$: active = $sortHeader.id === id;
// TODO: translate with id
$: ariaLabel = translateWithId();
</script>
{#if $tableSortable}
<th
aria-sort={active ? $sortHeader.sortDirection : 'none'}
{scope}
{...$$restProps}
on:mouseover
on:mouseenter
on:mouseleave>
<button
class:bx--table-sort={true}
class:bx--table-sort--active={active}
class:bx--table-sort--ascending={active && $sortHeader.sortDirection === 'descending'}
on:click>
<span class:bx--table-header-label={true}>
<slot />
</span>
<ArrowUp20 aria-label={ariaLabel} class="bx--table-sort__icon" />
<ArrowsVertical20
aria-label={ariaLabel}
class="bx--table-sort__icon-unsorted" />
</button>
</th>
{:else}
<th
{scope}
{...$$restProps}
on:click
on:mouseover
on:mouseenter
on:mouseleave>
<span class:bx--table-header-label={true}>
<slot />
</span>
</th>
{/if}