createStore hook & Strong typed store values

[omarluq]

this PR:

• introduces a factory function createStore that simplifies the process of creating new instances of the Store class. It takes an options object as a parameter, which includes the name, initialValue, and type for the new store. This function ensures that the store is properly initialized and that the name is initially a string and converts it to a symbol for uniqueness.
• updates Store constructor to accept a type argument and introduces strong typing to the Store class. The Store class now uses a generic T to represent the type of the value it holds. This ensures type safety when getting and setting the store's value. also added type checking in the set method to ensure that the new value matches the expected type.
• updates index.ts to export the createStore function instead of the Store class. This change encourages the use of the createStore function to create new stores, which ensures that they are properly initialized and named. This makes the Store class more of an implementation detail, which can help to simplify the API and make the library easier to use.

[omarluq]

@tcarac what do you think about the switch to initializing the stores in a single file and async manner?

// controllers/stores.js
import { createStore } from "stimulus-store";

export let counterStore;
export let anotherStore;

(async function initializeStores() {
  counterStore = await createStore({ name: 'counterStore', initialValue: 0, type: Number });
  anotherStore = await createStore({ name: 'anotherStore', initialValue: 'anotherStore', type: String });
})();

[tcarac]

@tcarac what do you think about the switch to initializing the stores in a single file and async manner?

// controllers/stores.js
import { createStore } from "stimulus-store";

export let counterStore;
export let anotherStore;

(async function initializeStores() {
  counterStore = await createStore({ name: 'counterStore', initialValue: 0, type: Number });
  anotherStore = await createStore({ name: 'anotherStore', initialValue: 'anotherStore', type: String });
})();

Seems useful, but I'm not a fan of IIF.
If I were to create different stores in different files I would have to rather wrap them in async functions or just create JSON objects. I think I liked the sync version more

[omarluq]

@tcarac what do you think about the switch to initializing the stores in a single file and async manner?

// controllers/stores.js
import { createStore } from "stimulus-store";

export let counterStore;
export let anotherStore;

(async function initializeStores() {
  counterStore = await createStore({ name: 'counterStore', initialValue: 0, type: Number });
  anotherStore = await createStore({ name: 'anotherStore', initialValue: 'anotherStore', type: String });
})();

Seems useful, but I'm not a fan of IIF. If I were to create different stores in different files I would have to rather wrap them in async functions or just create JSON objects. I think I liked the sync version more

I agree I'm not huge fan of using IIFE here too!
on the other hand it makes sense that createStore is async since store.set is also async and can accept a promise or a callback.
This can also be a module lvl await

import { createStore } from "stimulus-store";

export const counterStore = await createStore({ name: 'counterStore', initialValue: 0, type: Number });

this completely legal syntax! the only "gotcha" here is that the store module will not load if the promise is not resolved which can be handled with try/catch

import { createStore } from "stimulus-store";

try {
  export const counterStore = await createStore({ name: 'counterStore', initialValue: 0, type: Number });
} catch (error) {
  // do something with the error here
}