@modern-js/plugin-tailwindcss 2.27.0 → 2.28.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @modern-js/plugin-tailwindcss
2
2
 
3
+ ## 2.28.0
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies [00b58a7]
8
+ - @modern-js/utils@2.28.0
9
+ - @modern-js/runtime@2.28.0
10
+
3
11
  ## 2.27.0
4
12
 
5
13
  ### Patch Changes
package/dist/cjs/cli.js CHANGED
@@ -47,121 +47,119 @@ function getDefaultContent(appDirectory) {
47
47
  }
48
48
  const tailwindcssPlugin = ({ pluginName } = {
49
49
  pluginName: "@modern-js/plugin-tailwindcss"
50
- }) => {
51
- return {
52
- name: "@modern-js/plugin-tailwindcss",
53
- // support designSystem.supportStyledComponents
54
- usePlugins: [
55
- (0, _cli.default)({
56
- pluginName
57
- })
58
- ],
59
- setup: async (api) => {
60
- const { appDirectory, internalDirectory } = api.useAppContext();
61
- let internalTwConfigPath = "";
62
- const haveTwinMacro = await (0, _utils1.checkTwinMacroExist)(appDirectory);
63
- const tailwindPath = (0, _utils1.getTailwindPath)(appDirectory);
64
- const tailwindVersion = (0, _utils1.getTailwindVersion)(appDirectory);
65
- const defaultContent = getDefaultContent(appDirectory);
66
- return {
67
- prepare() {
68
- if (haveTwinMacro) {
69
- const twinMajorVersion = (0, _utils1.getTwinMacroMajorVersion)(appDirectory);
70
- const useConfigPath = twinMajorVersion && twinMajorVersion < 3;
71
- if (useConfigPath) {
72
- internalTwConfigPath = getRandomTwConfigFileName(internalDirectory);
73
- const globPattern = (0, _utils.slash)(_path.default.join(appDirectory, _utils.CONFIG_CACHE_DIR, "*.cjs"));
74
- const files = _utils.globby.sync(globPattern, {
75
- absolute: true
76
- });
77
- if (files.length > 0) {
78
- _utils.fs.writeFileSync(internalTwConfigPath, (0, _utils1.template)(files[files.length - 1]), "utf-8");
79
- }
50
+ }) => ({
51
+ name: "@modern-js/plugin-tailwindcss",
52
+ // support designSystem.supportStyledComponents
53
+ usePlugins: [
54
+ (0, _cli.default)({
55
+ pluginName
56
+ })
57
+ ],
58
+ setup: async (api) => {
59
+ const { appDirectory, internalDirectory } = api.useAppContext();
60
+ let internalTwConfigPath = "";
61
+ const haveTwinMacro = await (0, _utils1.checkTwinMacroExist)(appDirectory);
62
+ const tailwindPath = (0, _utils1.getTailwindPath)(appDirectory);
63
+ const tailwindVersion = (0, _utils1.getTailwindVersion)(appDirectory);
64
+ const defaultContent = getDefaultContent(appDirectory);
65
+ return {
66
+ prepare() {
67
+ if (haveTwinMacro) {
68
+ const twinMajorVersion = (0, _utils1.getTwinMacroMajorVersion)(appDirectory);
69
+ const useConfigPath = twinMajorVersion && twinMajorVersion < 3;
70
+ if (useConfigPath) {
71
+ internalTwConfigPath = getRandomTwConfigFileName(internalDirectory);
72
+ const globPattern = (0, _utils.slash)(_path.default.join(appDirectory, _utils.CONFIG_CACHE_DIR, "*.cjs"));
73
+ const files = _utils.globby.sync(globPattern, {
74
+ absolute: true
75
+ });
76
+ if (files.length > 0) {
77
+ _utils.fs.writeFileSync(internalTwConfigPath, (0, _utils1.template)(files[files.length - 1]), "utf-8");
80
78
  }
81
79
  }
82
- },
83
- validateSchema() {
84
- return [
85
- {
86
- target: "tools.tailwindcss",
87
- schema: {
88
- typeof: [
89
- "object",
90
- "function"
91
- ]
92
- }
93
- }
94
- ];
95
- },
96
- config() {
97
- let tailwindConfig;
98
- const initTailwindConfig = () => {
99
- if (!tailwindConfig) {
100
- var _modernConfig_tools, _modernConfig_source;
101
- const modernConfig = api.useResolvedConfigContext();
102
- tailwindConfig = (0, _tailwind.getTailwindConfig)(tailwindVersion, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig_tools = modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig_source = modernConfig.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem, {
103
- pureConfig: {
104
- content: defaultContent
105
- }
106
- });
80
+ }
81
+ },
82
+ validateSchema() {
83
+ return [
84
+ {
85
+ target: "tools.tailwindcss",
86
+ schema: {
87
+ typeof: [
88
+ "object",
89
+ "function"
90
+ ]
107
91
  }
108
- };
109
- return {
110
- tools: {
111
- // TODO: Add interface about postcss config
112
- // TODO: In module project, also is called, but should not be called.
113
- postcss: (config) => {
114
- initTailwindConfig();
115
- const tailwindPlugin = require(tailwindPath)(tailwindConfig);
116
- if (Array.isArray(config.postcssOptions.plugins)) {
117
- config.postcssOptions.plugins.push(tailwindPlugin);
118
- } else {
119
- config.postcssOptions.plugins = [
120
- tailwindPlugin
121
- ];
122
- }
123
- },
124
- babel: haveTwinMacro ? (_, { addPlugins }) => {
125
- initTailwindConfig();
126
- addPlugins([
127
- [
128
- require.resolve("babel-plugin-macros"),
129
- {
130
- twin: {
131
- preset: supportCssInJsLibrary,
132
- config: internalTwConfigPath || tailwindConfig
133
- }
92
+ }
93
+ ];
94
+ },
95
+ config() {
96
+ let tailwindConfig;
97
+ const initTailwindConfig = () => {
98
+ if (!tailwindConfig) {
99
+ var _modernConfig_tools, _modernConfig, _modernConfig_source, _modernConfig1;
100
+ const modernConfig = api.useResolvedConfigContext();
101
+ tailwindConfig = (0, _tailwind.getTailwindConfig)(tailwindVersion, (_modernConfig = modernConfig) === null || _modernConfig === void 0 ? void 0 : (_modernConfig_tools = _modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss, (_modernConfig1 = modernConfig) === null || _modernConfig1 === void 0 ? void 0 : (_modernConfig_source = _modernConfig1.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem, {
102
+ pureConfig: {
103
+ content: defaultContent
104
+ }
105
+ });
106
+ }
107
+ };
108
+ return {
109
+ tools: {
110
+ // TODO: Add interface about postcss config
111
+ // TODO: In module project, also is called, but should not be called.
112
+ postcss: (config) => {
113
+ initTailwindConfig();
114
+ const tailwindPlugin = require(tailwindPath)(tailwindConfig);
115
+ if (Array.isArray(config.postcssOptions.plugins)) {
116
+ config.postcssOptions.plugins.push(tailwindPlugin);
117
+ } else {
118
+ config.postcssOptions.plugins = [
119
+ tailwindPlugin
120
+ ];
121
+ }
122
+ },
123
+ babel: haveTwinMacro ? (_, { addPlugins }) => {
124
+ initTailwindConfig();
125
+ addPlugins([
126
+ [
127
+ require.resolve("babel-plugin-macros"),
128
+ {
129
+ twin: {
130
+ preset: supportCssInJsLibrary,
131
+ config: internalTwConfigPath || tailwindConfig
134
132
  }
135
- ]
136
- ]);
137
- } : void 0
138
- }
139
- };
140
- },
141
- beforeBuildTask(config) {
142
- const modernConfig = api.useResolvedConfigContext();
143
- const { designSystem } = modernConfig;
144
- const tailwindConfig = (0, _tailwind.getTailwindConfig)(tailwindVersion, config.style.tailwindcss, designSystem, {
145
- pureConfig: {
146
- content: defaultContent
147
- }
148
- });
149
- const tailwindPlugin = require(tailwindPath)(tailwindConfig);
150
- if (Array.isArray(config.style.postcss.plugins)) {
151
- config.style.postcss.plugins.push(tailwindPlugin);
152
- } else {
153
- config.style.postcss.plugins = [
154
- tailwindPlugin
155
- ];
133
+ }
134
+ ]
135
+ ]);
136
+ } : void 0
137
+ }
138
+ };
139
+ },
140
+ beforeBuildTask(config) {
141
+ const modernConfig = api.useResolvedConfigContext();
142
+ const { designSystem } = modernConfig;
143
+ const tailwindConfig = (0, _tailwind.getTailwindConfig)(tailwindVersion, config.style.tailwindcss, designSystem, {
144
+ pureConfig: {
145
+ content: defaultContent
156
146
  }
157
- return config;
158
- },
159
- modifyLibuild(config, next) {
160
- config.transformCache = false;
161
- return next(config);
147
+ });
148
+ const tailwindPlugin = require(tailwindPath)(tailwindConfig);
149
+ if (Array.isArray(config.style.postcss.plugins)) {
150
+ config.style.postcss.plugins.push(tailwindPlugin);
151
+ } else {
152
+ config.style.postcss.plugins = [
153
+ tailwindPlugin
154
+ ];
162
155
  }
163
- };
164
- }
165
- };
166
- };
156
+ return config;
157
+ },
158
+ modifyLibuild(config, next) {
159
+ config.transformCache = false;
160
+ return next(config);
161
+ }
162
+ };
163
+ }
164
+ });
167
165
  const _default = tailwindcssPlugin;
@@ -11,116 +11,115 @@ Object.defineProperty(exports, "default", {
11
11
  const _utils = require("@modern-js/utils");
12
12
  const _default = ({ pluginName } = {
13
13
  pluginName: "@modern-js/plugin-tailwindcss"
14
- }) => {
15
- return {
16
- name: "@modern-js/plugin-design-token",
17
- setup(api) {
18
- let pluginsExportsUtils;
19
- const resolveConfig = (0, _utils.lazyImport)("tailwindcss/resolveConfig", require);
20
- const PLUGIN_IDENTIFIER = "designToken";
21
- const getDesignTokens = (designSystem) => {
22
- const tailwindcssConfig = {};
23
- tailwindcssConfig.theme = designSystem ? {
24
- ...designSystem
25
- } : {};
26
- if (!designSystem) {
27
- tailwindcssConfig.presets = [];
28
- }
29
- if (designSystem) {
30
- delete tailwindcssConfig.theme.supportStyledComponents;
31
- }
32
- return resolveConfig(tailwindcssConfig).theme || {};
33
- };
34
- return {
35
- config() {
36
- const appContext = api.useAppContext();
37
- pluginsExportsUtils = (0, _utils.createRuntimeExportsUtils)(appContext.internalDirectory, "plugins");
38
- return {
39
- source: {
40
- alias: {
41
- "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
14
+ }) => ({
15
+ name: "@modern-js/plugin-design-token",
16
+ setup(api) {
17
+ let pluginsExportsUtils;
18
+ const resolveConfig = (0, _utils.lazyImport)("tailwindcss/resolveConfig", require);
19
+ const PLUGIN_IDENTIFIER = "designToken";
20
+ const getDesignTokens = (designSystem) => {
21
+ const tailwindcssConfig = {};
22
+ tailwindcssConfig.theme = designSystem ? {
23
+ ...designSystem
24
+ } : {};
25
+ if (!designSystem) {
26
+ tailwindcssConfig.presets = [];
27
+ }
28
+ if (designSystem) {
29
+ delete tailwindcssConfig.theme.supportStyledComponents;
30
+ }
31
+ return resolveConfig(tailwindcssConfig).theme || {};
32
+ };
33
+ return {
34
+ config() {
35
+ const appContext = api.useAppContext();
36
+ pluginsExportsUtils = (0, _utils.createRuntimeExportsUtils)(appContext.internalDirectory, "plugins");
37
+ return {
38
+ source: {
39
+ alias: {
40
+ "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
41
+ }
42
+ },
43
+ tools: {}
44
+ };
45
+ },
46
+ modifyEntryImports({ entrypoint, imports }) {
47
+ var _userConfig_source;
48
+ const userConfig = api.useResolvedConfigContext();
49
+ var _userConfig_source_designSystem;
50
+ 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 : {};
51
+ if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
52
+ const designTokens = getDesignTokens(userConfig.source.designSystem);
53
+ imports.push({
54
+ value: "@modern-js/runtime/plugins",
55
+ specifiers: [
56
+ {
57
+ imported: PLUGIN_IDENTIFIER
42
58
  }
43
- },
44
- tools: {}
45
- };
46
- },
47
- modifyEntryImports({ entrypoint, imports }) {
48
- var _userConfig_source;
49
- const userConfig = api.useResolvedConfigContext();
50
- var _userConfig_source_designSystem;
51
- 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 : {};
52
- if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
53
- const designTokens = getDesignTokens(userConfig.source.designSystem);
54
- imports.push({
55
- value: "@modern-js/runtime/plugins",
56
- specifiers: [
57
- {
58
- imported: PLUGIN_IDENTIFIER
59
- }
60
- ],
61
- initialize: `
59
+ ],
60
+ initialize: `
62
61
  const designTokens = ${JSON.stringify(designTokens)};
63
62
  `
64
- });
65
- }
66
- return {
67
- entrypoint,
68
- imports
69
- };
70
- },
71
- modifyEntryRuntimePlugins({ entrypoint, plugins }) {
72
- var _userConfig_source;
73
- const userConfig = api.useResolvedConfigContext();
74
- var _userConfig_source_designSystem;
75
- 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 : {};
76
- let useSCThemeProvider = true;
77
- if (designSystem) {
78
- useSCThemeProvider = (designSystem === null || designSystem === void 0 ? void 0 : designSystem.supportStyledComponents) || false;
79
- }
80
- if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
81
- plugins.push({
82
- name: PLUGIN_IDENTIFIER,
83
- options: `{token: designTokens, useStyledComponentsThemeProvider: ${useSCThemeProvider ? "true" : "false"}, useDesignTokenContext: false}`
84
- });
85
- }
86
- return {
87
- entrypoint,
88
- plugins
89
- };
90
- },
91
- validateSchema() {
92
- return [
93
- // Legacy Features
94
- {
95
- target: "source.designSystem",
96
- schema: {
97
- typeof: [
98
- "object"
99
- ]
100
- }
101
- },
102
- {
103
- target: "source.designSystem.supportStyledComponents",
104
- schema: {
105
- type: [
106
- "boolean"
107
- ]
108
- }
109
- },
110
- {
111
- target: "designSystem",
112
- schema: {
113
- typeof: [
114
- "object"
115
- ]
116
- }
117
- }
118
- ];
119
- },
120
- addRuntimeExports() {
121
- pluginsExportsUtils.addExport(`export { default as designToken } from '${pluginName}/runtime-design-token'`);
63
+ });
64
+ }
65
+ return {
66
+ entrypoint,
67
+ imports
68
+ };
69
+ },
70
+ modifyEntryRuntimePlugins({ entrypoint, plugins }) {
71
+ var _userConfig_source;
72
+ const userConfig = api.useResolvedConfigContext();
73
+ var _userConfig_source_designSystem;
74
+ 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 : {};
75
+ let useSCThemeProvider = true;
76
+ if (designSystem) {
77
+ var _designSystem;
78
+ useSCThemeProvider = ((_designSystem = designSystem) === null || _designSystem === void 0 ? void 0 : _designSystem.supportStyledComponents) || false;
122
79
  }
123
- };
124
- }
125
- };
126
- };
80
+ if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
81
+ plugins.push({
82
+ name: PLUGIN_IDENTIFIER,
83
+ options: `{token: designTokens, useStyledComponentsThemeProvider: ${useSCThemeProvider ? "true" : "false"}, useDesignTokenContext: false}`
84
+ });
85
+ }
86
+ return {
87
+ entrypoint,
88
+ plugins
89
+ };
90
+ },
91
+ validateSchema() {
92
+ return [
93
+ // Legacy Features
94
+ {
95
+ target: "source.designSystem",
96
+ schema: {
97
+ typeof: [
98
+ "object"
99
+ ]
100
+ }
101
+ },
102
+ {
103
+ target: "source.designSystem.supportStyledComponents",
104
+ schema: {
105
+ type: [
106
+ "boolean"
107
+ ]
108
+ }
109
+ },
110
+ {
111
+ target: "designSystem",
112
+ schema: {
113
+ typeof: [
114
+ "object"
115
+ ]
116
+ }
117
+ }
118
+ ];
119
+ },
120
+ addRuntimeExports() {
121
+ pluginsExportsUtils.addExport(`export { default as designToken } from '${pluginName}/runtime-design-token'`);
122
+ }
123
+ };
124
+ }
125
+ });
package/dist/esm/cli.js CHANGED
@@ -89,9 +89,9 @@ export var tailwindcssPlugin = function() {
89
89
  var tailwindConfig;
90
90
  var initTailwindConfig = function() {
91
91
  if (!tailwindConfig) {
92
- var _modernConfig_tools, _modernConfig_source;
92
+ var _modernConfig_tools, _modernConfig, _modernConfig_source, _modernConfig1;
93
93
  var modernConfig = api.useResolvedConfigContext();
94
- tailwindConfig = getTailwindConfig(tailwindVersion, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig_tools = modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig_source = modernConfig.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem, {
94
+ tailwindConfig = getTailwindConfig(tailwindVersion, (_modernConfig = modernConfig) === null || _modernConfig === void 0 ? void 0 : (_modernConfig_tools = _modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss, (_modernConfig1 = modernConfig) === null || _modernConfig1 === void 0 ? void 0 : (_modernConfig_source = _modernConfig1.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem, {
95
95
  pureConfig: {
96
96
  content: defaultContent
97
97
  }
@@ -65,7 +65,8 @@ export default function() {
65
65
  var 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
66
  var useSCThemeProvider = true;
67
67
  if (designSystem) {
68
- useSCThemeProvider = (designSystem === null || designSystem === void 0 ? void 0 : designSystem.supportStyledComponents) || false;
68
+ var _designSystem;
69
+ useSCThemeProvider = ((_designSystem = designSystem) === null || _designSystem === void 0 ? void 0 : _designSystem.supportStyledComponents) || false;
69
70
  }
70
71
  if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
71
72
  plugins.push({
@@ -24,121 +24,119 @@ function getDefaultContent(appDirectory) {
24
24
  }
25
25
  export const tailwindcssPlugin = ({ pluginName } = {
26
26
  pluginName: "@modern-js/plugin-tailwindcss"
27
- }) => {
28
- return {
29
- name: "@modern-js/plugin-tailwindcss",
30
- // support designSystem.supportStyledComponents
31
- usePlugins: [
32
- designTokenPlugin({
33
- pluginName
34
- })
35
- ],
36
- setup: async (api) => {
37
- const { appDirectory, internalDirectory } = api.useAppContext();
38
- let internalTwConfigPath = "";
39
- const haveTwinMacro = await checkTwinMacroExist(appDirectory);
40
- const tailwindPath = getTailwindPath(appDirectory);
41
- const tailwindVersion = getTailwindVersion(appDirectory);
42
- const defaultContent = getDefaultContent(appDirectory);
43
- return {
44
- prepare() {
45
- if (haveTwinMacro) {
46
- const twinMajorVersion = getTwinMacroMajorVersion(appDirectory);
47
- const useConfigPath = twinMajorVersion && twinMajorVersion < 3;
48
- if (useConfigPath) {
49
- internalTwConfigPath = getRandomTwConfigFileName(internalDirectory);
50
- const globPattern = slash(path.join(appDirectory, CONFIG_CACHE_DIR, "*.cjs"));
51
- const files = globby.sync(globPattern, {
52
- absolute: true
53
- });
54
- if (files.length > 0) {
55
- fs.writeFileSync(internalTwConfigPath, template(files[files.length - 1]), "utf-8");
56
- }
27
+ }) => ({
28
+ name: "@modern-js/plugin-tailwindcss",
29
+ // support designSystem.supportStyledComponents
30
+ usePlugins: [
31
+ designTokenPlugin({
32
+ pluginName
33
+ })
34
+ ],
35
+ setup: async (api) => {
36
+ const { appDirectory, internalDirectory } = api.useAppContext();
37
+ let internalTwConfigPath = "";
38
+ const haveTwinMacro = await checkTwinMacroExist(appDirectory);
39
+ const tailwindPath = getTailwindPath(appDirectory);
40
+ const tailwindVersion = getTailwindVersion(appDirectory);
41
+ const defaultContent = getDefaultContent(appDirectory);
42
+ return {
43
+ prepare() {
44
+ if (haveTwinMacro) {
45
+ const twinMajorVersion = getTwinMacroMajorVersion(appDirectory);
46
+ const useConfigPath = twinMajorVersion && twinMajorVersion < 3;
47
+ if (useConfigPath) {
48
+ internalTwConfigPath = getRandomTwConfigFileName(internalDirectory);
49
+ const globPattern = slash(path.join(appDirectory, CONFIG_CACHE_DIR, "*.cjs"));
50
+ const files = globby.sync(globPattern, {
51
+ absolute: true
52
+ });
53
+ if (files.length > 0) {
54
+ fs.writeFileSync(internalTwConfigPath, template(files[files.length - 1]), "utf-8");
57
55
  }
58
56
  }
59
- },
60
- validateSchema() {
61
- return [
62
- {
63
- target: "tools.tailwindcss",
64
- schema: {
65
- typeof: [
66
- "object",
67
- "function"
68
- ]
69
- }
70
- }
71
- ];
72
- },
73
- config() {
74
- let tailwindConfig;
75
- const initTailwindConfig = () => {
76
- if (!tailwindConfig) {
77
- var _modernConfig_tools, _modernConfig_source;
78
- const modernConfig = api.useResolvedConfigContext();
79
- tailwindConfig = getTailwindConfig(tailwindVersion, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig_tools = modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig_source = modernConfig.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem, {
80
- pureConfig: {
81
- content: defaultContent
82
- }
83
- });
57
+ }
58
+ },
59
+ validateSchema() {
60
+ return [
61
+ {
62
+ target: "tools.tailwindcss",
63
+ schema: {
64
+ typeof: [
65
+ "object",
66
+ "function"
67
+ ]
84
68
  }
85
- };
86
- return {
87
- tools: {
88
- // TODO: Add interface about postcss config
89
- // TODO: In module project, also is called, but should not be called.
90
- postcss: (config) => {
91
- initTailwindConfig();
92
- const tailwindPlugin = require(tailwindPath)(tailwindConfig);
93
- if (Array.isArray(config.postcssOptions.plugins)) {
94
- config.postcssOptions.plugins.push(tailwindPlugin);
95
- } else {
96
- config.postcssOptions.plugins = [
97
- tailwindPlugin
98
- ];
99
- }
100
- },
101
- babel: haveTwinMacro ? (_, { addPlugins }) => {
102
- initTailwindConfig();
103
- addPlugins([
104
- [
105
- require.resolve("babel-plugin-macros"),
106
- {
107
- twin: {
108
- preset: supportCssInJsLibrary,
109
- config: internalTwConfigPath || tailwindConfig
110
- }
69
+ }
70
+ ];
71
+ },
72
+ config() {
73
+ let tailwindConfig;
74
+ const initTailwindConfig = () => {
75
+ if (!tailwindConfig) {
76
+ var _modernConfig_tools, _modernConfig, _modernConfig_source, _modernConfig1;
77
+ const modernConfig = api.useResolvedConfigContext();
78
+ tailwindConfig = getTailwindConfig(tailwindVersion, (_modernConfig = modernConfig) === null || _modernConfig === void 0 ? void 0 : (_modernConfig_tools = _modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss, (_modernConfig1 = modernConfig) === null || _modernConfig1 === void 0 ? void 0 : (_modernConfig_source = _modernConfig1.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem, {
79
+ pureConfig: {
80
+ content: defaultContent
81
+ }
82
+ });
83
+ }
84
+ };
85
+ return {
86
+ tools: {
87
+ // TODO: Add interface about postcss config
88
+ // TODO: In module project, also is called, but should not be called.
89
+ postcss: (config) => {
90
+ initTailwindConfig();
91
+ const tailwindPlugin = require(tailwindPath)(tailwindConfig);
92
+ if (Array.isArray(config.postcssOptions.plugins)) {
93
+ config.postcssOptions.plugins.push(tailwindPlugin);
94
+ } else {
95
+ config.postcssOptions.plugins = [
96
+ tailwindPlugin
97
+ ];
98
+ }
99
+ },
100
+ babel: haveTwinMacro ? (_, { addPlugins }) => {
101
+ initTailwindConfig();
102
+ addPlugins([
103
+ [
104
+ require.resolve("babel-plugin-macros"),
105
+ {
106
+ twin: {
107
+ preset: supportCssInJsLibrary,
108
+ config: internalTwConfigPath || tailwindConfig
111
109
  }
112
- ]
113
- ]);
114
- } : void 0
115
- }
116
- };
117
- },
118
- beforeBuildTask(config) {
119
- const modernConfig = api.useResolvedConfigContext();
120
- const { designSystem } = modernConfig;
121
- const tailwindConfig = getTailwindConfig(tailwindVersion, config.style.tailwindcss, designSystem, {
122
- pureConfig: {
123
- content: defaultContent
124
- }
125
- });
126
- const tailwindPlugin = require(tailwindPath)(tailwindConfig);
127
- if (Array.isArray(config.style.postcss.plugins)) {
128
- config.style.postcss.plugins.push(tailwindPlugin);
129
- } else {
130
- config.style.postcss.plugins = [
131
- tailwindPlugin
132
- ];
110
+ }
111
+ ]
112
+ ]);
113
+ } : void 0
133
114
  }
134
- return config;
135
- },
136
- modifyLibuild(config, next) {
137
- config.transformCache = false;
138
- return next(config);
115
+ };
116
+ },
117
+ beforeBuildTask(config) {
118
+ const modernConfig = api.useResolvedConfigContext();
119
+ const { designSystem } = modernConfig;
120
+ const tailwindConfig = getTailwindConfig(tailwindVersion, config.style.tailwindcss, designSystem, {
121
+ pureConfig: {
122
+ content: defaultContent
123
+ }
124
+ });
125
+ const tailwindPlugin = require(tailwindPath)(tailwindConfig);
126
+ if (Array.isArray(config.style.postcss.plugins)) {
127
+ config.style.postcss.plugins.push(tailwindPlugin);
128
+ } else {
129
+ config.style.postcss.plugins = [
130
+ tailwindPlugin
131
+ ];
139
132
  }
140
- };
141
- }
142
- };
143
- };
133
+ return config;
134
+ },
135
+ modifyLibuild(config, next) {
136
+ config.transformCache = false;
137
+ return next(config);
138
+ }
139
+ };
140
+ }
141
+ });
144
142
  export default tailwindcssPlugin;
@@ -1,116 +1,115 @@
1
1
  import { lazyImport, createRuntimeExportsUtils } from "@modern-js/utils";
2
2
  export default ({ pluginName } = {
3
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 = [];
18
- }
19
- if (designSystem) {
20
- delete tailwindcssConfig.theme.supportStyledComponents;
21
- }
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()
4
+ }) => ({
5
+ name: "@modern-js/plugin-design-token",
6
+ setup(api) {
7
+ let pluginsExportsUtils;
8
+ const resolveConfig = lazyImport("tailwindcss/resolveConfig", require);
9
+ const PLUGIN_IDENTIFIER = "designToken";
10
+ const getDesignTokens = (designSystem) => {
11
+ const tailwindcssConfig = {};
12
+ tailwindcssConfig.theme = designSystem ? {
13
+ ...designSystem
14
+ } : {};
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(appContext.internalDirectory, "plugins");
27
+ return {
28
+ source: {
29
+ alias: {
30
+ "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
31
+ }
32
+ },
33
+ tools: {}
34
+ };
35
+ },
36
+ modifyEntryImports({ entrypoint, imports }) {
37
+ var _userConfig_source;
38
+ const userConfig = api.useResolvedConfigContext();
39
+ var _userConfig_source_designSystem;
40
+ 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 : {};
41
+ if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
42
+ const designTokens = getDesignTokens(userConfig.source.designSystem);
43
+ imports.push({
44
+ value: "@modern-js/runtime/plugins",
45
+ specifiers: [
46
+ {
47
+ imported: PLUGIN_IDENTIFIER
32
48
  }
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: `
49
+ ],
50
+ initialize: `
52
51
  const designTokens = ${JSON.stringify(designTokens)};
53
52
  `
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 [
83
- // Legacy Features
84
- {
85
- target: "source.designSystem",
86
- schema: {
87
- typeof: [
88
- "object"
89
- ]
90
- }
91
- },
92
- {
93
- target: "source.designSystem.supportStyledComponents",
94
- schema: {
95
- type: [
96
- "boolean"
97
- ]
98
- }
99
- },
100
- {
101
- target: "designSystem",
102
- schema: {
103
- typeof: [
104
- "object"
105
- ]
106
- }
107
- }
108
- ];
109
- },
110
- addRuntimeExports() {
111
- pluginsExportsUtils.addExport(`export { default as designToken } from '${pluginName}/runtime-design-token'`);
53
+ });
54
+ }
55
+ return {
56
+ entrypoint,
57
+ imports
58
+ };
59
+ },
60
+ modifyEntryRuntimePlugins({ entrypoint, plugins }) {
61
+ var _userConfig_source;
62
+ const userConfig = api.useResolvedConfigContext();
63
+ var _userConfig_source_designSystem;
64
+ 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 : {};
65
+ let useSCThemeProvider = true;
66
+ if (designSystem) {
67
+ var _designSystem;
68
+ useSCThemeProvider = ((_designSystem = 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
+ });
112
75
  }
113
- };
114
- }
115
- };
116
- };
76
+ return {
77
+ entrypoint,
78
+ plugins
79
+ };
80
+ },
81
+ validateSchema() {
82
+ return [
83
+ // Legacy Features
84
+ {
85
+ target: "source.designSystem",
86
+ schema: {
87
+ typeof: [
88
+ "object"
89
+ ]
90
+ }
91
+ },
92
+ {
93
+ target: "source.designSystem.supportStyledComponents",
94
+ schema: {
95
+ type: [
96
+ "boolean"
97
+ ]
98
+ }
99
+ },
100
+ {
101
+ target: "designSystem",
102
+ schema: {
103
+ typeof: [
104
+ "object"
105
+ ]
106
+ }
107
+ }
108
+ ];
109
+ },
110
+ addRuntimeExports() {
111
+ pluginsExportsUtils.addExport(`export { default as designToken } from '${pluginName}/runtime-design-token'`);
112
+ }
113
+ };
114
+ }
115
+ });
package/package.json CHANGED
@@ -15,7 +15,7 @@
15
15
  "modern",
16
16
  "modern.js"
17
17
  ],
18
- "version": "2.27.0",
18
+ "version": "2.28.0",
19
19
  "jsnext:source": "./src/index.ts",
20
20
  "types": "./dist/types/index.d.ts",
21
21
  "main": "./dist/cjs/index.js",
@@ -49,7 +49,7 @@
49
49
  "babel-plugin-macros": "3.1.0",
50
50
  "hoist-non-react-statics": "^3.3.2",
51
51
  "@swc/helpers": "0.5.1",
52
- "@modern-js/utils": "2.27.0"
52
+ "@modern-js/utils": "2.28.0"
53
53
  },
54
54
  "devDependencies": {
55
55
  "@types/jest": "^29",
@@ -59,17 +59,17 @@
59
59
  "jest": "^29",
60
60
  "react": "^18",
61
61
  "postcss": "8.4.21",
62
- "@modern-js/core": "2.27.0",
63
- "@modern-js/module-tools": "2.27.0",
64
- "@modern-js/runtime": "2.27.0",
65
- "@modern-js/types": "2.27.0",
66
- "@scripts/build": "2.27.0",
67
- "@modern-js/app-tools": "2.27.0",
68
- "@scripts/jest-config": "2.27.0"
62
+ "@modern-js/core": "2.28.0",
63
+ "@modern-js/module-tools": "2.28.0",
64
+ "@modern-js/runtime": "2.28.0",
65
+ "@modern-js/types": "2.28.0",
66
+ "@scripts/build": "2.28.0",
67
+ "@modern-js/app-tools": "2.28.0",
68
+ "@scripts/jest-config": "2.28.0"
69
69
  },
70
70
  "peerDependencies": {
71
71
  "tailwindcss": ">= 2.0.0 || >= 3.0.0",
72
- "@modern-js/runtime": "^2.27.0"
72
+ "@modern-js/runtime": "^2.28.0"
73
73
  },
74
74
  "peerDependenciesMeta": {
75
75
  "@modern-js/runtime": {