@arcote.tech/arc-react 0.0.33 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,4 @@
1
- import { type ArcObjectAny, type ArcObjectKeys, type ArcObjectValueByKey } from "@arcote.tech/arc";
2
- import type { ArcAbstractAny } from "@arcote.tech/arc/elements/abstract";
1
+ import type { ArcElement } from "@arcote.tech/arc/elements/element";
3
2
  import React from "react";
4
3
  export type FormFieldContext = {
5
4
  errors: any;
@@ -7,18 +6,18 @@ export type FormFieldContext = {
7
6
  };
8
7
  export declare const FormFieldContext: React.Context<FormFieldContext | null>;
9
8
  export declare function useFormField(): FormFieldContext;
10
- type Translations<E extends ArcAbstractAny> = {
11
- [K in keyof ReturnType<E["validate"]>]: (data: Exclude<ReturnType<E["validate"]>[K], undefined>) => string;
12
- };
13
- type FormFieldProps<T extends ArcObjectAny, K extends ArcObjectKeys<T>> = {
14
- name: K;
15
- translations: Translations<ArcObjectValueByKey<T, K>>;
16
- render: (field: FormFieldData<T>) => React.ReactNode;
9
+ type Translations<E extends ArcElement> = {
10
+ [K in keyof Exclude<ReturnType<E["validate"]>, false>]: (data: Exclude<Exclude<ReturnType<E["validate"]>, false>[K], undefined | false>) => string;
11
+ } | ((data: any) => string) | string;
12
+ type FormFieldProps<E extends ArcElement> = {
13
+ translations: Translations<E>;
14
+ render: (field: FormFieldData<E>) => React.ReactNode;
17
15
  };
18
16
  export type FormFieldData<T> = {
19
17
  onChange: (value: any) => void;
20
18
  value: any;
19
+ name: string;
21
20
  };
22
- export declare function FormField<T extends ArcObjectAny, K extends ArcObjectKeys<T>>({ name, translations, render, }: FormFieldProps<T, K>): import("react/jsx-dev-runtime").JSX.Element;
21
+ export declare function FormField<E extends ArcElement>(name: string): ({ translations, render }: FormFieldProps<E>) => import("react/jsx-dev-runtime").JSX.Element;
23
22
  export {};
24
23
  //# sourceMappingURL=field.d.ts.map
@@ -1,4 +1,4 @@
1
- import { type ArcObjectAny, type ArcObjectKeys } from "@arcote.tech/arc";
1
+ import { type ArcObjectAny, type ArcObjectKeys, type ArcObjectValueByKey } from "@arcote.tech/arc";
2
2
  import React from "react";
3
3
  import { FormField } from "./field";
4
4
  export type FormContextValue<T extends ArcObjectAny> = {
@@ -12,7 +12,7 @@ export type FormContextValue<T extends ArcObjectAny> = {
12
12
  export declare const FormContext: React.Context<FormContextValue<any> | null>;
13
13
  export declare function Form<T extends ArcObjectAny>({ render, schema, onSubmit, }: {
14
14
  render: (props: {
15
- FormField: typeof FormField<T, ArcObjectKeys<T>>;
15
+ [K in ArcObjectKeys<T> as Capitalize<`${K}`>]: ReturnType<typeof FormField<ArcObjectValueByKey<T, K>>>;
16
16
  }) => React.ReactNode;
17
17
  schema: T;
18
18
  onSubmit: (values: Record<ArcObjectKeys<T>, any>) => void | Promise<void>;
@@ -2,5 +2,4 @@ export * from "./field";
2
2
  export * from "./form";
3
3
  export * from "./legacy_form_resolver";
4
4
  export * from "./message";
5
- export * from "./test";
6
5
  //# sourceMappingURL=index.d.ts.map
@@ -1,3 +1,6 @@
1
- import React from "react";
2
- export declare const FormMessage: React.ForwardRefExoticComponent<React.RefAttributes<HTMLDivElement>>;
1
+ import { type HTMLAttributes } from "react";
2
+ export declare function FormMessage({ ...props }: HTMLAttributes<HTMLSpanElement>): import("react/jsx-dev-runtime").JSX.Element | null;
3
+ export declare namespace FormMessage {
4
+ var displayName: string;
5
+ }
3
6
  //# sourceMappingURL=message.d.ts.map
package/dist/index.d.ts CHANGED
@@ -1,4 +1,3 @@
1
1
  export * from "./form/";
2
- export * from "./idb.ts";
3
2
  export * from "./reactModel.tsx";
4
3
  //# sourceMappingURL=index.d.ts.map
package/dist/index.js CHANGED
@@ -22,7 +22,6 @@ function Form({
22
22
  const [dirty, setDirty] = useState(new Set);
23
23
  const [isSubmitted, setIsSubmitted] = useState(false);
24
24
  const validate = useCallback(() => {
25
- console.log("validate", values, schema);
26
25
  const errors2 = schema.validate(values);
27
26
  setErrors(errors2);
28
27
  return Object.values(errors2).some((result) => result);
@@ -42,12 +41,17 @@ function Form({
42
41
  const handleSubmit = useCallback(async (e) => {
43
42
  e.preventDefault();
44
43
  setIsSubmitted(true);
45
- validate();
46
- if (!hasErrors) {
44
+ const hasErrors2 = validate();
45
+ if (!hasErrors2) {
47
46
  await onSubmit(values);
48
47
  }
49
48
  }, [schema, values, onSubmit, hasErrors]);
50
- const FF = useCallback(FormField, []);
49
+ const Fields = useMemo(() => {
50
+ return Object.fromEntries(schema.entries().map(([key, value]) => [
51
+ key.charAt(0).toUpperCase() + key.slice(1),
52
+ FormField(key)
53
+ ]));
54
+ }, [schema]);
51
55
  const contextValue = useMemo(() => ({
52
56
  values,
53
57
  errors,
@@ -60,7 +64,7 @@ function Form({
60
64
  value: contextValue,
61
65
  children: /* @__PURE__ */ jsx("form", {
62
66
  onSubmit: handleSubmit,
63
- children: render({ FormField: FF })
67
+ children: render(Fields)
64
68
  }, undefined, false, undefined, this)
65
69
  }, undefined, false, undefined, this);
66
70
  }
@@ -75,45 +79,52 @@ function useFormField() {
75
79
  throw new Error("useFormField must be used within a FormFieldProvider");
76
80
  return context;
77
81
  }
78
- function FormField({
79
- name,
80
- translations,
81
- render
82
- }) {
83
- const form = useContext(FormContext);
84
- if (!form)
85
- throw new Error("FormField must be used within a Form");
86
- const { values, errors, dirty, isSubmitted, setFieldValue, setFieldDirty } = form;
87
- const fieldErrors = errors[name] || {};
88
- const value = values[name] || "";
89
- const isDirty = dirty.has(name);
90
- const handleChange = useCallback2((value2) => {
91
- if (typeof value2 === "string") {
92
- setFieldValue(name, value2);
93
- } else if (value2?.target?.value !== undefined) {
94
- setFieldValue(name, value2.target.value);
95
- }
96
- if (!isDirty) {
97
- setFieldDirty(name);
98
- }
99
- }, [name, isDirty, setFieldValue, setFieldDirty]);
100
- const errorMessages = Object.entries(fieldErrors).map(([key, value2]) => {
101
- if (!value2)
102
- return;
103
- const translation = translations[key];
104
- return translation?.(value2);
105
- }).filter(Boolean);
106
- const contextValue = useMemo2(() => ({
107
- errors: isSubmitted ? fieldErrors : {},
108
- messages: errorMessages
109
- }), [fieldErrors, isSubmitted, errorMessages]);
110
- return /* @__PURE__ */ jsx2(FormFieldContext.Provider, {
111
- value: contextValue,
112
- children: render({
113
- onChange: handleChange,
114
- value
115
- })
116
- }, undefined, false, undefined, this);
82
+ function FormField(name) {
83
+ return ({ translations, render }) => {
84
+ const form = useContext(FormContext);
85
+ if (!form)
86
+ throw new Error("FormField must be used within a Form");
87
+ const { values, errors, dirty, isSubmitted, setFieldValue, setFieldDirty } = form;
88
+ const schemaErrors = errors?.["schema"] || {};
89
+ const fieldErrors = schemaErrors[name] || false;
90
+ const value = values[name] || "";
91
+ const isDirty = dirty.has(name);
92
+ const handleChange = useCallback2((value2) => {
93
+ if (typeof value2 === "string") {
94
+ setFieldValue(name, value2);
95
+ } else if (value2?.target?.value !== undefined) {
96
+ setFieldValue(name, value2.target.value);
97
+ }
98
+ if (!isDirty) {
99
+ setFieldDirty(name);
100
+ }
101
+ }, [name, isDirty, setFieldValue, setFieldDirty]);
102
+ const errorMessages = fieldErrors ? Object.entries(fieldErrors).map(([key, value2]) => {
103
+ if (!value2)
104
+ return;
105
+ if (!translations)
106
+ return;
107
+ const translation = translations[key] || translations;
108
+ if (typeof translation === "function") {
109
+ return translation(value2);
110
+ }
111
+ if (typeof translation === "string") {
112
+ return translation;
113
+ }
114
+ }).filter(Boolean) : [];
115
+ const contextValue = useMemo2(() => ({
116
+ errors: isSubmitted ? fieldErrors : false,
117
+ messages: errorMessages
118
+ }), [fieldErrors, isSubmitted, errorMessages]);
119
+ return /* @__PURE__ */ jsx2(FormFieldContext.Provider, {
120
+ value: contextValue,
121
+ children: render({
122
+ onChange: handleChange,
123
+ name: name.toString(),
124
+ value
125
+ })
126
+ }, undefined, false, undefined, this);
127
+ };
117
128
  }
118
129
  // form/legacy_form_resolver.ts
119
130
  function formResolver(schema) {
@@ -125,214 +136,22 @@ function formResolver(schema) {
125
136
  };
126
137
  }
127
138
  // form/message.tsx
128
- import React3 from "react";
129
139
  import { jsx as jsx3 } from "react/jsx-runtime";
130
- var FormMessage = React3.forwardRef(({}, ref) => {
140
+ function FormMessage({ ...props }) {
131
141
  const { messages } = useFormField();
132
142
  if (messages.length === 0)
133
143
  return null;
134
- return /* @__PURE__ */ jsx3("div", {
135
- className: "text-destructive",
136
- ref,
144
+ return /* @__PURE__ */ jsx3("span", {
145
+ ...props,
137
146
  children: messages[0]
138
147
  }, undefined, false, undefined, this);
139
- });
140
- FormMessage.displayName = "FormMessage";
141
- // form/test.tsx
142
- import { object, string } from "@arcote.tech/arc";
143
- import { jsx as jsx4, Fragment } from "react/jsx-runtime";
144
- function Test() {
145
- const schema = object({
146
- username: string().minLength(3).maxLength(10)
147
- });
148
- const handleSubmit = async (values) => {
149
- console.log("Form submitted:", values);
150
- };
151
- return /* @__PURE__ */ jsx4(Form, {
152
- schema,
153
- onSubmit: handleSubmit,
154
- render: ({ FormField: FormField2 }) => /* @__PURE__ */ jsx4("div", {
155
- children: [
156
- /* @__PURE__ */ jsx4(FormField2, {
157
- name: "username",
158
- translations: {
159
- minLength: ({ minLength }) => `Username must be at least ${minLength} characters long`,
160
- maxLength: ({ maxLength }) => `Username must be at most ${maxLength} characters long`
161
- },
162
- render: (field) => /* @__PURE__ */ jsx4(Fragment, {
163
- children: [
164
- /* @__PURE__ */ jsx4("input", {
165
- className: "border border-gray-300 rounded-md p-2",
166
- ...field
167
- }, undefined, false, undefined, this),
168
- /* @__PURE__ */ jsx4(FormMessage, {}, undefined, false, undefined, this)
169
- ]
170
- }, undefined, true, undefined, this)
171
- }, undefined, false, undefined, this),
172
- /* @__PURE__ */ jsx4("button", {
173
- type: "submit",
174
- children: "Submit"
175
- }, undefined, false, undefined, this)
176
- ]
177
- }, undefined, true, undefined, this)
178
- }, undefined, false, undefined, this);
179
- }
180
- // idb.ts
181
- import {
182
- ArcCollection,
183
- ArcIndexedCollection
184
- } from "@arcote.tech/arc";
185
- var idbAdapterFactory = (name, version) => (context) => new Promise((resolve, reject) => {
186
- const dbRequest = indexedDB.open(name, version);
187
- dbRequest.addEventListener("error", (err) => {
188
- reject(err);
189
- });
190
- dbRequest.addEventListener("success", (ev) => {
191
- resolve(new IDBAdapter(ev.target.result));
192
- });
193
- dbRequest.addEventListener("upgradeneeded", (ev) => {
194
- const db = ev.target.result;
195
- context.elements.filter((element) => element instanceof ArcIndexedCollection || element instanceof ArcCollection).forEach((collection) => {
196
- const name2 = collection.name;
197
- if (db.objectStoreNames.contains(name2)) {
198
- db.deleteObjectStore(collection.name);
199
- }
200
- const objectStore = db.createObjectStore(collection.name, {
201
- keyPath: "_id"
202
- });
203
- if (collection instanceof ArcIndexedCollection) {
204
- Object.entries(collection.indexes).forEach(([name3, keyPath]) => {
205
- objectStore.createIndex(name3, keyPath, {
206
- unique: false
207
- });
208
- });
209
- }
210
- });
211
- if (db.objectStoreNames.contains("state")) {
212
- db.deleteObjectStore("state");
213
- }
214
- db.createObjectStore("state", {
215
- keyPath: "_id"
216
- });
217
- });
218
- });
219
-
220
- class IDBReadTransaction {
221
- transaction;
222
- constructor(transaction) {
223
- this.transaction = transaction;
224
- }
225
- async findById(store, id) {
226
- return new Promise((resolve) => {
227
- if (!id) {
228
- resolve(undefined);
229
- return;
230
- }
231
- const result = this.transaction.objectStore(store).get(id);
232
- result.onsuccess = (e) => {
233
- resolve(e.target.result);
234
- };
235
- });
236
- }
237
- async findByIndex(store, index, data) {
238
- return new Promise((resolve) => {
239
- const idbIndex = this.transaction.objectStore(store).index(index);
240
- const keyPath = idbIndex.keyPath;
241
- let keyRange;
242
- const getKey = (obj) => {
243
- if (!obj)
244
- return;
245
- const key = keyPath.map((key2) => obj[key2]);
246
- if (key.some((value) => value === undefined))
247
- return;
248
- return key;
249
- };
250
- const simpleKey = getKey(data);
251
- if (!simpleKey) {
252
- const lower = "$gt" in data ? getKey(data.$gt) : getKey(data.$gte);
253
- const upper = "$lt" in data ? getKey(data.$lt) : getKey(data.$lte);
254
- const lowerOpen = "$gt" in data;
255
- const upperOpen = "$lt" in data;
256
- if (lower !== undefined && upper !== undefined) {
257
- keyRange = IDBKeyRange.bound(lower, upper, lowerOpen, upperOpen);
258
- } else if (lower !== undefined) {
259
- keyRange = IDBKeyRange.lowerBound(lower, lowerOpen);
260
- } else {
261
- keyRange = IDBKeyRange.upperBound(upper, upperOpen);
262
- }
263
- } else {
264
- keyRange = IDBKeyRange.only(simpleKey);
265
- }
266
- const result = idbIndex.getAll(keyRange);
267
- result.onsuccess = (e) => {
268
- resolve(e.target.result);
269
- };
270
- });
271
- }
272
- async findAll(store) {
273
- return new Promise((resolve) => {
274
- const result = this.transaction.objectStore(store).getAll();
275
- result.onsuccess = (e) => {
276
- resolve(e.target.result);
277
- };
278
- });
279
- }
280
- }
281
-
282
- class IDBReadWriteTransaction extends IDBReadTransaction {
283
- async set(store, data) {
284
- return new Promise((resolve, reject) => {
285
- const result = this.transaction.objectStore(store).put(data);
286
- result.onsuccess = (e) => {
287
- resolve();
288
- };
289
- result.onerror = (e) => {
290
- reject(e);
291
- };
292
- });
293
- }
294
- async remove(store, id) {
295
- return new Promise((resolve, reject) => {
296
- const result = this.transaction.objectStore(store).delete(id);
297
- result.onsuccess = (e) => {
298
- resolve();
299
- };
300
- result.onerror = (e) => {
301
- reject(e);
302
- };
303
- });
304
- }
305
- async commit() {
306
- return new Promise((resolve) => {
307
- this.transaction.oncomplete = () => {
308
- resolve();
309
- };
310
- this.transaction.commit();
311
- });
312
- }
313
- }
314
-
315
- class IDBAdapter {
316
- db;
317
- constructor(db) {
318
- this.db = db;
319
- }
320
- readWriteTransaction(stores) {
321
- if (!stores)
322
- stores = Array.from(this.db.objectStoreNames);
323
- const transaction = this.db.transaction(stores, "readwrite");
324
- return new IDBReadWriteTransaction(transaction);
325
- }
326
- readTransaction(stores) {
327
- if (!stores)
328
- stores = Array.from(this.db.objectStoreNames);
329
- const transaction = this.db.transaction(stores, "readonly");
330
- return new IDBReadTransaction(transaction);
331
- }
332
148
  }
149
+ FormMessage.displayName = "FormMessage";
333
150
  // reactModel.tsx
334
151
  import {
335
152
  MasterDataStorage,
153
+ Model,
154
+ RemoteModelClient,
336
155
  rtcClientFactory
337
156
  } from "@arcote.tech/arc";
338
157
  import {
@@ -343,126 +162,133 @@ import {
343
162
  useRef,
344
163
  useState as useState2
345
164
  } from "react";
346
- import { jsx as jsx5 } from "react/jsx-runtime";
347
- var reactModel = (arcContext, databaseName) => {
165
+
166
+ // sqliteWasmAdapter.ts
167
+ import {
168
+ createSQLiteAdapterFactory
169
+ } from "@arcote.tech/arc";
170
+ var sqliteWasmAdapterFactory = (db) => {
171
+ return async (context) => {
172
+ return createSQLiteAdapterFactory(db)(context);
173
+ };
174
+ };
175
+
176
+ // reactModel.tsx
177
+ import { jsx as jsx4 } from "react/jsx-runtime";
178
+ var reactModel = (arcContext, options) => {
348
179
  const LiveModelContext = createContext3(null);
349
180
  const LocalModelContext = createContext3(null);
350
- let modelMasterDataStorage = null;
181
+ let masterModel = null;
351
182
  return [
352
183
  function LiveModelProvider(props) {
353
- const dataStorage = useMemo3(() => {
184
+ const model = useMemo3(() => {
354
185
  if (typeof window === "undefined")
355
186
  return null;
356
- const dbAdapterPromise = idbAdapterFactory(databaseName, arcContext.version)(arcContext);
357
- const dataStorage2 = new MasterDataStorage(dbAdapterPromise, rtcClientFactory(props.token), arcContext);
358
- modelMasterDataStorage = dataStorage2;
359
- return dataStorage2;
360
- }, [arcContext, databaseName, arcContext.version]);
187
+ if (masterModel)
188
+ return masterModel;
189
+ if ("remoteUrl" in options) {
190
+ const model2 = new RemoteModelClient(arcContext, options.remoteUrl, props.client, props.catchErrorCallback);
191
+ masterModel = model2;
192
+ return model2;
193
+ } else {
194
+ const dbAdapterPromise = sqliteWasmAdapterFactory(options.sqliteAdapter)(arcContext);
195
+ const dataStorage = new MasterDataStorage(dbAdapterPromise, rtcClientFactory(props.token), arcContext);
196
+ const model2 = new Model(arcContext, dataStorage, props.client, props.catchErrorCallback);
197
+ masterModel = model2;
198
+ return model2;
199
+ }
200
+ }, [arcContext, options, props.client]);
361
201
  const [syncProgress, setSyncProgress] = useState2([]);
362
202
  const [syncDone, setSyncDone] = useState2(false);
363
203
  useEffect2(() => {
364
- if (typeof window === "undefined" || !dataStorage)
204
+ if (typeof window === "undefined" || !model)
365
205
  return;
366
206
  const sync = async () => {
367
- await dataStorage.sync(({ store, size }) => {
207
+ if (!("dataStorage" in model))
208
+ return setSyncDone(true);
209
+ await model.dataStorage.sync(({ store, size }) => {
368
210
  setSyncProgress((prev) => [...prev, { store, size }]);
369
211
  });
370
212
  setSyncDone(true);
371
213
  };
372
214
  sync();
373
- }, [dataStorage]);
374
- if (!dataStorage || !syncDone)
375
- return /* @__PURE__ */ jsx5(props.syncView, {
215
+ }, [model]);
216
+ if (!model || !syncDone)
217
+ return props.syncView ? /* @__PURE__ */ jsx4(props.syncView, {
376
218
  progress: syncProgress
377
- }, undefined, false, undefined, this);
378
- return /* @__PURE__ */ jsx5(LiveModelContext.Provider, {
379
- value: {
380
- dataStorage,
381
- client: props.client,
382
- catchErrorCallback: props.catchErrorCallback
383
- },
219
+ }, undefined, false, undefined, this) : null;
220
+ return /* @__PURE__ */ jsx4(LiveModelContext.Provider, {
221
+ value: model,
384
222
  children: props.children
385
223
  }, undefined, false, undefined, this);
386
224
  },
387
225
  function LocalModelProvider({ children }) {
388
- const parentContext = useContext2(LiveModelContext);
389
- if (!parentContext) {
226
+ const parentModel = useContext2(LiveModelContext);
227
+ if (!parentModel || !(parentModel instanceof Model)) {
390
228
  throw new Error("LocalModelProvider must be used within a LiveModelProvider");
391
229
  }
392
- const [localContext] = useState2(() => ({
393
- dataStorage: parentContext.dataStorage.fork()
394
- }));
395
- return /* @__PURE__ */ jsx5(LocalModelContext.Provider, {
396
- value: {
397
- dataStorage: localContext.dataStorage,
398
- client: parentContext.client,
399
- catchErrorCallback: parentContext.catchErrorCallback
400
- },
230
+ const [localModel] = useState2(() => parentModel.fork());
231
+ return /* @__PURE__ */ jsx4(LocalModelContext.Provider, {
232
+ value: localModel,
401
233
  children
402
234
  }, undefined, false, undefined, this);
403
235
  },
404
236
  function useQuery(queryBuilderFn, dependencies = []) {
405
- const context = useContext2(LocalModelContext) || useContext2(LiveModelContext);
406
- if (!context) {
237
+ const model = useContext2(LocalModelContext) || useContext2(LiveModelContext);
238
+ if (!model) {
407
239
  throw new Error("useQuery must be used within a ModelProvider");
408
240
  }
409
241
  const [result, setResult] = useState2(null);
410
242
  const [loading, setLoading] = useState2(true);
411
- const queryRef = useRef(null);
243
+ const unsubscribeRef = useRef(null);
412
244
  useEffect2(() => {
413
- if (queryRef.current)
414
- queryRef.current.unsubscribe();
415
- const queryBuilder = arcContext.queryBuilder();
416
- const query = queryBuilderFn(queryBuilder).toQuery();
417
- queryRef.current = query;
418
- const runQuery = async () => {
419
- const result2 = await query.run(context.dataStorage, (newResult) => {
420
- setResult(newResult);
421
- setLoading(false);
422
- });
423
- setResult(result2);
245
+ if (unsubscribeRef.current) {
246
+ unsubscribeRef.current();
247
+ }
248
+ const { unsubscribe, result: result2 } = model.subscribe(queryBuilderFn, (newResult) => {
249
+ setResult(newResult);
424
250
  setLoading(false);
425
- };
426
- runQuery();
251
+ });
252
+ unsubscribeRef.current = unsubscribe;
253
+ result2.then(() => {
254
+ setLoading(false);
255
+ });
427
256
  return () => {
428
- queryRef.current?.unsubscribe();
429
- queryRef.current = null;
257
+ if (unsubscribeRef.current) {
258
+ unsubscribeRef.current();
259
+ unsubscribeRef.current = null;
260
+ }
430
261
  };
431
- }, [context, ...dependencies]);
262
+ }, [model, ...dependencies]);
432
263
  return [result, loading];
433
264
  },
434
265
  function useCommands() {
435
- const context = useContext2(LocalModelContext) || useContext2(LiveModelContext);
436
- if (!context) {
437
- throw new Error("useQuery must be used within a ModelProvider");
266
+ const model = useContext2(LocalModelContext) || useContext2(LiveModelContext);
267
+ if (!model) {
268
+ throw new Error("useCommands must be used within a ModelProvider");
438
269
  }
439
- return arcContext.commandsClient(context.client, context.dataStorage, context.catchErrorCallback);
270
+ return model.commands();
440
271
  },
441
- async function query(queryBuilderFn, datastorage) {
442
- if (!datastorage)
443
- datastorage = modelMasterDataStorage;
444
- const queryBuilder = arcContext.queryBuilder();
445
- const query = queryBuilderFn(queryBuilder).toQuery();
446
- if (!datastorage)
447
- throw new Error("dataStorage not found");
448
- const result = await query.run(datastorage);
449
- return result;
272
+ async function query(queryBuilderFn, model) {
273
+ if (!model)
274
+ model = masterModel;
275
+ if (!model)
276
+ throw new Error("Model not found");
277
+ return model.query(queryBuilderFn);
450
278
  },
451
- function useLocalDataStorage() {
452
- const context = useContext2(LocalModelContext);
453
- if (!context) {
279
+ function useLocalModel() {
280
+ const model = useContext2(LocalModelContext);
281
+ if (!model) {
454
282
  return null;
455
283
  }
456
- return context.dataStorage;
284
+ return model;
457
285
  }
458
286
  ];
459
287
  };
460
288
  export {
461
289
  useFormField,
462
290
  reactModel,
463
- idbAdapterFactory,
464
291
  formResolver,
465
- Test,
466
292
  FormMessage,
467
293
  FormFieldContext,
468
294
  FormField,
@@ -470,4 +296,4 @@ export {
470
296
  Form
471
297
  };
472
298
 
473
- //# debugId=1DDD66A12E066C4464756E2164756E21
299
+ //# debugId=F5FEB20267C5EE2264756E2164756E21
@@ -1,16 +1,21 @@
1
- import { ForkedDataStorage, type ArcContextAny, type CommandsClient, type DataStorage, type QueryBuilderFunctionResult, type QueryFactoryFunction } from "@arcote.tech/arc";
2
- export declare const reactModel: <C extends ArcContextAny>(arcContext: C, databaseName: string) => readonly [(props: {
1
+ import { ForkedModel, type ArcContextAny, type IArcQueryBuilder, type ModelBase, type QueryBuilderFunctionResult, type QueryFactoryFunction, type UnaryFunction } from "@arcote.tech/arc";
2
+ import type { SQLiteDatabase } from "@arcote.tech/arc";
3
+ export declare const reactModel: <C extends ArcContextAny>(arcContext: C, options: {
4
+ sqliteAdapter: SQLiteDatabase;
5
+ } | {
6
+ remoteUrl: string;
7
+ }) => readonly [(props: {
3
8
  children: React.ReactNode;
4
9
  client: string;
5
10
  token: string;
6
- syncView: React.ComponentType<{
11
+ syncView?: React.ComponentType<{
7
12
  progress: {
8
13
  store: string;
9
14
  size: number;
10
15
  }[];
11
16
  }>;
12
17
  catchErrorCallback: (error: any) => void;
13
- }) => import("react/jsx-dev-runtime").JSX.Element, ({ children }: {
18
+ }) => import("react/jsx-dev-runtime").JSX.Element | null, ({ children }: {
14
19
  children: React.ReactNode;
15
- }) => import("react/jsx-dev-runtime").JSX.Element, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn, dependencies?: any[]) => [QueryBuilderFunctionResult<QueryBuilderFn>, boolean], () => CommandsClient<C["commands"]>, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn, datastorage?: DataStorage | null) => Promise<QueryBuilderFunctionResult<QueryBuilderFn>>, () => ForkedDataStorage | null];
20
+ }) => import("react/jsx-dev-runtime").JSX.Element, <Q extends IArcQueryBuilder>(queryBuilderFn: UnaryFunction<ReturnType<C["queryBuilder"]>, Q>, dependencies?: any[]) => [ReturnType<Q["toQuery"]>["lastResult"], boolean], () => ReturnType<C["commandsClient"]>, <QueryBuilderFn extends QueryFactoryFunction<C>>(queryBuilderFn: QueryBuilderFn, model?: ModelBase<C> | null) => Promise<QueryBuilderFunctionResult<QueryBuilderFn>>, () => ForkedModel<C> | null];
16
21
  //# sourceMappingURL=reactModel.d.ts.map
@@ -0,0 +1,4 @@
1
+ import type { SQLiteDatabase } from "@arcote.tech/arc";
2
+ import { type DBAdapterFactory } from "@arcote.tech/arc";
3
+ export declare const sqliteWasmAdapterFactory: (db: SQLiteDatabase) => DBAdapterFactory;
4
+ //# sourceMappingURL=sqliteWasmAdapter.d.ts.map
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "type": "module",
7
- "version": "0.0.33",
7
+ "version": "0.1.0",
8
8
  "private": false,
9
9
  "author": "Przemysław Krasiński [arcote.tech]",
10
10
  "description": "React client for the Arc framework, providing utilities for querying data and executing commands, enhancing the development of reactive and efficient user interfaces.",
@@ -1,2 +0,0 @@
1
- export declare function Test(): import("react/jsx-dev-runtime").JSX.Element;
2
- //# sourceMappingURL=test.d.ts.map
package/dist/idb.d.ts DELETED
@@ -1,3 +0,0 @@
1
- import { type DBAdapterFactory } from "@arcote.tech/arc";
2
- export declare const idbAdapterFactory: (name: string, version: number) => DBAdapterFactory;
3
- //# sourceMappingURL=idb.d.ts.map