@hf-chimera/vue 0.2.0

package/README.md

@@ -0,0 +1,235 @@
+# ChimeraEntityStore Vue Integration
+
+This package provides Vue 3 composables for seamless integration with ChimeraEntityStore, enabling fully reactive data queries in Vue applications.
+
+## Features
+
+- **Vue Composables**: Use `useChimeraCollection` and `useChimeraItem` with the Composition API
+- **TypeScript Support**: Strong typing for entities, queries, and repositories
+- **Automatic Reactivity**: Components update automatically on data, status, and error changes
+- **Query Builder Support**: Fluent query builder function for strong types and readability
+
+## Installation
+
+```bash
+# Install both the core store and Vue adapter
+npm install @hf-chimera/store @hf-chimera/vue
+
+# Vue is a peer dependency
+npm install vue
+
+# Or install all at once
+npm install @hf-chimera/store @hf-chimera/vue vue
+```
+
+## Usage
+
+### For Vue Applications
+
+Import from the Vue-specific entry point:
+
+```ts
+import { createChimeraComposables } from "@hf-chimera/store/vue";
+// In your app, call createChimeraComposables(store) and export the returned composables
+```
+
+### For Non-Vue Usage
+
+Import and use the core store directly:
+
+```ts
+import { createChimeraEntityStore } from "@hf-chimera/store";
+import { createChimeraStoreComposables } from "@hf-chimera/vue";
+```
+
+## Quick Start
+
+### 1. Prepare composables for the store
+
+Use `createChimeraStoreComposables` to create Vue composables bound to your entity store instance.
+
+```ts
+import { createChimeraEntityStore } from "@hf-chimera/store";
+import { createChimeraStoreComposables } from "@hf-chimera/vue";
+
+// Define your entity type
+type Customer = {
+  id: number;
+  name: string;
+  email: string;
+};
+
+// Create your entity store instance
+const customerStore = createChimeraEntityStore<"customer", Customer>({
+  name: "customer",
+  idGetter: "id",
+  async collectionFetcher(params, requestParams) {
+    const response = await fetch("/api/customers", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ filter: params.filter, order: params.order }),
+      signal: requestParams.signal,
+    });
+    return { data: await response.json() };
+  },
+  async itemFetcher(params, requestParams) {
+    const response = await fetch(`/api/customers/${params.id}`, {
+      signal: requestParams.signal,
+    });
+    return { data: await response.json() };
+  },
+  // ... other CRUD operations
+});
+
+// Create composables bound to your customer store
+// This generates: useChimeraCustomerStore, useChimeraCustomerCollection, useChimeraCustomerItem
+export const {
+  useChimeraCustomerStore,
+  useChimeraCustomerCollection,
+  useChimeraCustomerItem,
+} = createChimeraStoreComposables(customerStore);
+```
+
+### 2. Use Collection Queries in a component
+
+`useChimeraCustomerCollection` returns a Vue `Ref` to a `ChimeraCollectionQuery`. In `<template>`, refs are auto-unwrapped. In `<script setup>`, access via `.value`.
+
+```vue
+<script setup lang="ts">
+import { useChimeraCustomerCollection } from "@/store/chimera";
+
+const customers = useChimeraCustomerCollection({
+  filter: { status: "active" },
+  order: [{ field: "name", direction: "asc" }],
+});
+
+function addCustomer() {
+  customers.value.create({ name: "New Customer" });
+}
+</script>
+
+<template>
+  <div>
+    <div v-if="!customers.ready">Loading...</div>
+    <div v-else-if="customers.lastError">
+      Error: {{ String(customers.lastError) }}
+    </div>
+    <template v-else>
+      <div v-for="c in customers" :key="c.id">
+        {{ c.name }}
+        <button @click="customers.delete(c.id)">Delete</button>
+      </div>
+      <button @click="addCustomer">Add Customer</button>
+    </template>
+  </div>
+</template>
+```
+
+### 3. Use Item Queries in a component
+
+```vue
+<script setup lang="ts">
+import { useChimeraCustomerItem } from "@/store/chimera";
+
+interface Props {
+  customerId: string;
+}
+const props = defineProps<Props>();
+
+const customer = useChimeraCustomerItem(() => props.customerId);
+
+function updateName() {
+  if (!customer.value.data) return;
+  customer.value.mutable.name = "Updated Name";
+  customer.value.commit();
+}
+</script>
+
+<template>
+  <div>
+    <div v-if="!customer.ready">Loading...</div>
+    <div v-else-if="customer.lastError">
+      Error: {{ String(customer.lastError) }}
+    </div>
+    <div v-else-if="!customer.data">Customer not found</div>
+    <div v-else>
+      <h3>{{ customer.data.name }}</h3>
+      <button @click="updateName">Update Name</button>
+    </div>
+  </div>
+</template>
+```
+
+### 4. Using the Query Builder
+
+You can pass a builder function instead of a params object. The composable will call it to build the query.
+
+```ts
+import { useChimeraCollection } from "@/store/chimera";
+
+const activeUsers = useChimeraCollection("customer", (q) => {
+  q.where("email", "contains", "@example.com").orderBy("createdAt", true);
+});
+```
+
+Complex example with groups:
+
+```ts
+const featuredOrders = useChimeraCollection("order", (q) => {
+  q.where("status", "eq", "completed")
+    // Must be either high value OR from VIP customer
+    .group("or", (group) => {
+      group
+        .where("totalAmount", "gte", 1000)
+        .where("customerId", "in", [1, 2, 3]);
+    })
+    // But not cancelled
+    .whereNot("status", "eq", "cancelled")
+    .orderBy("totalAmount", true);
+});
+```
+
+For more information on the query builder, see the [ChimeraQueryBuilder documentation](../../qb/README.md).
+
+## API Reference
+
+### Composables
+
+#### `useChimeraCustomerCollection<Meta>(params)`
+
+Composable for collection queries with automatic reactivity.
+
+Parameters:
+
+- `entityName: EntityName` — Entity name
+- `params: ChimeraCollectionParams | QueryBuilderCreator | Ref | Getter` — Query params or builder; can be a value, a `ref`, or a function getter
+
+Returns: `Ref<ChimeraCollectionQuery<Item, OperatorsMap>>` — see [ChimeraCollectionQuery](../../../README.md#chimeracollectionquery)
+
+#### `useChimeraItem<EntityName, Meta>(entityName, id, meta?)`
+
+Composable for single item queries with automatic reactivity.
+
+Parameters:
+
+- `entityName: EntityName` — Entity name
+- `id: ChimeraEntityId | Ref | Getter` — Item ID (can be reactive)
+- `meta?: Meta | Ref | Getter` — Optional metadata (can be reactive)
+
+Returns: `Ref<ChimeraItemQuery<Item>>` — see [ChimeraItemQuery](../../../README.md#chimeraitemquery)
+
+## Vue-specific Notes
+
+- All composables return Vue `Ref`s. In `<template>`, refs are automatically unwrapped; in `<script>`, access via `.value`.
+- Subscribes internally to store events and triggers updates on:
+  - Collections: `ready`, `updated`, `selfUpdated`, `selfItemCreated`, `itemAdded`, `itemUpdated`, `selfItemUpdated`, `itemDeleted`, `selfItemDeleted`, `error`.
+  - Items: `initialized`, `selfCreated`, `ready`, `updated`, `selfUpdated`, `deleted`, `selfDeleted`, `error`.
+- You can pass reactive inputs (refs or getters) to `entityName`, `params`, `id`, and `meta`. The composables will react to changes automatically.
+
+## Tips
+
+1. **Type Safety**: Consider exposing a typed facade (e.g., `getChimeraTypedComposables`) in your project for strict types.
+2. **Error Handling**: Always check `ready` and `lastError` before rendering critical UI.
+3. **Optimistic Updates**: Use the `mutable` object on item queries and call `commit()`.
+4. **Batch Operations**: Prefer collection-level operations when possible.
+5. **Query Builder**: Prefer the builder function for complex filtering and ordering with strong types.

package/dist/index.cjs

@@ -0,0 +1,44 @@
+let _hf_chimera_adapters_shared = require("@hf-chimera/adapters-shared");
+let _hf_chimera_query_builder = require("@hf-chimera/query-builder");
+let vue = require("vue");
+
+//#region composables.ts
+const isFunction = (value) => typeof value === "function";
+const toValue = (value) => isFunction(value) ? value() : (0, vue.isRef)(value) ? value.value : value;
+const capitalize = (s) => s !== "" ? s[0].toUpperCase() + s.slice(1) : "";
+const createEmitterRef = (value, events, name) => (0, vue.customRef)((track, trigger) => {
+	(0, vue.watch)(value, (value$1, _, onCleanup) => {
+		const actualValue = toValue(value$1);
+		const handler = () => trigger();
+		events.forEach((event) => {
+			actualValue.on(event, handler);
+		});
+		onCleanup(() => events.forEach((event) => {
+			actualValue.off(event, handler);
+		}));
+	}, { immediate: true });
+	return {
+		get() {
+			track();
+			return toValue(value);
+		},
+		set() {
+			console.warn(`${name} ref is readonly`);
+		}
+	};
+});
+function createChimeraStoreComposables(store, createQueryBuilder) {
+	createQueryBuilder ||= () => new _hf_chimera_query_builder.DefaultChimeraQueryBuilder();
+	return {
+		[`useChimera${capitalize(store.name)}Store`]: () => createEmitterRef(store, _hf_chimera_adapters_shared.CHIMERA_ENTITY_STORE_UPDATE_EVENTS, "ChimeraEntityStore"),
+		[`useChimera${capitalize(store.name)}Collection`]: (params) => {
+			const normalizedParams = (0, vue.computed)(() => (0, _hf_chimera_adapters_shared.normalizeParams)(createQueryBuilder, toValue(params)));
+			return createEmitterRef((0, vue.computed)(() => store.getCollection(normalizedParams.value)), _hf_chimera_adapters_shared.CHIMERA_COLLECTION_UPDATE_EVENTS, "ChimeraCollectionQuery");
+		},
+		[`useChimera${capitalize(store.name)}Item`]: (id, meta) => createEmitterRef((0, vue.computed)(() => store.getItem(toValue(id), toValue(meta))), _hf_chimera_adapters_shared.CHIMERA_ITEM_UPDATE_EVENTS, "ChimeraItemQuery")
+	};
+}
+
+//#endregion
+exports.createChimeraStoreComposables = createChimeraStoreComposables;
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","names":["value","DefaultChimeraQueryBuilder","CHIMERA_ENTITY_STORE_UPDATE_EVENTS","CHIMERA_COLLECTION_UPDATE_EVENTS","CHIMERA_ITEM_UPDATE_EVENTS"],"sources":["../composables.ts"],"sourcesContent":["import {\n\ttype AnyChimeraParams,\n\tCHIMERA_COLLECTION_UPDATE_EVENTS,\n\tCHIMERA_ENTITY_STORE_UPDATE_EVENTS,\n\tCHIMERA_ITEM_UPDATE_EVENTS,\n\tnormalizeParams,\n} from \"@hf-chimera/adapters-shared\";\nimport type { ChimeraQueryBuilder } from \"@hf-chimera/query-builder\";\nimport { DefaultChimeraQueryBuilder } from \"@hf-chimera/query-builder\";\nimport type {\n\tAnyChimeraEntityStore,\n\tAnyChimeraEventEmitter,\n\tChimeraCollectionQuery,\n\tChimeraEntityId,\n\tChimeraEntityStoreEntity,\n\tChimeraEntityStoreName,\n\tChimeraEntityStoreOperatorsMap,\n\tChimeraEventEmitterEventNames,\n\tChimeraItemQuery,\n} from \"@hf-chimera/store\";\nimport { computed, customRef, isRef, type Ref, watch } from \"vue\";\n\ntype MaybeRef<T> = T | Ref<T>;\ntype MaybeRefOrGetter<T> = MaybeRef<T> | (() => T);\n\ntype ChimeraComposables<\n\tTStore extends AnyChimeraEntityStore,\n\tTQueryBuilder extends ChimeraQueryBuilder<TStore>,\n\tTEntityName extends ChimeraEntityStoreName<TStore> = ChimeraEntityStoreName<TStore>,\n> = {\n\t[K in TEntityName as `useChimera${Capitalize<K>}Store`]: () => Ref<TStore>;\n} & {\n\t[K in TEntityName as `useChimera${Capitalize<K>}Collection`]: <TMeta = any>(\n\t\tparams: MaybeRefOrGetter<AnyChimeraParams<TStore, TMeta, Extract<TQueryBuilder, ChimeraQueryBuilder<TStore>>>>,\n\t) => Ref<\n\t\tChimeraCollectionQuery<\n\t\t\tChimeraEntityStoreName<TStore>,\n\t\t\tChimeraEntityStoreEntity<TStore>,\n\t\t\tChimeraEntityStoreOperatorsMap<TStore>\n\t\t>\n\t>;\n} & {\n\t[K in TEntityName as `useChimera${Capitalize<K>}Item`]: <TMeta = any>(\n\t\tid: MaybeRefOrGetter<ChimeraEntityId>,\n\t\tmeta?: MaybeRefOrGetter<TMeta>,\n\t) => Ref<ChimeraItemQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>>>;\n};\n\nconst isFunction = (value: any): value is () => any => typeof value === \"function\";\nconst toValue = <T>(value: MaybeRefOrGetter<T>): T =>\n\tisFunction(value) ? value() : isRef(value) ? value.value : value;\nconst capitalize = <T extends string>(s: T): Capitalize<T> =>\n\ts !== \"\" ? (((s[0] as string).toUpperCase() + s.slice(1)) as Capitalize<T>) : (\"\" as Capitalize<T>);\n\nconst createEmitterRef = <TEventEmitter extends AnyChimeraEventEmitter>(\n\tvalue: MaybeRefOrGetter<TEventEmitter>,\n\tevents: ChimeraEventEmitterEventNames<TEventEmitter>[],\n\tname: string,\n) =>\n\tcustomRef((track, trigger) => {\n\t\twatch(\n\t\t\tvalue,\n\t\t\t(value, _, onCleanup) => {\n\t\t\t\tconst actualValue = toValue(value);\n\n\t\t\t\tconst handler = () => trigger();\n\t\t\t\tevents.forEach((event) => {\n\t\t\t\t\tactualValue.on(event, handler);\n\t\t\t\t});\n\t\t\t\tonCleanup(() =>\n\t\t\t\t\tevents.forEach((event) => {\n\t\t\t\t\t\tactualValue.off(event, handler);\n\t\t\t\t\t}),\n\t\t\t\t);\n\t\t\t},\n\t\t\t{ immediate: true },\n\t\t);\n\n\t\treturn {\n\t\t\tget() {\n\t\t\t\ttrack();\n\t\t\t\treturn toValue(value);\n\t\t\t},\n\t\t\tset() {\n\t\t\t\tconsole.warn(`${name} ref is readonly`);\n\t\t\t},\n\t\t};\n\t});\n\nexport function createChimeraStoreComposables<TStore extends AnyChimeraEntityStore>(\n\tstore: TStore,\n): ChimeraComposables<TStore, DefaultChimeraQueryBuilder<TStore>>;\nexport function createChimeraStoreComposables<\n\tTStore extends AnyChimeraEntityStore,\n\tTQueryBuilder extends ChimeraQueryBuilder<TStore>,\n>(store: TStore, createQueryBuilder: () => TQueryBuilder): ChimeraComposables<TStore, TQueryBuilder>;\nexport function createChimeraStoreComposables<\n\tTStore extends AnyChimeraEntityStore,\n\tTQueryBuilder extends ChimeraQueryBuilder<TStore>,\n>(store: TStore, createQueryBuilder?: () => TQueryBuilder): ChimeraComposables<TStore, TQueryBuilder> {\n\tcreateQueryBuilder ||= () => new DefaultChimeraQueryBuilder() as unknown as TQueryBuilder;\n\n\treturn {\n\t\t[`useChimera${capitalize(store.name)}Store`]: () =>\n\t\t\tcreateEmitterRef(store, CHIMERA_ENTITY_STORE_UPDATE_EVENTS, \"ChimeraEntityStore\"),\n\t\t[`useChimera${capitalize(store.name)}Collection`]: <TMeta = any>(\n\t\t\tparams: MaybeRefOrGetter<AnyChimeraParams<TStore, TMeta, Extract<TQueryBuilder, ChimeraQueryBuilder<TStore>>>>,\n\t\t): Ref<\n\t\t\tChimeraCollectionQuery<\n\t\t\t\tChimeraEntityStoreName<TStore>,\n\t\t\t\tChimeraEntityStoreEntity<TStore>,\n\t\t\t\tChimeraEntityStoreOperatorsMap<TStore>\n\t\t\t>\n\t\t> => {\n\t\t\tconst normalizedParams = computed(() => normalizeParams(createQueryBuilder, toValue(params)));\n\t\t\treturn createEmitterRef(\n\t\t\t\tcomputed(() => store.getCollection(normalizedParams.value)),\n\t\t\t\tCHIMERA_COLLECTION_UPDATE_EVENTS,\n\t\t\t\t\"ChimeraCollectionQuery\",\n\t\t\t);\n\t\t},\n\t\t[`useChimera${capitalize(store.name)}Item`]: <TMeta = any>(\n\t\t\tid: MaybeRefOrGetter<ChimeraEntityId>,\n\t\t\tmeta?: MaybeRefOrGetter<TMeta>,\n\t\t): Ref<ChimeraItemQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>>> =>\n\t\t\tcreateEmitterRef(\n\t\t\t\tcomputed(() => store.getItem(toValue(id), toValue(meta))),\n\t\t\t\tCHIMERA_ITEM_UPDATE_EVENTS,\n\t\t\t\t\"ChimeraItemQuery\",\n\t\t\t),\n\t} as ChimeraComposables<TStore, TQueryBuilder>;\n}\n"],"mappings":";;;;;AAgDA,MAAM,cAAc,UAAmC,OAAO,UAAU;AACxE,MAAM,WAAc,UACnB,WAAW,MAAM,GAAG,OAAO,kBAAS,MAAM,GAAG,MAAM,QAAQ;AAC5D,MAAM,cAAgC,MACrC,MAAM,KAAQ,EAAE,GAAc,aAAa,GAAG,EAAE,MAAM,EAAE,GAAuB;AAEhF,MAAM,oBACL,OACA,QACA,6BAEW,OAAO,YAAY;AAC7B,gBACC,QACC,SAAO,GAAG,cAAc;EACxB,MAAM,cAAc,QAAQA,QAAM;EAElC,MAAM,gBAAgB,SAAS;AAC/B,SAAO,SAAS,UAAU;AACzB,eAAY,GAAG,OAAO,QAAQ;IAC7B;AACF,kBACC,OAAO,SAAS,UAAU;AACzB,eAAY,IAAI,OAAO,QAAQ;IAC9B,CACF;IAEF,EAAE,WAAW,MAAM,CACnB;AAED,QAAO;EACN,MAAM;AACL,UAAO;AACP,UAAO,QAAQ,MAAM;;EAEtB,MAAM;AACL,WAAQ,KAAK,GAAG,KAAK,kBAAkB;;EAExC;EACA;AASH,SAAgB,8BAGd,OAAe,oBAAqF;AACrG,8BAA6B,IAAIC,sDAA4B;AAE7D,QAAO;GACL,aAAa,WAAW,MAAM,KAAK,CAAC,eACpC,iBAAiB,OAAOC,gEAAoC,qBAAqB;GACjF,aAAa,WAAW,MAAM,KAAK,CAAC,eACpC,WAOI;GACJ,MAAM,4FAAkD,oBAAoB,QAAQ,OAAO,CAAC,CAAC;AAC7F,UAAO,yCACS,MAAM,cAAc,iBAAiB,MAAM,CAAC,EAC3DC,8DACA,yBACA;;GAED,aAAa,WAAW,MAAM,KAAK,CAAC,SACpC,IACA,SAEA,yCACgB,MAAM,QAAQ,QAAQ,GAAG,EAAE,QAAQ,KAAK,CAAC,CAAC,EACzDC,wDACA,mBACA;EACF"}

package/dist/index.d.cts

@@ -0,0 +1,14 @@
+import { AnyChimeraParams } from "@hf-chimera/adapters-shared";
+import { ChimeraQueryBuilder, DefaultChimeraQueryBuilder } from "@hf-chimera/query-builder";
+import { AnyChimeraEntityStore, ChimeraCollectionQuery, ChimeraEntityId, ChimeraEntityStoreEntity, ChimeraEntityStoreName, ChimeraEntityStoreOperatorsMap, ChimeraItemQuery } from "@hf-chimera/store";
+import { Ref } from "vue";
+
+//#region composables.d.ts
+type MaybeRef<T> = T | Ref<T>;
+type MaybeRefOrGetter<T> = MaybeRef<T> | (() => T);
+type ChimeraComposables<TStore extends AnyChimeraEntityStore, TQueryBuilder extends ChimeraQueryBuilder<TStore>, TEntityName extends ChimeraEntityStoreName<TStore> = ChimeraEntityStoreName<TStore>> = { [K in TEntityName as `useChimera${Capitalize<K>}Store`]: () => Ref<TStore> } & { [K in TEntityName as `useChimera${Capitalize<K>}Collection`]: <TMeta = any>(params: MaybeRefOrGetter<AnyChimeraParams<TStore, TMeta, Extract<TQueryBuilder, ChimeraQueryBuilder<TStore>>>>) => Ref<ChimeraCollectionQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>, ChimeraEntityStoreOperatorsMap<TStore>>> } & { [K in TEntityName as `useChimera${Capitalize<K>}Item`]: <TMeta = any>(id: MaybeRefOrGetter<ChimeraEntityId>, meta?: MaybeRefOrGetter<TMeta>) => Ref<ChimeraItemQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>>> };
+declare function createChimeraStoreComposables<TStore extends AnyChimeraEntityStore>(store: TStore): ChimeraComposables<TStore, DefaultChimeraQueryBuilder<TStore>>;
+declare function createChimeraStoreComposables<TStore extends AnyChimeraEntityStore, TQueryBuilder extends ChimeraQueryBuilder<TStore>>(store: TStore, createQueryBuilder: () => TQueryBuilder): ChimeraComposables<TStore, TQueryBuilder>;
+//#endregion
+export { createChimeraStoreComposables };
+//# sourceMappingURL=index.d.cts.map

package/dist/index.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.cts","names":[],"sources":["../composables.ts"],"sourcesContent":[],"mappings":";;;;;;KAsBK,cAAc,IAAI,IAAI;AAFuC,KAG7D,gBADQ,CAAA,CAAA,CAAA,GACc,QADd,CACuB,CADvB,CAAA,GAAA,CAAA,GAAA,GACmC,CADnC,CAAA;KAGR,kBAHc,CAAA,eAIH,qBAJG,EAAA,sBAKI,mBALJ,CAKwB,MALxB,CAAA,EAAA,oBAME,sBANF,CAMyB,MANzB,CAAA,GAMmC,sBANnC,CAM0D,MAN1D,CAAA,CAAA,GAAA,QAQZ,WARoB,IAAA,aAQQ,UARR,CAQmB,CARnB,CAAA,OAAA,GAAA,GAAA,GAQqC,GARrC,CAQyC,MARzC,CAAA,EAAJ,GAAA,QAUhB,WAVmB,IAAA,aAUS,UAVT,CAUoB,CAVpB,CAAA,YAAA,GAAA,CAAA,QAAA,GAAA,CAAA,CAAA,MAAA,EAWhB,gBAXgB,CAWC,gBAXD,CAWkB,MAXlB,EAW0B,KAX1B,EAWiC,OAXjC,CAWyC,aAXzC,EAWwD,mBAXxD,CAW4E,MAX5E,CAAA,CAAA,CAAA,CAAA,EAAA,GAYpB,GAZoB,CAaxB,sBAbwB,CAcvB,sBAduB,CAcA,MAdA,CAAA,EAevB,wBAfuB,CAeE,MAfF,CAAA,EAgBvB,8BAhBuB,CAgBQ,MAhBR,CAAA,CAAA,CAAA,EAAA,GACrB,QAmBE,WAnB6B,IAAA,aAmBD,UAnBC,CAmBU,CAnBV,CAAA,MAAA,GAAA,CAAA,QAAA,GAAA,CAAA,CAAA,EAAA,EAoB9B,gBApB8B,CAoBb,eApBa,CAAA,EAAA,IAAA,CAAA,EAqB3B,gBArB2B,CAqBV,KArBU,CAAA,EAAA,GAsB9B,GAtB8B,CAsB1B,gBAtB0B,CAsBT,sBAtBS,CAsBc,MAtBd,CAAA,EAsBuB,wBAtBvB,CAsBgD,MAtBhD,CAAA,CAAA,CAAA,EAAT;AAAqB,iBAkEhC,6BAlEgC,CAAA,eAkEa,qBAlEb,CAAA,CAAA,KAAA,EAmExC,MAnEwC,CAAA,EAoE7C,kBApE6C,CAoE1B,MApE0B,EAoElB,0BApEkB,CAoES,MApET,CAAA,CAAA;AAAC,iBAqEjC,6BArEiC,CAAA,eAsEjC,qBAtEiC,EAAA,sBAuE1B,mBAvE0B,CAuEN,MAvEM,CAAA,CAAA,CAAA,KAAA,EAwExC,MAxEwC,EAAA,kBAAA,EAAA,GAAA,GAwEN,aAxEM,CAAA,EAwEU,kBAxEV,CAwE6B,MAxE7B,EAwEqC,aAxErC,CAAA"}

package/dist/index.d.mts

@@ -0,0 +1,14 @@
+import { AnyChimeraParams } from "@hf-chimera/adapters-shared";
+import { ChimeraQueryBuilder, DefaultChimeraQueryBuilder } from "@hf-chimera/query-builder";
+import { Ref } from "vue";
+import { AnyChimeraEntityStore, ChimeraCollectionQuery, ChimeraEntityId, ChimeraEntityStoreEntity, ChimeraEntityStoreName, ChimeraEntityStoreOperatorsMap, ChimeraItemQuery } from "@hf-chimera/store";
+
+//#region composables.d.ts
+type MaybeRef<T> = T | Ref<T>;
+type MaybeRefOrGetter<T> = MaybeRef<T> | (() => T);
+type ChimeraComposables<TStore extends AnyChimeraEntityStore, TQueryBuilder extends ChimeraQueryBuilder<TStore>, TEntityName extends ChimeraEntityStoreName<TStore> = ChimeraEntityStoreName<TStore>> = { [K in TEntityName as `useChimera${Capitalize<K>}Store`]: () => Ref<TStore> } & { [K in TEntityName as `useChimera${Capitalize<K>}Collection`]: <TMeta = any>(params: MaybeRefOrGetter<AnyChimeraParams<TStore, TMeta, Extract<TQueryBuilder, ChimeraQueryBuilder<TStore>>>>) => Ref<ChimeraCollectionQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>, ChimeraEntityStoreOperatorsMap<TStore>>> } & { [K in TEntityName as `useChimera${Capitalize<K>}Item`]: <TMeta = any>(id: MaybeRefOrGetter<ChimeraEntityId>, meta?: MaybeRefOrGetter<TMeta>) => Ref<ChimeraItemQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>>> };
+declare function createChimeraStoreComposables<TStore extends AnyChimeraEntityStore>(store: TStore): ChimeraComposables<TStore, DefaultChimeraQueryBuilder<TStore>>;
+declare function createChimeraStoreComposables<TStore extends AnyChimeraEntityStore, TQueryBuilder extends ChimeraQueryBuilder<TStore>>(store: TStore, createQueryBuilder: () => TQueryBuilder): ChimeraComposables<TStore, TQueryBuilder>;
+//#endregion
+export { createChimeraStoreComposables };
+//# sourceMappingURL=index.d.mts.map

package/dist/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","names":[],"sources":["../composables.ts"],"sourcesContent":[],"mappings":";;;;;;KAsBK,cAAc,IAAI,IAAI;AAFuC,KAG7D,gBADQ,CAAA,CAAA,CAAA,GACc,QADd,CACuB,CADvB,CAAA,GAAA,CAAA,GAAA,GACmC,CADnC,CAAA;KAGR,kBAHc,CAAA,eAIH,qBAJG,EAAA,sBAKI,mBALJ,CAKwB,MALxB,CAAA,EAAA,oBAME,sBANF,CAMyB,MANzB,CAAA,GAMmC,sBANnC,CAM0D,MAN1D,CAAA,CAAA,GAAA,QAQZ,WARoB,IAAA,aAQQ,UARR,CAQmB,CARnB,CAAA,OAAA,GAAA,GAAA,GAQqC,GARrC,CAQyC,MARzC,CAAA,EAAJ,GAAA,QAUhB,WAVmB,IAAA,aAUS,UAVT,CAUoB,CAVpB,CAAA,YAAA,GAAA,CAAA,QAAA,GAAA,CAAA,CAAA,MAAA,EAWhB,gBAXgB,CAWC,gBAXD,CAWkB,MAXlB,EAW0B,KAX1B,EAWiC,OAXjC,CAWyC,aAXzC,EAWwD,mBAXxD,CAW4E,MAX5E,CAAA,CAAA,CAAA,CAAA,EAAA,GAYpB,GAZoB,CAaxB,sBAbwB,CAcvB,sBAduB,CAcA,MAdA,CAAA,EAevB,wBAfuB,CAeE,MAfF,CAAA,EAgBvB,8BAhBuB,CAgBQ,MAhBR,CAAA,CAAA,CAAA,EAAA,GACrB,QAmBE,WAnB6B,IAAA,aAmBD,UAnBC,CAmBU,CAnBV,CAAA,MAAA,GAAA,CAAA,QAAA,GAAA,CAAA,CAAA,EAAA,EAoB9B,gBApB8B,CAoBb,eApBa,CAAA,EAAA,IAAA,CAAA,EAqB3B,gBArB2B,CAqBV,KArBU,CAAA,EAAA,GAsB9B,GAtB8B,CAsB1B,gBAtB0B,CAsBT,sBAtBS,CAsBc,MAtBd,CAAA,EAsBuB,wBAtBvB,CAsBgD,MAtBhD,CAAA,CAAA,CAAA,EAAT;AAAqB,iBAkEhC,6BAlEgC,CAAA,eAkEa,qBAlEb,CAAA,CAAA,KAAA,EAmExC,MAnEwC,CAAA,EAoE7C,kBApE6C,CAoE1B,MApE0B,EAoElB,0BApEkB,CAoES,MApET,CAAA,CAAA;AAAC,iBAqEjC,6BArEiC,CAAA,eAsEjC,qBAtEiC,EAAA,sBAuE1B,mBAvE0B,CAuEN,MAvEM,CAAA,CAAA,CAAA,KAAA,EAwExC,MAxEwC,EAAA,kBAAA,EAAA,GAAA,GAwEN,aAxEM,CAAA,EAwEU,kBAxEV,CAwE6B,MAxE7B,EAwEqC,aAxErC,CAAA"}

package/dist/index.mjs

@@ -0,0 +1,44 @@
+import { CHIMERA_COLLECTION_UPDATE_EVENTS, CHIMERA_ENTITY_STORE_UPDATE_EVENTS, CHIMERA_ITEM_UPDATE_EVENTS, normalizeParams } from "@hf-chimera/adapters-shared";
+import { DefaultChimeraQueryBuilder } from "@hf-chimera/query-builder";
+import { computed, customRef, isRef, watch } from "vue";
+
+//#region composables.ts
+const isFunction = (value) => typeof value === "function";
+const toValue = (value) => isFunction(value) ? value() : isRef(value) ? value.value : value;
+const capitalize = (s) => s !== "" ? s[0].toUpperCase() + s.slice(1) : "";
+const createEmitterRef = (value, events, name) => customRef((track, trigger) => {
+	watch(value, (value$1, _, onCleanup) => {
+		const actualValue = toValue(value$1);
+		const handler = () => trigger();
+		events.forEach((event) => {
+			actualValue.on(event, handler);
+		});
+		onCleanup(() => events.forEach((event) => {
+			actualValue.off(event, handler);
+		}));
+	}, { immediate: true });
+	return {
+		get() {
+			track();
+			return toValue(value);
+		},
+		set() {
+			console.warn(`${name} ref is readonly`);
+		}
+	};
+});
+function createChimeraStoreComposables(store, createQueryBuilder) {
+	createQueryBuilder ||= () => new DefaultChimeraQueryBuilder();
+	return {
+		[`useChimera${capitalize(store.name)}Store`]: () => createEmitterRef(store, CHIMERA_ENTITY_STORE_UPDATE_EVENTS, "ChimeraEntityStore"),
+		[`useChimera${capitalize(store.name)}Collection`]: (params) => {
+			const normalizedParams = computed(() => normalizeParams(createQueryBuilder, toValue(params)));
+			return createEmitterRef(computed(() => store.getCollection(normalizedParams.value)), CHIMERA_COLLECTION_UPDATE_EVENTS, "ChimeraCollectionQuery");
+		},
+		[`useChimera${capitalize(store.name)}Item`]: (id, meta) => createEmitterRef(computed(() => store.getItem(toValue(id), toValue(meta))), CHIMERA_ITEM_UPDATE_EVENTS, "ChimeraItemQuery")
+	};
+}
+
+//#endregion
+export { createChimeraStoreComposables };
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["value"],"sources":["../composables.ts"],"sourcesContent":["import {\n\ttype AnyChimeraParams,\n\tCHIMERA_COLLECTION_UPDATE_EVENTS,\n\tCHIMERA_ENTITY_STORE_UPDATE_EVENTS,\n\tCHIMERA_ITEM_UPDATE_EVENTS,\n\tnormalizeParams,\n} from \"@hf-chimera/adapters-shared\";\nimport type { ChimeraQueryBuilder } from \"@hf-chimera/query-builder\";\nimport { DefaultChimeraQueryBuilder } from \"@hf-chimera/query-builder\";\nimport type {\n\tAnyChimeraEntityStore,\n\tAnyChimeraEventEmitter,\n\tChimeraCollectionQuery,\n\tChimeraEntityId,\n\tChimeraEntityStoreEntity,\n\tChimeraEntityStoreName,\n\tChimeraEntityStoreOperatorsMap,\n\tChimeraEventEmitterEventNames,\n\tChimeraItemQuery,\n} from \"@hf-chimera/store\";\nimport { computed, customRef, isRef, type Ref, watch } from \"vue\";\n\ntype MaybeRef<T> = T | Ref<T>;\ntype MaybeRefOrGetter<T> = MaybeRef<T> | (() => T);\n\ntype ChimeraComposables<\n\tTStore extends AnyChimeraEntityStore,\n\tTQueryBuilder extends ChimeraQueryBuilder<TStore>,\n\tTEntityName extends ChimeraEntityStoreName<TStore> = ChimeraEntityStoreName<TStore>,\n> = {\n\t[K in TEntityName as `useChimera${Capitalize<K>}Store`]: () => Ref<TStore>;\n} & {\n\t[K in TEntityName as `useChimera${Capitalize<K>}Collection`]: <TMeta = any>(\n\t\tparams: MaybeRefOrGetter<AnyChimeraParams<TStore, TMeta, Extract<TQueryBuilder, ChimeraQueryBuilder<TStore>>>>,\n\t) => Ref<\n\t\tChimeraCollectionQuery<\n\t\t\tChimeraEntityStoreName<TStore>,\n\t\t\tChimeraEntityStoreEntity<TStore>,\n\t\t\tChimeraEntityStoreOperatorsMap<TStore>\n\t\t>\n\t>;\n} & {\n\t[K in TEntityName as `useChimera${Capitalize<K>}Item`]: <TMeta = any>(\n\t\tid: MaybeRefOrGetter<ChimeraEntityId>,\n\t\tmeta?: MaybeRefOrGetter<TMeta>,\n\t) => Ref<ChimeraItemQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>>>;\n};\n\nconst isFunction = (value: any): value is () => any => typeof value === \"function\";\nconst toValue = <T>(value: MaybeRefOrGetter<T>): T =>\n\tisFunction(value) ? value() : isRef(value) ? value.value : value;\nconst capitalize = <T extends string>(s: T): Capitalize<T> =>\n\ts !== \"\" ? (((s[0] as string).toUpperCase() + s.slice(1)) as Capitalize<T>) : (\"\" as Capitalize<T>);\n\nconst createEmitterRef = <TEventEmitter extends AnyChimeraEventEmitter>(\n\tvalue: MaybeRefOrGetter<TEventEmitter>,\n\tevents: ChimeraEventEmitterEventNames<TEventEmitter>[],\n\tname: string,\n) =>\n\tcustomRef((track, trigger) => {\n\t\twatch(\n\t\t\tvalue,\n\t\t\t(value, _, onCleanup) => {\n\t\t\t\tconst actualValue = toValue(value);\n\n\t\t\t\tconst handler = () => trigger();\n\t\t\t\tevents.forEach((event) => {\n\t\t\t\t\tactualValue.on(event, handler);\n\t\t\t\t});\n\t\t\t\tonCleanup(() =>\n\t\t\t\t\tevents.forEach((event) => {\n\t\t\t\t\t\tactualValue.off(event, handler);\n\t\t\t\t\t}),\n\t\t\t\t);\n\t\t\t},\n\t\t\t{ immediate: true },\n\t\t);\n\n\t\treturn {\n\t\t\tget() {\n\t\t\t\ttrack();\n\t\t\t\treturn toValue(value);\n\t\t\t},\n\t\t\tset() {\n\t\t\t\tconsole.warn(`${name} ref is readonly`);\n\t\t\t},\n\t\t};\n\t});\n\nexport function createChimeraStoreComposables<TStore extends AnyChimeraEntityStore>(\n\tstore: TStore,\n): ChimeraComposables<TStore, DefaultChimeraQueryBuilder<TStore>>;\nexport function createChimeraStoreComposables<\n\tTStore extends AnyChimeraEntityStore,\n\tTQueryBuilder extends ChimeraQueryBuilder<TStore>,\n>(store: TStore, createQueryBuilder: () => TQueryBuilder): ChimeraComposables<TStore, TQueryBuilder>;\nexport function createChimeraStoreComposables<\n\tTStore extends AnyChimeraEntityStore,\n\tTQueryBuilder extends ChimeraQueryBuilder<TStore>,\n>(store: TStore, createQueryBuilder?: () => TQueryBuilder): ChimeraComposables<TStore, TQueryBuilder> {\n\tcreateQueryBuilder ||= () => new DefaultChimeraQueryBuilder() as unknown as TQueryBuilder;\n\n\treturn {\n\t\t[`useChimera${capitalize(store.name)}Store`]: () =>\n\t\t\tcreateEmitterRef(store, CHIMERA_ENTITY_STORE_UPDATE_EVENTS, \"ChimeraEntityStore\"),\n\t\t[`useChimera${capitalize(store.name)}Collection`]: <TMeta = any>(\n\t\t\tparams: MaybeRefOrGetter<AnyChimeraParams<TStore, TMeta, Extract<TQueryBuilder, ChimeraQueryBuilder<TStore>>>>,\n\t\t): Ref<\n\t\t\tChimeraCollectionQuery<\n\t\t\t\tChimeraEntityStoreName<TStore>,\n\t\t\t\tChimeraEntityStoreEntity<TStore>,\n\t\t\t\tChimeraEntityStoreOperatorsMap<TStore>\n\t\t\t>\n\t\t> => {\n\t\t\tconst normalizedParams = computed(() => normalizeParams(createQueryBuilder, toValue(params)));\n\t\t\treturn createEmitterRef(\n\t\t\t\tcomputed(() => store.getCollection(normalizedParams.value)),\n\t\t\t\tCHIMERA_COLLECTION_UPDATE_EVENTS,\n\t\t\t\t\"ChimeraCollectionQuery\",\n\t\t\t);\n\t\t},\n\t\t[`useChimera${capitalize(store.name)}Item`]: <TMeta = any>(\n\t\t\tid: MaybeRefOrGetter<ChimeraEntityId>,\n\t\t\tmeta?: MaybeRefOrGetter<TMeta>,\n\t\t): Ref<ChimeraItemQuery<ChimeraEntityStoreName<TStore>, ChimeraEntityStoreEntity<TStore>>> =>\n\t\t\tcreateEmitterRef(\n\t\t\t\tcomputed(() => store.getItem(toValue(id), toValue(meta))),\n\t\t\t\tCHIMERA_ITEM_UPDATE_EVENTS,\n\t\t\t\t\"ChimeraItemQuery\",\n\t\t\t),\n\t} as ChimeraComposables<TStore, TQueryBuilder>;\n}\n"],"mappings":";;;;;AAgDA,MAAM,cAAc,UAAmC,OAAO,UAAU;AACxE,MAAM,WAAc,UACnB,WAAW,MAAM,GAAG,OAAO,GAAG,MAAM,MAAM,GAAG,MAAM,QAAQ;AAC5D,MAAM,cAAgC,MACrC,MAAM,KAAQ,EAAE,GAAc,aAAa,GAAG,EAAE,MAAM,EAAE,GAAuB;AAEhF,MAAM,oBACL,OACA,QACA,SAEA,WAAW,OAAO,YAAY;AAC7B,OACC,QACC,SAAO,GAAG,cAAc;EACxB,MAAM,cAAc,QAAQA,QAAM;EAElC,MAAM,gBAAgB,SAAS;AAC/B,SAAO,SAAS,UAAU;AACzB,eAAY,GAAG,OAAO,QAAQ;IAC7B;AACF,kBACC,OAAO,SAAS,UAAU;AACzB,eAAY,IAAI,OAAO,QAAQ;IAC9B,CACF;IAEF,EAAE,WAAW,MAAM,CACnB;AAED,QAAO;EACN,MAAM;AACL,UAAO;AACP,UAAO,QAAQ,MAAM;;EAEtB,MAAM;AACL,WAAQ,KAAK,GAAG,KAAK,kBAAkB;;EAExC;EACA;AASH,SAAgB,8BAGd,OAAe,oBAAqF;AACrG,8BAA6B,IAAI,4BAA4B;AAE7D,QAAO;GACL,aAAa,WAAW,MAAM,KAAK,CAAC,eACpC,iBAAiB,OAAO,oCAAoC,qBAAqB;GACjF,aAAa,WAAW,MAAM,KAAK,CAAC,eACpC,WAOI;GACJ,MAAM,mBAAmB,eAAe,gBAAgB,oBAAoB,QAAQ,OAAO,CAAC,CAAC;AAC7F,UAAO,iBACN,eAAe,MAAM,cAAc,iBAAiB,MAAM,CAAC,EAC3D,kCACA,yBACA;;GAED,aAAa,WAAW,MAAM,KAAK,CAAC,SACpC,IACA,SAEA,iBACC,eAAe,MAAM,QAAQ,QAAQ,GAAG,EAAE,QAAQ,KAAK,CAAC,CAAC,EACzD,4BACA,mBACA;EACF"}

package/package.json

@@ -0,0 +1,48 @@
+{
+	"name": "@hf-chimera/vue",
+	"version": "0.2.0",
+	"description": "Cross-end reactivity API - Vue adapter",
+	"license": "MIT",
+	"author": "hewston",
+	"keywords": [
+		"reactivity",
+		"reactive",
+		"vue",
+		"composables",
+		"typescript",
+		"state-management"
+	],
+	"type": "module",
+	"types": "./dist/index.d.ts",
+	"main": "./dist/index.cjs",
+	"module": "./dist/index.js",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"require": "./dist/index.cjs",
+			"import": "./dist/index.js"
+		}
+	},
+	"files": [
+		"dist"
+	],
+	"bugs": {
+		"url": "https://github.com/hf-chimera/store/issues"
+	},
+	"repository": {
+		"url": "https://github.com/hf-chimera/store"
+	},
+	"peerDependencies": {
+		"@hf-chimera/store": "workspace:^",
+		"@hf-chimera/adapters-shared": "workspace:^",
+		"vue": ">=3.0.0"
+	},
+	"scripts": {
+		"build": "tsdown",
+		"changeset:patch": "node ../../../scripts/changeset-patch.mjs @hf-chimera/vue"
+	},
+	"publishConfig": {
+		"access": "public",
+		"provenance": true
+	}
+}