From 338fe92f3bf88fb4324fdb9e7e85d505a6abab4a Mon Sep 17 00:00:00 2001 From: Alex <8125011+alex-kinokon@users.noreply.github.com> Date: Wed, 31 Jul 2024 19:18:53 -0400 Subject: [PATCH] Add array support --- package.json | 10 +- pnpm-lock.yaml | 149 +++++------------- src/__tests__/__snapshots__/attr.test.ts.snap | 30 +++- .../__snapshots__/styleObject.test.ts.snap | 4 +- src/__tests__/attr.test.ts | 23 ++- src/babel-tailwind.ts | 6 +- src/index.ts | 2 + src/macro.d.ts | 6 + src/vite-plugin.ts | 6 + 9 files changed, 114 insertions(+), 122 deletions(-) diff --git a/package.json b/package.json index 7da5ce2..ad05c7e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@aet/tailwind", - "version": "1.0.2", + "version": "1.0.3", "license": "MIT", "scripts": { "build": "./scripts/index.ts", @@ -19,7 +19,7 @@ } }, "devDependencies": { - "@aet/eslint-rules": "^1.0.1-beta.6", + "@aet/eslint-rules": "^1.0.1-beta.10", "@types/babel__core": "^7.20.5", "@types/bun": "^1.1.6", "@types/dedent": "^0.7.2", @@ -35,6 +35,7 @@ "dedent": "^1.5.3", "esbuild-register": "^3.6.0", "eslint": "^8.57.0", + "nolyfill": "^1.0.39", "postcss-nested": "^6.2.0", "prettier": "^3.3.3", "tailwindcss": "^3.4.7", @@ -66,5 +67,10 @@ "semi": true, "singleQuote": false, "trailingComma": "es5" + }, + "pnpm": { + "overrides": { + "is-core-module": "npm:@nolyfill/is-core-module@^1" + } } } \ No newline at end of file diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1aac66a..235a0c1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -4,6 +4,9 @@ settings: autoInstallPeers: true excludeLinksFromLockfile: false +overrides: + is-core-module: npm:@nolyfill/is-core-module@^1 + importers: .: @@ -40,8 +43,8 @@ importers: version: 4.23.0 devDependencies: '@aet/eslint-rules': - specifier: ^1.0.1-beta.6 - version: 1.0.1-beta.6(eslint@8.57.0)(typescript@5.5.4) + specifier: ^1.0.1-beta.10 + version: 1.0.1-beta.10(eslint@8.57.0)(typescript@5.5.4) '@types/babel__core': specifier: ^7.20.5 version: 7.20.5 @@ -87,6 +90,9 @@ importers: eslint: specifier: ^8.57.0 version: 8.57.0 + nolyfill: + specifier: ^1.0.39 + version: 1.0.39 postcss-nested: specifier: ^6.2.0 version: 6.2.0(postcss@8.4.40) @@ -118,12 +124,12 @@ packages: resolution: {integrity: sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==} engines: {node: '>=0.10.0'} - '@aet/eslint-define-config@0.1.0-beta.8': - resolution: {integrity: sha512-mu8C4E+FcqHonozYE3YEXGCMNUnz/JrNN+kUUYrx/eJNx8uAm33jNpg4n73cpukOTHNCllFqACv6m/RvgMxvnQ==} + '@aet/eslint-define-config@0.1.0-beta.9': + resolution: {integrity: sha512-50ujDk5mmfS/Is7yJh5U7eX+vFUgIidUG5O6whRh1r0lxjM7lpt3uLXpd8jkXfDxMm/JSU/ptK/99ChrZ45EFA==} engines: {node: '>=18.0.0', npm: '>=9.0.0'} - '@aet/eslint-rules@1.0.1-beta.6': - resolution: {integrity: sha512-tj9IP8w7HrHsMlmusCT0k+6ubIZ15n/8tU4EL4bespquqHVvSq5XNsL7abelwRsRoCuWrpCb2I5AcUJsKsxtog==} + '@aet/eslint-rules@1.0.1-beta.10': + resolution: {integrity: sha512-m+DEznz4X2451JXg0aXEQIaq9g406jh4rgn/C6bQdBmjHV4WQa6bFM68i9akwELmTi2zzje3HuxDvcineBOpsA==} peerDependencies: eslint: ^8.57.0 typescript: ^5.4.4 @@ -1014,11 +1020,6 @@ packages: resolution: {integrity: sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==} engines: {node: '>=8'} - browserslist@4.23.0: - resolution: {integrity: sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==} - engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} - hasBin: true - browserslist@4.23.2: resolution: {integrity: sha512-qkqSyistMYdxAcw+CzbZwlBy8AGmS/eEWs+sEV5TnLRGDOL+C5M2EnH6tlZyg0YoAxGJAFKh61En9BR941GnHA==} engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7} @@ -1028,10 +1029,6 @@ packages: resolution: {integrity: sha512-zhaCDicdLuWN5UbN5IMnFqNMhNfo919sH85y2/ea+5Yg9TsTkeZxpL+JLbp6cgYFS4sRLp3YV4S6yDuqVWHYOw==} engines: {node: '>=6'} - builtin-modules@4.0.0: - resolution: {integrity: sha512-p1n8zyCkt1BVrKNFymOHjcDSAl7oq/gUvfgULv2EblgpPVQlQr9yHnWjg9IJ2MhfwPqiYqMMrr01OY7yQoK2yA==} - engines: {node: '>=18.20'} - bun-types@1.1.17: resolution: {integrity: sha512-Z4+OplcSd/YZq7ZsrfD00DKJeCwuNY96a1IDJyR73+cTBaFIS7SC6LhpY/W3AMEXO9iYq5NJ58WAwnwL1p5vKg==} @@ -1053,9 +1050,6 @@ packages: resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==} engines: {node: '>= 6'} - caniuse-lite@1.0.30001600: - resolution: {integrity: sha512-+2S9/2JFhYmYaDpZvo0lKkfvuKIglrx68MwOBqMGHhQsNkLjB5xtc/TGoEPs+MxjSyN/72qer2g97nzR641mOQ==} - caniuse-lite@1.0.30001643: resolution: {integrity: sha512-ERgWGNleEilSrHM6iUz/zJNSQTP8Mr21wDWpdgvRwcTXGAq6jMtOUPP4dqFPTdKqZ2wKTdtB+uucZ3MRpAUSmg==} @@ -1217,9 +1211,6 @@ packages: eastasianwidth@0.2.0: resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==} - electron-to-chromium@1.4.722: - resolution: {integrity: sha512-5nLE0TWFFpZ80Crhtp4pIp8LXCztjYX41yUcV6b+bKR2PqzjskTMOOlBi1VjBHlvHwS+4gar7kNKOrsbsewEZQ==} - electron-to-chromium@1.5.2: resolution: {integrity: sha512-kc4r3U3V3WLaaZqThjYz/Y6z8tJe+7K0bbjUVo3i+LWIypVdMx5nXCkwRe6SWbY6ILqLdc1rKcKmr3HoH7wjSQ==} @@ -1363,6 +1354,11 @@ packages: typescript: optional: true + eslint-plugin-react-refresh@0.4.9: + resolution: {integrity: sha512-QK49YrBAo5CLNLseZ7sZgvgTy21E6NEw22eZqc4teZfH8pxV3yXc9XXOYfUI6JNpw7mfHNkAeWtBxrTyykB6HA==} + peerDependencies: + eslint: '>=7' + eslint-plugin-react-x@1.6.0: resolution: {integrity: sha512-tyDoJfB0Kg3arEcN3q01LDQjGonYXW7awCIRwDW67u3eKETa6LxYtNNUo2RmWpsKWSP23UHp6AOaPdJhbh2E2Q==} engines: {bun: '>=1.0.15', node: '>=18.18.0'} @@ -1483,9 +1479,6 @@ packages: engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} os: [darwin] - function-bind@1.1.2: - resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==} - gensync@1.0.0-beta.2: resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} engines: {node: '>=6.9.0'} @@ -1555,10 +1548,6 @@ packages: resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==} engines: {node: '>=8'} - hasown@2.0.2: - resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==} - engines: {node: '>= 0.4'} - highlight.js@10.7.3: resolution: {integrity: sha512-tzcUFauisWKNHaRkN4Wjl/ZA07gENAjFl3J/c480dprkGTg5EQstgaNFqBfUqCq54kZRIEcreTsAgF/m2quD7A==} @@ -1606,16 +1595,9 @@ packages: resolution: {integrity: sha512-BSLE3HnV2syZ0FK0iMA/yUGplUeMmNz4AW5fnTunbCIqZi4vG3WjJT9FHMy5D69xmAYBHXQhJdALdpwVxV501A==} engines: {node: '>=6'} - is-builtin-module@4.0.0: - resolution: {integrity: sha512-rWP3AMAalQSesXO8gleROyL2iKU73SX5Er66losQn9rWOWL4Gef0a/xOEOVqjWGMuR2vHG3FJ8UUmT700O8oFg==} - engines: {node: '>=18.20'} - is-bun-module@1.0.2: resolution: {integrity: sha512-WusAHTFULJSBJnXlMKYvACScSMPqEjp+rwZtVJRuMsMRJDMxw8MvI53Qj74ACzx1QGPrMPhHifhc87CSJOvmsA==} - is-core-module@2.13.1: - resolution: {integrity: sha512-hHrIjvZsftOsvKSn2TRYl63zvxsgE0K+0mYMoH6gD4omR5IWB2KynivBQczo3+wF1cCkjzvptnI9Q0sPU66ilw==} - is-extglob@2.1.1: resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==} engines: {node: '>=0.10.0'} @@ -1789,10 +1771,6 @@ packages: resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==} engines: {node: '>=4'} - minimatch@10.0.1: - resolution: {integrity: sha512-ethXTt3SGGR+95gudmqJ1eNhRO7eGEGIgYA9vnPatK4/etz2MEVDno5GMCibdMTuBMyElzIlgxMna3K94XDIDQ==} - engines: {node: 20 || >=22} - minimatch@3.1.2: resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==} @@ -1800,9 +1778,6 @@ packages: resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==} engines: {node: '>=16 || 14 >=14.17'} - minimist@1.2.8: - resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==} - minipass@7.0.4: resolution: {integrity: sha512-jYofLM5Dam9279rdkWzqHozUo4ybjdZmCsDHePy5V/PbBcVMiSZR97gmAy45aqi8CK1lG2ECd356FU86avfwUQ==} engines: {node: '>=16 || 14 >=14.17'} @@ -1824,6 +1799,11 @@ packages: node-releases@2.0.14: resolution: {integrity: sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==} + nolyfill@1.0.39: + resolution: {integrity: sha512-1umctiVAqW9fFUDI0LT1ThVHFirQQzPow/A5K06u7bjEp6DzRcgEPCUUnF6t9pHNXngmmhn4KxkMs1IUxugaUw==} + engines: {node: '>=12.4.0'} + hasBin: true + normalize-package-data@2.5.0: resolution: {integrity: sha512-/5CMN3T0R4XTj4DcGaexo+roZSdSFW/0AOOTROrjxzCG1wrWXEsGbRKevjlIL+ZDE4sZlJr5ED4YW0yqmkK+eA==} @@ -2195,10 +2175,6 @@ packages: resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==} engines: {node: '>=12'} - strip-bom@3.0.0: - resolution: {integrity: sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==} - engines: {node: '>=4'} - strip-final-newline@2.0.0: resolution: {integrity: sha512-BrpvfNAE3dcvq7ll3xVumzjKjZQ5tI1sEUIKr3Uoks0XUl45St3FlatVqef9prk4jRDzhW6WZg+3bk93y6pLjA==} engines: {node: '>=6'} @@ -2308,10 +2284,6 @@ packages: ts-pattern@5.2.0: resolution: {integrity: sha512-aGaSpOlDcns7ZoeG/OMftWyQG1KqPVhgplhJxNCvyIXqWrumM5uIoOSarw/hmmi/T1PnuQ/uD8NaFHvLpHicDg==} - tsconfig-paths@4.2.0: - resolution: {integrity: sha512-NoZ4roiN7LnbKn9QqE1amc9DJfzvZXxF4xDavcOWt1BPkdx+m+0gJuPM+S0vCe7zTJMYUP0R8pO2XMr+Y8oLIg==} - engines: {node: '>=6'} - tslib@2.6.3: resolution: {integrity: sha512-xNvxJEOUiWPGhUuUdQgAJPKOOJfGnIyKySOc09XkKsgdUV/3E2zvwZYdejjmRgPCgcym1juLH3226yA7sEFJKQ==} @@ -2362,12 +2334,6 @@ packages: undici-types@5.26.5: resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==} - update-browserslist-db@1.0.13: - resolution: {integrity: sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==} - hasBin: true - peerDependencies: - browserslist: '>= 4.21.0' - update-browserslist-db@1.1.0: resolution: {integrity: sha512-EdRAaAyk2cUE1wOf2DkEhzxqOQvFOoRJFNS6NeyJ01Gp2beMRpBAINjM2iDXE3KCuKhwnvHIQCJm6ThL2Z+HzQ==} hasBin: true @@ -2496,11 +2462,11 @@ snapshots: '@aashutoshrathi/word-wrap@1.2.6': {} - '@aet/eslint-define-config@0.1.0-beta.8': {} + '@aet/eslint-define-config@0.1.0-beta.9': {} - '@aet/eslint-rules@1.0.1-beta.6(eslint@8.57.0)(typescript@5.5.4)': + '@aet/eslint-rules@1.0.1-beta.10(eslint@8.57.0)(typescript@5.5.4)': dependencies: - '@aet/eslint-define-config': 0.1.0-beta.8 + '@aet/eslint-define-config': 0.1.0-beta.9 '@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0) '@eslint-react/eslint-plugin': 1.6.0(eslint@8.57.0)(typescript@5.5.4) '@nolyfill/is-core-module': 1.0.39 @@ -2524,6 +2490,7 @@ snapshots: eslint-plugin-es-x: 8.0.0(eslint@8.57.0) eslint-plugin-import-x: 3.1.0(eslint@8.57.0)(typescript@5.5.4) eslint-plugin-jsdoc: 48.8.3(eslint@8.57.0) + eslint-plugin-react-refresh: 0.4.9(eslint@8.57.0) eslint-plugin-unicorn: 55.0.0(eslint@8.57.0) esprima: 4.0.1 esquery: 1.6.0 @@ -2531,15 +2498,12 @@ snapshots: fast-glob: 3.3.2 get-tsconfig: 4.7.6 ignore: 5.3.1 - is-builtin-module: 4.0.0 is-bun-module: 1.0.2 is-glob: 4.0.3 language-tags: 1.0.9 lodash: 4.17.21 - minimatch: 10.0.1 resolve: 2.0.0-next.5 semver: 7.6.3 - tsconfig-paths: 4.2.0 typescript: 5.5.4 transitivePeerDependencies: - eslint-import-resolver-typescript @@ -3374,13 +3338,6 @@ snapshots: dependencies: fill-range: 7.0.1 - browserslist@4.23.0: - dependencies: - caniuse-lite: 1.0.30001600 - electron-to-chromium: 1.4.722 - node-releases: 2.0.14 - update-browserslist-db: 1.0.13(browserslist@4.23.0) - browserslist@4.23.2: dependencies: caniuse-lite: 1.0.30001643 @@ -3390,8 +3347,6 @@ snapshots: builtin-modules@3.3.0: {} - builtin-modules@4.0.0: {} - bun-types@1.1.17: dependencies: '@types/node': 20.12.14 @@ -3408,8 +3363,6 @@ snapshots: camelcase-css@2.0.1: {} - caniuse-lite@1.0.30001600: {} - caniuse-lite@1.0.30001643: {} chai@5.1.1: @@ -3494,7 +3447,7 @@ snapshots: core-js-compat@3.37.1: dependencies: - browserslist: 4.23.0 + browserslist: 4.23.2 cross-spawn@7.0.3: dependencies: @@ -3544,8 +3497,6 @@ snapshots: eastasianwidth@0.2.0: {} - electron-to-chromium@1.4.722: {} - electron-to-chromium@1.5.2: {} emoji-regex@10.3.0: {} @@ -3643,7 +3594,7 @@ snapshots: eslint-import-resolver-node@0.3.9: dependencies: debug: 3.2.7 - is-core-module: 2.13.1 + is-core-module: '@nolyfill/is-core-module@1.0.39' resolve: 1.22.8 transitivePeerDependencies: - supports-color @@ -3772,6 +3723,10 @@ snapshots: transitivePeerDependencies: - supports-color + eslint-plugin-react-refresh@0.4.9(eslint@8.57.0): + dependencies: + eslint: 8.57.0 + eslint-plugin-react-x@1.6.0(eslint@8.57.0)(typescript@5.5.4): dependencies: '@eslint-react/ast': 1.6.0(eslint@8.57.0)(typescript@5.5.4) @@ -3968,8 +3923,6 @@ snapshots: fsevents@2.3.3: optional: true - function-bind@1.1.2: {} - gensync@1.0.0-beta.2: {} get-caller-file@2.0.5: {} @@ -4034,10 +3987,6 @@ snapshots: has-flag@4.0.0: {} - hasown@2.0.2: - dependencies: - function-bind: 1.1.2 - highlight.js@10.7.3: {} hosted-git-info@2.8.9: {} @@ -4074,18 +4023,10 @@ snapshots: dependencies: builtin-modules: 3.3.0 - is-builtin-module@4.0.0: - dependencies: - builtin-modules: 4.0.0 - is-bun-module@1.0.2: dependencies: semver: 7.6.3 - is-core-module@2.13.1: - dependencies: - hasown: 2.0.2 - is-extglob@2.1.1: {} is-fullwidth-code-point@3.0.0: {} @@ -4214,10 +4155,6 @@ snapshots: min-indent@1.0.1: {} - minimatch@10.0.1: - dependencies: - brace-expansion: 2.0.1 - minimatch@3.1.2: dependencies: brace-expansion: 1.1.11 @@ -4226,8 +4163,6 @@ snapshots: dependencies: brace-expansion: 2.0.1 - minimist@1.2.8: {} - minipass@7.0.4: {} ms@2.1.2: {} @@ -4244,6 +4179,8 @@ snapshots: node-releases@2.0.14: {} + nolyfill@1.0.39: {} + normalize-package-data@2.5.0: dependencies: hosted-git-info: 2.8.9 @@ -4450,13 +4387,13 @@ snapshots: resolve@1.22.8: dependencies: - is-core-module: 2.13.1 + is-core-module: '@nolyfill/is-core-module@1.0.39' path-parse: 1.0.7 supports-preserve-symlinks-flag: 1.0.0 resolve@2.0.0-next.5: dependencies: - is-core-module: 2.13.1 + is-core-module: '@nolyfill/is-core-module@1.0.39' path-parse: 1.0.7 supports-preserve-symlinks-flag: 1.0.0 @@ -4590,8 +4527,6 @@ snapshots: dependencies: ansi-regex: 6.0.1 - strip-bom@3.0.0: {} - strip-final-newline@2.0.0: {} strip-final-newline@3.0.0: {} @@ -4703,12 +4638,6 @@ snapshots: ts-pattern@5.2.0: {} - tsconfig-paths@4.2.0: - dependencies: - json5: 2.2.3 - minimist: 1.2.8 - strip-bom: 3.0.0 - tslib@2.6.3: {} tsup@8.2.3(jiti@1.21.0)(postcss@8.4.40)(typescript@5.5.4): @@ -4754,12 +4683,6 @@ snapshots: undici-types@5.26.5: {} - update-browserslist-db@1.0.13(browserslist@4.23.0): - dependencies: - browserslist: 4.23.0 - escalade: 3.1.2 - picocolors: 1.0.1 - update-browserslist-db@1.1.0(browserslist@4.23.2): dependencies: browserslist: 4.23.2 diff --git a/src/__tests__/__snapshots__/attr.test.ts.snap b/src/__tests__/__snapshots__/attr.test.ts.snap index dcaa1cd..5131a04 100644 --- a/src/__tests__/__snapshots__/attr.test.ts.snap +++ b/src/__tests__/__snapshots__/attr.test.ts.snap @@ -1,11 +1,37 @@ // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html +exports[`attr > supports array expressions in "css" attribute 1`] = ` +"import { cx as _cx } from "@emotion/css"; +import { jsx, jsxs } from "react/jsx-runtime"; +function Hello({ + bold +}) { + return /* @__PURE__ */ jsxs("div", { className: "tw-gqn2k6 tw-169ynv4", children: [ + /* @__PURE__ */ jsx("div", { className: _cx(["tw-gqn2k6", bold && "tw-169ynv4"]), children: "Hello," }), + "world!" + ] }); +} +export { + Hello +};" +`; + +exports[`attr > supports array expressions in "css" attribute 2`] = ` +".tw-gqn2k6 { + text-align: center; +} +.tw-169ynv4 { + font-weight: 600; +}" +`; + exports[`attr > supports conditional expression in "css" attribute 1`] = ` -"import { jsx } from "react/jsx-runtime"; +"import { cx as _cx } from "@emotion/css"; +import { jsx } from "react/jsx-runtime"; function Hello({ isCenter }) { - return /* @__PURE__ */ jsx("div", { className: isCenter ? "tw-gqn2k6" : void 0, children: "Hello, world!" }); + return /* @__PURE__ */ jsx("div", { className: _cx(isCenter ? "tw-gqn2k6" : void 0), children: "Hello, world!" }); } export { Hello diff --git a/src/__tests__/__snapshots__/styleObject.test.ts.snap b/src/__tests__/__snapshots__/styleObject.test.ts.snap index 6a826c2..dff8310 100644 --- a/src/__tests__/__snapshots__/styleObject.test.ts.snap +++ b/src/__tests__/__snapshots__/styleObject.test.ts.snap @@ -23,12 +23,10 @@ var tw_1qtvvjy = { } }; -// src/.temp-styleObject/index.tsx var style = [tw_1qtvvjy, tw_12x0ow0, tw_m4tg46, tw_rqrjo3]; export { style -}; -" +};" `; exports[`babel-tailwind > supports conversion into CSSProperties 1`] = ` diff --git a/src/__tests__/attr.test.ts b/src/__tests__/attr.test.ts index 5eb9d51..8cb533a 100644 --- a/src/__tests__/attr.test.ts +++ b/src/__tests__/attr.test.ts @@ -1,4 +1,4 @@ -import { describe, expect, it } from "vitest"; +import { describe, it } from "vitest"; import { getBuild, matchSnapshot } from "./utils"; describe("attr", () => { @@ -39,4 +39,25 @@ describe("attr", () => { matchSnapshot(files); }); + + it('supports array expressions in "css" attribute', async () => { + const { files } = await compileESBuild({ + clsx: "emotion", + expectFiles: 2, + javascript: /* tsx */ ` + export function Hello({ bold }) { + return ( +
+
+ Hello, +
+ world! +
+ ); + } + `, + }); + + matchSnapshot(files); + }); }); diff --git a/src/babel-tailwind.ts b/src/babel-tailwind.ts index 960e72b..dc30970 100644 --- a/src/babel-tailwind.ts +++ b/src/babel-tailwind.ts @@ -345,10 +345,14 @@ export function babelTailwind( ); } } else { + const containerValue = t.isStringLiteral(valuePathNode) + ? valuePathNode + : t.callExpression(_.getCx(), [valuePathNode]); + parent.attributes.push( t.jsxAttribute( t.jsxIdentifier("className"), - t.jsxExpressionContainer(valuePathNode) + t.jsxExpressionContainer(containerValue) ) ); } diff --git a/src/index.ts b/src/index.ts index 3f4f6d8..04ba9fc 100644 --- a/src/index.ts +++ b/src/index.ts @@ -10,6 +10,8 @@ import { vitePlugin } from "./vite-plugin"; import { type StyleMap, createPostCSS } from "./shared"; import { convertCssToJS } from "./css-to-js"; +export { isMacrosName } from "./vite-plugin"; + export { babelPlugin } from "./esbuild-babel"; export { createPostCSS } from "./shared"; diff --git a/src/macro.d.ts b/src/macro.d.ts index 901893f..9a3a8c0 100644 --- a/src/macro.d.ts +++ b/src/macro.d.ts @@ -1,3 +1,9 @@ +// declare namespace React { +// interface Attributes { +// css?: string +// } +// } + interface RecursiveStringObject { [modifier: string]: string | RecursiveStringObject; } diff --git a/src/vite-plugin.ts b/src/vite-plugin.ts index 86642fd..78d2efc 100644 --- a/src/vite-plugin.ts +++ b/src/vite-plugin.ts @@ -54,3 +54,9 @@ export const vitePlugin = ({ } }, }); + +/** + * `babel-plugin-macros` compatible `isMacrosName` function that works with this plugin. + */ +export const isMacrosName = (v: string) => + v !== macroName && /[./]macro(\.c?js)?$/.test(v);