74 lines
1.6 KiB
TypeScript
74 lines
1.6 KiB
TypeScript
import type { Meta, StoryObj } from "@storybook/react";
|
|
import React from "react";
|
|
|
|
import {
|
|
CopilotModalHeader,
|
|
CopilotSidebarView,
|
|
type CopilotSidebarViewProps,
|
|
} from "@copilotkit/react-core/v2";
|
|
import { CopilotStoryLayout } from "./CopilotStoryLayout";
|
|
|
|
const meta = {
|
|
title: "UI/CopilotSidebarView",
|
|
component: CopilotSidebarView,
|
|
parameters: {
|
|
layout: "fullscreen",
|
|
},
|
|
render: (args) => (
|
|
<CopilotStoryLayout>
|
|
<CopilotSidebarView {...(args as CopilotSidebarViewProps)} />
|
|
</CopilotStoryLayout>
|
|
),
|
|
} satisfies Meta<typeof CopilotSidebarView>;
|
|
|
|
export default meta;
|
|
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
autoScroll: true,
|
|
},
|
|
};
|
|
|
|
export const RightPosition: Story = {
|
|
args: {
|
|
autoScroll: true,
|
|
position: "right",
|
|
width: 480,
|
|
},
|
|
};
|
|
|
|
export const LeftPosition: Story = {
|
|
args: {
|
|
autoScroll: true,
|
|
position: "left",
|
|
width: 480,
|
|
},
|
|
};
|
|
|
|
export const CustomHeader: Story = {
|
|
args: {
|
|
header: {
|
|
title: "Workspace Copilot",
|
|
titleContent: (props) => (
|
|
<CopilotModalHeader.Title
|
|
{...props}
|
|
className="text-lg font-semibold tracking-tight text-foreground"
|
|
>
|
|
<span>{props.children}</span>
|
|
<span className="mt-1 block text-xs font-normal text-muted-foreground">
|
|
Always-on teammate
|
|
</span>
|
|
</CopilotModalHeader.Title>
|
|
),
|
|
closeButton: (props) => (
|
|
<CopilotModalHeader.CloseButton
|
|
{...props}
|
|
className="text-destructive hover:bg-destructive/10 hover:text-destructive"
|
|
/>
|
|
),
|
|
},
|
|
},
|
|
};
|