@hexdspace/react 0.1.0 → 0.1.1

package/README.md

@@ -0,0 +1,101 @@
+# @hexdspace/react
+
+React basic features, UI components plus a Tailwind v4-compatible theme CSS.
+
+## Install
+
+```sh
+pnpm add @hexdspace/react
+```
+
+Peer dependencies (install in your app):
+
+```sh
+pnpm add react react-dom react-router-dom radix-ui lucide-react react-toastify @tanstack/react-query
+```
+
+Tailwind requirements (for the theme + utilities):
+
+```sh
+pnpm add -D tailwindcss @tailwindcss/postcss postcss-import tailwind-scrollbar
+```
+
+## Usage
+
+Import the theme into your Tailwind entry stylesheet (order matters):
+
+```css
+/* src/index.css */
+@import "tailwindcss";
+@import "@hexdspace/react/css";
+@config "../tailwind.config.ts"; /* adjust path if needed */
+
+/* Your app styles */
+```
+
+Make sure PostCSS inlines imports before Tailwind:
+
+```js
+// postcss.config.js
+export default {
+  plugins: {
+    "postcss-import": {},
+    "@tailwindcss/postcss": {},
+  },
+};
+```
+
+### Tailwind config
+
+Point Tailwind at this package so it can generate utilities used by the components.
+
+For a published package:
+
+```js
+// tailwind.config.js (app)
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{ts,tsx,js,jsx}",
+    "./node_modules/@hexdspace/react/dist/**/*.{js,ts,tsx}",
+  ],
+  theme: {
+    extend: {},
+  },
+};
+```
+
+For a monorepo/workspace (use sources instead of dist):
+
+```js
+// tailwind.config.js (app)
+export default {
+  content: [
+    "./index.html",
+    "./src/**/*.{ts,tsx,js,jsx}",
+    "../packages/react/src/**/*.{ts,tsx}",
+  ],
+};
+```
+
+### Component usage
+
+```tsx
+import { Button } from "@hexdspace/react";
+
+export function Example() {
+  return (
+    <Button variant="outline" chrome="push">
+      Click me
+    </Button>
+  );
+}
+```
+
+## Troubleshooting
+
+- Theme styles apply but component utilities are missing:
+  - Ensure your Tailwind entry includes `@config` so Tailwind loads `tailwind.config.*`.
+  - Ensure the `content` array includes this package (dist or source).
+- `tailwind-scrollbar` styles are missing:
+  - Install `tailwind-scrollbar` (the theme registers it via `@plugin`).