feat(framework): add Angular and Svelte support ⚡

- Add Angular service and composable integration with signals
- Add Svelte store integration with reactive updates
- Remove centralized middleware re-export file
- Update package exports for Angular and Svelte modules
- Bump version to 0.4.0 with new framework dependencies
- Expand keywords for better discoverability

Author: NeaByteLab

ARCHITECTURE.md

@@ -1,6 +1,6 @@
 # Stateless-JS Architecture
 
-A universal state management library with **NO wrappers, NO actions, NO reducers, NO complexcity**.
+A universal state management library with **NO wrappers, NO actions, NO reducers, NO complexity**.
 
 ## 🎯 Core Philosophy
 
@@ -21,11 +21,15 @@ graph TB
     SS[State Setters]
     SV[State Values]
 
+    AA[Angular Adapter]
     RA[React Adapter]
+    SA[Svelte Adapter]
     VA[Vue Adapter]
     UA[Universal Adapter]
 
+    AC[Angular Components]
     RC[React Components]
+    SC[Svelte Components]
     VC[Vue Components]
     VJ[Vanilla JS]
 
@@ -35,10 +39,14 @@ graph TB
 
     RA --> CR
     VA --> CR
+    SA --> CR
+    AA --> CR
     UA --> CR
 
     RC --> RA
     VC --> VA
+    SC --> SA
+    AC --> AA
     VJ --> UA
 
     style CR fill:#e1f5fe,color:#000
@@ -83,6 +91,16 @@ graph LR
         VC2[Component D]
     end
 
+    subgraph "Svelte App"
+        SC1[Component E]
+        SC2[Component F]
+    end
+
+    subgraph "Angular App"
+        AC1[Component G]
+        AC2[Component H]
+    end
+
     subgraph "Vanilla JS"
         VJ1[Module X]
         VJ2[Module Y]
@@ -97,6 +115,10 @@ graph LR
     RC2 --> S2
     VC1 --> S1
     VC2 --> S2
+    SC1 --> S1
+    SC2 --> S2
+    AC1 --> S1
+    AC2 --> S2
     VJ1 --> S1
     VJ2 --> S2
 
@@ -109,6 +131,46 @@ graph LR
     style CR fill:#e1f5fe,color:#000
 ```
 
+## 🔷 Angular Integration
+
+```mermaid
+graph TB
+    subgraph "Angular Component"
+        AC[useAngularStateless]
+        AS[Angular Signal]
+        AI[Injectable Service]
+    end
+
+    subgraph "Angular Adapter"
+        AAS[Angular Subscribers Map]
+        NS[notifyAngularSubscribers]
+    end
+
+    subgraph "Core Registry"
+        CR[Core Registry]
+        SM[State Map]
+    end
+
+    AC --> AS
+    AC --> AI
+    AC --> CR
+    CR --> SM
+
+    AC --> NS
+    NS --> AAS
+    AAS --> AS
+
+    style AC fill:#dd0031,color:#fff
+    style AAS fill:#dd0031,color:#fff
+    style CR fill:#e1f5fe,color:#000
+```
+
+**How it works:**
+1. `useAngularStateless` calls `useStateless` (core)
+2. Creates Angular `WritableSignal` for reactivity
+3. Sets up subscriber to update signal value
+4. Supports both service injection and standalone function approaches
+
 ## ⚛️ React Integration
 
 ```mermaid
@@ -149,6 +211,45 @@ graph TB
 2. Sets up `useEffect` to subscribe to state changes
 3. Uses `forceUpdate` to trigger React re-renders
 
+## 🟠 Svelte Integration
+
+```mermaid
+graph TB
+    subgraph "Svelte Component"
+        SC[useSvelteStateless]
+        SW[Svelte Writable Store]
+        SU[Store Subscription]
+    end
+
+    subgraph "Svelte Adapter"
+        SS[Svelte Subscribers Map]
+        NS[notifySvelteSubscribers]
+    end
+
+    subgraph "Core Registry"
+        CR[Core Registry]
+        SM[State Map]
+    end
+
+    SC --> SW
+    SC --> SU
+    SC --> CR
+    CR --> SM
+
+    SC --> NS
+    NS --> SS
+    SS --> SW
+
+    style SC fill:#ff3e00,color:#fff
+    style SS fill:#ff3e00,color:#fff
+    style CR fill:#e1f5fe,color:#000
+```
+
+**How it works:**
+1. `useSvelteStateless` calls `useStateless` (core)
+2. Creates Svelte `writable` store for reactivity
+3. Sets up subscriber to update store value
+
 ## 🟢 Vue Integration
 
 ```mermaid

README.md

@@ -8,9 +8,15 @@ A universal and lightweight state management library with a clean, stateless API
 # Universal
 npm install @neabyte/stateless-js
 
+# Angular (Automatic Reactivity)
+npm install @neabyte/stateless-js @angular/core
+
 # React (Automatic Re-renders)
 npm install @neabyte/stateless-js react
 
+# Svelte (Automatic Reactivity)
+npm install @neabyte/stateless-js svelte
+
 # Vue (Automatic Reactivity)
 npm install @neabyte/stateless-js vue
 ```
@@ -25,9 +31,15 @@ const { createStateless, useStateless } = require('@neabyte/stateless-js')
 // ESM (ES Modules)
 import { createStateless, useStateless } from '@neabyte/stateless-js'
 
+// Angular (Automatic Reactivity)
+import { StatelessService, useAngularStateless } from '@neabyte/stateless-js/angular'
+
 // React (Automatic Re-renders)
 import { useReactStateless } from '@neabyte/stateless-js/react'
 
+// Svelte (Automatic Reactivity)
+import { useSvelteStateless } from '@neabyte/stateless-js/svelte'
+
 // Vue (Automatic Reactivity)
 import { useVueStateless } from '@neabyte/stateless-js/vue'
 
@@ -64,6 +76,47 @@ setCount(current => current + 1)
 console.log(count.value) // 1
 ```
 
+### 🔷 Angular Usage
+
+```typescript
+import { StatelessService, useAngularStateless } from '@neabyte/stateless-js/angular'
+
+// Using the service approach
+@Injectable({ providedIn: 'root' })
+export class MyService {
+  constructor(private stateless: StatelessService) {}
+  counterState = this.stateless.useAngularStateless('counter', 0)
+  count = this.counterState[1]
+  setCount = this.counterState[0]
+}
+
+// Using the standalone function approach
+export class MyComponent {
+  counterState = useAngularStateless('counter', 0)
+  count = this.counterState[1]
+  setCount = this.counterState[0]
+  increment = () => this.setCount(current => current + 1)
+}
+```
+
+```typescript
+// In your Angular component
+@Component({
+  template: `
+    <div>
+      <p>Count: {{ count() }}</p>
+      <button (click)="increment()">Increment</button>
+    </div>
+  `
+})
+export class CounterComponent {
+  counterState = useAngularStateless('counter', 0)
+  count = this.counterState[1]
+  setCount = this.counterState[0]
+  increment = () => this.setCount(current => current + 1)
+}
+```
+
 ### ⚛️ React Usage
 
 ```typescript
@@ -82,6 +135,30 @@ function Counter() {
 }
 ```
 
+
+### 🟠 Svelte Usage
+
+```typescript
+import { useSvelteStateless } from '@neabyte/stateless-js/svelte'
+
+// In your Svelte component
+const [setCount, count] = useSvelteStateless('counter', 0)
+const increment = () => setCount(current => current + 1)
+```
+
+```svelte
+<!-- In your .svelte file -->
+<script>
+  import { useSvelteStateless } from '@neabyte/stateless-js/svelte'
+  const [setCount, count] = useSvelteStateless('counter', 0)
+  const increment = () => setCount(current => current + 1)
+</script>
+<div>
+  <p>Count: {$count}</p>
+  <button on:click={increment}>Increment</button>
+</div>
+```
+
 ### 🟢 Vue Usage
 
 ```typescript
@@ -228,6 +305,24 @@ Uses existing state if it exists, otherwise creates a new one.
 - `fallbackState`: Value to use if state doesn't exist
 - Returns: Tuple `[StateSetter<T>, StateValue<T>]`
 
+### Angular Functions
+
+#### `StatelessService.useAngularStateless<T>(id: StateId, initialValue: T): [StateSetter<T>, Signal<T>]`
+
+Angular service method that provides automatic reactivity using Angular signals.
+
+- `id`: Unique identifier (string or number)
+- `initialValue`: Initial value for the state
+- Returns: Tuple `[StateSetter<T>, Signal<T>]` (Angular signal for reactivity)
+
+#### `useAngularStateless<T>(id: StateId, initialValue: T): [StateSetter<T>, Signal<T>]`
+
+Standalone Angular function that provides automatic reactivity using Angular signals.
+
+- `id`: Unique identifier (string or number)
+- `initialValue`: Initial value for the state
+- Returns: Tuple `[StateSetter<T>, Signal<T>]` (Angular signal for reactivity)
+
 ### React Functions
 
 #### `useReactStateless<T>(id: StateId, initialValue: T): [StateSetter<T>, T]`
@@ -238,6 +333,16 @@ React hook that provides automatic re-renders when state changes.
 - `initialValue`: Initial value for the state
 - Returns: Tuple `[StateSetter<T>, T]` (direct value, not StateValue object)
 
+### Svelte Functions
+
+#### `useSvelteStateless<T>(id: StateId, initialValue: T): [StateSetter<T>, Writable<T>]`
+
+Svelte function that provides automatic reactivity using Svelte stores.
+
+- `id`: Unique identifier (string or number)
+- `initialValue`: Initial value for the state
+- Returns: Tuple `[StateSetter<T>, Writable<T>]` (Svelte writable store for reactivity)
+
 ### Vue Functions
 
 #### `useVueStateless<T>(id: StateId, initialValue: T): [StateSetter<T>, Ref<T>]`

build.config.ts

@@ -13,7 +13,7 @@ import { resolve } from 'path'
  */
 export default defineBuildConfig({
   /** @type {string[]} Entry points for the build process */
-  entries: ['src/index', 'src/react', 'src/vue'],
+  entries: ['src/index', 'src/react', 'src/svelte', 'src/vue', 'src/angular'],
   /** @type {boolean} Whether to generate TypeScript declaration files */
   declaration: true,
   /** @type {boolean} Whether to clean the output directory before building */