Files
2026-07-13 12:58:18 +08:00

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"
/>
),
},
},
};