- Prop
items- Type
readonly ToolGroupItem[] | undefined- Default
- —
- Requirement
- optional
Docs Components Assistant
ToolGroup
React example follows below.
Vue example follows below.
Angular example follows below.
Svelte example follows below.
Solid example follows below.
- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
import { ToolGroup } from "@grassroot/ui-react/assistant";import { assistantDemoTools } from "@grassroot/demo-fixtures"; export default function ToolGroupDemo() { return <ToolGroup items={assistantDemoTools} defaultOpen={true} />;}- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
<script setup lang="ts">import { ToolGroup } from "@grassroot/ui-vue/assistant";import { assistantDemoTools } from "@grassroot/demo-fixtures";</script> <template> <ToolGroup :items="assistantDemoTools" :defaultOpen="true" /></template>- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
import "./ensure-compiler";import { ChangeDetectionStrategy, Component } from "@angular/core";import { GrassrootToolGroup } from "@grassroot/ui-angular/assistant";import { assistantDemoTools } from "@grassroot/demo-fixtures"; @Component({ selector: "app-tool-group-demo", standalone: true, imports: [GrassrootToolGroup], changeDetection: ChangeDetectionStrategy.OnPush, template: `<grassroot-tool-group [items]="items" [defaultOpen]="defaultOpen" />`,})export class ToolGroupDemoComponent { protected readonly items = assistantDemoTools; protected readonly defaultOpen = true;} export default ToolGroupDemoComponent;- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
<script lang="ts"> import { ToolGroup } from "@grassroot/ui-svelte/assistant"; import { assistantDemoTools } from "@grassroot/demo-fixtures";</script> <ToolGroup items={assistantDemoTools} defaultOpen={true} />- parts
- —
- nodes
- —
- size
- —
- part
- —
ts
/** @jsxImportSource solid-js */import { ToolGroup } from "@grassroot/ui-solid/assistant";import { assistantDemoTools } from "@grassroot/demo-fixtures"; export default function ToolGroupDemo() { return <ToolGroup items={assistantDemoTools} defaultOpen={true} />;}Installation
API Reference
Import
import { ToolGroup } from "@grassroot/ui-react/assistant";
import { assistantDemoTools } from "@grassroot/demo-fixtures";
Props
Prop
Type
Default
Requirement
itemsreadonly ToolGroupItem[] | undefined—
optional
countnumber | undefined—
optional
activeboolean | undefined—
optional
streamingboolean | undefined—
optional
openboolean | undefined—
optional
defaultOpenboolean | undefined—
optional
onOpenChange((open: boolean) => void) | undefined—
optional
- Prop
count- Type
number | undefined- Default
- —
- Requirement
- optional
- Prop
active- Type
boolean | undefined- Default
- —
- Requirement
- optional
- Prop
streaming- Type
boolean | undefined- Default
- —
- Requirement
- optional
- Prop
open- Type
boolean | undefined- Default
- —
- Requirement
- optional
- Prop
defaultOpen- Type
boolean | undefined- Default
- —
- Requirement
- optional
- Prop
onOpenChange- Type
((open: boolean) => void) | undefined- Default
- —
- Requirement
- optional
Events
| Event | Payload |
|---|---|
onOpenChange | ((open: boolean) => void) | undefined |
Content regions
children
Native attributes
Standard DOM and ARIA attributes not listed above spread onto the root element.
Import
import { ToolGroup } from "@grassroot/ui-vue/assistant";
import { assistantDemoTools } from "@grassroot/demo-fixtures";
Props
Prop
Type
Default
Requirement
itemsToolGroupItem[]() => []optional
countnumber—
optional
activeboolean—
optional
streamingboolean—
optional
openboolean—
optional
defaultOpenboolean—
optional
- Prop
items- Type
ToolGroupItem[]- Default
() => []- Requirement
- optional
- Prop
count- Type
number- Default
- —
- Requirement
- optional
- Prop
active- Type
boolean- Default
- —
- Requirement
- optional
- Prop
streaming- Type
boolean- Default
- —
- Requirement
- optional
- Prop
open- Type
boolean- Default
- —
- Requirement
- optional
- Prop
defaultOpen- Type
boolean- Default
- —
- Requirement
- optional
Events
| Event | Payload |
|---|---|
update:open | (boolean) => void |
openChange | (boolean) => void |
Content regions
default
Import
import "./ensure-compiler";
import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootToolGroup } from "@grassroot/ui-angular/assistant";
import { assistantDemoTools } from "@grassroot/demo-fixtures";
Props
Prop
Type
Default
Requirement
itemsreadonly { id: string; name?: string; status?: ToolStatus; content?: string }[][]optional
countnumber—
optional
activebooleanfalseoptional
streamingbooleanfalseoptional
openboolean—
optional
defaultOpenbooleanfalseoptional
- Prop
items- Type
readonly { id: string; name?: string; status?: ToolStatus; content?: string }[]- Default
[]- Requirement
- optional
- Prop
count- Type
number- Default
- —
- Requirement
- optional
- Prop
active- Type
boolean- Default
false- Requirement
- optional
- Prop
streaming- Type
boolean- Default
false- Requirement
- optional
- Prop
open- Type
boolean- Default
- —
- Requirement
- optional
- Prop
defaultOpen- Type
boolean- Default
false- Requirement
- optional
Events
| Event | Payload |
|---|---|
openChange | boolean |
Content regions
default
Import
import { ToolGroup } from "@grassroot/ui-svelte/assistant";
import { assistantDemoTools } from "@grassroot/demo-fixtures";
Props
Prop
Type
Default
Requirement
classstring—
optional
stylestring—
optional
itemsreadonly AssistantToolItem[]—
optional
countnumber—
optional
activebooleanfalseoptional
streamingbooleanfalseoptional
openboolean—
optional
defaultOpenbooleanfalseoptional
onOpenChange(open: boolean) => void—
optional
- Prop
class- Type
string- Default
- —
- Requirement
- optional
- Prop
style- Type
string- Default
- —
- Requirement
- optional
- Prop
items- Type
readonly AssistantToolItem[]- Default
- —
- Requirement
- optional
- Prop
count- Type
number- Default
- —
- Requirement
- optional
- Prop
active- Type
boolean- Default
false- Requirement
- optional
- Prop
streaming- Type
boolean- Default
false- Requirement
- optional
- Prop
open- Type
boolean- Default
- —
- Requirement
- optional
- Prop
defaultOpen- Type
boolean- Default
false- Requirement
- optional
- Prop
onOpenChange- Type
(open: boolean) => void- Default
- —
- Requirement
- optional
Events
| Event | Payload |
|---|---|
onOpenChange | (open: boolean) => void |
Content regions
children
Import
import { ToolGroup } from "@grassroot/ui-solid/assistant";
import { assistantDemoTools } from "@grassroot/demo-fixtures";
Props
Prop
Type
Default
Requirement
itemsreadonly ToolGroupItem[]—
optional
countnumber—
optional
activeboolean—
optional
streamingboolean—
optional
openboolean—
optional
defaultOpenboolean—
optional
onOpenChange(open: boolean) => void—
optional
- Prop
items- Type
readonly ToolGroupItem[]- Default
- —
- Requirement
- optional
- Prop
count- Type
number- Default
- —
- Requirement
- optional
- Prop
active- Type
boolean- Default
- —
- Requirement
- optional
- Prop
streaming- Type
boolean- Default
- —
- Requirement
- optional
- Prop
open- Type
boolean- Default
- —
- Requirement
- optional
- Prop
defaultOpen- Type
boolean- Default
- —
- Requirement
- optional
- Prop
onOpenChange- Type
(open: boolean) => void- Default
- —
- Requirement
- optional
Events
| Event | Payload |
|---|---|
onOpenChange | (open: boolean) => void |
Content regions
children
Native attributes
Standard DOM and ARIA attributes not listed above spread onto the root element.