LaconicNetwork/vega-frontend-monorepo
3
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

chore: convert tailwind to ts/esm

Browse Source
This commit is contained in:
Matthew Russell 2024-03-08 10:17:35 +00:00
parent fd1f7fd08b
commit fdd7022b5c
No known key found for this signature in database
17 changed files with 103 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
apps/explorer/tailwind.config.js
View File

@ -1,9 +1,9 @@
const { join } = require('path');
const { createGlobPatternsForDependencies } = require('@nx/react/tailwind');
const theme = require('../../libs/tailwindcss-config/src/theme');
const vegaCustomClasses = require('../../libs/tailwindcss-config/src/vega-custom-classes');
import { join } from 'path';
import { createGlobPatternsForDependencies } from '@nx/react/tailwind';
import { theme } from '@vegaprotocol/tailwindcss-config';
import { vegaCustomClasses } from '@vegaprotocol/tailwindcss-config';
module.exports = {
export default {
content: [
join(__dirname, 'src/**/*.{js,ts,jsx,tsx}'),
'libs/ui-toolkit/src/utils/shared.ts',

10
apps/governance/tailwind.config.js
View File

@ -1,9 +1,9 @@
const { join } = require('path');
const { createGlobPatternsForDependencies } = require('@nx/react/tailwind');
const theme = require('../../libs/tailwindcss-config/src/theme');
const vegaCustomClasses = require('../../libs/tailwindcss-config/src/vega-custom-classes');
import { join } from 'path';
import { createGlobPatternsForDependencies } from '@nx/react/tailwind';
import { theme } from '@vegaprotocol/tailwindcss-config';
import { vegaCustomClasses } from '@vegaprotocol/tailwindcss-config';
module.exports = {
export default {
content: [
join(__dirname, 'src/**/*.{js,ts,jsx,tsx}'),
'libs/ui-toolkit/src/utils/shared.ts',

10
apps/trading/tailwind.config.js
View File

@ -1,9 +1,9 @@
const { join } = require('path');
const { createGlobPatternsForDependencies } = require('@nx/next/tailwind');
const theme = require('../../libs/tailwindcss-config/src/theme');
const vegaCustomClasses = require('../../libs/tailwindcss-config/src/vega-custom-classes');
import { join } from 'path';
import { createGlobPatternsForDependencies } from '@nx/next/tailwind';
import { theme } from '@vegaprotocol/tailwindcss-config';
import { vegaCustomClasses } from '@vegaprotocol/tailwindcss-config';
module.exports = {
export default {
content: [
join(__dirname, 'pages/**/*.{js,ts,jsx,tsx}'),
join(__dirname, 'client-pages/**/*.{js,ts,jsx,tsx}'),

12
libs/tailwindcss-config/.eslintrc.json
View File

@ -13,6 +13,18 @@
{
"files": ["*.js", "*.jsx"],
"rules": {}
},
{
"files": ["*.json"],
"parser": "jsonc-eslint-parser",
"rules": {
"@nx/dependency-checks": [
"error",
{
"ignoredFiles": ["{projectRoot}/rollup.config.{js,ts,mjs,mts}"]
}
]
}
}
]
}

29
libs/tailwindcss-config/.swcrc Normal file
View File

@ -0,0 +1,29 @@
{
"jsc": {
"target": "es2017",
"parser": {
"syntax": "typescript",
"decorators": true,
"dynamicImport": true
},
"transform": {
"decoratorMetadata": true,
"legacyDecorator": true
},
"keepClassNames": true,
"externalHelpers": true,
"loose": true
},
"module": {
"type": "es6"
},
"sourceMaps": true,
"exclude": [
"jest.config.ts",
".*\\.spec.tsx?$",
".*\\.test.tsx?$",
"./src/jest-setup.ts$",
"./**/jest-setup.ts$",
".*.js$"
]
}

15
libs/tailwindcss-config/jest.config.js
View File

@ -1,15 +0,0 @@
module.exports = {
displayName: 'tailwindcss-config',
preset: '../../jest.preset.js',
globals: {},
transform: {
'^.+\\.[tj]s$': [
'ts-jest',
{
tsconfig: '<rootDir>/tsconfig.spec.json',
},
],
},
moduleFileExtensions: ['ts', 'js', 'html'],
coverageDirectory: '../../coverage/libs/tailwindcss-config',
};

2
libs/tailwindcss-config/package.json
View File

@ -1,4 +1,4 @@
{
"name": "@vegaprotocol/tailwindcss-config",
"version": "0.0.5"
"version": "0.0.6"
}

23
libs/tailwindcss-config/project.json
View File

@ -5,28 +5,37 @@
"projectType": "library",
"targets": {
"build": {
"executor": "@nx/js:tsc",
"executor": "@nx/rollup:rollup",
"outputs": ["{options.outputPath}"],
"format": ["esm", "cjs"],
"options": {
"outputPath": "dist/libs/tailwindcss-config",
"main": "libs/tailwindcss-config/src/index.js",
"main": "libs/tailwindcss-config/src/index.ts",
"tsConfig": "libs/tailwindcss-config/tsconfig.lib.json",
"assets": ["libs/tailwindcss-config/*.md"]
"assets": [],
"project": "libs/tailwindcss-config/package.json",
"compiler": "swc",
"format": ["esm", "cjs"]
}
},
"publish": {
"command": "node tools/scripts/publish.mjs tailwindcss-config {args.ver} {args.tag}",
"dependsOn": ["build"]
},
"lint": {
"executor": "@nx/eslint:lint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": ["libs/tailwindcss-config/**/*.js"]
"lintFilePatterns": [
"libs/tailwindcss-config/**/*.ts",
"libs/tailwindcss-config/package.json"
]
}
},
"test": {
"executor": "@nx/jest:jest",
"outputs": ["{workspaceRoot}/coverage/libs/tailwindcss-config"],
"outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
"options": {
"jestConfig": "libs/tailwindcss-config/jest.config.js"
"jestConfig": "libs/tailwindcss-config/jest.config.ts"
}
}
},

11
libs/tailwindcss-config/src/index.js
View File

@ -1,11 +0,0 @@
const theme = require('./theme');
const themelite = require('./theme-lite');
const vegaCustomClasses = require('./vega-custom-classes');
const { VegaColours } = require('./vega-colours');
module.exports = {
theme,
themelite,
plugins: [vegaCustomClasses],
VegaColours,
};

4
libs/tailwindcss-config/src/index.ts Normal file
View File

@ -0,0 +1,4 @@
export { theme } from './theme';
export { themeLite } from './theme-lite';
export { vegaCustomClasses } from './vega-custom-classes';
export { VegaColours } from './vega-colours';

8
libs/tailwindcss-config/src/theme-lite.js → libs/tailwindcss-config/src/theme-lite.ts
View File

@ -1,8 +1,8 @@
const defaultTheme = require('tailwindcss/defaultTheme');
const colors = require('tailwindcss/colors');
const theme = require('./theme');
import defaultTheme from 'tailwindcss/defaultTheme';
import colors from 'tailwindcss/colors';
import { theme } from './theme';
module.exports = {
export const themeLite = {
...theme,
colors: {
...theme.colors,

2
libs/tailwindcss-config/src/theme.js → libs/tailwindcss-config/src/theme.ts
View File

@ -1,4 +1,4 @@
module.exports = {
export const theme = {
screens: {
xs: '500px',
sm: '640px',

6
libs/tailwindcss-config/src/vega-colours.js → libs/tailwindcss-config/src/vega-colours.ts
View File

@ -1,4 +1,4 @@
const VegaColours = {
export const VegaColours = {
yellow: {
DEFAULT: '#D7FB50',
dark: '#9BE106',
@ -32,7 +32,3 @@ const VegaColours = {
400: '#626262',
},
};
module.exports = {
VegaColours,
};

30
libs/tailwindcss-config/src/vega-custom-classes-lite.js → libs/tailwindcss-config/src/vega-custom-classes-lite.ts
View File

@ -1,8 +1,8 @@
const plugin = require('tailwindcss/plugin');
const colors = require('tailwindcss/colors');
const themelite = require('./theme-lite');
import plugin from 'tailwindcss/plugin';
import colors from 'tailwindcss/colors';
import { themeLite } from './theme-lite';
const vegaCustomClassesLite = plugin(function ({ addUtilities }) {
export const vegaCustomClassesLite = plugin(function ({ addUtilities }) {
addUtilities({
'.percent-change-up::before': {
content: ' ',
@ -35,19 +35,19 @@ const vegaCustomClassesLite = plugin(function ({ addUtilities }) {
textTransform: 'uppercase',
textDecoration: 'none',
backgroundColor: 'rgba(0, 143, 74, 0.1)',
border: `1px solid ${themelite.colors.darkerGreen}`,
color: themelite.colors.darkerGreen,
border: `1px solid ${themeLite.colors.darkerGreen}`,
color: themeLite.colors.darkerGreen,
'&:hover': {
backgroundColor: themelite.colors.darkerGreen,
backgroundColor: themeLite.colors.darkerGreen,
color: colors.white,
},
'&.selected': {
backgroundColor: themelite.colors.darkerGreen,
backgroundColor: themeLite.colors.darkerGreen,
color: colors.white,
},
},
'.buyButtonDark': {
color: themelite.colors.darkerGreen,
color: themeLite.colors.darkerGreen,
'&:hover': {
color: colors.black,
},
@ -59,19 +59,19 @@ const vegaCustomClassesLite = plugin(function ({ addUtilities }) {
textTransform: 'uppercase',
textDecoration: 'none',
backgroundColor: 'rgba(255, 8, 126, 0.1)',
border: `1px solid ${themelite.colors.pink}`,
color: themelite.colors.pink,
border: `1px solid ${themeLite.colors.pink}`,
color: themeLite.colors.pink,
'&:hover': {
color: colors.white,
backgroundColor: themelite.colors.pink,
backgroundColor: themeLite.colors.pink,
},
'&.selected': {
backgroundColor: themelite.colors.pink,
backgroundColor: themeLite.colors.pink,
color: colors.white,
},
},
'.sellButtonDark': {
color: themelite.colors.pink,
color: themeLite.colors.pink,
'&:hover': {
color: colors.black,
},
@ -110,5 +110,3 @@ const vegaCustomClassesLite = plugin(function ({ addUtilities }) {
// },
});
});
module.exports = vegaCustomClassesLite;

12
libs/tailwindcss-config/src/vega-custom-classes.js → libs/tailwindcss-config/src/vega-custom-classes.ts
View File

@ -1,8 +1,8 @@
const plugin = require('tailwindcss/plugin');
const colors = require('tailwindcss/colors');
const theme = require('./theme');
import plugin from 'tailwindcss/plugin';
import colors from 'tailwindcss/colors';
import { theme } from './theme';
const vegaCustomClasses = plugin(function ({ addUtilities }) {
export const vegaCustomClasses = plugin(function ({ addUtilities }) {
addUtilities({
'.calt': {
fontFeatureSettings: "'calt'",
@ -32,7 +32,7 @@ const vegaCustomClasses = plugin(function ({ addUtilities }) {
'.dark .syntax-highlighter-wrapper .hljs': {
background: theme.colors.vega.cdark[900],
color: theme.colors.vega.green.DEFAULT,
border: 0,
border: '0',
},
'.syntax-highlighter-wrapper .hljs-literal': {
color: theme.colors.vega.pink.DEFAULT,
@ -60,5 +60,3 @@ const vegaCustomClasses = plugin(function ({ addUtilities }) {
},
});
});
module.exports = vegaCustomClasses;

9
libs/tailwindcss-config/tsconfig.spec.json
View File

@ -1,9 +0,0 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "../../dist/out-tsc",
"module": "commonjs",
"types": ["jest", "node"]
},
"include": ["**/*.test.ts", "**/*.spec.ts", "**/*.d.ts"]
}

2
tsconfig.base.json
View File

@ -47,7 +47,7 @@
"@vegaprotocol/react-helpers": ["libs/react-helpers/src/index.ts"],
"@vegaprotocol/smart-contracts": ["libs/smart-contracts/src/index.ts"],
"@vegaprotocol/tailwindcss-config": [
"libs/tailwindcss-config/src/index.js"
"libs/tailwindcss-config/src/index.ts"
],
"@vegaprotocol/tendermint": ["libs/tendermint/src/index.ts"],
"@vegaprotocol/trades": ["libs/trades/src/index.ts"],