@krrli/cm-designsystem 1.32.1 → 1.32.2

package/dist/components/modal/Modal.d.ts

@@ -1,75 +0,0 @@
-import React from "react";
-import { type VariantProps } from "tailwind-variants";
-declare const modalStyles: import("tailwind-variants").TVReturnType<{
-    [key: string]: {
-        [key: string]: import("tailwind-merge").ClassNameValue | {
-            title?: import("tailwind-merge").ClassNameValue;
-            content?: import("tailwind-merge").ClassNameValue;
-            container?: import("tailwind-merge").ClassNameValue;
-            overlay?: import("tailwind-merge").ClassNameValue;
-            actions?: import("tailwind-merge").ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import("tailwind-merge").ClassNameValue | {
-            title?: import("tailwind-merge").ClassNameValue;
-            content?: import("tailwind-merge").ClassNameValue;
-            container?: import("tailwind-merge").ClassNameValue;
-            overlay?: import("tailwind-merge").ClassNameValue;
-            actions?: import("tailwind-merge").ClassNameValue;
-        };
-    };
-} | {}, {
-    overlay: string[];
-    content: string[];
-    title: string[];
-    container: string[];
-    actions: string[];
-}, undefined, {
-    [key: string]: {
-        [key: string]: import("tailwind-merge").ClassNameValue | {
-            title?: import("tailwind-merge").ClassNameValue;
-            content?: import("tailwind-merge").ClassNameValue;
-            container?: import("tailwind-merge").ClassNameValue;
-            overlay?: import("tailwind-merge").ClassNameValue;
-            actions?: import("tailwind-merge").ClassNameValue;
-        };
-    };
-} | {}, {
-    overlay: string[];
-    content: string[];
-    title: string[];
-    container: string[];
-    actions: string[];
-}, import("tailwind-variants").TVReturnType<unknown, {
-    overlay: string[];
-    content: string[];
-    title: string[];
-    container: string[];
-    actions: string[];
-}, undefined, unknown, unknown, undefined>>;
-type ModalVariants = VariantProps<typeof modalStyles>;
-interface ModalProps extends ModalVariants {
-    title: string;
-    open: boolean;
-    onOpenChange: (isOpen: boolean) => void;
-    children: React.ReactNode;
-}
-export declare const Modal: React.FC<ModalProps> & {
-    Body: typeof ModalBody;
-    Actions: typeof ModalActions;
-};
-export declare function ModalBody({ children }: {
-    children: React.ReactNode;
-}): React.ReactNode;
-export declare namespace ModalBody {
-    var displayName: string;
-}
-export declare function ModalActions({ children }: {
-    children: React.ReactNode;
-}): React.ReactNode;
-export declare namespace ModalActions {
-    var displayName: string;
-}
-export {};

package/dist/components/modal/Modal.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/modal/Modal.test.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { render, screen } from "@testing-library/react";
-import { describe, expect, test } from "vitest";
-import { Button } from "../button/Button";
-import { Cancel, Checkmark } from "../icons/generated";
-import { Modal } from "./Modal";
-describe("Modal", () => {
-    test("should open modal", async () => {
-        // Arrange
-        render(_jsx("div", { children: _jsxs(Modal, { open: true, onOpenChange: () => { }, title: "Modal", children: [_jsx(Modal.Body, { children: "Body" }), _jsxs(Modal.Actions, { children: [_jsx(Button, { intent: "primary", size: "md", onClick: () => { }, icon: Cancel, children: "Exit" }), _jsx(Button, { intent: "secondary", size: "md", onClick: () => { }, icon: Checkmark, children: "Save" })] })] }) }));
-        // Assert
-        expect(screen.getByRole("dialog")).toBeVisible();
-        expect(screen.getByText(/body/i)).toBeVisible();
-        expect(screen.getByText(/modal/i)).toBeVisible();
-        expect(screen.getByRole("button", { name: /exit/i })).toBeVisible();
-        expect(screen.getByRole("button", { name: /save/i })).toBeVisible();
-    });
-    test("should open modal", async () => {
-        // Arrange
-        render(_jsx("div", { children: _jsxs(Modal, { open: false, onOpenChange: () => { }, title: "Modal", children: [_jsx(Modal.Body, { children: "Body" }), _jsxs(Modal.Actions, { children: [_jsx(Button, { intent: "primary", size: "md", onClick: () => { }, icon: Cancel, children: "Exit" }), _jsx(Button, { intent: "secondary", size: "md", onClick: () => { }, icon: Checkmark, children: "Save" })] })] }) }));
-        // Assert
-        expect(screen.queryByRole("dialog")).not.toBeInTheDocument();
-    });
-});

package/dist/components/navi-button/NaviButton.d.ts

@@ -1,49 +0,0 @@
-import React from "react";
-import { type VariantProps } from "tailwind-variants";
-import { type BaseAccessibleButtonProps } from "../accessible-button/AccessibleButton";
-import type { IconBaseProps } from "../icons/IconBase";
-declare const naviButtonStyles: import("tailwind-variants").TVReturnType<{
-    intent: {
-        secondary: string[];
-    };
-}, undefined, string[], {
-    intent: {
-        secondary: string[];
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    intent: {
-        secondary: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;
-type NaviButtonVariants = VariantProps<typeof naviButtonStyles>;
-type NaviButtonIntent = "secondary";
-/**
- * Props for the NaviButton component.
- *
- * @inheritdoc BaseAccessibleButtonProps
- * @inheritdoc NaviButtonVariants
- */
-interface NaviButtonProps extends NaviButtonVariants, BaseAccessibleButtonProps {
-    /**
-     * Visual intent of the button (controls background color, hover, and active styles).
-     */
-    intent?: NaviButtonIntent;
-    /**
-     * Optional icon element rendered alongside the button label.
-     */
-    icon?: React.ComponentType<IconBaseProps>;
-    /**
-     * Optional className applied to the icon element.
-     */
-    iconClassName?: string;
-    /**
-     * Visible text label displayed inside the button.
-     */
-    children: string;
-}
-/**
- * A navigation-style button component that combines an accessible,
- * keyboard-friendly button foundation with variant-based styling.
- */
-export declare const NaviButton: React.FC<NaviButtonProps>;
-export {};

package/dist/components/navi-button/NaviButton.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/navi-button/NaviButton.test.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { fireEvent, render, screen } from "@testing-library/react";
-import { describe, expect, test, vi } from "vitest";
-import { Mumble } from "../icons/generated";
-import { NaviButton } from "./NaviButton";
-describe("NaviButton", () => {
-    test("should render button with icon", async () => {
-        // Arrange
-        render(_jsx(NaviButton, { onClick: vi.fn(), icon: Mumble, children: "button" }));
-        // Assert
-        expect(screen.getByRole("button")).toBeVisible();
-        expect(screen.getByRole("button")).toHaveTextContent("button");
-        expect(screen.getByText("Mumble")).toBeVisible();
-    });
-    test("should call onClick when clicked", () => {
-        // Arrange
-        const onClick = vi.fn();
-        render(_jsx(NaviButton, { onClick: onClick, icon: Mumble, children: "button" }));
-        fireEvent.click(screen.getByRole("button"));
-        expect(onClick).toHaveBeenCalled();
-    });
-});

package/dist/components/navi-user-button/NaviUserButton.d.ts

@@ -1,44 +0,0 @@
-import { type VariantProps } from "tailwind-variants";
-import { type BaseAccessibleButtonProps } from "../accessible-button/AccessibleButton";
-declare const naviUserButtonStyles: import("tailwind-variants").TVReturnType<{
-    intent: {
-        secondary: string[];
-    };
-}, undefined, string[], {
-    intent: {
-        secondary: string[];
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    intent: {
-        secondary: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;
-type NaviUserButtonVariants = VariantProps<typeof naviUserButtonStyles>;
-type NaviUserButtonIntent = "secondary";
-/**
- * Props for the NaviUserButton component.
- *
- * @inheritdoc BaseAccessibleButtonProps
- * @inheritdoc NaviUserButtonVariants
- */
-interface NaviUserButtonProps extends NaviUserButtonVariants, BaseAccessibleButtonProps {
-    /**
-     * Visual intent of the button (controls background color, hover, and active styles).
-     */
-    intent?: NaviUserButtonIntent;
-    /**
-     * Source URL for the user avatar image.
-     */
-    src: string;
-    /**
-     * Accessible alt text describing the avatar.
-     * Required for proper screen reader support.
-     */
-    alt: string;
-}
-/**
- * A user-focused navigation button that displays a user avatar and behaves
- * like an accessible, keyboard-friendly button.
- */
-export declare const NaviUserButton: React.FC<NaviUserButtonProps>;
-export {};

package/dist/components/round-button/RoundButton.d.ts

@@ -1,44 +0,0 @@
-import { type VariantProps } from "tailwind-variants";
-import { type BaseAccessibleButtonProps } from "../accessible-button/AccessibleButton";
-import type { IconBaseProps } from "../icons/IconBase";
-declare const roundButtonStyles: import("tailwind-variants").TVReturnType<{
-    intent: {
-        primary: string[];
-    };
-}, undefined, string[], {
-    intent: {
-        primary: string[];
-    };
-}, undefined, import("tailwind-variants").TVReturnType<{
-    intent: {
-        primary: string[];
-    };
-}, undefined, string[], unknown, unknown, undefined>>;
-type RoundButtonVariants = VariantProps<typeof roundButtonStyles>;
-type RoundButtonIntent = "primary";
-/**
- * Props for the RoundButton component.
- *
- * @inheritdoc BaseAccessibleButtonProps
- * @inheritdoc RoundButtonVariants
- */
-interface RoundButtonProps extends RoundButtonVariants, BaseAccessibleButtonProps {
-    /**
-     * Visual intent of the button (controls background color, hover, and active styles).
-     */
-    intent?: RoundButtonIntent;
-    /**
-     * Accessible label for the button, used by screen readers.
-     */
-    ariaLabel: string;
-    /**
-     * Icon element rendered alongside the button label.
-     */
-    icon: React.ComponentType<IconBaseProps>;
-}
-/**
- * A circular, icon-only button component that provides full accessibility,
- * keyboard interaction, and visual feedback through hover and active states.
- */
-export declare const RoundButton: React.FC<RoundButtonProps>;
-export {};

package/dist/components/round-button/RoundButton.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/round-button/RoundButton.test.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { fireEvent, render, screen } from "@testing-library/react";
-import { describe, expect, test, vi } from "vitest";
-import { Mumble } from "../icons/generated";
-import { RoundButton } from "./RoundButton";
-describe("RoundButton", () => {
-    test("should render button with icon", async () => {
-        // Arrange
-        render(_jsx(RoundButton, { onClick: vi.fn(), ariaLabel: "Mumble", icon: Mumble }));
-        // Assert
-        expect(screen.getByRole("button")).toBeVisible();
-        expect(screen.getByLabelText("Mumble")).toBeVisible();
-        expect(screen.getByText("Mumble")).toBeVisible();
-    });
-    test("should call onChange when second tab clicked", () => {
-        // Arrange
-        const onClick = vi.fn();
-        render(_jsx(RoundButton, { onClick: onClick, ariaLabel: "Mumble", icon: Mumble }));
-        fireEvent.click(screen.getByRole("button"));
-        expect(onClick).toHaveBeenCalled();
-    });
-});

package/dist/components/tabs/TabItem.d.ts

@@ -1,11 +0,0 @@
-import React from "react";
-import { type VariantProps } from "tailwind-variants";
-declare const tabItemStyles: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, undefined, {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, undefined, unknown, unknown, undefined>>;
-type TabItemVariants = VariantProps<typeof tabItemStyles>;
-export interface TabItemProps extends TabItemVariants {
-    value: string;
-    label: string;
-    children: React.ReactNode;
-}
-export declare const TabItem: (props: TabItemProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/tabs/Tabs.d.ts

@@ -1,67 +0,0 @@
-import React from "react";
-import { type VariantProps } from "tailwind-variants";
-import type { TabItemProps } from "./TabItem";
-declare const tabStyles: import("tailwind-variants").TVReturnType<{
-    selected: {
-        false: {
-            trigger: string[];
-        };
-        true: {
-            trigger: string[];
-        };
-    };
-    effect: {
-        first: {};
-        middle: {};
-        last: {};
-    };
-}, {
-    list: string[];
-    trigger: string[];
-}, undefined, {
-    selected: {
-        false: {
-            trigger: string[];
-        };
-        true: {
-            trigger: string[];
-        };
-    };
-    effect: {
-        first: {};
-        middle: {};
-        last: {};
-    };
-}, {
-    list: string[];
-    trigger: string[];
-}, import("tailwind-variants").TVReturnType<{
-    selected: {
-        false: {
-            trigger: string[];
-        };
-        true: {
-            trigger: string[];
-        };
-    };
-    effect: {
-        first: {};
-        middle: {};
-        last: {};
-    };
-}, {
-    list: string[];
-    trigger: string[];
-}, undefined, unknown, unknown, undefined>>;
-type TabVariants = VariantProps<typeof tabStyles>;
-export interface TabLabelProps {
-    value: string;
-    label: string;
-}
-export interface TabProps extends TabVariants {
-    value: string;
-    onChange?: (value: string) => void;
-    children: React.ReactElement<TabItemProps>[];
-}
-export declare const Tabs: (props: TabProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/tabs/Tabs.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/tabs/Tabs.test.js

@@ -1,61 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { fireEvent, render, screen } from "@testing-library/react";
-import { describe, expect, test, vi } from "vitest";
-import { TabItem } from "./TabItem";
-import { Tabs } from "./Tabs";
-describe("Tabs", () => {
-    test("should render three tabs", async () => {
-        // Arrange
-        render(_jsxs(Tabs, { value: "1", children: [_jsx(TabItem, { label: "tab1", value: "1", children: "tabItem1" }), _jsx(TabItem, { label: "tab2", value: "2", children: "tabItem2" }), _jsx(TabItem, { label: "tab3", value: "3", children: "tabItem3" })] }));
-        // Assert
-        expect(screen.getByRole("tab", { name: /tab1/i })).toBeVisible();
-        expect(screen.getByRole("tab", { name: /tab2/i })).toBeVisible();
-        expect(screen.getByRole("tab", { name: /tab3/i })).toBeVisible();
-        const tabItem1 = screen.getByRole("tabpanel", {
-            name: /tab1/i,
-        });
-        expect(tabItem1).toBeVisible();
-        expect(tabItem1).toHaveTextContent(/tabItem1/i);
-        const tabItems = screen
-            .getAllByRole("tabpanel", { hidden: true })
-            .filter((el) => el.hasAttribute("hidden"));
-        expect(tabItems.length).toBe(2);
-    });
-    test("should render first tab as selected when value = 1 is set", async () => {
-        // Arrange
-        render(_jsxs(Tabs, { value: "1", children: [_jsx(TabItem, { label: "tab1", value: "1", children: "tabItem1" }), _jsx(TabItem, { label: "tab2", value: "2", children: "tabItem2" }), _jsx(TabItem, { label: "tab3", value: "3", children: "tabItem3" })] }));
-        // Assert
-        const tabItem1 = screen.getByRole("tabpanel", {
-            name: /tab1/i,
-        });
-        expect(tabItem1).toBeVisible();
-        expect(tabItem1).toHaveTextContent(/tabItem1/i);
-        expect(tabItem1).not.toHaveAttribute("hidden");
-        const tabItems = screen
-            .getAllByRole("tabpanel", { hidden: true })
-            .filter((el) => el.hasAttribute("hidden"));
-        expect(tabItems.length).toBe(2);
-    });
-    test("should render second tab as selected when value = 2 is set", async () => {
-        // Arrange
-        render(_jsxs(Tabs, { value: "2", children: [_jsx(TabItem, { label: "tab1", value: "1", children: "tabItem1" }), _jsx(TabItem, { label: "tab2", value: "2", children: "tabItem2" }), _jsx(TabItem, { label: "tab3", value: "3", children: "tabItem3" })] }));
-        // Assert
-        const tabItem2 = screen.getByRole("tabpanel", {
-            name: /tab2/i,
-        });
-        expect(tabItem2).toBeVisible();
-        expect(tabItem2).toHaveTextContent(/tabItem2/i);
-        expect(tabItem2).not.toHaveAttribute("hidden");
-        const tabItems = screen
-            .getAllByRole("tabpanel", { hidden: true })
-            .filter((el) => el.hasAttribute("hidden"));
-        expect(tabItems.length).toBe(2);
-    });
-    test("should call onChange when second tab clicked", () => {
-        // Arrange
-        const onValueChange = vi.fn();
-        render(_jsxs(Tabs, { value: "2", onChange: onValueChange, children: [_jsx(TabItem, { label: "tab1", value: "1", children: "tabItem1" }), _jsx(TabItem, { label: "tab2", value: "2", children: "tabItem2" }), _jsx(TabItem, { label: "tab3", value: "3", children: "tabItem3" })] }));
-        fireEvent.click(screen.getByRole("tab", { name: /tab2/i }));
-        expect(onValueChange).toHaveBeenCalledWith("2");
-    });
-});

package/dist/components/text-link/TextLink.d.ts

@@ -1,9 +0,0 @@
-import { type VariantProps } from "tailwind-variants";
-declare const textLinkStyles: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-type TextLinkVariants = VariantProps<typeof textLinkStyles>;
-interface TextLinkProps extends TextLinkVariants {
-    href: string;
-    children: React.ReactNode;
-}
-export declare const TextLink: (props: TextLinkProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/text-link/TextLink.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/text-link/TextLink.test.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen } from "@testing-library/react";
-import { describe, expect, test } from "vitest";
-import { TextLink } from "./TextLink";
-describe("Text Link", () => {
-    test("should render three tabs", async () => {
-        // Arrange
-        render(_jsx(TextLink, { href: "https://example.com", children: "Example Link" }));
-        // Assert
-        const link = screen.getByRole("link");
-        expect(link).toBeVisible();
-        expect(link).toHaveAttribute("href", "https://example.com");
-    });
-});

package/dist/components/textarea/Textarea.d.ts

@@ -1,48 +0,0 @@
-import { type VariantProps } from "tailwind-variants";
-declare const textareaStyles: import("tailwind-variants").TVReturnType<{
-    [key: string]: {
-        [key: string]: import("tailwind-merge").ClassNameValue | {
-            base?: import("tailwind-merge").ClassNameValue;
-            control?: import("tailwind-merge").ClassNameValue;
-            message?: import("tailwind-merge").ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import("tailwind-merge").ClassNameValue | {
-            base?: import("tailwind-merge").ClassNameValue;
-            control?: import("tailwind-merge").ClassNameValue;
-            message?: import("tailwind-merge").ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string[];
-    control: string[];
-    message: string[];
-}, undefined, {
-    [key: string]: {
-        [key: string]: import("tailwind-merge").ClassNameValue | {
-            base?: import("tailwind-merge").ClassNameValue;
-            control?: import("tailwind-merge").ClassNameValue;
-            message?: import("tailwind-merge").ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string[];
-    control: string[];
-    message: string[];
-}, import("tailwind-variants").TVReturnType<unknown, {
-    base: string[];
-    control: string[];
-    message: string[];
-}, undefined, unknown, unknown, undefined>>;
-type TextareaVariants = VariantProps<typeof textareaStyles>;
-interface TextareaProps extends TextareaVariants {
-    name: string;
-    placeholder: string;
-    label?: string;
-    isRequired?: boolean;
-    onChange: (value: string) => void;
-}
-export declare const Textarea: ({ isRequired, ...props }: TextareaProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/timed-button/TimedButton.d.ts

@@ -1,79 +0,0 @@
-import { type VariantProps } from "tailwind-variants";
-import { type BaseAccessibleButtonProps } from "../accessible-button/AccessibleButton";
-import type { IconBaseProps } from "../icons/IconBase";
-declare const timedButtonStyles: import("tailwind-variants").TVReturnType<{
-    pressed: {
-        false: {};
-        true: {
-            base: string[];
-        };
-    };
-    animating: {
-        true: {};
-        false: {};
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, undefined, {
-    pressed: {
-        false: {};
-        true: {
-            base: string[];
-        };
-    };
-    animating: {
-        true: {};
-        false: {};
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, import("tailwind-variants").TVReturnType<{
-    pressed: {
-        false: {};
-        true: {
-            base: string[];
-        };
-    };
-    animating: {
-        true: {};
-        false: {};
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, undefined, unknown, unknown, undefined>>;
-type TimedButtonVariants = VariantProps<typeof timedButtonStyles>;
-/**
- * Props for the TimedButton component.
- *
- * @inheritdoc BaseAccessibleButtonProps
- * @inheritdoc TimedButtonVariants
- */
-interface TimedButtonProps extends TimedButtonVariants, BaseAccessibleButtonProps {
-    /**
-     * Optional icon element rendered alongside the button label.
-     */
-    icon?: React.ComponentType<IconBaseProps>;
-    /**
-     * Default label displayed on the button.
-     *
-     * This is the visible text before the button is clicked or activated.
-     */
-    label: string;
-    /**
-     * Active label displayed temporarily after the button is clicked.
-     *
-     * Typically used to show feedback, e.g., `"Link copied!"`.
-     */
-    labelActive: string;
-}
-/**
- * A button component that temporarily changes its label when pressed.
- */
-export declare const TimedButton: React.FC<TimedButtonProps>;
-export {};

package/dist/components/timed-button/TimedButton.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/timed-button/TimedButton.test.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { fireEvent, render, screen, waitFor } from "@testing-library/react";
-import { describe, expect, test, vi } from "vitest";
-import { Share } from "../icons/generated";
-import { TimedButton } from "./TimedButton";
-describe("TimedButton", () => {
-    test("should render icon and label", async () => {
-        // Arrange
-        render(_jsx(TimedButton, { onClick: function () { }, icon: Share, label: "Copy Link", labelActive: "Link Copied" }));
-        const button = screen.getByRole("button");
-        expect(button).toBeVisible();
-        expect(button).toHaveTextContent("Copy Link");
-        // Icon prüfen
-        expect(screen.getByText("Share")).toBeInTheDocument();
-    });
-    test("renders initial state and toggles correctly", async () => {
-        // Arrange
-        const onClick = vi.fn();
-        render(_jsx(TimedButton, { onClick: onClick, icon: Share, label: "Copy Link", labelActive: "Link Copied" }));
-        const button = screen.getByRole("button");
-        expect(button).toBeVisible();
-        // Initial state with Likes
-        expect(button).toHaveTextContent("Copy Link");
-        expect(screen.getByText("Share")).toBeInTheDocument();
-        // Simulate click
-        fireEvent.click(button);
-        // Immediate state after click: "Liked" label + HeartFilled
-        expect(button).toHaveTextContent("Link Copied");
-        expect(screen.getByText("Share")).toBeInTheDocument();
-        expect(onClick).toHaveBeenCalled();
-        // Wait for animation + likes count update (1s delay + 350ms animation)
-        await waitFor(() => {
-            expect(button).toHaveTextContent("Copy Link");
-        }, { timeout: 1500 });
-    });
-});