@chelone/vue 0.6.0 → 0.9.0

package/dist/list/use-data-table-columns.js

@@ -1,69 +1,66 @@
-import { dataTableColumnKeys, moveColumn, toggleHiddenColumn } from "@chelone/core";
-import { computed, toValue, shallowRef, watch } from "vue";
 import { useCheloneContext } from "../context.js";
+import { computed, shallowRef, toValue, watch } from "vue";
+import { dataTableColumnKeys, moveColumn, moveColumnTo, toggleHiddenColumn } from "@chelone/core";
+// src/list/use-data-table-columns.ts
+/**
+* The column state a `<DataTable>` shares through the store with a control
+* outside it. Built on the context's optional store, not `useCheloneStore`:
+* with no store it returns the defaults and setters that do nothing.
+*
+* Both options may be refs or getters: a new `storeKey` re-reads and
+* resubscribes, a new `defaultHiddenColumns` applies until a choice is stored.
+*/
 function useDataTableColumns(options) {
-  const { store } = useCheloneContext();
-  const keys = computed(() => dataTableColumnKeys(toValue(options.storeKey)));
-  const defaults = computed(() => toValue(options.defaultHiddenColumns) ?? []);
-  const version = shallowRef(0);
-  if (store) {
-    watch(
-      keys,
-      ({ hidden: hidden2, order: order2, columns: columns2 }, _previous, onCleanup) => {
-        const bump = () => {
-          version.value++;
-        };
-        const unsubscribers = [hidden2, order2, columns2].map(
-          (key) => store.subscribe(key, bump)
-        );
-        onCleanup(() => {
-          for (const unsubscribe of unsubscribers) unsubscribe();
-        });
-      },
-      { immediate: true }
-    );
-  }
-  const hidden = computed(() => {
-    version.value;
-    return store?.getItem(keys.value.hidden) ?? defaults.value;
-  });
-  const order = computed(() => {
-    version.value;
-    return store?.getItem(keys.value.order) ?? [];
-  });
-  const columns = computed(() => {
-    version.value;
-    return store?.getItem(keys.value.columns) ?? [];
-  });
-  return {
-    columns,
-    hidden,
-    order,
-    toggle: (id) => {
-      store?.setItem(keys.value.hidden, toggleHiddenColumn(hidden.value, id));
-    },
-    move: (id, direction) => {
-      store?.setItem(
-        keys.value.order,
-        moveColumn(
-          order.value,
-          columns.value.map((column) => column.id),
-          id,
-          direction
-        )
-      );
-    },
-    reset: () => {
-      store?.removeItem(keys.value.hidden);
-      store?.removeItem(keys.value.order);
-    },
-    publish: (next) => {
-      if (!store) return;
-      const unchanged = JSON.stringify(next) === JSON.stringify(store.getItem(keys.value.columns));
-      if (!unchanged) store.setItem(keys.value.columns, next);
-    }
-  };
+	const { store } = useCheloneContext();
+	const keys = computed(() => dataTableColumnKeys(toValue(options.storeKey)));
+	const defaults = computed(() => toValue(options.defaultHiddenColumns) ?? []);
+	const version = shallowRef(0);
+	if (store) watch(keys, ({ hidden, order, columns }, _previous, onCleanup) => {
+		const bump = () => {
+			version.value++;
+		};
+		const unsubscribers = [
+			hidden,
+			order,
+			columns
+		].map((key) => store.subscribe(key, bump));
+		onCleanup(() => {
+			for (const unsubscribe of unsubscribers) unsubscribe();
+		});
+	}, { immediate: true });
+	const hidden = computed(() => {
+		version.value;
+		return store?.getItem(keys.value.hidden) ?? defaults.value;
+	});
+	const order = computed(() => {
+		version.value;
+		return store?.getItem(keys.value.order) ?? [];
+	});
+	const columns = computed(() => {
+		version.value;
+		return store?.getItem(keys.value.columns) ?? [];
+	});
+	return {
+		columns,
+		hidden,
+		order,
+		toggle: (id) => {
+			store?.setItem(keys.value.hidden, toggleHiddenColumn(hidden.value, id));
+		},
+		move: (id, direction) => {
+			store?.setItem(keys.value.order, moveColumn(order.value, columns.value.map((column) => column.id), id, direction));
+		},
+		moveTo: (id, index) => {
+			store?.setItem(keys.value.order, moveColumnTo(order.value, columns.value.map((column) => column.id), id, index));
+		},
+		reset: () => {
+			store?.removeItem(keys.value.hidden);
+			store?.removeItem(keys.value.order);
+		},
+		publish: (next) => {
+			if (!store) return;
+			if (!(JSON.stringify(next) === JSON.stringify(store.getItem(keys.value.columns)))) store.setItem(keys.value.columns, next);
+		}
+	};
 }
-export {
-  useDataTableColumns
-};
+export { useDataTableColumns };

package/dist/list/use-list.d.ts

@@ -38,7 +38,7 @@ export interface UseListOptions<TRecord extends ResourceRecord = ResourceRecord>
     /** Pass-through fetching flag for an async source feeding the list. */
     isFetching?: MaybeRefOrGetter<boolean>;
     /** Pass-through error for an async source feeding the list. */
-    error?: MaybeRefOrGetter<unknown>;
+    error?: MaybeRefOrGetter<Error | null>;
 }
 /**
  * Client-side list controller bound to Vue reactivity: returns the reactive

package/dist/list/use-list.js

@@ -1,48 +1,68 @@
-import { createClientListController, listControllerActions } from "@chelone/core";
-import { toValue, watch, reactive, computed } from "vue";
 import { useMicroStore } from "../store/use-micro-store.js";
+import { computed, reactive, toValue, watch } from "vue";
+import { createClientListController, listControllerActions } from "@chelone/core";
+// src/list/use-list.ts
+/**
+* `useList` — the client-side (in-memory) list composable, the Vue twin of
+* `@chelone/react`'s `useList` (`use-list.tsx`). It filters / sorts / paginates
+* / selects over an in-memory `data` array with NO dataProvider and NO fetching,
+* returning the SAME reactive shape a `<List>` publishes (`ListContextValue`) —
+* so it is a drop-in source for `provideListContext` around an array of embedded
+* records (`<ArrayField>`) or an async-resolved reference list
+* (`<ReferenceArrayField>` / `<ReferenceManyField>`).
+*
+* Idiom translation from the React twin: React binds the vanilla
+* `createClientListController` with `useSyncExternalStore` and reflects `data` /
+* `filter` / loading PROP changes back into the controller through effects
+* (keyed by content, guarded against the mount seed). Vue binds it through the
+* same {@link useMicroStore} seam and reflects reactive-source changes with `watch`
+* (skip-on-mount by default — construction already seeded the source). The data
+* watcher is registered BEFORE the loading watcher so that on the tick an async
+* source resolves (`data` populates AND `isPending` flips false together),
+* `setData` lands first and the `setLoadingState` recompute then publishes the
+* populated slice — exactly the React effect ordering.
+*/
+/**
+* Client-side list controller bound to Vue reactivity: returns the reactive
+* `ListContextValue` a `provideListContext` / `useListContext` consumer reads.
+* A reactive `data` / `isPending` / `isFetching` / `error` source is reflected
+* into the live controller so an async feed (a resolving `useGetMany` /
+* `useGetList`) populates the list in place.
+*/
 function useList(options = {}) {
-  const controller = createClientListController({
-    data: toValue(options.data),
-    filter: options.filter,
-    sort: options.sort,
-    perPage: options.perPage,
-    page: options.page,
-    isPending: toValue(options.isPending),
-    isFetching: toValue(options.isFetching),
-    error: toValue(options.error)
-  });
-  const state = useMicroStore(controller);
-  watch(
-    () => toValue(options.data),
-    (next) => controller.setData(next)
-  );
-  watch(
-    () => ({
-      isPending: toValue(options.isPending),
-      isFetching: toValue(options.isFetching),
-      error: toValue(options.error)
-    }),
-    (patch) => controller.setLoadingState(patch)
-  );
-  return reactive({
-    data: computed(() => state.value.data),
-    total: computed(() => state.value.total),
-    pageInfo: computed(() => state.value.pageInfo),
-    isPending: computed(() => state.value.isPending),
-    isFetching: computed(() => state.value.isFetching),
-    error: computed(() => state.value.error),
-    page: computed(() => state.value.page),
-    perPage: computed(() => state.value.perPage),
-    sort: computed(() => state.value.sort),
-    filter: computed(() => state.value.filter),
-    displayedFilters: computed(() => state.value.displayedFilters),
-    selectedIds: computed(() => state.value.selectedIds),
-    hasNextPage: computed(() => state.value.hasNextPage),
-    hasPreviousPage: computed(() => state.value.hasPreviousPage),
-    ...listControllerActions(controller)
-  });
+	const controller = createClientListController({
+		data: toValue(options.data),
+		filter: options.filter,
+		sort: options.sort,
+		perPage: options.perPage,
+		page: options.page,
+		isPending: toValue(options.isPending),
+		isFetching: toValue(options.isFetching),
+		error: toValue(options.error)
+	});
+	const state = useMicroStore(controller);
+	watch(() => toValue(options.data), (next) => controller.setData(next));
+	watch(() => ({
+		isPending: toValue(options.isPending),
+		isFetching: toValue(options.isFetching),
+		error: toValue(options.error)
+	}), (patch) => controller.setLoadingState(patch));
+	return reactive({
+		data: computed(() => state.value.data),
+		total: computed(() => state.value.total),
+		pageInfo: computed(() => state.value.pageInfo),
+		isPending: computed(() => state.value.isPending),
+		isFetching: computed(() => state.value.isFetching),
+		error: computed(() => state.value.error),
+		page: computed(() => state.value.page),
+		perPage: computed(() => state.value.perPage),
+		sort: computed(() => state.value.sort),
+		filter: computed(() => state.value.filter),
+		displayedFilters: computed(() => state.value.displayedFilters),
+		selectedIds: computed(() => state.value.selectedIds),
+		hasNextPage: computed(() => state.value.hasNextPage),
+		hasPreviousPage: computed(() => state.value.hasPreviousPage),
+		...listControllerActions(controller)
+	});
 }
-export {
-  useList
-};
+export { useList };

package/dist/maps-draw.js

@@ -1,28 +1,8 @@
 import { BBoxInput } from "./components/maps-draw/bbox-input.js";
-import { default as default2 } from "./components/maps-draw/draw-toolbar.vue.js";
+import draw_toolbar_default from "./components/maps-draw/draw-toolbar.js";
 import { cutFeatures, simplifyGeo } from "./components/maps-draw/geometry-ops.js";
-import { default as default3 } from "./components/maps-draw/shape-input.vue.js";
+import shape_input_default from "./components/maps-draw/shape-input.js";
 import { FeatureCollectionInput, FeatureInput, GeoJsonInput, GeometryCollectionInput, LineStringInput, MultiLineStringInput, MultiPointInput, MultiPolygonInput, PointInput, PolygonInput, toolsForShapes } from "./components/maps-draw/shape-inputs.js";
-import { default as default4 } from "./components/maps-draw/simplify-input.vue.js";
+import simplify_input_default from "./components/maps-draw/simplify-input.js";
 import { toolMode, useTerraDraw } from "./components/maps-draw/use-terra-draw.js";
-export {
-  BBoxInput,
-  default2 as DrawToolbar,
-  FeatureCollectionInput,
-  FeatureInput,
-  GeoJsonInput,
-  GeometryCollectionInput,
-  LineStringInput,
-  MultiLineStringInput,
-  MultiPointInput,
-  MultiPolygonInput,
-  PointInput,
-  PolygonInput,
-  default3 as ShapeInput,
-  default4 as SimplifyInput,
-  cutFeatures,
-  simplifyGeo,
-  toolMode,
-  toolsForShapes,
-  useTerraDraw
-};
+export { BBoxInput, draw_toolbar_default as DrawToolbar, FeatureCollectionInput, FeatureInput, GeoJsonInput, GeometryCollectionInput, LineStringInput, MultiLineStringInput, MultiPointInput, MultiPolygonInput, PointInput, PolygonInput, shape_input_default as ShapeInput, simplify_input_default as SimplifyInput, cutFeatures, simplifyGeo, toolMode, toolsForShapes, useTerraDraw };

package/dist/maps-osm.js

@@ -1,25 +1,11 @@
-import { default as default2 } from "./components/maps-osm/geocoding-input.vue.js";
-import { default as default3 } from "./components/maps-osm/map-with-search.vue.js";
-import { default as default4 } from "./components/maps-osm/osm-feature-operator.vue.js";
+import geocoding_input_default from "./components/maps-osm/geocoding-input.js";
+import map_with_search_default from "./components/maps-osm/map-with-search.js";
+import osm_feature_operator_default from "./components/maps-osm/osm-feature-operator.js";
 import { OsmFeatureAdd, OsmFeatureSubtract } from "./components/maps-osm/osm-feature-operators.js";
 import { fetchOsmFeatures, osmToPolygons } from "./components/maps-osm/osm-features.js";
 import { subtractMask, unionAll } from "./components/maps-osm/osm-geometry-ops.js";
-import { default as default5 } from "./components/maps-osm/reverse-geocode-field.vue.js";
+import reverse_geocode_field_default from "./components/maps-osm/reverse-geocode-field.js";
 import { useGeocode } from "./components/maps-osm/use-geocode.js";
 import { useOsmFeatures } from "./components/maps-osm/use-osm-features.js";
 import { useReverseGeocode } from "./components/maps-osm/use-reverse-geocode.js";
-export {
-  default2 as GeocodingInput,
-  default3 as MapWithSearch,
-  OsmFeatureAdd,
-  default4 as OsmFeatureOperator,
-  OsmFeatureSubtract,
-  default5 as ReverseGeocodeField,
-  fetchOsmFeatures,
-  osmToPolygons,
-  subtractMask,
-  unionAll,
-  useGeocode,
-  useOsmFeatures,
-  useReverseGeocode
-};
+export { geocoding_input_default as GeocodingInput, map_with_search_default as MapWithSearch, OsmFeatureAdd, osm_feature_operator_default as OsmFeatureOperator, OsmFeatureSubtract, reverse_geocode_field_default as ReverseGeocodeField, fetchOsmFeatures, osmToPolygons, subtractMask, unionAll, useGeocode, useOsmFeatures, useReverseGeocode };

package/dist/maps.js

@@ -1,34 +1,11 @@
-import { default as default2 } from "./components/maps/bbox-field.vue.js";
-import { default as default3 } from "./components/maps/geo-json-field.vue.js";
-import { default as default4 } from "./components/maps/geo-json-layers.vue.js";
-import { default as default5 } from "./components/maps/geo-json-view.vue.js";
-import { default as default6 } from "./components/maps/lat-lng-field.vue.js";
-import { default as default7 } from "./components/maps/lat-lng-input.vue.js";
-import { default as default8 } from "./components/maps/map-canvas.vue.js";
+import bbox_field_default from "./components/maps/bbox-field.js";
+import geo_json_field_default from "./components/maps/geo-json-field.js";
+import geo_json_layers_default from "./components/maps/geo-json-layers.js";
+import geo_json_view_default from "./components/maps/geo-json-view.js";
+import lat_lng_field_default from "./components/maps/lat-lng-field.js";
+import lat_lng_input_default from "./components/maps/lat-lng-input.js";
+import map_canvas_default from "./components/maps/map-canvas.js";
 import { FeatureCollectionField, FeatureField, GeometryCollectionField, LineStringField, MultiLineStringField, MultiPointField, MultiPolygonField, PointField, PolygonField } from "./components/maps/shape-fields.js";
 import { useGeoJsonSource } from "./components/maps/use-geo-json-source.js";
 import { MapMarker, MapsProvider, useMap, useMapMarker, useMapsConfig } from "./components/maps/use-map.js";
-export {
-  default2 as BBoxField,
-  FeatureCollectionField,
-  FeatureField,
-  default3 as GeoJsonField,
-  default4 as GeoJsonLayers,
-  default5 as GeoJsonView,
-  GeometryCollectionField,
-  default6 as LatLngField,
-  default7 as LatLngInput,
-  LineStringField,
-  default8 as MapCanvas,
-  MapMarker,
-  MapsProvider,
-  MultiLineStringField,
-  MultiPointField,
-  MultiPolygonField,
-  PointField,
-  PolygonField,
-  useGeoJsonSource,
-  useMap,
-  useMapMarker,
-  useMapsConfig
-};
+export { bbox_field_default as BBoxField, FeatureCollectionField, FeatureField, geo_json_field_default as GeoJsonField, geo_json_layers_default as GeoJsonLayers, geo_json_view_default as GeoJsonView, GeometryCollectionField, lat_lng_field_default as LatLngField, lat_lng_input_default as LatLngInput, LineStringField, map_canvas_default as MapCanvas, MapMarker, MapsProvider, MultiLineStringField, MultiPointField, MultiPolygonField, PointField, PolygonField, useGeoJsonSource, useMap, useMapMarker, useMapsConfig };

package/dist/mdx-editor.js

@@ -1,6 +1,3 @@
-import { default as default2 } from "./components/mdx-editor/mdx-field.vue.js";
-import { default as default3 } from "./components/mdx-editor/mdx-input.vue.js";
-export {
-  default2 as MdxField,
-  default3 as MdxInput
-};
+import mdx_field_default from "./components/mdx-editor/mdx-field.js";
+import mdx_input_default from "./components/mdx-editor/mdx-input.js";
+export { mdx_field_default as MdxField, mdx_input_default as MdxInput };

package/dist/monaco.js

@@ -1,6 +1,3 @@
-import { default as default2 } from "./components/monaco/monaco-json-field.vue.js";
-import { default as default3 } from "./components/monaco/monaco-json-input.vue.js";
-export {
-  default2 as MonacoJsonField,
-  default3 as MonacoJsonInput
-};
+import monaco_json_field_default from "./components/monaco/monaco-json-field.js";
+import monaco_json_input_default from "./components/monaco/monaco-json-input.js";
+export { monaco_json_field_default as MonacoJsonField, monaco_json_input_default as MonacoJsonInput };

package/dist/notification-hooks.js

@@ -1,27 +1,24 @@
-import { computed, shallowRef, onScopeDispose } from "vue";
 import { useCheloneNotifications } from "./context.js";
+import { computed, onScopeDispose, shallowRef } from "vue";
+// src/notification-hooks.ts
+/**
+* Reactive snapshot of the pending notification queue (i18n keys — translate in
+* the UI). Degrades to a stable empty list when no store was provided.
+*/
 function useNotifications() {
-  const store = useCheloneNotifications();
-  if (!store) {
-    return computed(() => []);
-  }
-  const snapshot = shallowRef(store.getSnapshot());
-  const unsubscribe = store.subscribe(() => {
-    snapshot.value = store.getSnapshot();
-  });
-  onScopeDispose(unsubscribe);
-  return computed(() => snapshot.value);
+	const store = useCheloneNotifications();
+	if (!store) return computed(() => []);
+	const snapshot = shallowRef(store.getSnapshot());
+	const unsubscribe = store.subscribe(() => {
+		snapshot.value = store.getSnapshot();
+	});
+	onScopeDispose(unsubscribe);
+	return computed(() => snapshot.value);
 }
+/** Stable `notify` action off the shared store — throws when none was provided. */
 function useNotify() {
-  const store = useCheloneNotifications();
-  if (!store) {
-    throw new Error(
-      "useNotify: pass a notification store to <Admin notifications={createNotificationStore()}>."
-    );
-  }
-  return store.notify;
+	const store = useCheloneNotifications();
+	if (!store) throw new Error("useNotify: pass a notification store to <Admin notifications={createNotificationStore()}>.");
+	return store.notify;
 }
-export {
-  useNotifications,
-  useNotify
-};
+export { useNotifications, useNotify };

package/dist/realtime/live.js

@@ -1,44 +1,47 @@
-import { subscribeLiveResource, subscribeLiveRecords, subscribeLiveRecord } from "@chelone/core";
-import { watchEffect, toValue, computed } from "vue";
 import { useCheloneContext } from "../context.js";
 import { useGetList, useGetMany, useGetOne } from "../data/queries.js";
-const isEnabled = (enabled) => enabled === void 0 || toValue(enabled);
+import { computed, toValue, watchEffect } from "vue";
+import { subscribeLiveRecord, subscribeLiveRecords, subscribeLiveResource } from "@chelone/core";
+// src/realtime/live.ts
+var isEnabled = (enabled) => enabled === void 0 || toValue(enabled);
+/** `useGetList`, kept fresh: refetches when the resource changes or the connection comes back. */
 function useGetListLive(resource, params = {}, options = {}) {
-  const ctx = useCheloneContext();
-  const query = useGetList(resource, params, options);
-  watchEffect((onCleanup) => {
-    if (!isEnabled(options.enabled)) return;
-    onCleanup(subscribeLiveResource(ctx, toValue(resource)).stop);
-  });
-  return query;
+	const ctx = useCheloneContext();
+	const query = useGetList(resource, params, options);
+	watchEffect((onCleanup) => {
+		if (!isEnabled(options.enabled)) return;
+		onCleanup(subscribeLiveResource(ctx, toValue(resource)).stop);
+	});
+	return query;
 }
+/** `useGetOne`, kept fresh: refetches when the record changes or the connection comes back. */
 function useGetOneLive(resource, params, options = {}) {
-  const ctx = useCheloneContext();
-  const query = useGetOne(resource, params, options);
-  watchEffect((onCleanup) => {
-    if (!isEnabled(options.enabled)) return;
-    onCleanup(subscribeLiveRecord(ctx, resource, toValue(params).id).stop);
-  });
-  return query;
+	const ctx = useCheloneContext();
+	const query = useGetOne(resource, params, options);
+	watchEffect((onCleanup) => {
+		if (!isEnabled(options.enabled)) return;
+		onCleanup(subscribeLiveRecord(ctx, resource, toValue(params).id).stop);
+	});
+	return query;
 }
+/** `useGetMany`, kept fresh: refetches when any listed record changes or the connection comes back. */
 function useGetManyLive(resource, params, options = {}) {
-  const ctx = useCheloneContext();
-  const query = useGetMany(resource, params, options);
-  let previous;
-  const ids = computed(() => {
-    const next = toValue(params).ids;
-    const key = JSON.stringify(next.map(String).sort());
-    if (previous?.key !== key) previous = { key, ids: next };
-    return previous.ids;
-  });
-  watchEffect((onCleanup) => {
-    if (!isEnabled(options.enabled)) return;
-    onCleanup(subscribeLiveRecords(ctx, resource, ids.value).stop);
-  });
-  return query;
+	const ctx = useCheloneContext();
+	const query = useGetMany(resource, params, options);
+	let previous;
+	const ids = computed(() => {
+		const next = toValue(params).ids;
+		const key = JSON.stringify(next.map(String).sort());
+		if (previous?.key !== key) previous = {
+			key,
+			ids: next
+		};
+		return previous.ids;
+	});
+	watchEffect((onCleanup) => {
+		if (!isEnabled(options.enabled)) return;
+		onCleanup(subscribeLiveRecords(ctx, resource, ids.value).stop);
+	});
+	return query;
 }
-export {
-  useGetListLive,
-  useGetManyLive,
-  useGetOneLive
-};
+export { useGetListLive, useGetManyLive, useGetOneLive };