gradio/js/accordion/Index.svelte
Abubakar Abid 8305ff8712
Adds .expand() and .collapse() events to gr.Accordion (#9875)
* feat: add expand and collapse events to Accordion component

* change

* add changeset

* format

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
Co-authored-by: Freddy Boulton <alfonsoboulton@gmail.com>
2024-10-31 14:55:41 -04:00

40 lines
914 B
Svelte

<script lang="ts">
import Accordion from "./shared/Accordion.svelte";
import { Block } from "@gradio/atoms";
import { StatusTracker } from "@gradio/statustracker";
import type { LoadingStatus } from "@gradio/statustracker";
import Column from "@gradio/column";
import type { Gradio } from "@gradio/utils";
export let label: string;
export let elem_id: string;
export let elem_classes: string[];
export let visible = true;
export let open = true;
export let loading_status: LoadingStatus;
export let gradio: Gradio<{
expand: never;
collapse: never;
}>;
</script>
<Block {elem_id} {elem_classes} {visible}>
<StatusTracker
autoscroll={gradio.autoscroll}
i18n={gradio.i18n}
{...loading_status}
/>
<Accordion
{label}
bind:open
on:expand={() => gradio.dispatch("expand")}
on:collapse={() => gradio.dispatch("collapse")}
>
<Column>
<slot />
</Column>
</Accordion>
</Block>