@empathyco/x-tailwindcss/dist/esm/x-tailwind-plugin/components/button/index.js

Empathy X Tailwind plugin

import { deepMerge } from '@empathyco/x-deep-merge';
import { rename } from '@empathyco/x-utils';
import { buttonColors } from './colors.js';
import { buttonDefault } from './default.js';
import { buttonDisabled } from './disabled.js';
import { buttonGhost } from './ghost.js';
import { buttonLayouts } from './layouts.js';
import { buttonLink } from './link.js';
import { buttonOutlined } from './outlined.js';
import { buttonSizes } from './sizes.js';
import { buttonTight } from './tight.js';

/**
 * Returns the component `button` CSS.
 *
 * @param helpers - The {@link TailwindHelpers} to generate CSS.
 * @returns The {@link CssStyleOptions} for the component.
 */
function button(helpers) {
    return {
        '.x-button': deepMerge(buttonDefault(helpers), rename({
            ...buttonColors(helpers),
            ...buttonSizes(helpers),
            ...buttonLayouts(helpers),
            ...buttonOutlined(helpers),
            ...buttonLink(helpers),
            ...buttonGhost(helpers),
            ...buttonTight(helpers),
        }, { prefix: '&-' }), buttonDisabled(helpers)),
    };
}

export { button };