@poveste/plugin-tailwind 0.8.0 → 0.8.2

package/dist/index.d.ts

@@ -23,5 +23,10 @@ export interface TailwindTokensOptions {
  */
 export declare function isTailwindEntry(filePath: string): boolean;
 export declare function HstTailwind(options?: TailwindTokensOptions): Plugin;
+export declare const TAILWIND_V4_REQUIRED: string;
+export declare function hasDesignSystemLoader(tailwind: unknown): boolean;
+type LoadDesignSystem = typeof import('tailwindcss')['__unstable__loadDesignSystem'];
+export declare function resolveDesignSystemLoader(importTailwind?: () => Promise<unknown>): Promise<LoadDesignSystem>;
 /** @deprecated Use `HstTailwind`. Kept for books that named the old builtin. */
 export declare const tailwindTokens: typeof HstTailwind;
+export {};

package/dist/index.js

@@ -159,8 +159,28 @@ async function resolveStylesheet(api, id, importBase) {
     const packageJson = JSON.parse(await api.fs.readFile(packageJsonPath, 'utf8'));
     return api.path.resolve(api.path.dirname(packageJsonPath), packageJson.style ?? 'index.css');
 }
+export const TAILWIND_V4_REQUIRED = '@poveste/plugin-tailwind needs Tailwind v4: the installed tailwindcss does not export '
+    + '`__unstable__loadDesignSystem`. A v3 project has nothing for this plugin to read — install tailwindcss@^4.';
+// `__unstable__loadDesignSystem` is Tailwind's own signal that this export may be
+// renamed or dropped in any release. The `tailwindcss` peer range is the only thing
+// bounding that, so whoever widens it re-checks this call site. Without the check the
+// failure reads as `__unstable__loadDesignSystem is not a function`, which points at
+// Poveste and says nothing about the version mismatch that caused it (#320).
+export function hasDesignSystemLoader(tailwind) {
+    return typeof tailwind
+        ?.__unstable__loadDesignSystem === 'function';
+}
+// The import is a parameter so the mismatch path is testable without a Tailwind v3
+// installed alongside v4.
+export async function resolveDesignSystemLoader(importTailwind = () => import('tailwindcss')) {
+    const tailwind = await importTailwind();
+    if (!hasDesignSystemLoader(tailwind)) {
+        throw new Error(TAILWIND_V4_REQUIRED);
+    }
+    return tailwind.__unstable__loadDesignSystem;
+}
 async function loadTailwindTheme(api, cssFile) {
-    const { __unstable__loadDesignSystem } = await import('tailwindcss');
+    const __unstable__loadDesignSystem = await resolveDesignSystemLoader();
     const base = api.path.dirname(cssFile);
     const designSystem = await __unstable__loadDesignSystem(await api.fs.readFile(cssFile, 'utf8'), {
         base,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@poveste/plugin-tailwind",
   "type": "module",
-  "version": "0.8.0",
+  "version": "0.8.2",
   "description": "Poveste plugin that renders a Tailwind design system as a story",
   "author": {
     "name": "Sorin Gitlan"
@@ -46,18 +46,20 @@
     "node": "^22.22.2 || ^24.15.0 || >=26.0.0"
   },
   "peerDependencies": {
-    "poveste": "^0.8.0"
+    "tailwindcss": "^4.0.0",
+    "poveste": "^0.8.2"
   },
   "dependencies": {
     "pathe": "^1.1.2",
-    "@poveste/shared": "0.8.0"
+    "@poveste/shared": "0.8.2"
   },
   "devDependencies": {
     "@types/node": "^22.10.1",
+    "tailwindcss": "^4.3.3",
     "typescript": "5.6.3",
     "vite": "^8.2.0",
     "vitest": "^4.1.10",
-    "poveste": "0.8.0"
+    "poveste": "0.8.2"
   },
   "scripts": {
     "build": "rimraf dist && tsc -d",