Various features/fixes (#727)

* fix(data-table): export useStaticWidth prop

* docs(data-table): add static width example

* fix(data-table): do not render table header if title/description not provided

* feat(modal): dispatch "click:button--primary" as an alias to "submit"

* test: update DataTable types test

* test(modal): update modal type tests

* docs(data-table): add clear reminder to key headers/rows
This commit is contained in:
Eric Liu 2021-07-05 13:22:56 -07:00 committed by GitHub
commit 0a69f8ec74
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 128 additions and 28 deletions

View file

@ -91,6 +91,9 @@
/** Set to `true` to enable a sticky header */
export let stickyHeader = false;
/** Set to `true` to use static width */
export let useStaticWidth = false;
import { createEventDispatcher, setContext } from "svelte";
import { writable, derived } from "svelte/store";
import ChevronRight16 from "carbon-icons-svelte/lib/ChevronRight16/ChevronRight16.svelte";
@ -203,24 +206,27 @@
</script>
<TableContainer {...$$restProps}>
<div class:bx--data-table-header="{true}">
{#if title || $$slots.title}
<h4 class:bx--data-table-header__title="{true}">
<slot name="title">{title}</slot>
</h4>
{/if}
{#if description || $$slots.description}
<p class:bx--data-table-header__description="{true}">
<slot name="description">{description}</slot>
</p>
{/if}
</div>
{#if title || $$slots.title || description || $$slots.description}
<div class:bx--data-table-header="{true}">
{#if title || $$slots.title}
<h4 class:bx--data-table-header__title="{true}">
<slot name="title">{title}</slot>
</h4>
{/if}
{#if description || $$slots.description}
<p class:bx--data-table-header__description="{true}">
<slot name="description">{description}</slot>
</p>
{/if}
</div>
{/if}
<slot />
<Table
zebra="{zebra}"
size="{size}"
stickyHeader="{stickyHeader}"
sortable="{sortable}"
useStaticWidth="{useStaticWidth}"
>
<TableHead>
<TableRow>