@assistant-ui/react/dist/tailwindcss/index.mjs

React components for AI chat.

// src/tailwindcss/index.ts
import plugin from "tailwindcss/plugin.js";
import baseComponentsCSS from "../../dist/styles/tailwindcss/base-components.css.json";
import threadCSS from "../../dist/styles/tailwindcss/thread.css.json";
import modalCSS from "../../dist/styles/tailwindcss/modal.css.json";
import defaultThemeCSS from "../../dist/styles/themes/default.css.json";
var auiPlugin = plugin.withOptions(
  ({ components = ["assistant-modal", "thread"], shadcn = false } = {}) => ({ addComponents }) => {
    const assistantModal = components.includes("assistant-modal");
    const thread = assistantModal || components.includes("thread");
    const base = thread || components.includes("base");
    const defaultTheme = components.includes("default-theme");
    if (defaultTheme && shadcn)
      throw new Error("default-theme cannot be used with shadcn");
    if (defaultTheme || base && !shadcn) {
      addComponents(defaultThemeCSS);
    }
    if (base) {
      addComponents(baseComponentsCSS);
    }
    if (thread) {
      addComponents(threadCSS);
    }
    if (assistantModal) {
      addComponents(modalCSS);
    }
  },
  ({ shadcn = false, colors = {} } = {}) => {
    const prefix = !shadcn ? "--aui-" : "--";
    return {
      safelist: [{ pattern: /aui-/ }],
      theme: {
        extend: {
          colors: {
            aui: {
              border: colors.border ?? `hsl(var(${prefix}border))`,
              input: colors.input ?? `hsl(var(${prefix}input))`,
              ring: colors.ring ?? `hsl(var(${prefix}ring))`,
              background: colors.background ?? `hsl(var(${prefix}background))`,
              foreground: colors.foreground ?? `hsl(var(${prefix}foreground))`,
              primary: {
                DEFAULT: colors.primary?.DEFAULT ?? `hsl(var(${prefix}primary))`,
                foreground: colors.primary?.foreground ?? `hsl(var(${prefix}primary-foreground))`
              },
              secondary: {
                DEFAULT: colors.secondary?.DEFAULT ?? `hsl(var(${prefix}secondary))`,
                foreground: colors.secondary?.foreground ?? `hsl(var(${prefix}secondary-foreground))`
              },
              destructive: {
                DEFAULT: colors.destructive?.DEFAULT ?? `hsl(var(${prefix}destructive))`,
                foreground: `hsl(var(${prefix}destructive-foreground))`
              },
              muted: {
                DEFAULT: `hsl(var(${prefix}muted))`,
                foreground: colors.muted?.foreground ?? `hsl(var(${prefix}muted-foreground))`
              },
              accent: {
                DEFAULT: colors.accent?.DEFAULT ?? `hsl(var(${prefix}accent))`,
                foreground: colors.accent?.foreground ?? `hsl(var(${prefix}accent-foreground))`
              },
              popover: {
                DEFAULT: colors.popover?.DEFAULT ?? `hsl(var(${prefix}popover))`,
                foreground: colors.popover?.foreground ?? `hsl(var(${prefix}popover-foreground))`
              },
              card: {
                DEFAULT: colors.card?.DEFAULT ?? `hsl(var(${prefix}card))`,
                foreground: colors.card?.foreground ?? `hsl(var(${prefix}card-foreground))`
              }
            }
          }
        }
      }
    };
  }
);
var tailwindcss_default = auiPlugin;
export {
  tailwindcss_default as default
};
//# sourceMappingURL=index.mjs.map