@shohojdhara/atomix 0.3.1 → 0.3.3

package/CHANGELOG.md

@@ -35,7 +35,6 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - **Package Exports**:
   - `@shohojdhara/atomix/theme` - Theme manager utilities
-  - `@shohojdhara/atomix/themes/config` - Theme configuration
 
 - **Documentation**:
   - Comprehensive theme manager guide (`docs/THEME_MANAGER.md`)

package/README.md

@@ -40,44 +40,62 @@ function App() {
 }
 ```
 
-### Theme Management
+### 🎨 Theme Management
 
-Atomix includes a powerful theme manager for dynamic theme switching:
+Atomix provides a powerful, developer-friendly theming system with multiple options:
+
+#### Quick Start with Pre-built Themes
 
 ```jsx
+// Option 1: Import a pre-built theme
+import '@shohojdhara/atomix/themes/flashtrade.css';
+
+// Option 2: Dynamic theme switching
 import { ThemeProvider, useTheme } from '@shohojdhara/atomix/theme';
-import { themesConfig } from '@shohojdhara/atomix/themes/config';
 
 function App() {
   return (
-    <ThemeProvider themes={themesConfig.metadata} defaultTheme="shaj-default">
+    <ThemeProvider>
       <YourApp />
     </ThemeProvider>
   );
 }
+```
 
-function ThemeSwitcher() {
-  const { theme, setTheme, availableThemes } = useTheme();
-  
-  return (
-    <select value={theme} onChange={(e) => setTheme(e.target.value)}>
-      {availableThemes.map(t => (
-        <option key={t.class} value={t.class}>{t.name}</option>
-      ))}
-    </select>
-  );
-}
+#### Create Custom Themes
+
+```bash
+# Use the CLI to create a new theme
+npx atomix create-theme my-theme
+
+# Build your theme
+npx atomix build-theme my-theme
+
+# List available themes
+npx atomix list-themes
+```
+
+#### Programmatic Theme Creation
+
+```jsx
+import { quickTheme, ThemeProvider } from '@shohojdhara/atomix/theme-tools';
+
+const myTheme = quickTheme('My Brand', '#FF5733', '#33FF57');
+
+<ThemeProvider defaultTheme={myTheme}>
+  <App />
+</ThemeProvider>
 ```
 
-**Available Themes:**
-- `shaj-default` - Default theme (stable)
+**📦 Pre-built Themes:**
+- `shaj-default` - Default theme with light/dark modes (stable)
 - `flashtrade` - Crypto trading platform theme (stable)
-- `boomdevs` - BoomDevs theme (beta)
-- `esrar` - Esrar theme (beta)
-- `mashroom` - Mashroom theme (beta)
-- `applemix` - Apple-inspired glass morphism theme (experimental)
+- `boomdevs` - Modern dark theme (beta)
+- `esrar` - Minimal light theme (beta)
+- `mashroom` - Psychedelic colorful theme (beta)
+- `applemix` - Apple-inspired glass morphism (experimental)
 
-For detailed theme manager documentation, see [Theme Manager Guide](docs/THEME_MANAGER.md).
+For complete documentation, see [Developer Guide](docs/DEVELOPER_GUIDE.md) and [Theme System Guide](docs/THEME_SYSTEM.md).
 
 
 ## Styles
@@ -120,7 +138,6 @@ This command will:
 1. Build the main JavaScript library (ESM and CJS formats)
 2. Generate TypeScript definitions
 3. Build the main CSS styles (`dist/atomix.css` and `dist/atomix.min.css`)
-4. Build all themes in `dist/themes/`
 
 ### Individual Builds
 
@@ -167,7 +184,7 @@ To keep visual docs and any snapshots stable, choose one of the following and st
   - This relies on your builder's SCSS pipeline; avoid mixing SCSS and built CSS in the same Storybook to prevent drift.
 
 Notes:
-- CSS bundles produced by the styles build are deterministic: dist/atomix.css and dist/atomix.min.css, plus per-theme files under dist/themes/.
+- CSS bundles produced by the styles build are deterministic: dist/atomix.css and dist/atomix.min.css.
 - CI should run yarn attw to validate package exports and types after changes.
 
 ## Components