import { renderToStaticMarkup } from "react-dom/server";import { BotIcon } from "lucide-react";import { describe, expect, it } from "vite-plus/test"; import {  ComposerControl,  ComposerControlChevron,  ComposerControlIcon,  ComposerControlSeparator,} from "./ComposerControl"; describe("ComposerControl", () => {  it("preserves the expanded composer geometry by default", () => {    const markup = renderToStaticMarkup(<ComposerControl>Model</ComposerControl>);     expect(markup).toContain("h-7");    expect(markup).toContain("min-h-7");    expect(markup).toContain("gap-1.5");    expect(markup).toContain("px-2.5");  });   it("uses the shared xs geometry for resting controls", () => {    const markup = renderToStaticMarkup(      <ComposerControl size="xs">        Model        <ComposerControlChevron size="xs" />      </ComposerControl>,    );     expect(markup).toContain("sm:h-6");    expect(markup).toContain("font-normal");    expect(markup).toContain("text-muted-foreground/70");    expect(markup).toContain("[--control-icon-color:currentColor]");    expect(markup).toContain("svg[data-composer-control-chevron]]:ms-0");    expect(markup).toContain("svg[data-composer-control-chevron]]:-me-1");    expect(markup).not.toContain("min-h-7");    expect(markup).not.toContain("gap-1.5");    expect(markup).not.toContain("px-2.5");  });   it("keeps the expanded chevron treatment unless resting overrides it", () => {    const expanded = renderToStaticMarkup(<ComposerControlChevron />);    const resting = renderToStaticMarkup(<ComposerControlChevron size="xs" />);     expect(expanded).toContain("size-3.5");    expect(expanded).toContain("text-icon-muted");    expect(expanded).toContain('stroke-width="2.25"');    expect(resting).toContain("size-3");    expect(resting).toContain("text-current");    expect(resting).toContain("opacity-50");    expect(resting).not.toContain("size-3.5");    expect(resting).not.toContain("text-icon-muted");  });   it("owns resting icon geometry", () => {    const expanded = renderToStaticMarkup(<ComposerControlIcon icon={BotIcon} />);    const resting = renderToStaticMarkup(<ComposerControlIcon icon={BotIcon} size="xs" />);     expect(expanded).toContain("size-4");    expect(resting).toContain("size-3");    expect(resting).not.toContain("size-4");  });   it("owns separator geometry for both composer sizes", () => {    const expanded = renderToStaticMarkup(<ComposerControlSeparator />);    const resting = renderToStaticMarkup(      <ComposerControlSeparator size="xs" data-resting-controls-separator="true" />,    );     expect(expanded).toContain("h-4");    expect(expanded).not.toContain("h-3.5!");    expect(resting).toContain("h-3.5!");    expect(resting).not.toContain("h-4");    expect(resting).toContain('data-resting-controls-separator="true"');  });});