grapesjs-tailwindcss-plugin
Version:
A powerful GrapesJS plugin that integrates Tailwind CSS 4 for modern styling and rapid development
49 lines (45 loc) • 1.53 kB
TypeScript
import { Editor } from 'grapesjs';
export type TailwindPluginOptions = {
/**
* The prefix to use for Tailwind CSS classes.
* This helps differentiate Tailwind classes from other CSS classes.
* @default null
*/
prefix?: string | null;
/**
* If true, the plugin will automatically rebuild the Tailwind CSS on each update.
* @default true
*/
autobuild?: boolean;
/**
* This option allows you to append your own CSS code immediately after the "@import 'tailwindcss';" statement.
* This means you can add any custom directives, such as "@layer components { ... }" or even "@theme { ... }"
* to further extend or override the default styles.
*
* @see https://tailwindcss.com/docs/theme for more detailes on how customize theme variables.
* @see https://tailwindcss.com/docs/adding-custom-styles for more details on how to customize your Tailwind CSS.
* @default null
*/
customCss?: string;
/**
* Option to add a build button to the toolbar that allows manual triggering of the Tailwind CSS build process.
* @default false
*/
buildButton?: boolean;
/**
* Specifies which panel the build button should be added to
* @default "options"
*/
toolbarPanel?: string;
/**
* Define a custom function to handle notifications when the Tailwind CSS is compiled
* with the `build-tailwind` command
* @default () => void
*/
notificationCallback?: () => void;
};
declare const _default: (editor: Editor, opts?: TailwindPluginOptions) => void;
export {
_default as default,
};
export {};