@modern-js/plugin-tailwindcss 2.15.0 → 2.17.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,99 +1,90 @@
1
- import {
2
- lazyImport,
3
- PLUGIN_SCHEMAS,
4
- createRuntimeExportsUtils
5
- } from "@modern-js/utils";
6
- var cli_default = ({ pluginName } = { pluginName: "@modern-js/plugin-tailwindcss" }) => ({
7
- name: "@modern-js/plugin-design-token",
8
- setup(api) {
9
- let pluginsExportsUtils;
10
- const resolveConfig = lazyImport("tailwindcss/resolveConfig", require);
11
- const PLUGIN_IDENTIFIER = "designToken";
12
- const getDesignTokens = (designSystem) => {
13
- const tailwindcssConfig = {};
14
- tailwindcssConfig.theme = designSystem ? { ...designSystem } : {};
15
- if (!designSystem) {
16
- tailwindcssConfig.presets = [];
17
- }
18
- if (designSystem) {
19
- delete tailwindcssConfig.theme.supportStyledComponents;
20
- }
21
- return resolveConfig(tailwindcssConfig).theme || {};
22
- };
23
- return {
24
- config() {
25
- const appContext = api.useAppContext();
26
- pluginsExportsUtils = createRuntimeExportsUtils(
27
- appContext.internalDirectory,
28
- "plugins"
29
- );
30
- return {
31
- source: {
32
- alias: {
33
- "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
34
- }
35
- },
36
- tools: {
37
- // TODO: support less、scss、css vars
38
- // less: https://github.com/web-infra-dev/modern.js/pull/398/files#diff-f77c749e403fbf1fb676d5687bef3d7138a230331c849298d8afaff9b6afbc3dR166
39
- // sass: https://github.com/web-infra-dev/modern.js/pull/398/files#diff-f77c749e403fbf1fb676d5687bef3d7138a230331c849298d8afaff9b6afbc3dR229
40
- // postcss: https://github.com/web-infra-dev/modern.js/pull/398/files#diff-f77c749e403fbf1fb676d5687bef3d7138a230331c849298d8afaff9b6afbc3dR281
41
- }
42
- };
43
- },
44
- modifyEntryImports({ entrypoint, imports }) {
45
- var _a, _b;
46
- const userConfig = api.useResolvedConfigContext();
47
- const designSystem = (_b = (_a = userConfig.source) == null ? void 0 : _a.designSystem) != null ? _b : {};
48
- if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
49
- const designTokens = getDesignTokens(userConfig.source.designSystem);
50
- imports.push({
51
- value: "@modern-js/runtime/plugins",
52
- specifiers: [
53
- {
54
- imported: PLUGIN_IDENTIFIER
55
- }
56
- ],
57
- initialize: `
58
- const designTokens = ${JSON.stringify(designTokens)};
59
- `
60
- });
1
+ import { lazyImport, PLUGIN_SCHEMAS, createRuntimeExportsUtils } from "@modern-js/utils";
2
+ export default ({ pluginName } = {
3
+ pluginName: "@modern-js/plugin-tailwindcss"
4
+ }) => {
5
+ return {
6
+ name: "@modern-js/plugin-design-token",
7
+ setup(api) {
8
+ let pluginsExportsUtils;
9
+ const resolveConfig = lazyImport("tailwindcss/resolveConfig", require);
10
+ const PLUGIN_IDENTIFIER = "designToken";
11
+ const getDesignTokens = (designSystem) => {
12
+ const tailwindcssConfig = {};
13
+ tailwindcssConfig.theme = designSystem ? {
14
+ ...designSystem
15
+ } : {};
16
+ if (!designSystem) {
17
+ tailwindcssConfig.presets = [];
61
18
  }
62
- return {
63
- entrypoint,
64
- imports
65
- };
66
- },
67
- modifyEntryRuntimePlugins({ entrypoint, plugins }) {
68
- var _a, _b;
69
- const userConfig = api.useResolvedConfigContext();
70
- const designSystem = (_b = (_a = userConfig.source) == null ? void 0 : _a.designSystem) != null ? _b : {};
71
- let useSCThemeProvider = true;
72
19
  if (designSystem) {
73
- useSCThemeProvider = (designSystem == null ? void 0 : designSystem.supportStyledComponents) || false;
20
+ delete tailwindcssConfig.theme.supportStyledComponents;
74
21
  }
75
- if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
76
- plugins.push({
77
- name: PLUGIN_IDENTIFIER,
78
- options: `{token: designTokens, useStyledComponentsThemeProvider: ${useSCThemeProvider ? "true" : "false"}, useDesignTokenContext: false}`
79
- });
22
+ return resolveConfig(tailwindcssConfig).theme || {};
23
+ };
24
+ return {
25
+ config() {
26
+ const appContext = api.useAppContext();
27
+ pluginsExportsUtils = createRuntimeExportsUtils(appContext.internalDirectory, "plugins");
28
+ return {
29
+ source: {
30
+ alias: {
31
+ "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
32
+ }
33
+ },
34
+ tools: {}
35
+ };
36
+ },
37
+ modifyEntryImports({ entrypoint, imports }) {
38
+ var _userConfig_source;
39
+ const userConfig = api.useResolvedConfigContext();
40
+ var _userConfig_source_designSystem;
41
+ const designSystem = (_userConfig_source_designSystem = (_userConfig_source = userConfig.source) === null || _userConfig_source === void 0 ? void 0 : _userConfig_source.designSystem) !== null && _userConfig_source_designSystem !== void 0 ? _userConfig_source_designSystem : {};
42
+ if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
43
+ const designTokens = getDesignTokens(userConfig.source.designSystem);
44
+ imports.push({
45
+ value: "@modern-js/runtime/plugins",
46
+ specifiers: [
47
+ {
48
+ imported: PLUGIN_IDENTIFIER
49
+ }
50
+ ],
51
+ initialize: `
52
+ const designTokens = ${JSON.stringify(designTokens)};
53
+ `
54
+ });
55
+ }
56
+ return {
57
+ entrypoint,
58
+ imports
59
+ };
60
+ },
61
+ modifyEntryRuntimePlugins({ entrypoint, plugins }) {
62
+ var _userConfig_source;
63
+ const userConfig = api.useResolvedConfigContext();
64
+ var _userConfig_source_designSystem;
65
+ const designSystem = (_userConfig_source_designSystem = (_userConfig_source = userConfig.source) === null || _userConfig_source === void 0 ? void 0 : _userConfig_source.designSystem) !== null && _userConfig_source_designSystem !== void 0 ? _userConfig_source_designSystem : {};
66
+ let useSCThemeProvider = true;
67
+ if (designSystem) {
68
+ useSCThemeProvider = (designSystem === null || designSystem === void 0 ? void 0 : designSystem.supportStyledComponents) || false;
69
+ }
70
+ if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
71
+ plugins.push({
72
+ name: PLUGIN_IDENTIFIER,
73
+ options: `{token: designTokens, useStyledComponentsThemeProvider: ${useSCThemeProvider ? "true" : "false"}, useDesignTokenContext: false}`
74
+ });
75
+ }
76
+ return {
77
+ entrypoint,
78
+ plugins
79
+ };
80
+ },
81
+ validateSchema() {
82
+ return PLUGIN_SCHEMAS["@modern-js/plugin-design-token"];
83
+ },
84
+ addRuntimeExports() {
85
+ pluginsExportsUtils.addExport(`export { default as designToken } from '${pluginName}/runtime-design-token'`);
80
86
  }
81
- return {
82
- entrypoint,
83
- plugins
84
- };
85
- },
86
- validateSchema() {
87
- return PLUGIN_SCHEMAS["@modern-js/plugin-design-token"];
88
- },
89
- addRuntimeExports() {
90
- pluginsExportsUtils.addExport(
91
- `export { default as designToken } from '${pluginName}/runtime-design-token'`
92
- );
93
- }
94
- };
95
- }
96
- });
97
- export {
98
- cli_default as default
87
+ };
88
+ }
89
+ };
99
90
  };
@@ -1,5 +1,2 @@
1
- import { default as default2 } from "./runtime";
1
+ export { default } from "./runtime";
2
2
  export * from "./runtime";
3
- export {
4
- default2 as default
5
- };
@@ -1,6 +1,4 @@
1
- var postcss_plugin_default = ({
2
- cssVarsHash = {}
3
- } = {}) => ({
1
+ export default ({ cssVarsHash = {} } = {}) => ({
4
2
  postcssPlugin: "postcss-replace-css-vars",
5
3
  Declaration(decl) {
6
4
  if (decl.value && typeof decl.value === "string") {
@@ -13,6 +11,3 @@ var postcss_plugin_default = ({
13
11
  }
14
12
  }
15
13
  });
16
- export {
17
- postcss_plugin_default as default
18
- };
@@ -1,6 +1,3 @@
1
1
  import designTokenPlugin from "./plugin";
2
2
  export * from "./plugin";
3
- var runtime_default = designTokenPlugin;
4
- export {
5
- runtime_default as default
6
- };
3
+ export default designTokenPlugin;
@@ -1,28 +1,44 @@
1
- import { jsx } from "react/jsx-runtime";
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import hoistNonReactStatics from "hoist-non-react-statics";
3
3
  import React, { useContext } from "react";
4
- const DesignTokenContext = React.createContext({});
5
- const useDesignTokens = () => useContext(DesignTokenContext);
6
- var plugin_default = (options = {}) => ({
4
+ export const DesignTokenContext = /* @__PURE__ */ React.createContext({});
5
+ export const useDesignTokens = () => useContext(DesignTokenContext);
6
+ export default (options = {}) => ({
7
7
  name: "@modern-js/plugin-design-token",
8
8
  setup: () => ({
9
9
  hoc({ App }, next) {
10
10
  const DesignTokenAppWrapper = (props) => {
11
- const {
12
- token = {},
13
- useStyledComponentsThemeProvider = false,
14
- useDesignTokenContext = false
15
- } = options;
11
+ const { token = {}, useStyledComponentsThemeProvider = false, useDesignTokenContext = false } = options;
16
12
  if (useStyledComponentsThemeProvider && useDesignTokenContext) {
17
13
  const { ThemeProvider } = require("@modern-js/runtime/styled");
18
- return /* @__PURE__ */ jsx(ThemeProvider, { theme: token, children: /* @__PURE__ */ jsx(DesignTokenContext.Provider, { value: token, children: /* @__PURE__ */ jsx(App, { ...props }) }) });
14
+ return /* @__PURE__ */ _jsx(ThemeProvider, {
15
+ theme: token,
16
+ children: /* @__PURE__ */ _jsx(DesignTokenContext.Provider, {
17
+ value: token,
18
+ children: /* @__PURE__ */ _jsx(App, {
19
+ ...props
20
+ })
21
+ })
22
+ });
19
23
  } else if (useStyledComponentsThemeProvider) {
20
24
  const { ThemeProvider } = require("@modern-js/runtime/styled");
21
- return /* @__PURE__ */ jsx(ThemeProvider, { theme: token, children: /* @__PURE__ */ jsx(App, { ...props }) });
25
+ return /* @__PURE__ */ _jsx(ThemeProvider, {
26
+ theme: token,
27
+ children: /* @__PURE__ */ _jsx(App, {
28
+ ...props
29
+ })
30
+ });
22
31
  } else if (useDesignTokenContext) {
23
- return /* @__PURE__ */ jsx(DesignTokenContext.Provider, { value: token, children: /* @__PURE__ */ jsx(App, { ...props }) });
32
+ return /* @__PURE__ */ _jsx(DesignTokenContext.Provider, {
33
+ value: token,
34
+ children: /* @__PURE__ */ _jsx(App, {
35
+ ...props
36
+ })
37
+ });
24
38
  } else {
25
- return /* @__PURE__ */ jsx(App, { ...props });
39
+ return /* @__PURE__ */ _jsx(App, {
40
+ ...props
41
+ });
26
42
  }
27
43
  };
28
44
  return next({
@@ -31,8 +47,3 @@ var plugin_default = (options = {}) => ({
31
47
  }
32
48
  })
33
49
  });
34
- export {
35
- DesignTokenContext,
36
- plugin_default as default,
37
- useDesignTokens
38
- };
@@ -1,4 +1 @@
1
- import { default as default2 } from "./cli";
2
- export {
3
- default2 as default
4
- };
1
+ export { default } from "./cli";
@@ -1,12 +1,15 @@
1
1
  import { applyOptionsChain, logger } from "@modern-js/utils";
2
2
  import { merge, cloneDeep } from "@modern-js/utils/lodash";
3
3
  const checkIfExistNotAllowKeys = (tailwindConfig) => {
4
- const notAllowExistKeys = ["theme"];
4
+ const notAllowExistKeys = [
5
+ "theme"
6
+ ];
5
7
  let notAllowKey = "";
6
- const ret = Object.keys(tailwindConfig).some(
7
- (key) => notAllowExistKeys.includes(key) && (notAllowKey = key)
8
- );
9
- return [ret, notAllowKey];
8
+ const ret = Object.keys(tailwindConfig).some((key) => notAllowExistKeys.includes(key) && (notAllowKey = key));
9
+ return [
10
+ ret,
11
+ notAllowKey
12
+ ];
10
13
  };
11
14
  const getPureDesignSystemConfig = (designSystemConfig) => {
12
15
  const pureDesignSystemConfig = cloneDeep(designSystemConfig);
@@ -14,34 +17,28 @@ const getPureDesignSystemConfig = (designSystemConfig) => {
14
17
  return pureDesignSystemConfig;
15
18
  };
16
19
  const getTailwindConfig = (tailwindVersion, tailwindcss, designSystem, option = {}) => {
17
- const purgeConfig = merge(
18
- {
19
- // TODO: how the operating environment is determined
20
- enabled: process.env.NODE_ENV === "production",
21
- // TODO: Remove or not
22
- layers: ["utilities"],
23
- content: []
24
- },
25
- option.pureConfig || {}
26
- );
27
- const defaultTailwindConfig = tailwindVersion === "3" ? { content: purgeConfig.content } : {
20
+ const purgeConfig = merge({
21
+ // TODO: how the operating environment is determined
22
+ enabled: process.env.NODE_ENV === "production",
23
+ // TODO: Remove or not
24
+ layers: [
25
+ "utilities"
26
+ ],
27
+ content: []
28
+ }, option.pureConfig || {});
29
+ const defaultTailwindConfig = tailwindVersion === "3" ? {
30
+ content: purgeConfig.content
31
+ } : {
28
32
  purge: purgeConfig
29
33
  };
30
- const tailwindConfig = applyOptionsChain(
31
- defaultTailwindConfig,
32
- tailwindcss || {}
33
- );
34
- const designSystemConfig = getPureDesignSystemConfig(designSystem != null ? designSystem : {});
34
+ const tailwindConfig = applyOptionsChain(defaultTailwindConfig, tailwindcss || {});
35
+ const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
35
36
  const [exist, key] = checkIfExistNotAllowKeys(tailwindConfig);
36
37
  if (exist) {
37
- logger.error(
38
- `should not exist '${key}' on tools.tailwindcss, please remove it`
39
- );
38
+ logger.error(`should not exist '${key}' on tools.tailwindcss, please remove it`);
40
39
  process.exit(0);
41
40
  }
42
41
  tailwindConfig.theme = designSystemConfig || {};
43
42
  return tailwindConfig;
44
43
  };
45
- export {
46
- getTailwindConfig
47
- };
44
+ export { getTailwindConfig };
@@ -0,0 +1 @@
1
+ export {};
@@ -1,6 +1,6 @@
1
1
  import path from "path";
2
2
  import { fs } from "@modern-js/utils";
3
- const template = (configPath) => `
3
+ export const template = (configPath) => `
4
4
  function _interopRequireDefault(obj) {
5
5
  return obj && obj.__esModule ? obj : { default: obj };
6
6
  }
@@ -21,18 +21,18 @@ module.exports = {
21
21
  };
22
22
  `;
23
23
  const TWIN_MACRO_NAME = "twin.macro";
24
- const checkTwinMacroExist = async (appDirectory) => {
24
+ export const checkTwinMacroExist = async (appDirectory) => {
25
25
  const packageJson = await fs.readJSON(path.join(appDirectory, "package.json"), {
26
26
  throws: false
27
27
  }) || {};
28
- return Boolean(
29
- typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]
30
- );
28
+ return Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]);
31
29
  };
32
- const getTwinMacroMajorVersion = (appDirectory) => {
30
+ export const getTwinMacroMajorVersion = (appDirectory) => {
33
31
  try {
34
32
  const pkgJsonPath = require.resolve(`${TWIN_MACRO_NAME}/package.json`, {
35
- paths: [appDirectory]
33
+ paths: [
34
+ appDirectory
35
+ ]
36
36
  });
37
37
  const { version } = require(pkgJsonPath);
38
38
  return Number(version.split(".")[0]);
@@ -40,27 +40,28 @@ const getTwinMacroMajorVersion = (appDirectory) => {
40
40
  return null;
41
41
  }
42
42
  };
43
- function getTailwindPath(appDirectory) {
43
+ export function getTailwindPath(appDirectory) {
44
44
  try {
45
- return require.resolve("tailwindcss", { paths: [appDirectory, __dirname] });
45
+ return require.resolve("tailwindcss", {
46
+ paths: [
47
+ appDirectory,
48
+ __dirname
49
+ ]
50
+ });
46
51
  } catch (err) {
47
52
  return "tailwindcss";
48
53
  }
49
54
  }
50
- function getTailwindVersion(appDirectory) {
55
+ export function getTailwindVersion(appDirectory) {
51
56
  try {
52
57
  const packageJsonPath = require.resolve("tailwindcss/package.json", {
53
- paths: [appDirectory, __dirname]
58
+ paths: [
59
+ appDirectory,
60
+ __dirname
61
+ ]
54
62
  });
55
63
  return require(packageJsonPath).version.split(".")[0];
56
64
  } catch (err) {
57
65
  return "3";
58
66
  }
59
67
  }
60
- export {
61
- checkTwinMacroExist,
62
- getTailwindPath,
63
- getTailwindVersion,
64
- getTwinMacroMajorVersion,
65
- template
66
- };
package/package.json CHANGED
@@ -3,7 +3,11 @@
3
3
  "description": "A Progressive React Framework for modern web development.",
4
4
  "homepage": "https://modernjs.dev",
5
5
  "bugs": "https://github.com/web-infra-dev/modern.js/issues",
6
- "repository": "web-infra-dev/modern.js",
6
+ "repository": {
7
+ "type": "git",
8
+ "url": "https://github.com/web-infra-dev/modern.js",
9
+ "directory": "packages/cli/plugin-tailwind"
10
+ },
7
11
  "license": "MIT",
8
12
  "keywords": [
9
13
  "react",
@@ -11,7 +15,7 @@
11
15
  "modern",
12
16
  "modern.js"
13
17
  ],
14
- "version": "2.15.0",
18
+ "version": "2.17.0",
15
19
  "jsnext:source": "./src/index.ts",
16
20
  "types": "./dist/types/index.d.ts",
17
21
  "main": "./dist/cjs/index.js",
@@ -45,7 +49,7 @@
45
49
  "@babel/runtime": "^7.18.0",
46
50
  "babel-plugin-macros": "3.1.0",
47
51
  "hoist-non-react-statics": "^3.3.2",
48
- "@modern-js/utils": "2.15.0"
52
+ "@modern-js/utils": "2.17.0"
49
53
  },
50
54
  "devDependencies": {
51
55
  "@types/jest": "^29",
@@ -55,17 +59,17 @@
55
59
  "jest": "^29",
56
60
  "react": "^18",
57
61
  "postcss": "8.4.21",
58
- "@modern-js/module-tools": "2.15.0",
59
- "@modern-js/runtime": "2.15.0",
60
- "@modern-js/core": "2.15.0",
61
- "@modern-js/types": "2.15.0",
62
- "@scripts/build": "2.15.0",
63
- "@modern-js/app-tools": "2.15.0",
64
- "@scripts/jest-config": "2.15.0"
62
+ "@modern-js/core": "2.17.0",
63
+ "@modern-js/module-tools": "2.17.0",
64
+ "@modern-js/runtime": "2.17.0",
65
+ "@modern-js/types": "2.17.0",
66
+ "@scripts/build": "2.17.0",
67
+ "@modern-js/app-tools": "2.17.0",
68
+ "@scripts/jest-config": "2.17.0"
65
69
  },
66
70
  "peerDependencies": {
67
71
  "tailwindcss": ">= 2.0.0 || >= 3.0.0",
68
- "@modern-js/runtime": "^2.15.0"
72
+ "@modern-js/runtime": "^2.17.0"
69
73
  },
70
74
  "peerDependenciesMeta": {
71
75
  "@modern-js/runtime": {