From 46aefe417d6a347eef48a30f92e0246daa64ae4e Mon Sep 17 00:00:00 2001 From: Matthias Goudjil Date: Thu, 1 Feb 2024 12:03:50 +0100 Subject: [PATCH 1/3] fix: rollup-config --- build/package.json | 2 +- build/src/tasks/full-bundle.ts | 3 --- build/src/tasks/modules.ts | 2 -- packages/components/icon/src/icon.vue | 10 ++++----- packages/puik/tsconfig.json | 6 ----- packages/tailwind-preset/index.js | 7 +++--- packages/tailwind-preset/theme.js | 3 +-- packages/theme/src/icon.scss | 3 +++ packages/theme/tailwind.config.js | 4 +--- packages/theme/tsconfig.json | 5 +++++ playground/.gitignore | 3 +++ pnpm-lock.yaml | 32 ++++++++++++++++++++++++--- 12 files changed, 50 insertions(+), 30 deletions(-) delete mode 100644 packages/puik/tsconfig.json create mode 100644 packages/theme/tsconfig.json diff --git a/build/package.json b/build/package.json index ac0f6d52..2701a110 100644 --- a/build/package.json +++ b/build/package.json @@ -36,8 +36,8 @@ "devDependencies": { "@esbuild-kit/cjs-loader": "^2.4.2", "@pnpm/types": "^9.0.0", - "@rollup/plugin-json": "^6.1.0", "@types/rollup-plugin-css-only": "^3.1.0", + "rollup-plugin-polyfill-node": "^0.13.0", "unbuild": "^1.2.0", "vue": "^3.2.47" } diff --git a/build/src/tasks/full-bundle.ts b/build/src/tasks/full-bundle.ts index a4e62147..5585316f 100644 --- a/build/src/tasks/full-bundle.ts +++ b/build/src/tasks/full-bundle.ts @@ -8,7 +8,6 @@ import esbuild from 'rollup-plugin-esbuild' import { parallel } from 'gulp' import glob from 'fast-glob' import { camelCase, upperFirst } from 'lodash-unified' -import json from '@rollup/plugin-json' import { version } from '../../../packages/puik/version' import { PuikAlias } from '../plugins/puik-alias' import { @@ -49,7 +48,6 @@ async function buildFullEntry(minify: boolean) { 'process.env.NODE_ENV': JSON.stringify('production'), }, }), - json(), ], external: await generateExternal({ full: true }), }) @@ -99,7 +97,6 @@ async function buildFullLocale(minify: boolean) { sourceMap: minify, target, }), - json(), ], }) await writeBundles(bundle, [ diff --git a/build/src/tasks/modules.ts b/build/src/tasks/modules.ts index b4dfcdac..04eec298 100644 --- a/build/src/tasks/modules.ts +++ b/build/src/tasks/modules.ts @@ -5,7 +5,6 @@ import { nodeResolve } from '@rollup/plugin-node-resolve' import commonjs from '@rollup/plugin-commonjs' import esbuild from 'rollup-plugin-esbuild' import glob from 'fast-glob' -import json from '@rollup/plugin-json' import { puikRoot, pkgRoot, @@ -45,7 +44,6 @@ export const buildModules = async () => { '.vue': 'ts', }, }), - json(), ], external: await generateExternal({ full: false }), treeshake: false, diff --git a/packages/components/icon/src/icon.vue b/packages/components/icon/src/icon.vue index 58c7407c..4eed957c 100644 --- a/packages/components/icon/src/icon.vue +++ b/packages/components/icon/src/icon.vue @@ -4,6 +4,9 @@ class="puik-icon" :style="style" :data-test="dataTest" + :class="{ + 'puik-icon--disabled': isDisabled, + }" > {{ icon }} @@ -11,15 +14,12 @@ diff --git a/packages/puik/tsconfig.json b/packages/puik/tsconfig.json deleted file mode 100644 index 68bb7381..00000000 --- a/packages/puik/tsconfig.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "compilerOptions": { - "moduleResolution": "NodeNext", - "module": "NodeNext" - } -} diff --git a/packages/tailwind-preset/index.js b/packages/tailwind-preset/index.js index 23cb9fe3..92607c49 100644 --- a/packages/tailwind-preset/index.js +++ b/packages/tailwind-preset/index.js @@ -1,7 +1,6 @@ // eslint-disable-next-line @typescript-eslint/no-var-requires -// const Puiktheme = require('./theme') -import PuikTheme from './theme' +const Puiktheme = require('./theme') -export default { - theme: PuikTheme, +module.exports = { + theme: Puiktheme, } diff --git a/packages/tailwind-preset/theme.js b/packages/tailwind-preset/theme.js index 7ebe549b..61568df3 100644 --- a/packages/tailwind-preset/theme.js +++ b/packages/tailwind-preset/theme.js @@ -1,5 +1,4 @@ -/** @type {import('tailwindcss').Config} */ -export default { +module.exports = { extend: { colors: { primary: { diff --git a/packages/theme/src/icon.scss b/packages/theme/src/icon.scss index 54bfde56..2ad0f820 100644 --- a/packages/theme/src/icon.scss +++ b/packages/theme/src/icon.scss @@ -1,3 +1,6 @@ .puik-icon { @apply font-materialIcons leading-none; } +.puik-icon--disabled { + color: theme('colors.primary.500') !important; +} diff --git a/packages/theme/tailwind.config.js b/packages/theme/tailwind.config.js index 22f4999e..6576bfeb 100644 --- a/packages/theme/tailwind.config.js +++ b/packages/theme/tailwind.config.js @@ -1,8 +1,6 @@ -import tailwindConfig from '@puik/tailwind-preset' - /* eslint-disable @typescript-eslint/no-var-requires */ module.exports = { - presets: [tailwindConfig], + presets: [require('@puik/tailwind-preset')], content: ['./src/**/*.scss'], plugins: [require('tailwind-scrollbar')({ nocompatible: true })], darkMode: 'class', // To remove if we wanna use the css' prefers-color-scheme feature (dark mode based on OS/browser preference) diff --git a/packages/theme/tsconfig.json b/packages/theme/tsconfig.json new file mode 100644 index 00000000..2f980427 --- /dev/null +++ b/packages/theme/tsconfig.json @@ -0,0 +1,5 @@ +{ + "compilerOptions": { + "esModuleInterop": true + } +} diff --git a/playground/.gitignore b/playground/.gitignore index a547bf36..1f2d1ba9 100644 --- a/playground/.gitignore +++ b/playground/.gitignore @@ -22,3 +22,6 @@ dist-ssr *.njsproj *.sln *.sw? + +# views directory +views diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 94d55343..03c6a895 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -250,12 +250,12 @@ importers: '@pnpm/types': specifier: ^9.0.0 version: 9.0.0 - '@rollup/plugin-json': - specifier: ^6.1.0 - version: 6.1.0(rollup@3.20.2) '@types/rollup-plugin-css-only': specifier: ^3.1.0 version: 3.1.0 + rollup-plugin-polyfill-node: + specifier: ^0.13.0 + version: 0.13.0(rollup@3.20.2) unbuild: specifier: ^1.2.0 version: 1.2.0(sass@1.62.0) @@ -3472,6 +3472,21 @@ packages: magic-string: 0.27.0 rollup: 3.20.2 + /@rollup/plugin-inject@5.0.5(rollup@3.20.2): + resolution: {integrity: sha512-2+DEJbNBoPROPkgTDNe8/1YXWcqxbN5DTjASVIOx8HS+pITXushyNiBV56RB08zuptzz8gT3YfkqriTBVycepg==} + engines: {node: '>=14.0.0'} + peerDependencies: + rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0 + peerDependenciesMeta: + rollup: + optional: true + dependencies: + '@rollup/pluginutils': 5.1.0(rollup@3.20.2) + estree-walker: 2.0.2 + magic-string: 0.30.5 + rollup: 3.20.2 + dev: true + /@rollup/plugin-json@6.1.0(rollup@3.20.2): resolution: {integrity: sha512-EGI2te5ENk1coGeADSIwZ7G2Q8CJS2sF120T7jLw4xFw9n7wIOXHo+kIYRAoVpJAN+kmqZSoO3Fp4JtoNF4ReA==} engines: {node: '>=14.0.0'} @@ -9616,6 +9631,7 @@ packages: /iconv-lite@0.6.3: resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==} engines: {node: '>=0.10.0'} + requiresBuild: true dependencies: safer-buffer: 2.1.2 @@ -13307,6 +13323,15 @@ packages: - supports-color dev: false + /rollup-plugin-polyfill-node@0.13.0(rollup@3.20.2): + resolution: {integrity: sha512-FYEvpCaD5jGtyBuBFcQImEGmTxDTPbiHjJdrYIp+mFIwgXiXabxvKUK7ZT9P31ozu2Tqm9llYQMRWsfvTMTAOw==} + peerDependencies: + rollup: ^1.20.0 || ^2.0.0 || ^3.0.0 || ^4.0.0 + dependencies: + '@rollup/plugin-inject': 5.0.5(rollup@3.20.2) + rollup: 3.20.2 + dev: true + /rollup@0.63.5: resolution: {integrity: sha512-dFf8LpUNzIj3oE0vCvobX6rqOzHzLBoblyFp+3znPbjiSmSvOoK2kMKx+Fv9jYduG1rvcCfCveSgEaQHjWRF6g==} hasBin: true @@ -13387,6 +13412,7 @@ packages: /safer-buffer@2.1.2: resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} + requiresBuild: true /sass@1.62.0: resolution: {integrity: sha512-Q4USplo4pLYgCi+XlipZCWUQz5pkg/ruSSgJ0WRDSb/+3z9tXUOkQ7QPYn4XrhZKYAK4HlpaQecRwKLJX6+DBg==} From 63c24348cf339df8cd23e3278e53d5ef195522e1 Mon Sep 17 00:00:00 2001 From: Matthias Goudjil Date: Thu, 1 Feb 2024 12:10:14 +0100 Subject: [PATCH 2/3] test: update icon test (check disabled class) --- packages/components/icon/test/icon.spec.ts | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/packages/components/icon/test/icon.spec.ts b/packages/components/icon/test/icon.spec.ts index 0b91801c..48da78e6 100644 --- a/packages/components/icon/test/icon.spec.ts +++ b/packages/components/icon/test/icon.spec.ts @@ -40,7 +40,7 @@ describe('Icon tests', () => { isDisabled: true, }) - expect(findIcon().element.style.color).toBe('rgb(187, 187, 187)') + expect(findIcon().classes()).toContain('puik-icon--disabled') }) it('should set the color', async () => { @@ -84,6 +84,3 @@ describe('Icon tests', () => { expect(findIcon().attributes('data-test')).toBe('test') }) }) -function resolveConfig(tailwindConfig: any) { - throw new Error('Function not implemented.') -} From f1ea72bee0ef973c2b2d845025eb8ae35e48183a Mon Sep 17 00:00:00 2001 From: Matthias Goudjil Date: Thu, 1 Feb 2024 12:22:56 +0100 Subject: [PATCH 3/3] build: remove rollup-plugin-polyfill-node plugin --- build/package.json | 1 - pnpm-lock.yaml | 74 +++++++++++++++++++++++++--------------------- 2 files changed, 41 insertions(+), 34 deletions(-) diff --git a/build/package.json b/build/package.json index 2701a110..de93ee44 100644 --- a/build/package.json +++ b/build/package.json @@ -37,7 +37,6 @@ "@esbuild-kit/cjs-loader": "^2.4.2", "@pnpm/types": "^9.0.0", "@types/rollup-plugin-css-only": "^3.1.0", - "rollup-plugin-polyfill-node": "^0.13.0", "unbuild": "^1.2.0", "vue": "^3.2.47" } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 03c6a895..415c4d4c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -253,12 +253,9 @@ importers: '@types/rollup-plugin-css-only': specifier: ^3.1.0 version: 3.1.0 - rollup-plugin-polyfill-node: - specifier: ^0.13.0 - version: 0.13.0(rollup@3.20.2) unbuild: specifier: ^1.2.0 - version: 1.2.0(sass@1.62.0) + version: 1.2.0 vue: specifier: ^3.2.47 version: 3.2.47 @@ -3472,21 +3469,6 @@ packages: magic-string: 0.27.0 rollup: 3.20.2 - /@rollup/plugin-inject@5.0.5(rollup@3.20.2): - resolution: {integrity: sha512-2+DEJbNBoPROPkgTDNe8/1YXWcqxbN5DTjASVIOx8HS+pITXushyNiBV56RB08zuptzz8gT3YfkqriTBVycepg==} - engines: {node: '>=14.0.0'} - peerDependencies: - rollup: ^1.20.0||^2.0.0||^3.0.0||^4.0.0 - peerDependenciesMeta: - rollup: - optional: true - dependencies: - '@rollup/pluginutils': 5.1.0(rollup@3.20.2) - estree-walker: 2.0.2 - magic-string: 0.30.5 - rollup: 3.20.2 - dev: true - /@rollup/plugin-json@6.1.0(rollup@3.20.2): resolution: {integrity: sha512-EGI2te5ENk1coGeADSIwZ7G2Q8CJS2sF120T7jLw4xFw9n7wIOXHo+kIYRAoVpJAN+kmqZSoO3Fp4JtoNF4ReA==} engines: {node: '>=14.0.0'} @@ -5103,7 +5085,7 @@ packages: vite: ^4.0.0 vue: ^3.2.25 dependencies: - vite: 4.2.1(@types/node@18.15.11)(sass@1.62.0) + vite: 4.2.1 vue: 3.2.47 /@vitejs/plugin-vue@4.1.0(vite@4.2.1)(vue@3.3.10): @@ -9657,6 +9639,7 @@ packages: /immutable@4.3.0: resolution: {integrity: sha512-0AOCmOip+xgJwEVTQj1EfiDDOkPmuyllDuTuEX+DDXUgapLAsBIfkg3sxCYyCEA8mQqZrrxPUGjcOQ2JS3WLkg==} + dev: true /import-fresh@3.3.0: resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} @@ -11377,7 +11360,7 @@ packages: engines: {node: '>=10'} hasBin: true - /mkdist@1.2.0(sass@1.62.0)(typescript@5.0.4): + /mkdist@1.2.0(typescript@5.0.4): resolution: {integrity: sha512-UTqu/bXmIk/+VKNVgufAeMyjUcNy1dn9Bl7wL1zZlCKVrpDgj/VllmZBeh3ZCC/2HWqUrt6frNFTKt9TRZbNvQ==} hasBin: true peerDependencies: @@ -11397,7 +11380,6 @@ packages: mlly: 1.2.0 mri: 1.2.0 pathe: 1.1.0 - sass: 1.62.0 typescript: 5.0.4 dev: true @@ -12470,6 +12452,7 @@ packages: nanoid: 3.3.6 picocolors: 1.0.0 source-map-js: 1.0.2 + dev: true /postcss@8.4.31: resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==} @@ -13323,15 +13306,6 @@ packages: - supports-color dev: false - /rollup-plugin-polyfill-node@0.13.0(rollup@3.20.2): - resolution: {integrity: sha512-FYEvpCaD5jGtyBuBFcQImEGmTxDTPbiHjJdrYIp+mFIwgXiXabxvKUK7ZT9P31ozu2Tqm9llYQMRWsfvTMTAOw==} - peerDependencies: - rollup: ^1.20.0 || ^2.0.0 || ^3.0.0 || ^4.0.0 - dependencies: - '@rollup/plugin-inject': 5.0.5(rollup@3.20.2) - rollup: 3.20.2 - dev: true - /rollup@0.63.5: resolution: {integrity: sha512-dFf8LpUNzIj3oE0vCvobX6rqOzHzLBoblyFp+3znPbjiSmSvOoK2kMKx+Fv9jYduG1rvcCfCveSgEaQHjWRF6g==} hasBin: true @@ -13422,6 +13396,7 @@ packages: chokidar: 3.5.3 immutable: 4.3.0 source-map-js: 1.0.2 + dev: true /saxes@6.0.0: resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==} @@ -14655,7 +14630,7 @@ packages: which-boxed-primitive: 1.0.2 dev: true - /unbuild@1.2.0(sass@1.62.0): + /unbuild@1.2.0: resolution: {integrity: sha512-GcolNMBatav7FbRdLDR8BMbnYWMoKfxXdJIHibpBtx3GERN4GbbUD5h4RfGIFi+mjWPz4AphSz5gIg9FWNWw3Q==} hasBin: true dependencies: @@ -14673,7 +14648,7 @@ packages: hookable: 5.5.3 jiti: 1.18.2 magic-string: 0.30.0 - mkdist: 1.2.0(sass@1.62.0)(typescript@5.0.4) + mkdist: 1.2.0(typescript@5.0.4) mlly: 1.2.0 mri: 1.2.0 pathe: 1.1.0 @@ -15130,6 +15105,38 @@ packages: - terser dev: true + /vite@4.2.1: + resolution: {integrity: sha512-7MKhqdy0ISo4wnvwtqZkjke6XN4taqQ2TBaTccLIpOKv7Vp2h4Y+NpmWCnGDeSvvn45KxvWgGyb0MkHvY1vgbg==} + engines: {node: ^14.18.0 || >=16.0.0} + hasBin: true + peerDependencies: + '@types/node': '>= 14' + less: '*' + sass: '*' + stylus: '*' + sugarss: '*' + terser: ^5.4.0 + peerDependenciesMeta: + '@types/node': + optional: true + less: + optional: true + sass: + optional: true + stylus: + optional: true + sugarss: + optional: true + terser: + optional: true + dependencies: + esbuild: 0.17.16 + postcss: 8.4.33 + resolve: 1.22.2 + rollup: 3.20.2 + optionalDependencies: + fsevents: 2.3.2 + /vite@4.2.1(@types/node@18.15.11)(sass@1.62.0): resolution: {integrity: sha512-7MKhqdy0ISo4wnvwtqZkjke6XN4taqQ2TBaTccLIpOKv7Vp2h4Y+NpmWCnGDeSvvn45KxvWgGyb0MkHvY1vgbg==} engines: {node: ^14.18.0 || >=16.0.0} @@ -15163,6 +15170,7 @@ packages: sass: 1.62.0 optionalDependencies: fsevents: 2.3.2 + dev: true /vitest@0.32.4(jsdom@21.1.1)(sass@1.62.0): resolution: {integrity: sha512-3czFm8RnrsWwIzVDu/Ca48Y/M+qh3vOnF16czJm98Q/AN1y3B6PBsyV8Re91Ty5s7txKNjEhpgtGPcfdbh2MZg==}