ModelSelector

import { ModelSelector } from "@grassroot/ui-react/assistant";
import { assistantDemoModels } from "@grassroot/demo-fixtures";
 
export default function ModelSelectorDemo() {
  return <ModelSelector models={assistantDemoModels} model="opus" effort="medium" />;
}

<script setup lang="ts">
import { ModelSelector } from "@grassroot/ui-vue/assistant";
import { assistantDemoModels } from "@grassroot/demo-fixtures";
</script>
 
<template>
  <ModelSelector :models="assistantDemoModels" model="opus" effort="medium" />
</template>

import "./ensure-compiler";
import { ChangeDetectionStrategy, Component } from "@angular/core";
import { GrassrootModelSelector } from "@grassroot/ui-angular/assistant";
import { assistantDemoModels } from "@grassroot/demo-fixtures";
 
@Component({
  selector: "app-model-selector-demo",
  standalone: true,
  imports: [GrassrootModelSelector],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `<grassroot-model-selector [models]="models" model="opus" effort="medium" />`,
})
export class ModelSelectorDemoComponent {
  protected readonly models = assistantDemoModels;
}
 
export default ModelSelectorDemoComponent;

<script lang="ts">
  import { ModelSelector } from "@grassroot/ui-svelte/assistant";
  import { assistantDemoModels } from "@grassroot/demo-fixtures";
</script>
 
<ModelSelector models={assistantDemoModels} model="opus" effort="medium" />

/** @jsxImportSource solid-js */
import { ModelSelector } from "@grassroot/ui-solid/assistant";
import { assistantDemoModels } from "@grassroot/demo-fixtures";
 
export default function ModelSelectorDemo() {
  return <ModelSelector models={assistantDemoModels} model="opus" effort="medium" />;
}