reshaped 3.8.0-canary.2 → 3.8.0-canary.20

package/package.json

@@ -1,202 +1,196 @@
 {
-	"name": "reshaped",
-	"description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
-	"version": "3.8.0-canary.2",
-	"license": "MIT",
-	"email": "hello@reshaped.so",
-	"homepage": "https://reshaped.so",
-	"keywords": [
-		"react",
-		"ui",
-		"design-system",
-		"react-components",
-		"component-library",
-		"components",
-		"css-modules",
-		"figma",
-		"ui-kit",
-		"accessibility",
-		"accessible"
-	],
-	"repository": {
-		"type": "git",
-		"url": "https://github.com/reshaped-ui/reshaped.git"
-	},
-	"bugs": {
-		"url": "https://github.com/reshaped-ui/reshaped/issues"
-	},
-	"author": {
-		"name": "Dmitry Belyaev",
-		"email": "blv.dmitry@gmail.com",
-		"url": "https://reshaped.so"
-	},
-	"sideEffects": [
-		"*.css"
-	],
-	"files": [
-		"bin/cli.js",
-		"dist/**/*"
-	],
-	"types": "./dist/index.d.ts",
-	"exports": {
-		".": {
-			"types": "./dist/index.d.ts",
-			"import": "./dist/index.js"
-		},
-		"./themes": {
-			"types": "./dist/themes/index.d.ts",
-			"default": "./dist/cjs/themes/index.js"
-		},
-		"./config/postcss": {
-			"types": "./dist/config/postcss.d.ts",
-			"default": "./dist/cjs/config/postcss.js"
-		},
-		"./config/tailwind": {
-			"types": "./dist/config/tailwind.d.ts",
-			"default": "./dist/cjs/config/tailwind.js"
-		},
-		"./bundle": {
-			"types": "./dist/bundle.d.ts",
-			"import": "./dist/bundle.js"
-		},
-		"./bundle.css": "./dist/bundle.css",
-		"./themes/reshaped/*": "./dist/themes/reshaped/*",
-		"./themes/slate/*": "./dist/themes/slate/*",
-		"./themes/figma/*": "./dist/themes/figma/*",
-		"./themes/fragments/twitter/*": "./dist/themes/fragments/twitter/*",
-		"./package.json": "./package.json"
-	},
-	"bin": {
-		"reshaped": "./bin/cli.js"
-	},
-	"scripts": {
-		"dev": "storybook dev -p 3001 --disable-telemetry",
-		"clean": "sh ./bin/clean.sh",
-		"build": "pnpm clean && pnpm build:stories && pnpm build:esm && pnpm build:css && pnpm build:cjs && pnpm build:bundle",
-		"build:themes": "node bin/cli.js theming --config dist/cjs/cli/theming/reshaped.config.js --output src/themes",
-		"build:esm": "tsc -p tsconfig.esm.json && resolve-tspaths -p tsconfig.esm.json",
-		"build:cjs": "tsc -p tsconfig.cjs.json && resolve-tspaths -p tsconfig.cjs.json && node ./bin/format-cjs-build.js",
-		"build:css": "postcss \"src/**/*.css\" --dir dist --base src --config tools/build",
-		"build:stories": "tsc -p tsconfig.stories.json && resolve-tspaths -p tsconfig.stories.json",
-		"build:bundle": "vite build && cp dist/index.d.ts dist/bundle.d.ts",
-		"build:size": "pnpm clean && pnpm build:esm && pnpm build:bundle",
-		"build:storybook": "storybook build -o dist/app --disable-telemetry",
-		"build:chromatic": "STORYBOOK_ENV=chromatic storybook build",
-		"changelog": "node bin/generate-changelog.js",
-		"version": "pnpm changelog && git add CHANGELOG.md",
-		"release": "node bin/release.js",
-		"release:patch": "node bin/release.js patch",
-		"release:minor": "node bin/release.js minor",
-		"release:major": "node bin/release.js major",
-		"release:lib": "pnpm build && pnpm publish",
-		"release:canary": "pnpm build && yarn publish --tag canary",
-		"release:test": "pnpm build && pnpm pack --filename reshaped-test.tgz",
-		"release:copy": "sh ./bin/release-copy.sh",
-		"chromatic": "chromatic -b build:chromatic --project-token=$(cat .chromatic)",
-		"test:vrt": "pnpm chromatic",
-		"test:vrt:turbo": "pnpm chromatic --only-changed",
-		"test:browser": "vitest run --project=storybook",
-		"test:unit": "vitest run --project=unit",
-		"test:size": "size-limit",
-		"lint": "pnpm lint:js && pnpm lint:css",
-		"lint:js": "eslint './src/**/*.{ts,tsx}' --fix",
-		"lint:css": "stylelint 'src/**/*.css'",
-		"commit": "git-cz"
-	},
-	"browserslist": [
-		"defaults and not IE 11"
-	],
-	"devDependencies": {
-		"@commitlint/cli": "19.8.1",
-		"@commitlint/config-conventional": "19.8.1",
-		"@commitlint/types": "19.8.1",
-		"@eslint/js": "9.35.0",
-		"@size-limit/preset-big-lib": "11.2.0",
-		"@storybook/addon-a11y": "9.1.5",
-		"@storybook/addon-docs": "9.1.5",
-		"@storybook/addon-vitest": "9.1.5",
-		"@storybook/react": "9.1.5",
-		"@storybook/react-vite": "9.1.5",
-		"@testing-library/user-event": "14.6.1",
-		"@types/culori": "4.0.1",
-		"@types/events": "3.0.3",
-		"@types/node": "24.3.3",
-		"@types/react": "19.1.13",
-		"@types/react-dom": "19.1.9",
-		"@vitejs/plugin-react": "4.6.0",
-		"@vitest/browser": "3.2.4",
-		"@vitest/coverage-istanbul": "3.2.4",
-		"@vitest/coverage-v8": "3.2.4",
-		"chromatic": "13.1.4",
-		"conventional-changelog-cli": "5.0.0",
-		"cz-conventional-changelog": "3.3.0",
-		"eslint": "9.35.0",
-		"eslint-config-prettier": "10.1.8",
-		"eslint-plugin-jsx-a11y": "6.10.2",
-		"eslint-plugin-prettier": "5.5.4",
-		"eslint-plugin-react": "7.37.5",
-		"eslint-plugin-react-hooks": "5.2.0",
-		"lefthook": "1.13.0",
-		"playwright": "1.55.0",
-		"postcss": "8.5.6",
-		"postcss-cli": "11.0.1",
-		"postcss-each": "1.1.0",
-		"postcss-nested": "7.0.2",
-		"prettier": "3.6.2",
-		"react": "18",
-		"react-dom": "18",
-		"react-shadow": "20.6.0",
-		"resolve-tspaths": "0.8.23",
-		"size-limit": "11.2.0",
-		"storybook": "9.1.5",
-		"stylelint": "16.24.0",
-		"stylelint-config-prettier": "9.0.5",
-		"stylelint-config-standard": "39.0.0",
-		"ts-node": "10.9.2",
-		"typescript": "5.9.2",
-		"typescript-eslint": "8.43.0",
-		"vite": "7.1.5",
-		"vite-tsconfig-paths": "5.1.4",
-		"vitest": "3.2.4",
-		"vitest-browser-react": "1.0.1"
-	},
-	"peerDependencies": {
-		"postcss": "^8",
-		"react": "^18 || ^19",
-		"react-dom": "^18 || ^19"
-	},
-	"dependencies": {
-		"@csstools/postcss-global-data": "3.1.0",
-		"chalk": "4.1.2",
-		"commander": "14.0.1",
-		"cssnano": "7.1.1",
-		"csstype": "3.1.3",
-		"culori": "4.0.2",
-		"postcss-custom-media": "11.0.6"
-	},
-	"size-limit": [
-		{
-			"name": "Library / JS",
-			"path": "dist/bundle.js",
-			"webpack": false
-		},
-		{
-			"name": "Library / CSS",
-			"path": "dist/bundle.css",
-			"webpack": false
-		},
-		{
-			"name": "Theming / JS",
-			"path": "dist/tests/themingWithoutDefinition.js",
-			"webpack": true
-		},
-		{
-			"name": "Theming with a default theme definition / JS",
-			"path": "dist/tests/themingWithDefinition.js",
-			"webpack": true
-		}
-	],
-	"engines": {
-		"node": ">=22"
-	}
-}
+  "name": "reshaped",
+  "description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
+  "version": "3.8.0-canary.20",
+  "license": "MIT",
+  "email": "hello@reshaped.so",
+  "homepage": "https://reshaped.so",
+  "keywords": [
+    "react",
+    "ui",
+    "design-system",
+    "react-components",
+    "component-library",
+    "components",
+    "css-modules",
+    "figma",
+    "ui-kit",
+    "accessibility",
+    "accessible"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/reshaped-ui/reshaped.git"
+  },
+  "bugs": {
+    "url": "https://github.com/reshaped-ui/reshaped/issues"
+  },
+  "author": {
+    "name": "Dmitry Belyaev",
+    "email": "blv.dmitry@gmail.com",
+    "url": "https://reshaped.so"
+  },
+  "sideEffects": [
+    "*.css"
+  ],
+  "files": [
+    "bin/cli.js",
+    "dist/**/*"
+  ],
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./themes": {
+      "types": "./dist/themes/index.d.ts",
+      "default": "./dist/cjs/themes/index.js"
+    },
+    "./config/postcss": {
+      "types": "./dist/config/postcss.d.ts",
+      "default": "./dist/cjs/config/postcss.js"
+    },
+    "./config/tailwind": {
+      "types": "./dist/config/tailwind.d.ts",
+      "default": "./dist/cjs/config/tailwind.js"
+    },
+    "./bundle": {
+      "types": "./dist/bundle.d.ts",
+      "import": "./dist/bundle.js"
+    },
+    "./bundle.css": "./dist/bundle.css",
+    "./themes/reshaped/*": "./dist/themes/reshaped/*",
+    "./themes/slate/*": "./dist/themes/slate/*",
+    "./themes/figma/*": "./dist/themes/figma/*",
+    "./themes/fragments/twitter/*": "./dist/themes/fragments/twitter/*",
+    "./package.json": "./package.json"
+  },
+  "bin": {
+    "reshaped": "./bin/cli.js"
+  },
+  "browserslist": [
+    "defaults and not IE 11"
+  ],
+  "devDependencies": {
+    "@changesets/cli": "2.27.8",
+    "@commitlint/cli": "19.8.1",
+    "@commitlint/config-conventional": "19.8.1",
+    "@commitlint/types": "19.8.1",
+    "@eslint/js": "9.37.0",
+    "@size-limit/preset-big-lib": "11.2.0",
+    "@storybook/addon-a11y": "9.1.10",
+    "@storybook/addon-docs": "9.1.10",
+    "@storybook/addon-vitest": "9.1.10",
+    "@storybook/react": "9.1.10",
+    "@storybook/react-vite": "9.1.10",
+    "@testing-library/user-event": "14.6.1",
+    "@types/culori": "4.0.1",
+    "@types/events": "3.0.3",
+    "@types/node": "24.7.0",
+    "@types/react": "19.2.1",
+    "@types/react-dom": "19.2.0",
+    "@vitejs/plugin-react": "4.6.0",
+    "@vitest/browser": "3.2.4",
+    "@vitest/coverage-istanbul": "3.2.4",
+    "@vitest/coverage-v8": "3.2.4",
+    "chromatic": "13.3.0",
+    "eslint": "9.37.0",
+    "eslint-config-prettier": "10.1.8",
+    "eslint-plugin-jsx-a11y": "6.10.2",
+    "eslint-plugin-prettier": "5.5.4",
+    "eslint-plugin-react": "7.37.5",
+    "eslint-plugin-react-hooks": "6.1.1",
+    "lefthook": "1.13.6",
+    "playwright": "1.56.0",
+    "postcss": "8.5.6",
+    "postcss-cli": "11.0.1",
+    "postcss-each": "1.1.0",
+    "postcss-nested": "7.0.2",
+    "prettier": "3.6.2",
+    "react": "18",
+    "react-dom": "18",
+    "react-shadow": "20.6.0",
+    "resolve-tspaths": "0.8.23",
+    "size-limit": "11.2.0",
+    "storybook": "9.1.10",
+    "stylelint": "16.25.0",
+    "stylelint-config-prettier": "9.0.5",
+    "stylelint-config-standard": "39.0.1",
+    "ts-node": "10.9.2",
+    "typescript": "5.9.3",
+    "typescript-eslint": "8.46.0",
+    "vite": "7.1.9",
+    "vite-tsconfig-paths": "5.1.4",
+    "vitest": "3.2.4",
+    "vitest-browser-react": "1.0.1"
+  },
+  "peerDependencies": {
+    "postcss": "^8",
+    "react": "^18 || ^19",
+    "react-dom": "^18 || ^19"
+  },
+  "dependencies": {
+    "@changesets/changelog-github": "0.5.1",
+    "@csstools/postcss-global-data": "3.1.0",
+    "chalk": "4.1.2",
+    "commander": "14.0.1",
+    "cssnano": "7.1.1",
+    "csstype": "3.1.3",
+    "culori": "4.0.2",
+    "postcss-custom-media": "11.0.6"
+  },
+  "size-limit": [
+    {
+      "name": "Library / JS",
+      "path": "dist/bundle.js",
+      "webpack": false
+    },
+    {
+      "name": "Library / CSS",
+      "path": "dist/bundle.css",
+      "webpack": false
+    },
+    {
+      "name": "Theming / JS",
+      "path": "dist/tests/themingWithoutDefinition.js",
+      "webpack": true
+    },
+    {
+      "name": "Theming with a default theme definition / JS",
+      "path": "dist/tests/themingWithDefinition.js",
+      "webpack": true
+    }
+  ],
+  "engines": {
+    "node": ">=22"
+  },
+  "scripts": {
+    "dev": "storybook dev -p 3001 --disable-telemetry",
+    "clean": "sh ./bin/clean.sh",
+    "commit": "git-cz",
+    "changeset": "changeset",
+    "build": "pnpm clean && pnpm build:stories && pnpm build:esm && pnpm build:css && pnpm build:cjs && pnpm build:bundle",
+    "build:themes": "node bin/cli.js theming --config dist/cjs/cli/theming/reshaped.config.js --output src/themes",
+    "build:esm": "tsc -p tsconfig.esm.json && resolve-tspaths -p tsconfig.esm.json",
+    "build:cjs": "tsc -p tsconfig.cjs.json && resolve-tspaths -p tsconfig.cjs.json && node ./bin/format-cjs-build.js",
+    "build:css": "postcss \"src/**/*.css\" --dir dist --base src --config tools/build",
+    "build:stories": "tsc -p tsconfig.stories.json && resolve-tspaths -p tsconfig.stories.json",
+    "build:bundle": "vite build && cp dist/index.d.ts dist/bundle.d.ts",
+    "build:size": "pnpm clean && pnpm build:esm && pnpm build:bundle",
+    "build:storybook": "storybook build -o dist/app --disable-telemetry",
+    "build:chromatic": "STORYBOOK_ENV=chromatic storybook build",
+    "release": "sh ./bin/release.sh",
+    "release:canary": "sh ./bin/release-canary.sh",
+    "release:local": "pnpm build && pnpm pack --out reshaped-local.tgz",
+    "chromatic": "chromatic -b build:chromatic --project-token=$(cat .chromatic)",
+    "test:vrt": "pnpm chromatic",
+    "test:vrt:turbo": "pnpm chromatic --only-changed",
+    "test:browser": "vitest run --project=storybook",
+    "test:unit": "vitest run --project=unit",
+    "test:size": "size-limit",
+    "lint": "pnpm lint:js && pnpm lint:css",
+    "lint:js": "eslint './src/**/*.{ts,tsx}' --fix",
+    "lint:css": "stylelint 'src/**/*.css'"
+  }
+}

package/CHANGELOG-extra.md

@@ -1,3 +0,0 @@
-## Additional changelog notes for the release
-
-- Figma: Migrated to lucide icons

package/CHANGELOG.md

@@ -1,57 +0,0 @@
-## 3.8.0-canary.2
-
-
-### Features
-
-* **ToggleButton:** relaxed variant types ([416ddaa](https://github.com/reshaped-ui/reshaped/commit/416ddaa3ebbeed9e12acfdc7e0fb3027943dfbbf))
-
-## 3.8.0-canary.1
-
-### Bug Fixes
-
-- **Flyout:** fixed fallbackAdjustLayout positioning ([eaa9739](https://github.com/reshaped-ui/reshaped/commit/eaa9739bd340a60e942e3689fef46fa3ccd94f31))
-- **PinField:** fixed incorrect overwrite behavior edge case when default value is provided ([8a3d269](https://github.com/reshaped-ui/reshaped/commit/8a3d269fbffad5530669445f2f0c9e107ac93eb0))
-
-### Features
-
-- **flyout:** add shiftIntoView fallback for constrained containers ([7547e9a](https://github.com/reshaped-ui/reshaped/commit/7547e9ad7bd445a49463b60f87d87fcd8eed430b)), closes [#423](https://github.com/reshaped-ui/reshaped/issues/423)
-- **Flyout:** added fallbackAdjustLayout ([88255e4](https://github.com/reshaped-ui/reshaped/commit/88255e47b71e9166db31a5f54239be2ea59c2fb0))
-
-## 3.8.0-canary.0
-
-### Bug Fixes
-
-- **Flyout:** added support for attributes.style ([24a414f](https://github.com/formaat-design/reshaped-source/commit/24a414fa050bd3f6f91d0d0dae37030dd1677aba))
-- **Theme:** added additional check when used without name and there is no parent theme ([3cca4d1](https://github.com/formaat-design/reshaped-source/commit/3cca4d1ea0bb1a33f706bdc74f28f8f955a6a841))
-
-### Features
-
-- **Grid:** added columnGap and rowGap properties ([3aaaea6](https://github.com/formaat-design/reshaped-source/commit/3aaaea66e497636638397b2672e57e5d0a8be9ee))
-- **ProgressIndicator:** updated the dots design and simplified the implementation ([e881361](https://github.com/formaat-design/reshaped-source/commit/e881361880b8d6381f56431078b253a78cec293b))
-- remove chromatic token ([18685a7](https://github.com/formaat-design/reshaped-source/commit/18685a7b100c85094cc64d34a47f605bbb41c580))
-- **Tabs:** removed hover effect from the active tabs ([5708280](https://github.com/formaat-design/reshaped-source/commit/5708280515f164b1b21c8ab5ea84eaadaa7f5379))
-- **themes:** added transform helper to the exports ([ca8dd87](https://github.com/formaat-design/reshaped-source/commit/ca8dd870974920da01b93dfcff16e918080b0125))
-
-## 3.7.4
-
-### Bug Fixes
-
-- **Autocomplete:** correct backspace handling ([c6eb011](https://github.com/formaat-design/reshaped-source/commit/c6eb011f4c8a64aca15997d9194d0b1d12ad2709))
-
-## 3.7.3
-
-### Bug Fixes
-
-- **Tabs:** item equal scroll ([d1ce792](https://github.com/formaat-design/reshaped-source/commit/d1ce792de460092a9381fa61276db30209faf324))
-
-## 3.7.2
-
-### Bug Fixes
-
-- padding fallbacks ([250fa5b](https://github.com/formaat-design/reshaped-source/commit/250fa5be907c81699ff8a9c2e9646c70194183b6))
-
-## 3.8.0
-
-- Added tsdoc for all components
-
-- DropdownMenu: Added support for attributes.style on the content

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

@@ -1,32 +0,0 @@
-import { StoryObj } from "@storybook/react-vite";
-import { fn } from "storybook/test";
-declare const _default: {
-    title: string;
-    component: import("react").ForwardRefExoticComponent<import("./..").ActionableProps & import("react").RefAttributes<import("./..").ActionableRef>>;
-    parameters: {
-        iframe: {
-            url: string;
-        };
-        chromatic: {
-            disableSnapshot: boolean;
-        };
-    };
-};
-export default _default;
-export declare const children: StoryObj;
-export declare const href: StoryObj;
-export declare const attributesHref: StoryObj;
-export declare const onClick: StoryObj<{
-    handleClick: ReturnType<typeof fn>;
-}>;
-export declare const hrefOnClick: StoryObj<{
-    handleClick: ReturnType<typeof fn>;
-}>;
-export declare const as: StoryObj;
-export declare const type: StoryObj<{
-    handleSubmit: ReturnType<typeof fn>;
-}>;
-export declare const stopPropagation: StoryObj<{
-    handleParentClick: ReturnType<typeof fn>;
-}>;
-export declare const className: StoryObj;

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

@@ -1,130 +0,0 @@
-import { userEvent, expect, fn } from "storybook/test";
-import Actionable from "../index.js";
-export default {
-    title: "Utility components/Actionable/tests",
-    component: Actionable,
-    parameters: {
-        iframe: {
-            url: "https://reshaped.so/docs/utilities/actionable",
-        },
-        chromatic: { disableSnapshot: true },
-    },
-};
-export const children = {
-    name: "children",
-    render: () => <Actionable>Trigger</Actionable>,
-    play: async ({ canvas }) => {
-        const el = canvas.getByText("Trigger");
-        expect(el).toBeInTheDocument();
-        expect(el.tagName).toBe("SPAN");
-    },
-};
-export const href = {
-    name: "href",
-    render: () => <Actionable href="https://reshaped.so">Trigger</Actionable>,
-    play: async ({ canvas }) => {
-        const el = canvas.getByRole("link");
-        expect(el).toHaveAttribute("href", "https://reshaped.so");
-    },
-};
-export const attributesHref = {
-    name: "attributes.href",
-    render: () => <Actionable attributes={{ href: "https://reshaped.so" }}>Trigger</Actionable>,
-    play: async ({ canvas }) => {
-        const el = canvas.getByRole("link");
-        expect(el).toHaveAttribute("href", "https://reshaped.so");
-    },
-};
-export const onClick = {
-    name: "onClick",
-    args: {
-        handleClick: fn(),
-    },
-    render: (args) => <Actionable onClick={args.handleClick}>Trigger</Actionable>,
-    play: async ({ canvas, args }) => {
-        const { handleClick } = args;
-        const el = canvas.getAllByRole("button")[0];
-        await userEvent.click(el);
-        expect(el).toHaveAttribute("type", "button");
-        expect(handleClick).toHaveBeenCalledTimes(1);
-        expect(handleClick).toHaveBeenCalledWith(expect.objectContaining({ target: el }));
-    },
-};
-export const hrefOnClick = {
-    name: "href + onClick",
-    args: {
-        handleClick: fn(),
-    },
-    render: (args) => (<Actionable onClick={(e) => {
-            e.preventDefault();
-            args.handleClick(e);
-        }} href="https://reshaped.so">
-			Trigger
-		</Actionable>),
-    play: async ({ canvas, args }) => {
-        const { handleClick } = args;
-        const el = canvas.getByRole("link");
-        await userEvent.click(el);
-        expect(el).toHaveAttribute("href", "https://reshaped.so");
-        expect(handleClick).toHaveBeenCalledTimes(1);
-        expect(handleClick).toHaveBeenCalledWith(expect.objectContaining({ target: el }));
-    },
-};
-export const as = {
-    name: "as",
-    render: () => (<Actionable onClick={() => { }} as="span">
-			Trigger
-		</Actionable>),
-    play: ({ canvas }) => {
-        const el = canvas.getAllByRole("button")[0];
-        expect(el.tagName).toBe("SPAN");
-    },
-};
-export const type = {
-    name: "type",
-    args: {
-        handleSubmit: fn(),
-    },
-    render: (args) => (<form onSubmit={(e) => {
-            e.preventDefault();
-            args.handleSubmit();
-        }}>
-			<Actionable onClick={() => { }} type="submit">
-				Trigger
-			</Actionable>
-		</form>),
-    play: async ({ canvas, args }) => {
-        const button = canvas.getAllByRole("button")[0];
-        await userEvent.click(button);
-        expect(args.handleSubmit).toHaveBeenCalledTimes(1);
-    },
-};
-export const stopPropagation = {
-    name: "stopPropagation",
-    args: {
-        handleParentClick: fn(),
-    },
-    render: (args) => (<div onClick={args.handleParentClick}>
-			<Actionable stopPropagation onClick={() => { }}>
-				Trigger
-			</Actionable>
-		</div>),
-    play: async ({ canvas, args }) => {
-        const button = canvas.getAllByRole("button")[0];
-        await userEvent.click(button);
-        expect(args.handleParentClick).not.toHaveBeenCalled();
-    },
-};
-export const className = {
-    name: "className, attributes",
-    render: () => (<div data-testid="root">
-			<Actionable className="test-classname" attributes={{ id: "test-id" }}>
-				Trigger
-			</Actionable>
-		</div>),
-    play: async ({ canvas }) => {
-        const root = canvas.getByTestId("root").firstChild;
-        expect(root).toHaveClass("test-classname");
-        expect(root).toHaveAttribute("id", "test-id");
-    },
-};