feat(alpine): add store class

packages/alpine/README.md

@@ -40,6 +40,38 @@ const store = alpineStoreGenerator({
 console.log(store.type); // Output: root
 ```
 
+### AlpineStore
+
+Provides a Alpine.js pure store implementation with logger.
+
+#### Constructor
+
+Creates an instance of `AlpineStore`.
+
+- **config**: The configuration object for the store.
+  - **name**: The name of the store.
+  - **defaultValue**: The default value of the store.
+
+### Properties
+
+- **store**: alpine store proxy.
+
+#### Example Usage
+
+```ts
+import {AlpineStore} from '@nexim/alpine';
+
+const {store} = new AlpineStore({
+  name: 'myStore',
+  defaultValue: {data: 'root'},
+});
+
+console.log(store.data); // Output: { data: 'root' }
+store.data = 'user';
+
+console.log(store.data); // Output: { data: 'user' }
+```
+
 ### AlpineStoreWithBackup
 
 Extends `AlpineStore` to add backup and restore functionality with local storage support and expiration handling.
@@ -54,6 +86,10 @@ Creates an instance of `AlpineStoreWithBackup`.
   - **defaultValue**: The default value of the store.
   - **expireDuration**: Optional. The duration after which the store expires.
 
+### Properties
+
+- **store**: alpine store proxy.
+
 #### Methods
 
 - **save()**: Saves the current data to local storage. If the data is null, it clears the stored data. Also updates the expiration time.
@@ -79,3 +115,7 @@ console.log(storeWithBackup.store.data); // Output: { data: 'user' }
 storeWithBackup.clear();
 console.log(storeWithBackup.store.data); // Output: { data: 'root' }
 ```
+
+### TODO
+
+- Analyze [@alwatr/context](https://github.com/Alwatr/flux/tree/next/packages/context) for use here.

packages/alpine/src/main.ts

@@ -3,4 +3,5 @@ import {packageTracer} from '@alwatr/package-tracer';
 __dev_mode__: packageTracer.add(__package_name__, __package_version__);
 
 export * from './store/store-generator.js';
+export * from './store/store.js';
 export * from './store/store-with-backup.js';

packages/alpine/src/store/store-with-backup.ts

@@ -1,7 +1,8 @@
 import {localJsonStorage} from '@alwatr/local-storage';
-import {type AlwatrLogger, createLogger} from '@alwatr/logger';
 import {parseDuration, type Duration} from '@alwatr/parse-duration';
 
+import {AlpineStore} from './store.js';
+
 /**
  * Type for the store's data to extends from them.
  */
@@ -36,14 +37,7 @@ const schemaVersion = 1;
 /**
  * Provides a Alpine.js store implementation with backup and expiration.
  */
-export class AlpineStoreWithBackup<T extends AlpineStoreWithBackupType> {
-  /**
-   * The store's data.
-   */
-  store: T;
-
-  protected logger_: AlwatrLogger;
-
+export class AlpineStoreWithBackup<T extends AlpineStoreWithBackupType> extends AlpineStore<T> {
   /**
    * Keys for storing data and expire time in local storage with version.
    */
@@ -76,10 +70,7 @@ export class AlpineStoreWithBackup<T extends AlpineStoreWithBackupType> {
    * console.log(storeWithBackup.store.data); // Output: { data: 'root' }
    */
   constructor(private config__: AlpineStoreWithBackupOptions<T>) {
-    this.logger_ = createLogger(`[${__package_name__}]:${config__.name}`);
-    this.logger_.logMethodArgs?.('constructor', config__);
-
-    this.store = config__.defaultValue;
+    super(config__);
 
     if (this.config__.expireDuration !== null) {
       this.handleDataExpiration__();

packages/alpine/src/store/store.ts

@@ -0,0 +1,49 @@
+import {type AlwatrLogger, createLogger} from '@alwatr/logger';
+
+/**
+ * AlpineStore Options.
+ *
+ * @template T - The type of the store value.
+ * @param {string} name - The name of the store.
+ * @param {T} defaultValue - The default value of the store.
+ */
+export type AlpineStoreOptions<T extends DictionaryReq> = {
+  name: string;
+  defaultValue: T;
+};
+
+/**
+ * Provides a Alpine.js pure store implementation with logger.
+ */
+export class AlpineStore<T extends DictionaryReq> {
+  /**
+   * The store's data.
+   */
+  store: T;
+
+  protected logger_: AlwatrLogger;
+
+  /**
+   * Provides a Alpine.js pure store implementation with logger.
+   *
+   * @param {AlpineStoreOptions} config - Configuration object.
+   *
+   * @example
+   * import {AlpineStore} from '@nexim/alpine';
+   *
+   * const {store} = new AlpineStore({
+   *   name: 'myStore',
+   *   defaultValue: {data: 'root'},
+   * });
+   * console.log(store.data); // Output: { data: 'root' }
+   *
+   * store.data = 'user';
+   * console.log(store.data); // Output: { data: 'user' }
+   */
+  constructor(config: AlpineStoreOptions<T>) {
+    this.logger_ = createLogger(`${__package_name__}:${config.name}`);
+    this.logger_.logMethodArgs?.('constructor', config);
+
+    this.store = config.defaultValue;
+  }
+}