@aircall/blocks 0.11.0 → 0.13.0

package/README.md

@@ -8,13 +8,33 @@ wrappers), empty states, and more.
 pnpm add @aircall/blocks @aircall/ds
 ```
 
-Import the precompiled CSS once from your entry (alongside `@aircall/ds`'s):
+Import the precompiled CSS once from your entry. `@aircall/blocks/globals.css` already
+bundles the entire `@aircall/ds/globals.css` — do **not** import both or you duplicate all
+of DS's compiled output (Preflight, theme tokens, all DS utilities):
 
 ```tsx
-import '@aircall/ds/globals.css';
+// ✅ Correct — blocks already includes DS
 import '@aircall/blocks/globals.css';
+
+// ❌ Wrong — duplicates all of DS's compiled output
+// import '@aircall/ds/globals.css';
+// import '@aircall/blocks/globals.css';
 ```
 
+If you author your own Tailwind utility classes, use a CSS entry instead of a JS import:
+
+```css
+/* style.css */
+@layer theme, base, components, utilities;
+@import 'tailwindcss/theme.css' layer(theme);
+@import 'tailwindcss/utilities.css' layer(utilities);
+@import '@aircall/blocks/globals.css';
+@source "./src/**/*.{ts,tsx}";
+```
+
+For module-federation consumers (your app runs as a remote inside a host that already loads
+DS/blocks globals), omit both globals imports entirely.
+
 > Importing `@aircall/blocks` registers a `blocks` i18n namespace on `@aircall/ds`'s shared
 > i18next instance. To make block strings follow the user's language, mount `DsI18nProvider`
 > (from `@aircall/ds`) **under** your react-i18next provider, fed the active language. See