@udixio/theme 0.3.1 → 0.4.0

package/index.cjs.js

@@ -2,30 +2,6 @@
 
 var awilix = require('awilix');
 var materialColorUtilities = require('@material/material-color-utilities');
-var plugin = require('tailwindcss/plugin');
-var fs = require('fs');
-var path = require('path');
-var replaceInFile = require('replace-in-file');
-
-function _interopNamespaceDefault(e) {
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n.default = e;
-    return Object.freeze(n);
-}
-
-var fs__namespace = /*#__PURE__*/_interopNamespaceDefault(fs);
-var path__namespace = /*#__PURE__*/_interopNamespaceDefault(path);
 
 class ColorApi {
     constructor({ colorManager }) {
@@ -1670,6 +1646,12 @@ const getRotatedHue = (sourceColorHct, hueBreakpoints, rotations) => {
     }
     return materialColorUtilities.sanitizeDegreesDouble(sourceColorHct.hue + rotation);
 };
+const Variants = {
+    Expressive: expressiveVariant,
+    Neutral: neutralVariant,
+    TonalSpot: tonalSpotVariant,
+    Vibrant: vibrantVariant,
+};
 class Variant {
     constructor(palettes = {}, name, customPalettes, 
     /** TODO
@@ -2858,329 +2840,6 @@ class FontPluginImpl extends PluginImplAbstract {
     }
 }
 
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
-
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
-const createOrUpdateFile = (filePath, content) => {
-    try {
-        if (!fs__namespace.existsSync(filePath)) {
-            // Create the folder if necessary.
-            const dirPath = path__namespace.dirname(filePath);
-            if (!fs__namespace.existsSync(dirPath)) {
-                fs__namespace.mkdirSync(dirPath, { recursive: true });
-            }
-            // Create the file with the provided content.
-            fs__namespace.writeFileSync(filePath, content);
-            console.log(`✅ File successfully created: ${filePath}`);
-        }
-        else {
-            console.log(`⚠️ File already exists: ${filePath}`);
-            replaceFileContent(filePath, /[\s\S]*/, content);
-        }
-    }
-    catch (error) {
-        console.error('❌ Error while creating the file:', error);
-    }
-};
-const getFileContent = (filePath, searchPattern) => {
-    try {
-        // Vérifier si le fichier existe
-        if (!fs__namespace.existsSync(filePath)) {
-            console.error(`❌ The specified file does not exist: ${filePath}`);
-            return null;
-        }
-        // Lire le contenu du fichier entier
-        const fileContent = fs__namespace.readFileSync(filePath, 'utf8');
-        // Si un motif est fourni, chercher le texte correspondant
-        if (searchPattern) {
-            if (typeof searchPattern === 'string') {
-                const found = fileContent.includes(searchPattern)
-                    ? searchPattern
-                    : false;
-                console.log(found
-                    ? `✅ The file contains the specified string: "${searchPattern}"`
-                    : `⚠️ The file does NOT contain the specified string: "${searchPattern}"`);
-                return found;
-            }
-            else {
-                const match = fileContent.match(searchPattern);
-                if (match) {
-                    console.log(`✅ Found match: "${match[0]}"`);
-                    return match[0]; // Retourner le texte trouvé
-                }
-                else {
-                    console.log(`⚠️ No match found for the pattern: "${searchPattern.toString()}"`);
-                    return false; // Aucune correspondance trouvée
-                }
-            }
-        }
-        // Si aucun motif n'est fourni, retourner tout le contenu
-        console.log(`✅ File content successfully retrieved.`);
-        return fileContent;
-    }
-    catch (error) {
-        console.error('❌ An error occurred while processing the file:', error);
-        return null;
-    }
-};
-const replaceFileContent = (filePath, searchPattern, replacement) => {
-    try {
-        const results = replaceInFile.replaceInFileSync({
-            files: filePath,
-            from: searchPattern,
-            to: replacement,
-        });
-        if (results.length > 0 && results[0].hasChanged) {
-            console.log(`✅ Content successfully replaced in the file: ${filePath}`);
-        }
-        else {
-            console.log(`⚠️ No replacement made. Here are some possible reasons:\n- The pattern ${searchPattern} was not found.\n- The file might already contain the expected content.`);
-        }
-    }
-    catch (error) {
-        console.error('❌ Error while replacing the file content:', error);
-    }
-};
-const findTailwindCssFile = (startDir, searchPattern) => {
-    const files = fs__namespace.readdirSync(startDir);
-    for (const file of files) {
-        const filePath = path__namespace.join(startDir, file);
-        const stats = fs__namespace.statSync(filePath);
-        if (stats.isDirectory()) {
-            // Appeler récursivement si c'est un dossier
-            const result = findTailwindCssFile(filePath, searchPattern);
-            if (result)
-                return result;
-        }
-        else if (file.endsWith('.css')) {
-            // Lire chaque fichier .css
-            const content = fs__namespace.readFileSync(filePath, 'utf8');
-            if (content.includes(searchPattern)) {
-                console.log('Fichier trouvé :', filePath);
-                return filePath;
-            }
-        }
-    }
-    return null;
-};
-
-const font = (fontStyles, responsiveBreakPoints) => {
-    const createUtilities = ({ theme }) => {
-        const pixelUnit = 'rem';
-        const newUtilities = {};
-        const baseTextStyle = (sizeValue) => ({
-            fontSize: sizeValue.fontSize + pixelUnit,
-            fontWeight: sizeValue.fontWeight,
-            lineHeight: sizeValue.lineHeight + pixelUnit,
-            letterSpacing: sizeValue.letterSpacing
-                ? sizeValue.letterSpacing + pixelUnit
-                : null,
-            fontFamily: theme('fontFamily.' + sizeValue.fontFamily),
-        });
-        const responsiveTextStyle = (sizeValue, breakPointName, breakPointRatio) => ({
-            [`@media (min-width: ${theme('screens.' + breakPointName, {})})`]: {
-                fontSize: sizeValue.fontSize * breakPointRatio + pixelUnit,
-                lineHeight: sizeValue.lineHeight * breakPointRatio + pixelUnit,
-            },
-        });
-        for (const [roleName, roleValue] of Object.entries(fontStyles)) {
-            for (const [sizeName, sizeValue] of Object.entries(roleValue)) {
-                newUtilities['.text-' + roleName + '-' + sizeName] = Object.assign(Object.assign({}, baseTextStyle(sizeValue)), Object.entries(responsiveBreakPoints).reduce((acc, [breakPointName, breakPointRatio]) => {
-                    acc = Object.assign(Object.assign({}, acc), responsiveTextStyle(sizeValue, breakPointName, breakPointRatio));
-                    return acc;
-                }, {}));
-            }
-        }
-        return newUtilities;
-    };
-    return plugin(({ addUtilities, theme, }) => {
-        const newUtilities = createUtilities({ theme });
-        addUtilities(newUtilities);
-    });
-};
-
-// from tailwindcss src/util/flattenColors
-const state = (colorKeys) => plugin((pluginArgs) => {
-    addAllNewComponents(pluginArgs, {
-        statePrefix: 'state',
-        disabledStyles: {
-            textOpacity: 0.38,
-            backgroundOpacity: 0.12,
-        },
-        transition: {
-            duration: 150,
-        },
-    }, colorKeys);
-}, {});
-const addAllNewComponents = ({ addComponents }, { statePrefix, disabledStyles, transition }, colorKeys) => {
-    const newComponents = {};
-    for (const isGroup of [false, true]) {
-        const group = isGroup ? 'group-' : '';
-        for (const colorName of colorKeys) {
-            const className = `.${group}${statePrefix}-${colorName}`;
-            newComponents[className] = {
-                [`@apply ${group}hover:bg-${colorName}/[0.08]`]: {},
-                [`@apply ${group}active:bg-${colorName}/[0.12]`]: {},
-                [`@apply ${group}focus-visible:bg-${colorName}/[0.12]`]: {},
-            };
-            if (transition) {
-                newComponents[className][`@apply transition-colors`] = {};
-                newComponents[className][`@apply duration-${transition.duration}`] = {};
-            }
-            if (disabledStyles) {
-                newComponents[className][`@apply ${group}disabled:text-on-surface/[${disabledStyles.textOpacity}]`] = {};
-                newComponents[className][`@apply ${group}disabled:bg-on-surface/[${disabledStyles.backgroundOpacity}]`] = {};
-            }
-        }
-    }
-    for (const colorName of colorKeys) {
-        for (const stateName of ['hover', 'active', 'focus', 'disabled']) {
-            const className = `.${stateName}-${statePrefix}-${colorName}`;
-            if (stateName === 'active' || stateName === 'focus') {
-                newComponents[className] = {
-                    [`@apply bg-${colorName}/[0.12]`]: {},
-                };
-            }
-            else if (stateName === 'hover') {
-                newComponents[className] = {
-                    [`@apply bg-${colorName}/[0.08]`]: {},
-                };
-            }
-            else if (stateName === 'disabled') {
-                newComponents[className] = {
-                    [`@apply text-on-surface/[${disabledStyles.textOpacity}]`]: {},
-                };
-                newComponents[className] = {
-                    [`@apply bg-on-surface/[${disabledStyles.backgroundOpacity}]`]: {},
-                };
-            }
-        }
-    }
-    addComponents(newComponents);
-};
-
-class TailwindPlugin extends PluginAbstract {
-    constructor() {
-        super(...arguments);
-        this.dependencies = [FontPlugin];
-        this.name = 'tailwind';
-        this.pluginClass = TailwindImplPlugin;
-    }
-}
-class TailwindImplPlugin extends PluginImplAbstract {
-    onInit() {
-        var _a, _b;
-        var _c, _d;
-        (_a = (_c = this.options).darkMode) !== null && _a !== void 0 ? _a : (_c.darkMode = 'class');
-        (_b = (_d = this.options).responsiveBreakPoints) !== null && _b !== void 0 ? _b : (_d.responsiveBreakPoints = {
-            lg: 1.125,
-        });
-    }
-    load() {
-        var _a;
-        const searchKeyword = '@plugin "@udixio/tailwind"';
-        const tailwindCssPath = findTailwindCssFile(process.cwd(), searchKeyword);
-        if (!tailwindCssPath) {
-            throw new Error('Tailwind plugin not found. Please use it first. (@plugin "@udixio/tailwind")');
-        }
-        const searchPattern = /@import 'tailwindcss';/;
-        const replacement = `@import 'tailwindcss';\n@import "./udixio.css";`;
-        if (!getFileContent(tailwindCssPath, /@import\s+"\.\/udixio\.css";/)) {
-            replaceFileContent(tailwindCssPath, searchPattern, replacement);
-        }
-        const cssFilePath = path.dirname(tailwindCssPath);
-        const colors = {};
-        for (const isDark of [false, true]) {
-            this.api.themes.update({ isDark: isDark });
-            for (const [key, value] of this.api.colors.getColors().entries()) {
-                const newKey = key
-                    .replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2')
-                    .toLowerCase();
-                (_a = colors[newKey]) !== null && _a !== void 0 ? _a : (colors[newKey] = { light: '', dark: '' });
-                colors[newKey][isDark ? 'dark' : 'light'] = value.getHex();
-            }
-        }
-        const { fontStyles, fontFamily } = this.api.plugins
-            .getPlugin(FontPlugin)
-            .getInstance()
-            .getFonts();
-        createOrUpdateFile(path.join(cssFilePath, 'udixio.css'), `
-@custom-variant dark (&:where(.dark, .dark *));
-@theme {
-    --color-*: initial;
-  ${Object.entries(colors)
-            .map(([key, value]) => `--color-${key}: ${value.light};`)
-            .join('\n  ')}
-}
-@layer theme {
-  .dark {
-  ${Object.entries(colors)
-            .map(([key, value]) => `--color-${key}: ${value.dark};`)
-            .join('\n  ')}
-  }
-}
-`);
-        const plugins = [
-            state(Object.keys(colors)),
-            font(fontStyles, this.options.responsiveBreakPoints),
-        ];
-        return plugin.withOptions(
-        // 1) factory(options) → la fonction “handler” du plugin
-        (options = {}) => {
-            return function (api) {
-                return __awaiter(this, void 0, void 0, function* () {
-                    plugins.forEach((plugin) => {
-                        plugin.handler(api);
-                    });
-                });
-            };
-        }, 
-        // 2) config(options) → objet à merger dans tailwind.config
-        (options = {}) => {
-            return {
-                theme: {
-                    fontFamily,
-                },
-            };
-        });
-    }
-}
-
-const createTheme = () => {
-    const app = bootstrapFromConfig();
-    const plugin = app.plugins.getPlugin(TailwindPlugin).getInstance();
-    return plugin.load();
-};
-
 exports.API = API;
 exports.AppContainer = AppContainer;
 exports.AppModule = AppModule;
@@ -3199,25 +2858,22 @@ exports.PluginImplAbstract = PluginImplAbstract;
 exports.PluginModule = PluginModule;
 exports.Scheme = Scheme;
 exports.SchemeManager = SchemeManager;
-exports.TailwindPlugin = TailwindPlugin;
 exports.ThemeApi = ThemeApi;
 exports.ThemeModule = ThemeModule;
 exports.ToneDeltaPair = ToneDeltaPair;
 exports.Variant = Variant;
 exports.VariantManager = VariantManager;
+exports.Variants = Variants;
 exports.bootstrap = bootstrap;
 exports.bootstrapFromConfig = bootstrapFromConfig;
-exports.createTheme = createTheme;
 exports.defaultColors = defaultColors;
 exports.defineConfig = defineConfig;
 exports.expressiveVariant = expressiveVariant;
 exports.extendSpecVersion = extendSpecVersion;
-exports.font = font;
 exports.getPiecewiseHue = getPiecewiseHue;
 exports.getRotatedHue = getRotatedHue;
 exports.highestSurface = highestSurface;
 exports.importContainer = importContainer;
 exports.neutralVariant = neutralVariant;
-exports.state = state;
 exports.tonalSpotVariant = tonalSpotVariant;
 exports.vibrantVariant = vibrantVariant;

package/index.esm.js

@@ -1,10 +1,5 @@
 import { asClass, createContainer, InjectionMode } from 'awilix';
 import { lerp, argbFromLstar, sanitizeDegreesDouble, yFromLstar, argbFromLinrgb, Cam16, signum, matrixMultiply, ViewingConditions, lstarFromArgb, lstarFromY, Contrast, clampDouble, hexFromArgb, argbFromHex, DynamicColor as DynamicColor$1, TonalPalette } from '@material/material-color-utilities';
-import plugin from 'tailwindcss/plugin';
-import * as fs from 'fs';
-import * as path from 'path';
-import path__default from 'path';
-import { replaceInFileSync } from 'replace-in-file';
 
 class ColorApi {
     constructor({ colorManager }) {
@@ -1649,6 +1644,12 @@ const getRotatedHue = (sourceColorHct, hueBreakpoints, rotations) => {
     }
     return sanitizeDegreesDouble(sourceColorHct.hue + rotation);
 };
+const Variants = {
+    Expressive: expressiveVariant,
+    Neutral: neutralVariant,
+    TonalSpot: tonalSpotVariant,
+    Vibrant: vibrantVariant,
+};
 class Variant {
     constructor(palettes = {}, name, customPalettes, 
     /** TODO
@@ -2837,327 +2838,4 @@ class FontPluginImpl extends PluginImplAbstract {
     }
 }
 
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
-
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
-const createOrUpdateFile = (filePath, content) => {
-    try {
-        if (!fs.existsSync(filePath)) {
-            // Create the folder if necessary.
-            const dirPath = path.dirname(filePath);
-            if (!fs.existsSync(dirPath)) {
-                fs.mkdirSync(dirPath, { recursive: true });
-            }
-            // Create the file with the provided content.
-            fs.writeFileSync(filePath, content);
-            console.log(`✅ File successfully created: ${filePath}`);
-        }
-        else {
-            console.log(`⚠️ File already exists: ${filePath}`);
-            replaceFileContent(filePath, /[\s\S]*/, content);
-        }
-    }
-    catch (error) {
-        console.error('❌ Error while creating the file:', error);
-    }
-};
-const getFileContent = (filePath, searchPattern) => {
-    try {
-        // Vérifier si le fichier existe
-        if (!fs.existsSync(filePath)) {
-            console.error(`❌ The specified file does not exist: ${filePath}`);
-            return null;
-        }
-        // Lire le contenu du fichier entier
-        const fileContent = fs.readFileSync(filePath, 'utf8');
-        // Si un motif est fourni, chercher le texte correspondant
-        if (searchPattern) {
-            if (typeof searchPattern === 'string') {
-                const found = fileContent.includes(searchPattern)
-                    ? searchPattern
-                    : false;
-                console.log(found
-                    ? `✅ The file contains the specified string: "${searchPattern}"`
-                    : `⚠️ The file does NOT contain the specified string: "${searchPattern}"`);
-                return found;
-            }
-            else {
-                const match = fileContent.match(searchPattern);
-                if (match) {
-                    console.log(`✅ Found match: "${match[0]}"`);
-                    return match[0]; // Retourner le texte trouvé
-                }
-                else {
-                    console.log(`⚠️ No match found for the pattern: "${searchPattern.toString()}"`);
-                    return false; // Aucune correspondance trouvée
-                }
-            }
-        }
-        // Si aucun motif n'est fourni, retourner tout le contenu
-        console.log(`✅ File content successfully retrieved.`);
-        return fileContent;
-    }
-    catch (error) {
-        console.error('❌ An error occurred while processing the file:', error);
-        return null;
-    }
-};
-const replaceFileContent = (filePath, searchPattern, replacement) => {
-    try {
-        const results = replaceInFileSync({
-            files: filePath,
-            from: searchPattern,
-            to: replacement,
-        });
-        if (results.length > 0 && results[0].hasChanged) {
-            console.log(`✅ Content successfully replaced in the file: ${filePath}`);
-        }
-        else {
-            console.log(`⚠️ No replacement made. Here are some possible reasons:\n- The pattern ${searchPattern} was not found.\n- The file might already contain the expected content.`);
-        }
-    }
-    catch (error) {
-        console.error('❌ Error while replacing the file content:', error);
-    }
-};
-const findTailwindCssFile = (startDir, searchPattern) => {
-    const files = fs.readdirSync(startDir);
-    for (const file of files) {
-        const filePath = path.join(startDir, file);
-        const stats = fs.statSync(filePath);
-        if (stats.isDirectory()) {
-            // Appeler récursivement si c'est un dossier
-            const result = findTailwindCssFile(filePath, searchPattern);
-            if (result)
-                return result;
-        }
-        else if (file.endsWith('.css')) {
-            // Lire chaque fichier .css
-            const content = fs.readFileSync(filePath, 'utf8');
-            if (content.includes(searchPattern)) {
-                console.log('Fichier trouvé :', filePath);
-                return filePath;
-            }
-        }
-    }
-    return null;
-};
-
-const font = (fontStyles, responsiveBreakPoints) => {
-    const createUtilities = ({ theme }) => {
-        const pixelUnit = 'rem';
-        const newUtilities = {};
-        const baseTextStyle = (sizeValue) => ({
-            fontSize: sizeValue.fontSize + pixelUnit,
-            fontWeight: sizeValue.fontWeight,
-            lineHeight: sizeValue.lineHeight + pixelUnit,
-            letterSpacing: sizeValue.letterSpacing
-                ? sizeValue.letterSpacing + pixelUnit
-                : null,
-            fontFamily: theme('fontFamily.' + sizeValue.fontFamily),
-        });
-        const responsiveTextStyle = (sizeValue, breakPointName, breakPointRatio) => ({
-            [`@media (min-width: ${theme('screens.' + breakPointName, {})})`]: {
-                fontSize: sizeValue.fontSize * breakPointRatio + pixelUnit,
-                lineHeight: sizeValue.lineHeight * breakPointRatio + pixelUnit,
-            },
-        });
-        for (const [roleName, roleValue] of Object.entries(fontStyles)) {
-            for (const [sizeName, sizeValue] of Object.entries(roleValue)) {
-                newUtilities['.text-' + roleName + '-' + sizeName] = Object.assign(Object.assign({}, baseTextStyle(sizeValue)), Object.entries(responsiveBreakPoints).reduce((acc, [breakPointName, breakPointRatio]) => {
-                    acc = Object.assign(Object.assign({}, acc), responsiveTextStyle(sizeValue, breakPointName, breakPointRatio));
-                    return acc;
-                }, {}));
-            }
-        }
-        return newUtilities;
-    };
-    return plugin(({ addUtilities, theme, }) => {
-        const newUtilities = createUtilities({ theme });
-        addUtilities(newUtilities);
-    });
-};
-
-// from tailwindcss src/util/flattenColors
-const state = (colorKeys) => plugin((pluginArgs) => {
-    addAllNewComponents(pluginArgs, {
-        statePrefix: 'state',
-        disabledStyles: {
-            textOpacity: 0.38,
-            backgroundOpacity: 0.12,
-        },
-        transition: {
-            duration: 150,
-        },
-    }, colorKeys);
-}, {});
-const addAllNewComponents = ({ addComponents }, { statePrefix, disabledStyles, transition }, colorKeys) => {
-    const newComponents = {};
-    for (const isGroup of [false, true]) {
-        const group = isGroup ? 'group-' : '';
-        for (const colorName of colorKeys) {
-            const className = `.${group}${statePrefix}-${colorName}`;
-            newComponents[className] = {
-                [`@apply ${group}hover:bg-${colorName}/[0.08]`]: {},
-                [`@apply ${group}active:bg-${colorName}/[0.12]`]: {},
-                [`@apply ${group}focus-visible:bg-${colorName}/[0.12]`]: {},
-            };
-            if (transition) {
-                newComponents[className][`@apply transition-colors`] = {};
-                newComponents[className][`@apply duration-${transition.duration}`] = {};
-            }
-            if (disabledStyles) {
-                newComponents[className][`@apply ${group}disabled:text-on-surface/[${disabledStyles.textOpacity}]`] = {};
-                newComponents[className][`@apply ${group}disabled:bg-on-surface/[${disabledStyles.backgroundOpacity}]`] = {};
-            }
-        }
-    }
-    for (const colorName of colorKeys) {
-        for (const stateName of ['hover', 'active', 'focus', 'disabled']) {
-            const className = `.${stateName}-${statePrefix}-${colorName}`;
-            if (stateName === 'active' || stateName === 'focus') {
-                newComponents[className] = {
-                    [`@apply bg-${colorName}/[0.12]`]: {},
-                };
-            }
-            else if (stateName === 'hover') {
-                newComponents[className] = {
-                    [`@apply bg-${colorName}/[0.08]`]: {},
-                };
-            }
-            else if (stateName === 'disabled') {
-                newComponents[className] = {
-                    [`@apply text-on-surface/[${disabledStyles.textOpacity}]`]: {},
-                };
-                newComponents[className] = {
-                    [`@apply bg-on-surface/[${disabledStyles.backgroundOpacity}]`]: {},
-                };
-            }
-        }
-    }
-    addComponents(newComponents);
-};
-
-class TailwindPlugin extends PluginAbstract {
-    constructor() {
-        super(...arguments);
-        this.dependencies = [FontPlugin];
-        this.name = 'tailwind';
-        this.pluginClass = TailwindImplPlugin;
-    }
-}
-class TailwindImplPlugin extends PluginImplAbstract {
-    onInit() {
-        var _a, _b;
-        var _c, _d;
-        (_a = (_c = this.options).darkMode) !== null && _a !== void 0 ? _a : (_c.darkMode = 'class');
-        (_b = (_d = this.options).responsiveBreakPoints) !== null && _b !== void 0 ? _b : (_d.responsiveBreakPoints = {
-            lg: 1.125,
-        });
-    }
-    load() {
-        var _a;
-        const searchKeyword = '@plugin "@udixio/tailwind"';
-        const tailwindCssPath = findTailwindCssFile(process.cwd(), searchKeyword);
-        if (!tailwindCssPath) {
-            throw new Error('Tailwind plugin not found. Please use it first. (@plugin "@udixio/tailwind")');
-        }
-        const searchPattern = /@import 'tailwindcss';/;
-        const replacement = `@import 'tailwindcss';\n@import "./udixio.css";`;
-        if (!getFileContent(tailwindCssPath, /@import\s+"\.\/udixio\.css";/)) {
-            replaceFileContent(tailwindCssPath, searchPattern, replacement);
-        }
-        const cssFilePath = path__default.dirname(tailwindCssPath);
-        const colors = {};
-        for (const isDark of [false, true]) {
-            this.api.themes.update({ isDark: isDark });
-            for (const [key, value] of this.api.colors.getColors().entries()) {
-                const newKey = key
-                    .replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, '$1-$2')
-                    .toLowerCase();
-                (_a = colors[newKey]) !== null && _a !== void 0 ? _a : (colors[newKey] = { light: '', dark: '' });
-                colors[newKey][isDark ? 'dark' : 'light'] = value.getHex();
-            }
-        }
-        const { fontStyles, fontFamily } = this.api.plugins
-            .getPlugin(FontPlugin)
-            .getInstance()
-            .getFonts();
-        createOrUpdateFile(path__default.join(cssFilePath, 'udixio.css'), `
-@custom-variant dark (&:where(.dark, .dark *));
-@theme {
-    --color-*: initial;
-  ${Object.entries(colors)
-            .map(([key, value]) => `--color-${key}: ${value.light};`)
-            .join('\n  ')}
-}
-@layer theme {
-  .dark {
-  ${Object.entries(colors)
-            .map(([key, value]) => `--color-${key}: ${value.dark};`)
-            .join('\n  ')}
-  }
-}
-`);
-        const plugins = [
-            state(Object.keys(colors)),
-            font(fontStyles, this.options.responsiveBreakPoints),
-        ];
-        return plugin.withOptions(
-        // 1) factory(options) → la fonction “handler” du plugin
-        (options = {}) => {
-            return function (api) {
-                return __awaiter(this, void 0, void 0, function* () {
-                    plugins.forEach((plugin) => {
-                        plugin.handler(api);
-                    });
-                });
-            };
-        }, 
-        // 2) config(options) → objet à merger dans tailwind.config
-        (options = {}) => {
-            return {
-                theme: {
-                    fontFamily,
-                },
-            };
-        });
-    }
-}
-
-const createTheme = () => {
-    const app = bootstrapFromConfig();
-    const plugin = app.plugins.getPlugin(TailwindPlugin).getInstance();
-    return plugin.load();
-};
-
-export { API, AppContainer, AppModule, ColorApi, ColorManager, ColorModule, ConfigModule, ConfigService, ConfigurableColor, ContrastCurve, DynamicColor, FontFamily, FontPlugin, PluginAbstract, PluginApi, PluginImplAbstract, PluginModule, Scheme, SchemeManager, TailwindPlugin, ThemeApi, ThemeModule, ToneDeltaPair, Variant, VariantManager, bootstrap, bootstrapFromConfig, createTheme, defaultColors, defineConfig, expressiveVariant, extendSpecVersion, font, getPiecewiseHue, getRotatedHue, highestSurface, importContainer, neutralVariant, state, tonalSpotVariant, vibrantVariant };
+export { API, AppContainer, AppModule, ColorApi, ColorManager, ColorModule, ConfigModule, ConfigService, ConfigurableColor, ContrastCurve, DynamicColor, FontFamily, FontPlugin, PluginAbstract, PluginApi, PluginImplAbstract, PluginModule, Scheme, SchemeManager, ThemeApi, ThemeModule, ToneDeltaPair, Variant, VariantManager, Variants, bootstrap, bootstrapFromConfig, defaultColors, defineConfig, expressiveVariant, extendSpecVersion, getPiecewiseHue, getRotatedHue, highestSurface, importContainer, neutralVariant, tonalSpotVariant, vibrantVariant };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@udixio/theme",
-  "version": "0.3.1",
+  "version": "0.4.0",
   "main": "./index.cjs.js",
   "module": "./index.esm.js",
   "dependencies": {

package/src/lib/index.d.ts

@@ -8,5 +8,4 @@ export * from './main';
 export * from './material-color-utilities';
 export * from './plugin';
 export * from './plugins/font';
-export * from './plugins/tailwind';
 export * from './theme';

package/src/lib/theme/variant.d.ts

@@ -3,6 +3,12 @@ import { Hct } from '../material-color-utilities/htc';
 import { AddColors } from '../color';
 export declare const getPiecewiseHue: (sourceColorHct: Hct, hueBreakpoints: number[], hues: number[]) => number;
 export declare const getRotatedHue: (sourceColorHct: Hct, hueBreakpoints: number[], rotations: number[]) => number;
+export declare const Variants: {
+    Expressive: Variant;
+    Neutral: Variant;
+    TonalSpot: Variant;
+    Vibrant: Variant;
+};
 export declare class Variant {
     palettes: Record<string, (args: {
         sourceColorHct: Hct;

package/src/lib/plugins/tailwind/file.d.ts

@@ -1,4 +0,0 @@
-export declare const createOrUpdateFile: (filePath: string, content: string) => void;
-export declare const getFileContent: (filePath: string, searchPattern?: RegExp | string) => string | false | null;
-export declare const replaceFileContent: (filePath: string, searchPattern: RegExp | string, replacement: string) => void;
-export declare const findTailwindCssFile: (startDir: string, searchPattern: string) => string | null;

package/src/lib/plugins/tailwind/index.d.ts

@@ -1,3 +0,0 @@
-export * from './main';
-export * from './plugins-tailwind';
-export * from './tailwind.plugin';

package/src/lib/plugins/tailwind/main.d.ts

@@ -1,2 +0,0 @@
-import plugin from 'tailwindcss/plugin';
-export declare const createTheme: () => ReturnType<typeof plugin.withOptions>;

package/src/lib/plugins/tailwind/plugins-tailwind/font.d.ts

@@ -1,3 +0,0 @@
-import { FontRole, FontSize, FontStyle } from '@udixio/theme';
-import plugin from 'tailwindcss/plugin';
-export declare const font: (fontStyles: Record<FontRole, Record<FontSize, FontStyle>>, responsiveBreakPoints: Record<string, number>) => ReturnType<typeof plugin>;

package/src/lib/plugins/tailwind/plugins-tailwind/index.d.ts

@@ -1,2 +0,0 @@
-export * from './state';
-export * from './font';

package/src/lib/plugins/tailwind/plugins-tailwind/state.d.ts

@@ -1,2 +0,0 @@
-import plugin from 'tailwindcss/plugin';
-export declare const state: (colorKeys: string[]) => ReturnType<typeof plugin>;

package/src/lib/plugins/tailwind/tailwind.plugin.d.ts

@@ -1,18 +0,0 @@
-import { PluginAbstract, PluginImplAbstract } from '../../plugin';
-import { FontPlugin } from '../font';
-import plugin from 'tailwindcss/plugin';
-interface TailwindPluginOptions {
-    darkMode?: 'class' | 'media';
-    responsiveBreakPoints?: Record<string, number>;
-    subThemes?: Record<string, string>;
-}
-export declare class TailwindPlugin extends PluginAbstract<TailwindImplPlugin, TailwindPluginOptions> {
-    dependencies: (typeof FontPlugin)[];
-    name: string;
-    pluginClass: typeof TailwindImplPlugin;
-}
-declare class TailwindImplPlugin extends PluginImplAbstract<TailwindPluginOptions> {
-    onInit(): void;
-    load(): ReturnType<typeof plugin.withOptions>;
-}
-export {};