diff --git a/.babelrc b/.babelrc index 2c055d07..1f7e3f8b 100644 --- a/.babelrc +++ b/.babelrc @@ -11,6 +11,5 @@ ], "@babel/preset-typescript", "@babel/preset-react" - ], - "plugins": ["babel-plugin-styled-components"] + ] } diff --git a/.storybook/main.ts b/.storybook/main.ts index 43f37f27..f2a44679 100644 --- a/.storybook/main.ts +++ b/.storybook/main.ts @@ -14,7 +14,6 @@ const config: StorybookConfig = { '@storybook/addon-onboarding', '@storybook/addon-interactions', '@chromatic-com/storybook', - '@storybook/addon-mdx-gfm' ], framework: { diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx index e021ba1d..f4c014ac 100644 --- a/.storybook/preview.tsx +++ b/.storybook/preview.tsx @@ -1,6 +1,5 @@ import type { Preview } from '@storybook/react' import React from 'react' -import { ThemeProvider } from 'styled-components' import '../src/tailwind.css' import theme from '../src/theme' @@ -13,13 +12,7 @@ const preview: Preview = { }, }, }, - decorators: [ - (Story) => ( - - - - ), - ], + decorators: [(Story) => ], } export default preview diff --git a/package.json b/package.json index 2031fcf4..1751e7a1 100644 --- a/package.json +++ b/package.json @@ -9,15 +9,11 @@ "author": "Arturo Filastò ", "license": "BSD-3-Clause", "dependencies": { - "@styled-system/css": "^5.1.5", - "@styled-system/should-forward-prop": "^5.1.5", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", "mini-svg-data-uri": "^1.4.4", "react-select": "^5.8.0", - "styled-system": "^5.1.5", - "tailwind-merge": "^2.3.0", - "yalc": "^1.0.0-pre.53" + "tailwind-merge": "^2.3.0" }, "devDependencies": { "@babel/core": "^7.23.9", @@ -25,22 +21,21 @@ "@babel/preset-react": "^7.23.3", "@babel/preset-typescript": "^7.23.3", "@biomejs/biome": "1.5.3", - "@chromatic-com/storybook": "^1.6.0", + "@chromatic-com/storybook": "^1.6.1", "@rollup/plugin-commonjs": "^25.0.7", "@rollup/plugin-json": "^6.1.0", "@rollup/plugin-node-resolve": "^15.2.3", "@rollup/plugin-terser": "^0.4.4", "@rollup/plugin-typescript": "^11.1.6", "@rollup/plugin-url": "^8.0.2", - "@storybook/addon-essentials": "^8.1.11", - "@storybook/addon-interactions": "^8.1.11", - "@storybook/addon-links": "^8.1.11", - "@storybook/addon-mdx-gfm": "^8.1.11", - "@storybook/addon-onboarding": "^8.1.11", - "@storybook/blocks": "^8.1.11", - "@storybook/react": "^8.1.11", - "@storybook/react-vite": "^8.1.11", - "@storybook/test": "^8.1.11", + "@storybook/addon-essentials": "^8.2.1", + "@storybook/addon-interactions": "^8.2.1", + "@storybook/addon-links": "^8.2.1", + "@storybook/addon-onboarding": "^8.2.1", + "@storybook/blocks": "^8.2.1", + "@storybook/react": "^8.2.1", + "@storybook/react-vite": "^8.2.1", + "@storybook/test": "^8.2.1", "@svgr/rollup": "^8.1.0", "@tailwindcss/forms": "^0.5.7", "@testing-library/dom": "^9.3.4", @@ -50,16 +45,12 @@ "@types/jest": "^29.5.12", "@types/react": "^18.2.57", "@types/react-dom": "^18.2.19", - "@types/styled-system": "^5.1.22", - "@types/styled-system__css": "^5.0.21", "autoprefixer": "^10.4.17", "babel-plugin-inline-react-svg": "^2.0.2", - "babel-plugin-styled-components": "^2.1.4", "cheerio": "^1.0.0-rc.12", "gh-pages": "^6.1.1", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", - "jest-styled-components": "^7.1.1", "jest-svg-transformer": "^1.0.0", "react": "^18.3.1", "react-dom": "^18.3.1", @@ -73,23 +64,17 @@ "rollup-plugin-peer-deps-external": "^2.2.4", "rollup-plugin-typescript2": "^0.36.0", "rollup-plugin-visualizer": "^5.12.0", - "storybook": "^8.1.11", - "styled-components": "^6.1.11", + "storybook": "^8.2.1", "tailwindcss": "^3.4.4", "ts-jest": "^29.1.5", "tslib": "^2.6.3", "typescript": "^5.5.3", - "vite": "^5.3.3" - }, - "resolutions": { - "serialize-javascript": "^6.0.0", - "node-fetch": "^2.6.7", - "jackspeak": "2.1.1" + "vite": "^5.3.3", + "yalc": "^1.0.0-pre.53" }, "peerDependencies": { "react": ">= 17", "react-icons": ">= 4", - "styled-components": ">= 6", "tailwindcss": ">=3.0.0" }, "scripts": { @@ -110,12 +95,5 @@ "storybook": "storybook dev -p 6006", "storybook:build": "storybook build" }, - "files": [ - "dist", - "animations", - "svgs", - "index.d.ts", - "icons", - "tailwind" - ] + "files": ["dist", "animations", "svgs", "index.d.ts", "icons", "tailwind"] } diff --git a/src/__test__/Button.test.tsx b/src/__test__/Button.test.tsx index 035f8661..8ef85a19 100644 --- a/src/__test__/Button.test.tsx +++ b/src/__test__/Button.test.tsx @@ -1,8 +1,8 @@ -import React from 'react' import { screen } from '@testing-library/react' import 'jest-styled-components' -import renderWithWrapper from './index' +import React from 'react' import { Button } from '..' +import renderWithWrapper from './index' describe('Button', () => { test('renders Button', () => { @@ -27,13 +27,4 @@ describe('Button', () => { // expect(buttonElement).toHaveStyleRule('color', '#0588cb') expect(buttonElement).toHaveStyleRule('background-color', 'transparent') }) - - test('renders Button with rebass props', () => { - renderWithWrapper({ component: