reshaped 3.7.0-canary.2 → 3.7.0-canary.3

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "reshaped",
 	"description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
-	"version": "3.7.0-canary.2",
+	"version": "3.7.0-canary.3",
 	"license": "MIT",
 	"email": "hello@reshaped.so",
 	"homepage": "https://reshaped.so",

package/dist/components/Tabs/tests/Tabs.test.stories.d.ts

@@ -1,27 +0,0 @@
-import { StoryObj } from "@storybook/react-vite";
-import { fn } from "storybook/test";
-declare const _default: {
-    title: string;
-    component: import("react").FC<import("./..").TabsProps> & {
-        Item: import("react").ForwardRefExoticComponent<import("./..").TabsItemProps & import("react").RefAttributes<import("../../Actionable").ActionableRef>>;
-        List: import("react").FC<import("../Tabs.types").ListProps>;
-        Panel: import("react").FC<import("../Tabs.types").PanelProps>;
-    };
-    parameters: {
-        iframe: {
-            url: string;
-        };
-        chromatic: {
-            disableSnapshot: boolean;
-        };
-    };
-};
-export default _default;
-export declare const base: StoryObj;
-export declare const defaultValue: StoryObj<{
-    handleChange: ReturnType<typeof fn>;
-}>;
-export declare const value: StoryObj<{
-    handleChange: ReturnType<typeof fn>;
-}>;
-export declare const className: StoryObj;

package/dist/components/Tabs/tests/Tabs.test.stories.js

@@ -1,128 +0,0 @@
-import { expect, within, userEvent, waitFor, fn } from "storybook/test";
-import Tabs from "../index.js";
-export default {
-    title: "Components/Tabs/tests",
-    component: Tabs,
-    parameters: {
-        iframe: {
-            url: "https://reshaped.so/docs/components/tabs",
-        },
-        chromatic: { disableSnapshot: true },
-    },
-};
-export const base = {
-    name: "base",
-    render: () => (<Tabs>
-			<Tabs.List>
-				<Tabs.Item value="1">Item 1</Tabs.Item>
-				<Tabs.Item value="2">Item 2</Tabs.Item>
-			</Tabs.List>
-
-			<Tabs.Panel value="1">Content 1</Tabs.Panel>
-			<Tabs.Panel value="2">Content 2</Tabs.Panel>
-		</Tabs>),
-    play: async ({ canvas }) => {
-        const list = canvas.getByRole("tablist");
-        const items = canvas.getAllByRole("tab");
-        const panels = canvas.getAllByRole("tabpanel", { hidden: true });
-        expect(list).toBeInTheDocument();
-        expect(items).toHaveLength(2);
-        expect(panels).toHaveLength(2);
-        expect(panels[0]).toBeVisible();
-        expect(panels[1]).not.toBeVisible();
-        const selectedItem = items[0];
-        const selectedPanel = panels[0];
-        expect(selectedItem).toHaveAttribute("aria-selected", "true");
-        expect(selectedItem.getAttribute("aria-controls")).toBe(selectedPanel.getAttribute("id"));
-        const unselectedItem = items[1];
-        const unselectedPanel = panels[1];
-        expect(unselectedItem).toHaveAttribute("aria-selected", "false");
-        expect(unselectedItem.getAttribute("aria-controls")).toBe(unselectedPanel.getAttribute("id"));
-        await userEvent.tab();
-        expect(document.activeElement).toBe(items[0]);
-        await userEvent.tab();
-        waitFor(() => {
-            expect(document.activeElement).toBe(panels[0]);
-        });
-    },
-};
-export const defaultValue = {
-    name: "defaultValue, uncontrolled",
-    args: {
-        handleChange: fn(),
-    },
-    render: (args) => (<Tabs defaultValue="2" onChange={args.handleChange}>
-			<Tabs.List>
-				<Tabs.Item value="1">Item 1</Tabs.Item>
-				<Tabs.Item value="2">Item 2</Tabs.Item>
-			</Tabs.List>
-
-			<Tabs.Panel value="1">Content 1</Tabs.Panel>
-			<Tabs.Panel value="2">Content 2</Tabs.Panel>
-		</Tabs>),
-    play: async ({ canvas, args }) => {
-        const items = canvas.getAllByRole("tab");
-        expect(items[1]).toHaveAttribute("aria-selected", "true");
-        expect(items[1]).toHaveAttribute("tabindex", "0");
-        expect(items[0]).toHaveAttribute("tabindex", "-1");
-        await userEvent.click(items[0]);
-        expect(args.handleChange).toHaveBeenCalledTimes(1);
-        expect(args.handleChange).toHaveBeenCalledWith({ value: "1" });
-        expect(document.activeElement).toBe(items[0]);
-        expect(items[0]).toHaveAttribute("aria-selected", "true");
-        expect(items[0]).toHaveAttribute("tabindex", "0");
-        expect(items[1]).toHaveAttribute("tabindex", "-1");
-    },
-};
-export const value = {
-    name: "value, controlled",
-    args: {
-        handleChange: fn(),
-    },
-    render: (args) => (<Tabs value="2" onChange={args.handleChange}>
-			<Tabs.List>
-				<Tabs.Item value="1">Item 1</Tabs.Item>
-				<Tabs.Item value="2">Item 2</Tabs.Item>
-			</Tabs.List>
-
-			<Tabs.Panel value="1">Content 1</Tabs.Panel>
-			<Tabs.Panel value="2">Content 2</Tabs.Panel>
-		</Tabs>),
-    play: async ({ canvas, args }) => {
-        const items = canvas.getAllByRole("tab");
-        expect(items[1]).toHaveAttribute("aria-selected", "true");
-        expect(items[1]).toHaveAttribute("tabindex", "0");
-        expect(items[0]).toHaveAttribute("tabindex", "-1");
-        await userEvent.click(items[0]);
-        expect(args.handleChange).toHaveBeenCalledTimes(1);
-        expect(args.handleChange).toHaveBeenCalledWith({ value: "1" });
-        expect(document.activeElement).toBe(items[0]);
-        expect(items[1]).toHaveAttribute("aria-selected", "true");
-        expect(items[1]).toHaveAttribute("tabindex", "0");
-        expect(items[0]).toHaveAttribute("tabindex", "-1");
-    },
-};
-export const className = {
-    name: "className, attributes",
-    render: () => (<div data-testid="root">
-			<Tabs>
-				<Tabs.List attributes={{ id: "test-list-id" }} className="test-list-classname">
-					<Tabs.Item attributes={{ id: "test-item-id" }} value="1">
-						Item
-					</Tabs.Item>
-				</Tabs.List>
-
-				<Tabs.Panel attributes={{ "data-testid": "test-panel-id" }} className="test-panel-classname" value="1"/>
-			</Tabs>
-		</div>),
-    play: async ({ canvas }) => {
-        const list = canvas.getByTestId("root").firstChild;
-        const item = within(list).getByRole("presentation");
-        const panel = canvas.getByRole("tabpanel");
-        expect(list).toHaveClass("test-list-classname");
-        expect(list).toHaveAttribute("id", "test-list-id");
-        expect(item).toHaveAttribute("id", "test-item-id");
-        expect(panel).toHaveClass("test-panel-classname");
-        expect(panel).toHaveAttribute("data-testid", "test-panel-id");
-    },
-};