AssistantModal

import { AssistantModal } from "@grassroot/ui-react/assistant";
 
export default function AssistantModalDemo() {
  return <AssistantModal trigger="Open assistant">Ask about themes, tokens or charts.</AssistantModal>;
}

<script setup lang="ts">
import { AssistantModal } from "@grassroot/ui-vue/assistant";
</script>
 
<template>
  <AssistantModal>
    <template #trigger>Open assistant</template>
    Ask about themes, tokens or charts.
  </AssistantModal>
</template>

import "./ensure-compiler";
import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootAssistantModal } from "@grassroot/ui-angular/assistant";
 
@Component({
  selector: "app-assistant-modal-demo",
  standalone: true,
  imports: [GrassrootAssistantModal],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `<grassroot-assistant-modal><span trigger>Open assistant</span>Ask about themes, tokens or charts.</grassroot-assistant-modal>`,
})
export class AssistantModalDemoComponent {}
 
export default AssistantModalDemoComponent;

<script lang="ts">
  import { AssistantModal } from "@grassroot/ui-svelte/assistant";
</script>
 
<AssistantModal>
  {#snippet trigger()}Open assistant{/snippet}
  Ask about themes, tokens or charts.
</AssistantModal>

/** @jsxImportSource solid-js */
import { AssistantModal } from "@grassroot/ui-solid/assistant";
 
export default function AssistantModalDemo() {
  return <AssistantModal trigger="Open assistant">Ask about themes, tokens or charts.</AssistantModal>;
}