Skip to content

Commit a911f23

Browse files
google-labs-jules[bot]google-labs-jules[bot]
committed
Jules was unable to complete the task in time. Please review the work done so far and provide feedback for Jules to continue.
1 parent 79b827b commit a911f23

11 files changed

Lines changed: 6504 additions & 17214 deletions

File tree

‎.storybook/addons.js‎

Lines changed: 0 additions & 7 deletions
This file was deleted.

‎.storybook/config.js‎

Lines changed: 0 additions & 20 deletions
This file was deleted.

‎.storybook/main.js‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
module.exports = {
2+
stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
3+
addons: [
4+
'@storybook/addon-links',
5+
'@storybook/addon-essentials', // Includes actions, backgrounds, controls, docs, viewport, toolbars
6+
'@storybook/addon-interactions', // For play functions
7+
'@storybook/addon-console',
8+
'@storybook/addon-storysource',
9+
// 'storybook-addon-jsx', // Commenting out for now, will check compatibility later if needed
10+
],
11+
framework: {
12+
name: '@storybook/react-vite',
13+
options: {},
14+
},
15+
docs: {
16+
autodocs: 'tag', // Enable autodocs for tagged components
17+
},
18+
staticDirs: ['../public'], // Replicates -s public, assuming nes.css is imported or handled by vite-plugin-static-copy
19+
};

‎.storybook/preview.js‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
// Import global CSS. This path should be accessible during Storybook build/dev.
2+
// Since vite.config.ts copies src/assets/nes.css to lib/assets/nes.css,
3+
// and Storybook runs from the project root, this import should resolve correctly
4+
// IF components are expected to import it this way OR if it's for Storybook's own UI.
5+
// However, for components in the library, they might rely on CSS modules or
6+
// the lib consumer to include nes.css.
7+
// For Storybook's own preview area, importing it here makes sense.
8+
import '../src/assets/nes.css';
9+
10+
// Attempt to migrate setConsoleOptions
11+
// The addon-console might pick up parameters automatically or via a dedicated parameter.
12+
// Checking addon-console documentation, it seems it might not need explicit setup here anymore for panelExclude.
13+
// If console filtering is needed, it can be set using `parameters.console`.
14+
// For now, we'll omit explicit setConsoleOptions as it was from Storybook v5 structure.
15+
16+
export const parameters = {
17+
// actions: { argTypesRegex: "^on[A-Z].*" }, // Default in addon-essentials
18+
controls: {
19+
matchers: {
20+
color: /(background|color)$/i,
21+
date: /Date$/,
22+
},
23+
},
24+
// Example for console addon parameter if needed:
25+
// console: {
26+
// panelExclude: [],
27+
// },
28+
docs: {
29+
// Ensures that the docs addon is configured (though autodocs in main.js is the primary switch)
30+
}
31+
};
32+
33+
// Global decorators can be added here if needed.
34+
// The `withPropsTable` from storybook-addon-react-docgen is not used with Vite.
35+
// Component documentation (props tables) should be generated by addon-docs with react-vite.
36+
export const decorators = [
37+
// Add any global decorators from the old config if they are still relevant
38+
// e.g., if there was a global wrapper component
39+
];

‎.storybook/webpack.config.js‎

Lines changed: 0 additions & 17 deletions
This file was deleted.

‎package.json‎

Lines changed: 26 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -3,23 +3,18 @@
33
"version": "0.0.9",
44
"dependencies": {
55
"react": "^16.10.2",
6-
"react-dom": "^16.10.2",
7-
"react-scripts": "3.4.1",
8-
"styled-components": "^5.1.0",
9-
"webfontloader": "^1.6.28"
6+
"react-dom": "^16.10.2"
107
},
118
"scripts": {
12-
"start": "react-scripts start",
13-
"build": "react-scripts build",
14-
"build:nes": "rm -rf ./lib && rollup -c && tsc",
15-
"build:ts": "tsc",
16-
"test": "react-scripts test",
17-
"eject": "react-scripts eject",
18-
"storybook": "start-storybook -p 9009 -s public",
19-
"build-storybook": "build-storybook -s public",
9+
"start": "storybook dev -p 9009 -c .storybook -s public",
10+
"dev:vite": "vite",
11+
"build": "vite build",
12+
"test": "jest",
13+
"storybook": "storybook dev -p 9009 -c .storybook -s public",
14+
"build-storybook": "storybook build -c .storybook -s public",
2015
"lint": "eslint 'src/**/*.{ts,tsx}'",
2116
"lint:prettier": "prettier --check './src/**/*.{js,ts,tsx}'",
22-
"predeploy": "build-storybook",
17+
"predeploy": "yarn build-storybook",
2318
"deploy": "gh-pages -d storybook-static"
2419
},
2520
"eslintConfig": {
@@ -38,32 +33,24 @@
3833
]
3934
},
4035
"devDependencies": {
41-
"@rollup/plugin-multi-entry": "^3.0.0",
42-
"@storybook/addon-actions": "^5.2.4",
43-
"@storybook/addon-console": "^1.2.1",
44-
"@storybook/addon-docs": "^5.2.4",
45-
"@storybook/addon-info": "^5.2.4",
46-
"@storybook/addon-knobs": "^5.2.4",
47-
"@storybook/addon-links": "^5.2.4",
48-
"@storybook/addon-storysource": "^5.2.4",
49-
"@storybook/addon-viewport": "^5.2.4",
50-
"@storybook/addons": "^5.2.4",
51-
"@storybook/cli": "^5.2.4",
52-
"@storybook/preset-typescript": "^3.0.0",
53-
"@storybook/react": "^5.2.4",
54-
"@svgr/rollup": "^5.3.1",
36+
"@storybook/addon-essentials": "^8.6.14",
37+
"@storybook/addon-interactions": "^8.6.14",
38+
"@storybook/addon-links": "^8.6.14",
39+
"@storybook/blocks": "^8.6.14",
40+
"@storybook/builder-vite": "^8.6.14",
41+
"@storybook/react": "^8.6.14",
42+
"@storybook/react-vite": "^8.6.14",
43+
"@storybook/testing-library": "^0.2.2",
5544
"@testing-library/react": "^10.0.3",
45+
"@types/glob": "^7.0.0",
5646
"@types/jest": "25.2.2",
5747
"@types/node": "14.0.3",
5848
"@types/react": "16.9.35",
5949
"@types/react-dom": "16.9.8",
6050
"@types/react-test-renderer": "^16.9.1",
61-
"@types/storybook__addon-info": "^5.2.1",
62-
"@types/storybook__react": "^5.2.1",
63-
"@types/styled-components": "^5.1.0",
64-
"@types/webfontloader": "^1.6.29",
6551
"@typescript-eslint/eslint-plugin": "^3.0.0",
6652
"@typescript-eslint/parser": "^3.0.0",
53+
"@vitejs/plugin-react": "^4.5.0",
6754
"add": "^2.0.6",
6855
"eslint": "^6.6.0",
6956
"eslint-config-prettier": "^6.5.0",
@@ -76,37 +63,27 @@
7663
"eslint-plugin-react-hooks": "^4.0.0",
7764
"fs-extra": "^9.0.0",
7865
"gh-pages": "^3.0.0",
79-
"glob": "^7.1.6",
66+
"glob": "^7.0.0",
8067
"husky": "^4.2.5",
8168
"jest": "^25.4.0",
8269
"jest-dom": "^4.0.0",
8370
"lint-staged": "^10.1.7",
8471
"prettier": "^2.0.5",
85-
"react-docgen-typescript-loader": "^3.3.0",
8672
"react-test-renderer": "^16.11.0",
87-
"rollup": "^2.12.1",
88-
"rollup-plugin-commonjs": "^10.1.0",
89-
"rollup-plugin-copy": "^3.1.0",
90-
"rollup-plugin-json": "^4.0.0",
91-
"rollup-plugin-node-resolve": "^5.2.0",
92-
"rollup-plugin-peer-deps-external": "^2.2.0",
93-
"rollup-plugin-postcss": "^3.1.1",
94-
"rollup-plugin-replace": "^2.2.0",
95-
"rollup-plugin-sourcemaps": "^0.6.0",
96-
"rollup-plugin-terser": "^6.0.0",
97-
"rollup-plugin-typescript2": "^0.27.0",
98-
"rollup-plugin-url": "^3.0.1",
9973
"storybook-addon-jsx": "^7.1.6",
100-
"storybook-addon-react-docgen": "^1.2.28",
10174
"stylelint": "^13.3.3",
10275
"stylelint-config-styled-components": "^0.1.1",
10376
"ts-jest": "^26.0.0",
104-
"typescript": "^3.7.4",
77+
"typescript": "^5.8.3",
78+
"vite": "^6.3.5",
79+
"vite-plugin-dts": "^4.5.4",
80+
"vite-plugin-lib-inject-css": "^2.2.2",
81+
"vite-plugin-static-copy": "^3.0.0",
82+
"vite-plugin-svgr": "^4.3.0",
10583
"yarn": "^1.22.0"
10684
},
10785
"peerDependencies": {
10886
"react": "^16.8.6",
109-
"react-dom": "^16.8.6",
110-
"styled-components": "^4.4.0"
87+
"react-dom": "^16.8.6"
11188
}
11289
}

‎src/Tag/Tag.module.css‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
.toolTag {
2+
background: #eee;
3+
border-radius: 3px 0 0 3px;
4+
color: #999;
5+
display: inline-block;
6+
height: 26px;
7+
line-height: 26px;
8+
padding: 0 20px 0 23px;
9+
position: relative;
10+
margin: 0 10px 10px 0;
11+
text-decoration: none;
12+
-webkit-transition: color 0.2s;
13+
}
14+
15+
.toolTag::before {
16+
background: #fff;
17+
border-radius: 10px;
18+
box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
19+
content: '';
20+
height: 6px;
21+
left: 10px;
22+
position: absolute;
23+
width: 6px;
24+
top: 10px;
25+
}
26+
27+
.toolTag::after {
28+
background: #fff;
29+
border-bottom: 13px solid transparent;
30+
border-left: 10px solid #eee;
31+
border-top: 13px solid transparent;
32+
content: '';
33+
position: absolute;
34+
right: 0;
35+
top: 0;
36+
}
37+
38+
.toolTag:hover {
39+
background-color: #000000;
40+
color: white;
41+
}
42+
43+
.toolTag:hover::after {
44+
border-left-color: #000000;
45+
}

‎src/Tag/index.tsx‎

Lines changed: 4 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,18 @@
11
import * as React from 'react';
22
import '../assets/nes.css';
3-
import styled from 'styled-components';
3+
import styles from './Tag.module.css';
44

55
type Props = {
66
textType: 'primary' | 'success' | 'warning' | 'error';
77
item: string;
88
};
99

10-
const ToolTag = styled.span`
11-
background: #eee;
12-
border-radius: 3px 0 0 3px;
13-
color: #999;
14-
display: inline-block;
15-
height: 26px;
16-
line-height: 26px;
17-
padding: 0 20px 0 23px;
18-
position: relative;
19-
margin: 0 10px 10px 0;
20-
text-decoration: none;
21-
-webkit-transition: color 0.2s;
22-
::before {
23-
background: #fff;
24-
border-radius: 10px;
25-
box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
26-
content: '';
27-
height: 6px;
28-
left: 10px;
29-
position: absolute;
30-
width: 6px;
31-
top: 10px;
32-
}
33-
::after {
34-
background: #fff;
35-
border-bottom: 13px solid transparent;
36-
border-left: 10px solid #eee;
37-
border-top: 13px solid transparent;
38-
content: '';
39-
position: absolute;
40-
right: 0;
41-
top: 0;
42-
}
43-
:hover {
44-
background-color: #000000;
45-
color: white;
46-
}
47-
:hover::after {
48-
border-left-color: #000000;
49-
}
50-
`;
51-
5210
export class NesTag extends React.Component<Props> {
5311
render() {
5412
const { textType, item } = this.props;
5513
const textClass = `nes-text is-${textType}`;
56-
return <ToolTag className={textClass}>{item}</ToolTag>;
14+
// Combine the CSS module class for the tag's structure and the nes.css classes for text styling
15+
const combinedClassName = `${styles.toolTag} ${textClass}`;
16+
return <span className={combinedClassName}>{item}</span>;
5717
}
5818
}

‎tsconfig.json‎

Lines changed: 10 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,40 @@
11
{
22
"compilerOptions": {
3-
"module": "esnext",
3+
"module": "ESNext",
44
"esModuleInterop": true,
5-
"target": "es6",
6-
"moduleResolution": "node",
5+
"target": "ES2020",
6+
"moduleResolution": "bundler",
77
"strict": false,
88
"alwaysStrict": true,
99
"removeComments": false,
1010
"noFallthroughCasesInSwitch": true,
1111
"noImplicitReturns": true,
1212
"noUnusedLocals": true,
13-
"outDir": "./lib",
1413
"baseUrl": ".",
1514
"lib": [
16-
"dom",
17-
"esnext"
15+
"DOM",
16+
"DOM.Iterable",
17+
"ESNext"
1818
],
1919
"allowJs": false,
2020
"skipLibCheck": true,
2121
"forceConsistentCasingInFileNames": true,
2222
"resolveJsonModule": true,
2323
"importHelpers": true,
2424
"noEmitOnError": false,
25-
"declaration": true,
26-
"declarationDir": "lib",
27-
"jsx": "react",
25+
"jsx": "react-jsx",
2826
"allowSyntheticDefaultImports": true,
2927
"isolatedModules": true,
3028
"noEmit": true
3129
},
3230
"include": [
33-
"src/**/*"
31+
"src",
32+
"vite.config.ts"
3433
],
3534
"exclude": [
3635
"node_modules",
3736
"lib",
38-
"rollup.config.js",
37+
"storybook-static",
3938
"src/stories/*",
4039
"src/__tests__/*",
4140
"src/assets/*"

0 commit comments

Comments
 (0)