archive-gh-me/nextui
1
0
Fork 0
mirror of https://github.com/nextui-org/nextui.git synced 2025-12-08 19:26:11 +00:00
Code Issues Projects Releases Wiki Activity

chore(root): initial theme plugin added

Browse Source
This commit is contained in:
Junior Garcia 2023-01-07 22:47:30 -03:00
parent cf83f14afa
commit b90976d48e
7 changed files with 191 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -66,6 +66,7 @@
"@testing-library/react": "^12.1.2",
"@testing-library/react-hooks": "^7.0.0",
"@testing-library/user-event": "^13.2.0",
"@storybook/react": "^7.0.0-beta.20",
"@types/jest": "^28.1.1",
"@types/node": "^15.12.4",
"@types/react": "17.0.33",

4
packages/components/link/src/link.tsx
View File

@ -6,7 +6,7 @@ import {useDOMRef} from "@nextui-org/dom-utils";
import {clsx, __DEV__} from "@nextui-org/shared-utils";
import {link} from "@nextui-org/theme";
import {StyledLink} from "./link.styles";
// import {StyledLink} from "./link.styles";
import {UseLinkProps, useLink} from "./use-link";
import {LinkIcon} from "./link-icon";
@ -25,7 +25,7 @@ const Link = forwardRef<LinkProps, "a">((props, ref) => {
return (
<a
ref={domRef}
className="font-semibold text-blue-500 hover:underline focus:underline active:underline focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 focus:ring-offset-2 focus:ring-offset-blue-50"
className={link()}
// css={{
// ...linkCss,
// ...css,

6
packages/core/theme/package.json
View File

@ -31,7 +31,8 @@
"url": "https://github.com/nextui-org/nextui/issues"
},
"scripts": {
"build": "tsup src/index.ts --format=esm,cjs --dts",
"build": "tsup src/index.ts --format=esm,cjs --dts && pnpm build:plugin",
"build:plugin": "tsup plugin.js --format=cjs",
"dev": "yarn build:fast -- --watch",
"clean": "rimraf dist .turbo",
"typecheck": "tsc --noEmit",
@ -40,7 +41,8 @@
"postpack": "clean-package restore"
},
"devDependencies": {
"clean-package": "2.1.1"
"clean-package": "2.1.1",
"tailwindcss": "^3.2.4"
},
"dependencies": {
"class-variance-authority": "0.4.0"

136
packages/core/theme/plugin.js Normal file
View File

@ -0,0 +1,136 @@
const twPlugin = require("tailwindcss/plugin");
const plugin = twPlugin(function () {}, {
darkMode: "class",
theme: {
extend: {
colors: {
transparent: "transparent",
white: "#ffffff",
black: "#000000",
gray: {
50: "#F9FAFB",
100: "#F3F4F6",
200: "#E5E7EB",
300: "#D1D5DB",
400: "#9CA3AF",
500: "#6B7280",
600: "#4B5563",
700: "#374151",
800: "#1F2937",
900: "#111827",
},
red: {
50: "#FDF2F2",
100: "#FDE8E8",
200: "#FBD5D5",
300: "#F8B4B4",
400: "#F98080",
500: "#F05252",
600: "#E02424",
700: "#C81E1E",
800: "#9B1C1C",
900: "#771D1D",
},
orange: {
50: "#FFF8F1",
100: "#FEECDC",
200: "#FCD9BD",
300: "#FDBA8C",
400: "#FF8A4C",
500: "#FF5A1F",
600: "#D03801",
700: "#B43403",
800: "#8A2C0D",
900: "#771D1D",
},
yellow: {
50: "#FDFDEA",
100: "#FDF6B2",
200: "#FCE96A",
300: "#FACA15",
400: "#E3A008",
500: "#C27803",
600: "#9F580A",
700: "#8E4B10",
800: "#723B13",
900: "#633112",
},
green: {
50: "#F3FAF7",
100: "#DEF7EC",
200: "#BCF0DA",
300: "#84E1BC",
400: "#31C48D",
500: "#0E9F6E",
600: "#057A55",
700: "#046C4E",
800: "#03543F",
900: "#014737",
},
teal: {
50: "#EDFAFA",
100: "#D5F5F6",
200: "#AFECEF",
300: "#7EDCE2",
400: "#16BDCA",
500: "#0694A2",
600: "#047481",
700: "#036672",
800: "#05505C",
900: "#014451",
},
blue: {
50: "#EBF5FF",
100: "#E1EFFE",
200: "#C3DDFD",
300: "#A4CAFE",
400: "#76A9FA",
500: "#3F83F8",
600: "#1C64F2",
700: "#1A56DB",
800: "#1E429F",
900: "#233876",
},
indigo: {
50: "#F0F5FF",
100: "#E5EDFF",
200: "#CDDBFE",
300: "#B4C6FC",
400: "#8DA2FB",
500: "#6875F5",
600: "#5850EC",
700: "#5145CD",
800: "#42389D",
900: "#362F78",
},
purple: {
50: "#F6F5FF",
100: "#EDEBFE",
200: "#DCD7FE",
300: "#CABFFD",
400: "#AC94FA",
500: "#9061F9",
600: "#7E3AF2",
700: "#6C2BD9",
800: "#5521B5",
900: "#4A1D96",
},
pink: {
50: "#FDF2F8",
100: "#FCE8F3",
200: "#FAD1E8",
300: "#F8B4D9",
400: "#F17EB8",
500: "#E74694",
600: "#D61F69",
700: "#BF125D",
800: "#99154B",
900: "#751A3D",
},
},
},
},
});
module.exports = {plugin};

2
packages/core/theme/tsconfig.json
View File

@ -1,4 +1,4 @@
{
"extends": "../../../tsconfig.json",
"include": ["src", "index.ts"]
"include": ["src", "index.ts", "plugin.cjs"]
}

4
packages/core/theme/tsup.config.ts
View File

@ -2,9 +2,9 @@ import {defineConfig} from "tsup";
import {findUpSync} from "find-up";
export default defineConfig({
clean: true,
clean: false,
minify: false,
treeshake: true,
treeshake: false,
format: ["cjs", "esm"],
outExtension(ctx) {
return {js: `.${ctx.format}.js`};

50
pnpm-lock.yaml generated
View File

@ -24,6 +24,7 @@ importers:
'@react-bootstrap/babel-preset': ^2.1.0
'@react-types/link': ^3.3.3
'@react-types/shared': ^3.15.0
'@storybook/react': ^7.0.0-beta.20
'@swc-node/jest': ^1.5.2
'@swc/core': ^1.2.177
'@testing-library/dom': ^8.1.0
@ -108,6 +109,7 @@ importers:
'@react-bootstrap/babel-preset': 2.1.0
'@react-types/link': 3.3.4_react@17.0.2
'@react-types/shared': 3.15.0_react@17.0.2
'@storybook/react': 7.0.0-beta.20_v2v2bhvqb53glznm3v6fp3lhsa
'@swc-node/jest': 1.5.5_sk6hm4pklqzictiw7wcab3lqmy
'@swc/core': 1.3.8
'@testing-library/dom': 8.19.0
@ -780,6 +782,7 @@ importers:
'@babel/preset-env': ^7.14.5
'@babel/preset-react': ^7.14.5
'@babel/preset-typescript': ^7.14.5
'@nextui-org/theme': workspace:*
'@storybook/addon-a11y': ^6.5.13
'@storybook/addon-actions': ^6.5.13
'@storybook/addon-essentials': ^7.0.0-beta.20
@ -789,7 +792,6 @@ importers:
'@storybook/blocks': ^7.0.0-beta.20
'@storybook/node-logger': ^7.0.0-beta.20
'@storybook/preset-create-react-app': ^4.1.2
'@storybook/react': ^7.0.0-beta.20
'@storybook/react-webpack5': ^7.0.0-beta.20
'@storybook/testing-library': ^0.0.14-next.1
babel-loader: ^8.2.3
@ -805,6 +807,7 @@ importers:
'@babel/preset-env': 7.20.2
'@babel/preset-react': 7.18.6
'@babel/preset-typescript': 7.18.6
'@nextui-org/theme': link:../../core/theme
'@storybook/addon-a11y': 6.5.13_sfoxds7t5ydpegc3knd667wn6m
'@storybook/addon-actions': 6.5.13_sfoxds7t5ydpegc3knd667wn6m
'@storybook/addon-essentials': 7.0.0-beta.20_sfoxds7t5ydpegc3knd667wn6m
@ -813,8 +816,7 @@ importers:
'@storybook/addon-storysource': 6.5.13_sfoxds7t5ydpegc3knd667wn6m
'@storybook/blocks': 7.0.0-beta.20_sfoxds7t5ydpegc3knd667wn6m
'@storybook/node-logger': 7.0.0-beta.20
'@storybook/preset-create-react-app': 4.1.2_cm6efttihqpyzodo3utk3ykri4
'@storybook/react': 7.0.0-beta.20_sfoxds7t5ydpegc3knd667wn6m
'@storybook/preset-create-react-app': 4.1.2_ljwg5m67v45tyeglmzmj54oibe
'@storybook/react-webpack5': 7.0.0-beta.20_rtktkkzwwhm6za5nkhtbzdfc3a
'@storybook/testing-library': 0.0.14-next.1
babel-loader: 8.3.0_webpack@5.75.0
@ -947,10 +949,12 @@ importers:
specifiers:
class-variance-authority: 0.4.0
clean-package: 2.1.1
tailwindcss: ^3.2.4
dependencies:
class-variance-authority: 0.4.0
devDependencies:
clean-package: 2.1.1
tailwindcss: 3.2.4
packages/hooks/use-clipboard:
specifiers:
@ -9596,7 +9600,7 @@ packages:
resolution: {integrity: sha512-xdFjwuiG6+L+UGdqIL861SnTXOi5o8d6jqjWXo4GODOgY48ouJrWOp7k2J7ahEdiqlR5G0pnppeWmB/idzVnLQ==}
dev: true
/@storybook/preset-create-react-app/4.1.2_cm6efttihqpyzodo3utk3ykri4:
/@storybook/preset-create-react-app/4.1.2_ljwg5m67v45tyeglmzmj54oibe:
resolution: {integrity: sha512-5uBZPhuyXx4APgLZnhiZ/PqYYprBua5CabQCfAlk+/9V4vSpX+ww+XP4Rl8Ifc/nf/HktgwtJFH4HXrZGRKC4w==}
peerDependencies:
'@babel/core': '*'
@ -9606,7 +9610,6 @@ packages:
dependencies:
'@pmmmwh/react-refresh-webpack-plugin': 0.5.8_webpack@5.75.0
'@storybook/node-logger': 7.0.0-beta.20
'@storybook/react': 7.0.0-beta.20_sfoxds7t5ydpegc3knd667wn6m
'@storybook/react-docgen-typescript-plugin': 1.0.2--canary.7.324a727c65a1819f7f3ede5abc1f32d440e4530a.0_webpack@5.75.0
'@types/babel__core': 7.1.19
babel-plugin-react-docgen: 4.2.1
@ -9826,6 +9829,43 @@ packages:
- supports-color
dev: true
/@storybook/react/7.0.0-beta.20_v2v2bhvqb53glznm3v6fp3lhsa:
resolution: {integrity: sha512-RcJQgiiDRqQhaA1ieNjqnsDdyuO80ueCfKQN2fykn1Xal+bbMIHirgAVeKD03H/m1/mArd4CckRIWx7gv1Wpcg==}
engines: {node: '>=16.0.0'}
peerDependencies:
react: ^16.8.0 || ^17.0.0 || ^18.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0
typescript: '*'
peerDependenciesMeta:
typescript:
optional: true
dependencies:
'@storybook/client-logger': 7.0.0-beta.20
'@storybook/core-client': 7.0.0-beta.20
'@storybook/docs-tools': 7.0.0-beta.20
'@storybook/global': 5.0.0
'@storybook/preview-api': 7.0.0-beta.20
'@storybook/types': 7.0.0-beta.20
'@types/estree': 0.0.51
'@types/node': 16.11.66
acorn: 7.4.1
acorn-jsx: 5.3.2_acorn@7.4.1
acorn-walk: 7.2.0
escodegen: 2.0.0
html-tags: 3.2.0
lodash: 4.17.21
prop-types: 15.8.1
react: 17.0.2
react-dom: 17.0.2_react@17.0.2
react-element-to-jsx-string: 15.0.0_sfoxds7t5ydpegc3knd667wn6m
ts-dedent: 2.2.0
type-fest: 2.19.0
typescript: 4.6.2
util-deprecate: 1.0.2
transitivePeerDependencies:
- supports-color
dev: true
/@storybook/router/6.5.13_sfoxds7t5ydpegc3knd667wn6m:
resolution: {integrity: sha512-sf5aogfirH5ucD0d0hc2mKf2iyWsZsvXhr5kjxUQmgkcoflkGUWhc34sbSQVRQ1i8K5lkLIDH/q2s1Zr2SbzhQ==}
peerDependencies: