carbon-components-svelte/src/DataTable/Toolbar.svelte
Eric Liu c39427670a feat(data-table): add ToolbarMenu
Requires menuRef from OverflowMenu to be exported.
2020-10-26 07:43:54 -07:00

36 lines
731 B
Svelte

<script>
/**
* Specify the toolbar size
* @type {"sm" | "default"} [size="default"]
*/
export let size = "default";
import { setContext } from "svelte";
let ref = null;
setContext("Toolbar", {
setOverflow: (toggled) => {
if (ref) {
if (toggled) {
ref.style.overflow = "visible";
} else {
ref.removeAttribute("style");
}
}
},
});
</script>
<section
bind:this="{ref}"
aria-label="data table toolbar"
class:bx--table-toolbar="{true}"
class:bx--table-toolbar--small="{size === 'sm'}"
class:bx--table-toolbar--normal="{size === 'default'}"
{...$$restProps}
>
<div class:bx--toolbar-content="{true}">
<slot />
</div>
</section>