strivui 1.22.4 → 1.22.5

package/README.md

@@ -1,9 +1,11 @@
-# 🚀 StrivUI
+<p align="center">
+  <img src="https://github.com/Syed-Dev-Sphere/StrivUI/blob/main/strivui_logo.png?raw=true" width="250" alt="StrivUI Logo" />
+</p>
 
-*StrivUI** is a hybrid, utility-first UI component library built for **React**, designed to feel instantly familiar to both **React Native** and **Web developers**. Powered by a **Tailwind CSS class-based approach** and written in **TypeScript**, it delivers a seamless and consistent design system for modern applications.
 
-Every component in StrivUI comes with **thoughtfully crafted default styles**, inspired by **Material UI**, allowing you to build polished interfaces out of the box—while still offering full flexibility for customization.
+**🚀StrivUI** is a hybrid, utility-first UI component library built for **React**, designed to feel instantly familiar to both **React Native** and **Web developers**. It follows a **class-based styling approach** and is written in **TypeScript**, delivering a seamless and consistent design system for modern applications.
 
+Every component in StrivUI comes with **thoughtfully crafted default styles**, allowing you to build polished interfaces out of the box — while still offering full flexibility for customization.
 
 > Developed with ❤️ by [Syed Abdullah Ali](https://github.com/syedabdullahali)
 
@@ -11,12 +13,12 @@ Every component in StrivUI comes with **thoughtfully crafted default styles**, i
 
 ## ✨ Why StrivUI?
 
-- ⚡ **Utility-first styling** using Tailwind CSS Classes Approach 
-- 📱 **React Native-style components** like `<View />`, `<Text />`, and `<FlatList />`
-- 🌐 **Web-native components** like `<Header />`, `<Section />`, and `<Card />`
-- 🧩 Shared UI building blocks for fast development
-- 🛠️ Built with TypeScript — safe and scalable
-- 💻 Lightweight and blazing fast
+* ⚡ **Utility-first styling** using a class-based approach
+* 📱 **React Native-style components** like `<View />`, `<Text />`, and `<FlatList />`
+* 🌐 **Web-native components** like `<Header />`, `<Section />`, and `<Card />`
+* 🧩 Shared UI building blocks for fast development
+* 🛠️ Built with TypeScript — safe and scalable
+* 💻 Lightweight and blazing fast
 
 ---
 
@@ -27,7 +29,7 @@ Install with npm or yarn:
 ```bash
 npm install strivui
 # or
-yarn add strivui
+comingSoon-> yarn add strivui
 ```
 
 ---
@@ -40,7 +42,7 @@ yarn add strivui
 import { Button } from 'strivui';
 
 function App() {
-  return <Button className="bg-blue-500 text-white px-4 py-2 rounded">Click Me</Button>;
+  return <Button className="bg-blue-500 text-white px-4 py-2 rounded  hover:bg-blue-400">Click Me</Button>;
 }
 ```
 
@@ -50,7 +52,7 @@ function App() {
 import { Button } from 'strivui';
 
 const App: React.FC = () => {
-  return <Button className="bg-blue-500 text-white px-4 py-2 rounded">Click Me</Button>;
+  return <Button className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-400">Click Me</Button>;
 };
 ```
 
@@ -59,54 +61,57 @@ const App: React.FC = () => {
 ## 🧱 Component Categories
 
 ### 🟣 React Native–Inspired Components
-These bring familiar primitives to web developers:
-
-- `<View />`
-- `<Text />`
-- `<ScrollView />`
-- `<Pressable />`
-- `<TouchableOpacity />`
-- `<FlatList />`
-- `<SectionList />`
-- `<Image />`
-- `<ImageBackground />`
-- `<ActivityIndicator />`
+
+Familiar primitives brought to the web:
+
+* `<View />`
+* `<Text />`
+* `<ScrollView />`
+* `<Pressable />`
+* `<TouchableOpacity />`
+* `<FlatList />`
+* `<SectionList />`
+* `<Image />`
+* `<ImageBackground />`
+* `<ActivityIndicator />`
 
 ---
 
 ### 🔵 Web Layout Components
-Semantic tags for building structured, responsive UIs:
 
-- `<Header />`
-- `<Footer />`
-- `<Main />`
-- `<Section />`
-- `<Navigation />`
-- `<Container />`
-- `<Card />`
+Semantic elements for responsive structure:
+
+* `<Header />`
+* `<Footer />`
+* `<Main />`
+* `<Section />`
+* `<Navigation />`
+* `<Container />`
+* `<Card />`
 
 ---
 
 ### 🟢 Shared UI Components
-Reusable building blocks for inputs, tables, modals, etc.:
-
-- `<Button />`
-- `<Input />`
-- `<TextArea />`
-- `<Select />`
-- `<Link />`
-- `<Modal />`
-- `<Dialog />`
-- `<Overlay />`
-- `<Table />`, `<TableHead />`, `<TableBody />`, `<TableRow />`, `<TableHeaderCell />`, `<TableDataCell />`
+
+Reusable components for forms, modals, tables, etc.:
+
+* `<Button />`
+* `<Input />`
+* `<TextArea />`
+* `<Select />`
+* `<Link />`
+* `<Modal />`
+* `<Dialog />`
+* `<Overlay />`
+* `<Table />`, `<TableHead />`, `<TableBody />`, `<TableRow />`, `<TableHeaderCell />`, `<TableDataCell />`
 
 ---
 
 ## 🎨 Styling & Theming
 
-StrivUI uses **Tailwind CSS** under the hood. You can fully customize styles using Tailwind utility classes via `className`.
+StrivUI uses a **utility-first, class-based styling approach**. You can customize components using `className` with your own styles or design system.
 
-> Coming soon: `strive.config.js` for theme overrides like colors, spacing, font scale, and variants.
+> Coming soon: `strive.config.js` for overriding design tokens like colors, spacing, font scale, and variants.
 
 ---
 
@@ -114,7 +119,7 @@ StrivUI uses **Tailwind CSS** under the hood. You can fully customize styles usi
 
 Full documentation and interactive previews will be available at:
 
-📘 [https://css_striv_ui.com](https://css_striv_ui.com)
+📘 [https://css\_striv\_ui.com](https://css_striv_ui.com)
 
 ---
 
@@ -146,3 +151,7 @@ We love contributions!
 ## 📄 License
 
 MIT © 2025 [Syed Abdullah Ali](https://github.com/syedabdullahali)
+
+---
+
+Let me know if you want to auto-generate badges, README visuals, or a live storybook section too!

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "strivui",
-  "version": "1.22.4",
+  "version": "1.22.5",
   "scripts": {
     "build": "npx sass app/styles/striveui.scss dist/striveui.css && rollup -c",
     "clean": "rimraf dist"
@@ -35,6 +35,9 @@
     "type": "git",
     "url": "git+https://github.com/Syed-Dev-Sphere/StrivUI.git"
   },
+  "publishConfig": {
+    "access": "public"
+  },
   "license": "MIT",
   "author": "Syed Abdullah Ali",
   "type": "module",