@modern-js/plugin-tailwindcss 2.13.4 → 2.13.5-beta.0

package/dist/js/node/utils.js

@@ -0,0 +1,119 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+var utils_exports = {};
+__export(utils_exports, {
+  checkTwinMacroExist: () => checkTwinMacroExist,
+  getTailwindPath: () => getTailwindPath,
+  getTailwindVersion: () => getTailwindVersion,
+  getTwinMacroMajorVersion: () => getTwinMacroMajorVersion,
+  template: () => template
+});
+module.exports = __toCommonJS(utils_exports);
+var import_path = __toESM(require("path"));
+var import_utils = require("@modern-js/utils");
+const template = (configPath) => `
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : { default: obj };
+}
+const modernConfig = _interopRequireDefault(require('${configPath}')).default;
+
+const theme =
+    modernConfig && modernConfig.source && modernConfig.source.designSystem
+      ? modernConfig.source.designSystem
+      : {};
+const tailwindcss =
+    modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss
+      ? modernConfig.tools.tailwindcss
+      : {};
+
+module.exports = {
+    theme,
+    ...tailwindcss,
+};
+`;
+const TWIN_MACRO_NAME = "twin.macro";
+const checkTwinMacroExist = (appDirectory) => __async(void 0, null, function* () {
+  const packageJson = (yield import_utils.fs.readJSON(import_path.default.join(appDirectory, "package.json"), {
+    throws: false
+  })) || {};
+  return Boolean(
+    typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]
+  );
+});
+const getTwinMacroMajorVersion = (appDirectory) => {
+  try {
+    const pkgJsonPath = require.resolve(`${TWIN_MACRO_NAME}/package.json`, {
+      paths: [appDirectory]
+    });
+    const { version } = require(pkgJsonPath);
+    return Number(version.split(".")[0]);
+  } catch (err) {
+    return null;
+  }
+};
+function getTailwindPath(appDirectory) {
+  try {
+    return require.resolve("tailwindcss", { paths: [appDirectory, __dirname] });
+  } catch (err) {
+    return "tailwindcss";
+  }
+}
+function getTailwindVersion(appDirectory) {
+  try {
+    const packageJsonPath = require.resolve("tailwindcss/package.json", {
+      paths: [appDirectory, __dirname]
+    });
+    return require(packageJsonPath).version.split(".")[0];
+  } catch (err) {
+    return "3";
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  checkTwinMacroExist,
+  getTailwindPath,
+  getTailwindVersion,
+  getTwinMacroMajorVersion,
+  template
+});

package/dist/js/treeshaking/cli.js

@@ -0,0 +1,268 @@
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+    try {
+        var info = gen[key](arg);
+        var value = info.value;
+    } catch (error) {
+        reject(error);
+        return;
+    }
+    if (info.done) {
+        resolve(value);
+    } else {
+        Promise.resolve(value).then(_next, _throw);
+    }
+}
+function _asyncToGenerator(fn) {
+    return function() {
+        var self = this, args = arguments;
+        return new Promise(function(resolve, reject) {
+            var gen = fn.apply(self, args);
+            function _next(value) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+            }
+            function _throw(err) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+            }
+            _next(undefined);
+        });
+    };
+}
+var __generator = this && this.__generator || function(thisArg, body) {
+    var f, y, t, g, _ = {
+        label: 0,
+        sent: function() {
+            if (t[0] & 1) throw t[1];
+            return t[1];
+        },
+        trys: [],
+        ops: []
+    };
+    return(g = {
+        next: verb(0),
+        "throw": verb(1),
+        "return": verb(2)
+    }, typeof Symbol === "function" && (g[Symbol.iterator] = function() {
+        return this;
+    }), g);
+    function verb(n) {
+        return function(v) {
+            return step([
+                n,
+                v
+            ]);
+        };
+    }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while(_)try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [
+                op[0] & 2,
+                t.value
+            ];
+            switch(op[0]){
+                case 0:
+                case 1:
+                    t = op;
+                    break;
+                case 4:
+                    _.label++;
+                    return {
+                        value: op[1],
+                        done: false
+                    };
+                case 5:
+                    _.label++;
+                    y = op[1];
+                    op = [
+                        0
+                    ];
+                    continue;
+                case 7:
+                    op = _.ops.pop();
+                    _.trys.pop();
+                    continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+                        _ = 0;
+                        continue;
+                    }
+                    if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+                        _.label = op[1];
+                        break;
+                    }
+                    if (op[0] === 6 && _.label < t[1]) {
+                        _.label = t[1];
+                        t = op;
+                        break;
+                    }
+                    if (t && _.label < t[2]) {
+                        _.label = t[2];
+                        _.ops.push(op);
+                        break;
+                    }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop();
+                    continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) {
+            op = [
+                6,
+                e
+            ];
+            y = 0;
+        } finally{
+            f = t = 0;
+        }
+        if (op[0] & 5) throw op[1];
+        return {
+            value: op[0] ? op[1] : void 0,
+            done: true
+        };
+    }
+};
+import path from "path";
+import { PLUGIN_SCHEMAS, fs, CONFIG_CACHE_DIR, globby, nanoid, slash } from "@modern-js/utils";
+import designTokenPlugin from "./design-token/cli";
+import { getTailwindConfig } from "./tailwind";
+import { template, checkTwinMacroExist, getTailwindPath, getTailwindVersion, getTwinMacroMajorVersion } from "./utils";
+var supportCssInJsLibrary = "styled-components";
+var getRandomTwConfigFileName = function(internalDirectory) {
+    return slash(path.join(internalDirectory, "tailwind.config.".concat(Date.now(), ".").concat(nanoid(), ".js")));
+};
+var cli_default = function() {
+    var pluginName = (arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {
+        pluginName: "@modern-js/plugin-tailwindcss"
+    }).pluginName;
+    return {
+        name: "@modern-js/plugin-tailwindcss",
+        usePlugins: [
+            designTokenPlugin({
+                pluginName: pluginName
+            })
+        ],
+        setup: function() {
+            var _ref = _asyncToGenerator(function(api) {
+                var _api_useAppContext, appDirectory, internalDirectory, internalTwConfigPath, haveTwinMacro, tailwindPath, tailwindVersion, defaultContent;
+                return __generator(this, function(_state) {
+                    switch(_state.label){
+                        case 0:
+                            _api_useAppContext = api.useAppContext(), appDirectory = _api_useAppContext.appDirectory, internalDirectory = _api_useAppContext.internalDirectory;
+                            internalTwConfigPath = "";
+                            return [
+                                4,
+                                checkTwinMacroExist(appDirectory)
+                            ];
+                        case 1:
+                            haveTwinMacro = _state.sent();
+                            tailwindPath = getTailwindPath(appDirectory);
+                            tailwindVersion = getTailwindVersion(appDirectory);
+                            defaultContent = [
+                                "./config/html/**/*.html",
+                                "./config/html/**/*.ejs",
+                                "./config/html/**/*.hbs",
+                                "./src/**/*.js",
+                                "./src/**/*.jsx",
+                                "./src/**/*.ts",
+                                "./src/**/*.tsx",
+                                "./storybook/**/*"
+                            ];
+                            return [
+                                2,
+                                {
+                                    prepare: function prepare() {
+                                        if (haveTwinMacro) {
+                                            var twinMajorVersion = getTwinMacroMajorVersion(appDirectory);
+                                            var useConfigPath = twinMajorVersion && twinMajorVersion < 3;
+                                            if (useConfigPath) {
+                                                internalTwConfigPath = getRandomTwConfigFileName(internalDirectory);
+                                                var globPattern = slash(path.join(appDirectory, CONFIG_CACHE_DIR, "*.cjs"));
+                                                var files = globby.sync(globPattern, {
+                                                    absolute: true
+                                                });
+                                                if (files.length > 0) {
+                                                    fs.writeFileSync(internalTwConfigPath, template(files[files.length - 1]), "utf-8");
+                                                }
+                                            }
+                                        }
+                                    },
+                                    validateSchema: function validateSchema() {
+                                        return PLUGIN_SCHEMAS["@modern-js/plugin-tailwindcss"];
+                                    },
+                                    config: function config() {
+                                        var tailwindConfig;
+                                        var initTailwindConfig = function() {
+                                            if (!tailwindConfig) {
+                                                var _modernConfig_tools, _modernConfig_source;
+                                                var modernConfig = api.useResolvedConfigContext();
+                                                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, {
+                                                    pureConfig: {
+                                                        content: defaultContent
+                                                    }
+                                                });
+                                            }
+                                        };
+                                        return {
+                                            tools: {
+                                                postcss: function(config) {
+                                                    initTailwindConfig();
+                                                    var tailwindPlugin = require(tailwindPath)(tailwindConfig);
+                                                    if (Array.isArray(config.postcssOptions.plugins)) {
+                                                        config.postcssOptions.plugins.push(tailwindPlugin);
+                                                    } else {
+                                                        config.postcssOptions.plugins = [
+                                                            tailwindPlugin
+                                                        ];
+                                                    }
+                                                },
+                                                babel: function babel(_, param) {
+                                                    var addPlugins = param.addPlugins;
+                                                    if (haveTwinMacro) {
+                                                        initTailwindConfig();
+                                                        addPlugins([
+                                                            [
+                                                                require.resolve("babel-plugin-macros"),
+                                                                {
+                                                                    twin: {
+                                                                        preset: supportCssInJsLibrary,
+                                                                        config: internalTwConfigPath || tailwindConfig
+                                                                    }
+                                                                }
+                                                            ]
+                                                        ]);
+                                                    }
+                                                }
+                                            }
+                                        };
+                                    },
+                                    beforeBuildTask: function beforeBuildTask(config) {
+                                        var modernConfig = api.useResolvedConfigContext();
+                                        var designSystem = modernConfig.designSystem;
+                                        var tailwindConfig = getTailwindConfig(tailwindVersion, config.style.tailwindCss, designSystem, {
+                                            pureConfig: {
+                                                content: defaultContent
+                                            }
+                                        });
+                                        var tailwindPlugin = require(tailwindPath)(tailwindConfig);
+                                        if (Array.isArray(config.style.postcss.plugins)) {
+                                            config.style.postcss.plugins.push(tailwindPlugin);
+                                        } else {
+                                            config.style.postcss.plugins = [
+                                                tailwindPlugin
+                                            ];
+                                        }
+                                        return config;
+                                    }
+                                }
+                            ];
+                    }
+                });
+            });
+            return function(api) {
+                return _ref.apply(this, arguments);
+            };
+        }()
+    };
+};
+export { cli_default as default, getRandomTwConfigFileName };

package/dist/js/treeshaking/design-token/cli/index.js

@@ -0,0 +1,118 @@
+function _defineProperty(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
+import { lazyImport, PLUGIN_SCHEMAS, createRuntimeExportsUtils } from "@modern-js/utils";
+var cli_default = function() {
+    var pluginName = (arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {
+        pluginName: "@modern-js/plugin-tailwindcss"
+    }).pluginName;
+    return {
+        name: "@modern-js/plugin-design-token",
+        setup: function setup(api) {
+            var pluginsExportsUtils;
+            var resolveConfig = lazyImport("tailwindcss/resolveConfig", require);
+            var PLUGIN_IDENTIFIER = "designToken";
+            var getDesignTokens = function(designSystem) {
+                var tailwindcssConfig = {};
+                tailwindcssConfig.theme = designSystem ? _objectSpread({}, designSystem) : {};
+                if (!designSystem) {
+                    tailwindcssConfig.presets = [];
+                }
+                if (designSystem) {
+                    delete tailwindcssConfig.theme.supportStyledComponents;
+                }
+                return resolveConfig(tailwindcssConfig).theme || {};
+            };
+            return {
+                config: function config() {
+                    var appContext = api.useAppContext();
+                    pluginsExportsUtils = createRuntimeExportsUtils(appContext.internalDirectory, "plugins");
+                    return {
+                        source: {
+                            alias: {
+                                "@modern-js/runtime/plugins": pluginsExportsUtils.getPath()
+                            }
+                        },
+                        tools: {}
+                    };
+                },
+                modifyEntryImports: function modifyEntryImports(param) {
+                    var entrypoint = param.entrypoint, imports = param.imports;
+                    var _userConfig_source;
+                    var userConfig = api.useResolvedConfigContext();
+                    var _userConfig_source_designSystem;
+                    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 : {};
+                    if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
+                        var designTokens = getDesignTokens(userConfig.source.designSystem);
+                        imports.push({
+                            value: "@modern-js/runtime/plugins",
+                            specifiers: [
+                                {
+                                    imported: PLUGIN_IDENTIFIER
+                                }
+                            ],
+                            initialize: "\n  const designTokens = ".concat(JSON.stringify(designTokens), ";\n            ")
+                        });
+                    }
+                    return {
+                        entrypoint: entrypoint,
+                        imports: imports
+                    };
+                },
+                modifyEntryRuntimePlugins: function modifyEntryRuntimePlugins(param) {
+                    var entrypoint = param.entrypoint, plugins = param.plugins;
+                    var _userConfig_source;
+                    var userConfig = api.useResolvedConfigContext();
+                    var _userConfig_source_designSystem;
+                    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 : {};
+                    var useSCThemeProvider = true;
+                    if (designSystem) {
+                        useSCThemeProvider = (designSystem === null || designSystem === void 0 ? void 0 : designSystem.supportStyledComponents) || false;
+                    }
+                    if (typeof designSystem === "object" && designSystem.supportStyledComponents) {
+                        plugins.push({
+                            name: PLUGIN_IDENTIFIER,
+                            options: "{token: designTokens, useStyledComponentsThemeProvider: ".concat(useSCThemeProvider ? "true" : "false", ", useDesignTokenContext: false}")
+                        });
+                    }
+                    return {
+                        entrypoint: entrypoint,
+                        plugins: plugins
+                    };
+                },
+                validateSchema: function validateSchema() {
+                    return PLUGIN_SCHEMAS["@modern-js/plugin-design-token"];
+                },
+                addRuntimeExports: function addRuntimeExports() {
+                    pluginsExportsUtils.addExport("export { default as designToken } from '".concat(pluginName, "/runtime-design-token'"));
+                }
+            };
+        }
+    };
+};
+export { cli_default as default };

package/dist/js/treeshaking/design-token/index.js

@@ -0,0 +1,3 @@
+import { default as default2 } from "./runtime";
+export * from "./runtime";
+export { default2 as default };

package/dist/js/treeshaking/design-token/postcss-plugin/index.js

@@ -0,0 +1,17 @@
+var postcss_plugin_default = function() {
+    var _ref = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, _ref_cssVarsHash = _ref.cssVarsHash, cssVarsHash = _ref_cssVarsHash === void 0 ? {} : _ref_cssVarsHash;
+    return {
+        postcssPlugin: "postcss-replace-css-vars",
+        Declaration: function Declaration(decl) {
+            if (decl.value && typeof decl.value === "string") {
+                decl.value = decl.value.replace(/--\S*/g, function(match) {
+                    if (cssVarsHash[match]) {
+                        return cssVarsHash[match];
+                    }
+                    return match;
+                });
+            }
+        }
+    };
+};
+export { postcss_plugin_default as default };

package/dist/js/treeshaking/design-token/runtime/index.js

@@ -0,0 +1,4 @@
+import designTokenPlugin from "./plugin";
+export * from "./plugin";
+var runtime_default = designTokenPlugin;
+export { runtime_default as default };

package/dist/js/treeshaking/design-token/runtime/plugin.js

@@ -0,0 +1,78 @@
+function _defineProperty(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
+    }
+    return obj;
+}
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
+import { jsx } from "react/jsx-runtime";
+import hoistNonReactStatics from "hoist-non-react-statics";
+import React, { useContext } from "react";
+var DesignTokenContext = React.createContext({});
+var useDesignTokens = function() {
+    return useContext(DesignTokenContext);
+};
+var plugin_default = function() {
+    var options = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
+    return {
+        name: "@modern-js/plugin-design-token",
+        setup: function() {
+            return {
+                hoc: function hoc(param, next) {
+                    var App = param.App;
+                    var DesignTokenAppWrapper = function(props) {
+                        var _options_token = options.token, token = _options_token === void 0 ? {} : _options_token, _options_useStyledComponentsThemeProvider = options.useStyledComponentsThemeProvider, useStyledComponentsThemeProvider = _options_useStyledComponentsThemeProvider === void 0 ? false : _options_useStyledComponentsThemeProvider, _options_useDesignTokenContext = options.useDesignTokenContext, useDesignTokenContext = _options_useDesignTokenContext === void 0 ? false : _options_useDesignTokenContext;
+                        if (useStyledComponentsThemeProvider && useDesignTokenContext) {
+                            var ThemeProvider = require("@modern-js/runtime/styled").ThemeProvider;
+                            return /* @__PURE__ */ jsx(ThemeProvider, {
+                                theme: token,
+                                children: /* @__PURE__ */ jsx(DesignTokenContext.Provider, {
+                                    value: token,
+                                    children: /* @__PURE__ */ jsx(App, _objectSpread({}, props))
+                                })
+                            });
+                        } else if (useStyledComponentsThemeProvider) {
+                            var ThemeProvider1 = require("@modern-js/runtime/styled").ThemeProvider;
+                            return /* @__PURE__ */ jsx(ThemeProvider1, {
+                                theme: token,
+                                children: /* @__PURE__ */ jsx(App, _objectSpread({}, props))
+                            });
+                        } else if (useDesignTokenContext) {
+                            return /* @__PURE__ */ jsx(DesignTokenContext.Provider, {
+                                value: token,
+                                children: /* @__PURE__ */ jsx(App, _objectSpread({}, props))
+                            });
+                        } else {
+                            return /* @__PURE__ */ jsx(App, _objectSpread({}, props));
+                        }
+                    };
+                    return next({
+                        App: hoistNonReactStatics(DesignTokenAppWrapper, App)
+                    });
+                }
+            };
+        }
+    };
+};
+export { DesignTokenContext, plugin_default as default, useDesignTokens };

package/dist/js/treeshaking/index.js

@@ -0,0 +1,2 @@
+import { default as default2 } from "./cli";
+export { default2 as default };