@tan-ahmed/tan-ui-kit 0.1.0 → 0.1.2

package/README.md

@@ -1,73 +1,77 @@
-# React + TypeScript + Vite
+# @tan-ahmed/tan-ui-kit
 
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
+A React component library built with Tailwind CSS v4 and shadcn/ui components.
 
-Currently, two official plugins are available:
+## Installation
 
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+### Recommended: Using pnpm
+```bash
+pnpm add @tan-ahmed/tan-ui-kit
+```
+
+### Using yarn
+```bash
+yarn add @tan-ahmed/tan-ui-kit
+```
+
+### Using npm
+```bash
+npm install @tan-ahmed/tan-ui-kit
+```
+
+**Note:** If you encounter the error `Cannot read properties of null (reading 'matches')` with npm, this is a known npm bug with Node.js 23.x. Please use one of the following workarounds:
+
+1. Use pnpm or yarn (recommended)
+2. Use `npm install --legacy-peer-deps`
+3. Clear npm cache: `npm cache clean --force` and retry
+4. Update npm: `npm install -g npm@latest`
+
+See [INSTALLATION_TROUBLESHOOTING.md](./INSTALLATION_TROUBLESHOOTING.md) for more details.
 
-## React Compiler
+## Peer Dependencies
 
-The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+This package requires the following peer dependencies:
 
-## Expanding the ESLint configuration
+- `react`: ^18.0.0 || ^19.0.0
+- `react-dom`: ^18.0.0 || ^19.0.0
+- `@radix-ui/react-slot`: ^1.0.2
+- `class-variance-authority`: ^0.7.0
+- `clsx`: ^2.1.0
+- `tailwind-merge`: ^2.5.0
 
-If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+Make sure to install these in your project:
 
-```js
-export default defineConfig([
-  globalIgnores(['dist']),
-  {
-    files: ['**/*.{ts,tsx}'],
-    extends: [
-      // Other configs...
+```bash
+pnpm add react react-dom @radix-ui/react-slot class-variance-authority clsx tailwind-merge
+```
+
+## Usage
 
-      // Remove tseslint.configs.recommended and replace with this
-      tseslint.configs.recommendedTypeChecked,
-      // Alternatively, use this for stricter rules
-      tseslint.configs.strictTypeChecked,
-      // Optionally, add this for stylistic rules
-      tseslint.configs.stylisticTypeChecked,
+```tsx
+import { Button } from '@tan-ahmed/tan-ui-kit'
+import '@tan-ahmed/tan-ui-kit/styles'
 
-      // Other configs...
-    ],
-    languageOptions: {
-      parserOptions: {
-        project: ['./tsconfig.node.json', './tsconfig.app.json'],
-        tsconfigRootDir: import.meta.dirname,
-      },
-      // other options...
-    },
-  },
-])
+function App() {
+  return <Button>Click me</Button>
+}
 ```
 
-You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
-
-```js
-// eslint.config.js
-import reactX from 'eslint-plugin-react-x'
-import reactDom from 'eslint-plugin-react-dom'
-
-export default defineConfig([
-  globalIgnores(['dist']),
-  {
-    files: ['**/*.{ts,tsx}'],
-    extends: [
-      // Other configs...
-      // Enable lint rules for React
-      reactX.configs['recommended-typescript'],
-      // Enable lint rules for React DOM
-      reactDom.configs.recommended,
-    ],
-    languageOptions: {
-      parserOptions: {
-        project: ['./tsconfig.node.json', './tsconfig.app.json'],
-        tsconfigRootDir: import.meta.dirname,
-      },
-      // other options...
-    },
-  },
-])
+## Development
+
+```bash
+# Install dependencies
+pnpm install
+
+# Start dev server
+pnpm dev
+
+# Build
+pnpm build
+
+# Lint
+pnpm lint
 ```
+
+## License
+
+MIT

package/dist/components/ui/button.d.ts

@@ -0,0 +1,12 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from "react";
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };
+//# sourceMappingURL=button.d.ts.map

package/dist/components/ui/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/components/ui/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;8EA2BnB,CAAA;AAED,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,YAAY,CAAC,OAAO,cAAc,CAAC;IACrC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB;AAED,QAAA,MAAM,MAAM,uFAWX,CAAA;AAGD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/index.d.ts

@@ -1 +1,3 @@
-export {}
+export { Button, buttonVariants } from './components/ui/button';
+export type { ButtonProps } from './components/ui/button';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAA;AAGrB,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAA;AAC/D,YAAY,EAAE,WAAW,EAAE,MAAM,wBAAwB,CAAA"}

package/dist/lib/utils.d.ts

@@ -0,0 +1,3 @@
+import { ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;
+//# sourceMappingURL=utils.d.ts.map

package/dist/lib/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAA;AAG5C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tan-ahmed/tan-ui-kit",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "A React component library built with Tailwind CSS v4 and shadcn/ui components",
   "type": "module",
   "main": "./dist/tan-ui-kit.cjs.js",
@@ -12,14 +12,17 @@
       "import": "./dist/tan-ui-kit.es.js",
       "require": "./dist/tan-ui-kit.cjs.js"
     },
-    "./styles": "./dist/tan-ui-kit.css"
+    "./styles": {
+      "types": "./dist/styles.d.ts",
+      "default": "./dist/tan-ui-kit.css"
+    }
   },
   "files": [
     "dist"
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/tan-ahmed/tan-ui-kit.git"
+    "url": "git+https://github.com/tan-ahmed/tan-ui-kit.git"
   },
   "publishConfig": {
     "access": "public"
@@ -61,7 +64,7 @@
     "eslint": "^9.39.1",
     "eslint-plugin-react-hooks": "^7.0.1",
     "eslint-plugin-react-refresh": "^0.4.24",
-    "globals": "^16.5.0",
+    "globals": "^15.0.0",
     "tailwind-merge": "^2.5.0",
     "tailwindcss": "^4.0.0",
     "typescript": "~5.9.3",