@chelone/vue 0.0.0-stage → 0.1.0

package/dist/router/vue-router-adapter.js

@@ -0,0 +1,143 @@
+import { matchPath, parseLocation } from "@chelone/core";
+import { provide, ref, shallowRef, toValue, onScopeDispose, shallowReadonly, computed } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import { RouterAdapterKey } from "./adapter.js";
+function readHistoryState() {
+  return typeof window !== "undefined" ? window.history.state : null;
+}
+function toCorePattern(pattern) {
+  if (typeof pattern === "string") return pattern;
+  if (pattern.end !== false) return pattern.path;
+  return `${pattern.path.replace(/\/+$/, "")}/*`;
+}
+function toNeutralParams(params) {
+  const out = {};
+  for (const key of Object.keys(params)) {
+    const value = params[key];
+    out[key] = Array.isArray(value) ? value.join("/") : value;
+  }
+  if ("pathMatch" in out) out["*"] = out.pathMatch;
+  return out;
+}
+const navigations = /* @__PURE__ */ new WeakMap();
+function isSuperseded(router, to) {
+  let tracker = navigations.get(router);
+  if (!tracker) {
+    tracker = { seen: /* @__PURE__ */ new WeakSet(), latest: null };
+    navigations.set(router, tracker);
+  }
+  if (tracker.seen.has(to)) return tracker.latest !== to;
+  tracker.seen.add(to);
+  tracker.latest = to;
+  return false;
+}
+const vueRouterAdapter = {
+  useLocation() {
+    const route = useRoute();
+    return computed(() => parseLocation(route.fullPath, readHistoryState()));
+  },
+  useNavigate() {
+    const router = useRouter();
+    return ((to, opts) => {
+      if (typeof to === "number") {
+        router.go(to);
+        return;
+      }
+      const state = opts?.state;
+      const resolved = router.resolve(to);
+      const location = {
+        path: resolved.path,
+        query: resolved.query,
+        hash: resolved.hash,
+        state
+      };
+      if (opts?.replace) {
+        void router.replace(location);
+        return;
+      }
+      void router.push(location);
+    });
+  },
+  useParams() {
+    const route = useRoute();
+    return computed(() => toNeutralParams(route.params));
+  },
+  useMatch(pattern) {
+    const route = useRoute();
+    const corePattern = toCorePattern(pattern);
+    return computed(() => matchPath(corePattern, route.path));
+  },
+  matchPath,
+  useBlocker(shouldBlock) {
+    const router = useRouter();
+    const state = ref("unblocked");
+    const location = shallowRef(null);
+    let settle = null;
+    const release = (proceed) => {
+      settle?.(proceed);
+      settle = null;
+    };
+    const stopGuard = router.beforeEach((to, from) => {
+      if (isSuperseded(router, to)) return true;
+      release(true);
+      const nextLocation = parseLocation(to.fullPath);
+      const blocks = typeof shouldBlock === "function" ? shouldBlock({
+        currentLocation: parseLocation(from.fullPath),
+        nextLocation
+      }) : toValue(shouldBlock);
+      if (!blocks) {
+        state.value = "unblocked";
+        location.value = null;
+        return true;
+      }
+      location.value = nextLocation;
+      state.value = "blocked";
+      return new Promise((resolve) => {
+        settle = resolve;
+      });
+    });
+    const stopAfter = router.afterEach(() => {
+      if (state.value !== "proceeding") return;
+      state.value = "unblocked";
+      location.value = null;
+    });
+    const stopError = router.onError(() => {
+      if (state.value !== "proceeding") return;
+      state.value = "unblocked";
+      location.value = null;
+    });
+    onScopeDispose(() => {
+      release(false);
+      state.value = "unblocked";
+      location.value = null;
+      stopGuard();
+      stopAfter();
+      stopError();
+    });
+    return {
+      state: shallowReadonly(state),
+      location: shallowReadonly(location),
+      proceed() {
+        if (state.value !== "blocked") return;
+        state.value = "proceeding";
+        release(true);
+      },
+      reset() {
+        if (state.value !== "blocked") return;
+        state.value = "unblocked";
+        location.value = null;
+        release(false);
+      }
+    };
+  },
+  useCanBlock() {
+    return true;
+  }
+};
+function provideVueRouterAdapter() {
+  provide(RouterAdapterKey, vueRouterAdapter);
+}
+export {
+  provideVueRouterAdapter,
+  vueRouterAdapter
+};

package/dist/store/use-micro-store.d.ts

@@ -0,0 +1,42 @@
+import type { MicroStore } from "@chelone/core";
+import { type ComputedRef, type Ref } from "vue";
+/**
+ * Vue reactivity bridge for Chelone's `MicroStore<T>` — the single subscribe
+ * seam that lets a Vue adapter drive the *unchanged* core controllers. This is
+ * the Vue analog of React's `useSyncExternalStore(subscribe, getSnapshot)`.
+ *
+ * The 4R (acquire/release) lifecycle maps 1:1 onto Vue's effect scope:
+ * - **acquire** — the first `store.subscribe()` flips the store's subscriber
+ *   count 0->1, firing its `onSubscribed` (the controller attaches its
+ *   QueryObserver / KV subscriptions). Because the bridge subscribes during
+ *   `setup`, mounting a component that reads a controller acquires its
+ *   resources exactly as React's commit-phase subscribe does.
+ * - **release** — `onScopeDispose(unsubscribe)` runs when the owning effect
+ *   scope tears down (component unmount, or `effectScope().stop()` in tests).
+ *   The unsubscribe flips the count back to 0, firing the `onSubscribed`
+ *   teardown (detach). Vue's scope disposal replaces React's
+ *   `useSyncExternalStore` teardown; there is no separate `destroy()` on the
+ *   render path (mirrors the React twin's deliberate no-destroy-effect rule).
+ *
+ * The snapshot is held in a `shallowRef` — the whole object swaps on each
+ * mutation (core guarantees snapshot stability: same reference until
+ * `setState`), so a shallow ref is the right granularity and avoids deep-
+ * proxying controller state. The returned `computed` view is genuinely
+ * read-only (no cast) and does not re-proxy the snapshot.
+ */
+export declare function useMicroStore<T>(store: MicroStore<T>): Readonly<Ref<T>>;
+/**
+ * Selector variant of {@link useMicroStore}: subscribe to `store`, project each
+ * snapshot through `selector`, and only re-emit when the *selected slice*
+ * changes under shallow equality. This is the Vue analog of React's
+ * `useSyncExternalStoreWithSelector` — it lets a component depend on one field
+ * (or a small derived object) and skip re-renders when unrelated slices mutate.
+ *
+ * A plain `computed(() => selector(state.value))` cannot do this: a selector
+ * returning a fresh object each call is `!==` its predecessor, so Vue would
+ * propagate on every store mutation. The shallow-equal guard below holds the
+ * previous slice and only reassigns the backing ref when the projection
+ * actually differs — so downstream watchers/renders fire solely on slice change.
+ * The 4R acquire/release maps to scope disposal exactly as in {@link useMicroStore}.
+ */
+export declare function useMicroStoreSelector<T, S>(store: MicroStore<T>, selector: (state: T) => S): ComputedRef<S>;

package/dist/store/use-micro-store.js

@@ -0,0 +1,41 @@
+import { shallowRef, onScopeDispose, computed } from "vue";
+function useMicroStore(store) {
+  const state = shallowRef(store.getSnapshot());
+  const unsubscribe = store.subscribe(() => {
+    state.value = store.getSnapshot();
+  });
+  onScopeDispose(unsubscribe);
+  return computed(() => state.value);
+}
+function shallowEqual(a, b) {
+  if (Object.is(a, b)) return true;
+  if (typeof a !== "object" || a === null || typeof b !== "object" || b === null) {
+    return false;
+  }
+  const aRecord = a;
+  const bRecord = b;
+  const aKeys = Object.keys(aRecord);
+  const bKeys = Object.keys(bRecord);
+  if (aKeys.length !== bKeys.length) return false;
+  for (const key of aKeys) {
+    if (!Object.hasOwn(bRecord, key) || !Object.is(aRecord[key], bRecord[key])) {
+      return false;
+    }
+  }
+  return true;
+}
+function useMicroStoreSelector(store, selector) {
+  const selected = shallowRef(selector(store.getSnapshot()));
+  const unsubscribe = store.subscribe(() => {
+    const next = selector(store.getSnapshot());
+    if (!shallowEqual(selected.value, next)) {
+      selected.value = next;
+    }
+  });
+  onScopeDispose(unsubscribe);
+  return computed(() => selected.value);
+}
+export {
+  useMicroStore,
+  useMicroStoreSelector
+};

package/dist/store/use-saved-queries.d.ts

@@ -0,0 +1,20 @@
+import { type SavedQueriesControllerOptions, type SavedQuery, type SavedQueryValue } from "@chelone/core";
+import { type Ref } from "vue";
+export interface UseSavedQueriesReturn {
+    queries: Readonly<Ref<readonly SavedQuery[]>>;
+    /** Trims the label and ignores a blank one; a same-label query is replaced. */
+    save(label: string, value: SavedQueryValue): void;
+    /** Trims the label; a label no query has is ignored. */
+    remove(label: string): void;
+}
+/**
+ * The named list queries of `resource`, persisted in the KV store. Several
+ * instances over one store key stay in step. Without a store the queries live
+ * in this instance only. The resource and options are read
+ * once, in `setup`.
+ *
+ * Divergence from ra-core's `useSavedQueries`, which returns a
+ * `[queries, setQueries]` tuple: this returns `{ queries, save, remove }`, with
+ * `queries` a ref.
+ */
+export declare function useSavedQueries(resource: string, options?: SavedQueriesControllerOptions): UseSavedQueriesReturn;

package/dist/store/use-saved-queries.js

@@ -0,0 +1,20 @@
+import { createSavedQueriesController } from "@chelone/core";
+import { computed } from "vue";
+import { useCheloneContext } from "../context.js";
+import { useMicroStore } from "./use-micro-store.js";
+function useSavedQueries(resource, options = {}) {
+  const controller = createSavedQueriesController(
+    { store: useCheloneContext().store },
+    resource,
+    options
+  );
+  const state = useMicroStore(controller);
+  return {
+    queries: computed(() => state.value.queries),
+    save: controller.save,
+    remove: controller.remove
+  };
+}
+export {
+  useSavedQueries
+};

package/dist/store/use-store-item.d.ts

@@ -0,0 +1,12 @@
+import { type Ref } from "vue";
+/**
+ * One key of the KV store as a ref and a setter, the Vue twin of React's
+ * `useStoreItem`. It subscribes to its own key only, so writes to other keys
+ * do not touch the ref.
+ *
+ * Divergence from the React twin: the value is a `Ref`. The key and default
+ * are read once, in `setup`.
+ */
+export declare function useStoreItem<T>(key: string, defaultValue?: T): [Readonly<Ref<T | undefined>>, (value: T) => void];
+/** ra-parity alias of {@link useStoreItem}: the same function, not a wrapper. */
+export declare const useStore: typeof useStoreItem;

package/dist/store/use-store-item.js

@@ -0,0 +1,18 @@
+import { shallowRef, onScopeDispose } from "vue";
+import { useCheloneStore } from "../context.js";
+function useStoreItem(key, defaultValue) {
+  const store = useCheloneStore();
+  const read = () => store.getItem(key) ?? defaultValue;
+  const value = shallowRef(read());
+  onScopeDispose(
+    store.subscribe(key, () => {
+      value.value = read();
+    })
+  );
+  return [value, (next) => store.setItem(key, next)];
+}
+const useStore = useStoreItem;
+export {
+  useStore,
+  useStoreItem
+};

package/dist/supabase.d.ts

@@ -0,0 +1,8 @@
+export { default as ForgotPasswordForm, type ForgotPasswordFormProps, } from "./components/admin/supabase/forgot-password-form.vue.js";
+export { default as ForgotPasswordPage, type ForgotPasswordPageProps, } from "./components/admin/supabase/forgot-password-page.vue.js";
+export { AppleButton, AzureButton, BitbucketButton, DiscordButton, FacebookButton, GithubButton, GitlabButton, GoogleButton, KeycloakButton, LinkedinButton, NotionButton, type ProviderButtonProps, SlackButton, SpotifyButton, TwitchButton, TwitterButton, WorkosButton, } from "./components/admin/supabase/provider-buttons.js";
+export { default as SetPasswordForm, type SetPasswordFormProps, } from "./components/admin/supabase/set-password-form.vue.js";
+export { default as SetPasswordPage, type SetPasswordPageProps, } from "./components/admin/supabase/set-password-page.vue.js";
+export { default as SocialAuthButton, type SocialAuthButtonProps, type SupabaseOAuthProvider, } from "./components/admin/supabase/social-auth-button.vue.js";
+export { default as SupabaseLoginPage, type SupabaseLoginPageProps, } from "./components/admin/supabase/supabase-login-page.vue.js";
+export { type UseResetPasswordOptions, type UseSetPasswordOptions, useResetPassword, useSetPassword, useSupabaseUrlTokens, } from "./components/admin/supabase/use-password-recovery.js";

package/dist/supabase.js

@@ -0,0 +1,35 @@
+import { default as default2 } from "./components/admin/supabase/forgot-password-form.vue.js";
+import { default as default3 } from "./components/admin/supabase/forgot-password-page.vue.js";
+import { AppleButton, AzureButton, BitbucketButton, DiscordButton, FacebookButton, GithubButton, GitlabButton, GoogleButton, KeycloakButton, LinkedinButton, NotionButton, SlackButton, SpotifyButton, TwitchButton, TwitterButton, WorkosButton } from "./components/admin/supabase/provider-buttons.js";
+import { default as default4 } from "./components/admin/supabase/set-password-form.vue.js";
+import { default as default5 } from "./components/admin/supabase/set-password-page.vue.js";
+import { default as default6 } from "./components/admin/supabase/social-auth-button.vue.js";
+import { default as default7 } from "./components/admin/supabase/supabase-login-page.vue.js";
+import { useResetPassword, useSetPassword, useSupabaseUrlTokens } from "./components/admin/supabase/use-password-recovery.js";
+export {
+  AppleButton,
+  AzureButton,
+  BitbucketButton,
+  DiscordButton,
+  FacebookButton,
+  default2 as ForgotPasswordForm,
+  default3 as ForgotPasswordPage,
+  GithubButton,
+  GitlabButton,
+  GoogleButton,
+  KeycloakButton,
+  LinkedinButton,
+  NotionButton,
+  default4 as SetPasswordForm,
+  default5 as SetPasswordPage,
+  SlackButton,
+  default6 as SocialAuthButton,
+  SpotifyButton,
+  default7 as SupabaseLoginPage,
+  TwitchButton,
+  TwitterButton,
+  WorkosButton,
+  useResetPassword,
+  useSetPassword,
+  useSupabaseUrlTokens
+};

package/package.json

@@ -1,6 +1,164 @@
 {
   "name": "@chelone/vue",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.1.0",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/chelonejs/chelone.git",
+    "directory": "packages/vue"
+  },
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist",
+    "!dist/r"
+  ],
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json",
+    "./monaco": {
+      "types": "./dist/monaco.d.ts",
+      "default": "./dist/monaco.js"
+    },
+    "./supabase": {
+      "types": "./dist/supabase.d.ts",
+      "default": "./dist/supabase.js"
+    },
+    "./csv-import": {
+      "types": "./dist/csv-import.d.ts",
+      "default": "./dist/csv-import.js"
+    },
+    "./maps": {
+      "types": "./dist/maps.d.ts",
+      "default": "./dist/maps.js"
+    },
+    "./maps/draw": {
+      "types": "./dist/maps-draw.d.ts",
+      "default": "./dist/maps-draw.js"
+    },
+    "./maps/osm": {
+      "types": "./dist/maps-osm.d.ts",
+      "default": "./dist/maps-osm.js"
+    },
+    "./mdx-editor": {
+      "types": "./dist/mdx-editor.d.ts",
+      "default": "./dist/mdx-editor.js"
+    },
+    "./mdx-editor.css": "./dist/components/mdx-editor/mdx-editor-theme.css"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "cronstrue": "^3.24.0",
+    "libphonenumber-js": "^1.13.8",
+    "@chelone/core": "0.1.0"
+  },
+  "peerDependencies": {
+    "@guolao/vue-monaco-editor": "^1.6.0",
+    "@milkdown/crepe": "^7.23.0",
+    "@milkdown/kit": "^7.23.0",
+    "@tanstack/vue-query": "^5.0.0",
+    "@turf/buffer": "^7.4.0",
+    "@turf/difference": "^7.4.0",
+    "@turf/simplify": "^7.4.0",
+    "@turf/union": "^7.4.0",
+    "maplibre-gl": "^6",
+    "monaco-editor": "^0.57.0",
+    "osm2geojson-lite": "^2.0.1",
+    "papaparse": "^5.4.0",
+    "terra-draw": "^1.39.0",
+    "terra-draw-maplibre-gl-adapter": "^1.5.0",
+    "vue": "^3.4.0",
+    "vue-router": "^4.0.0",
+    "@chelone/supabase": "0.1.0"
+  },
+  "peerDependenciesMeta": {
+    "@chelone/supabase": {
+      "optional": true
+    },
+    "@guolao/vue-monaco-editor": {
+      "optional": true
+    },
+    "@milkdown/crepe": {
+      "optional": true
+    },
+    "@milkdown/kit": {
+      "optional": true
+    },
+    "@turf/buffer": {
+      "optional": true
+    },
+    "@turf/difference": {
+      "optional": true
+    },
+    "@turf/simplify": {
+      "optional": true
+    },
+    "@turf/union": {
+      "optional": true
+    },
+    "maplibre-gl": {
+      "optional": true
+    },
+    "monaco-editor": {
+      "optional": true
+    },
+    "osm2geojson-lite": {
+      "optional": true
+    },
+    "papaparse": {
+      "optional": true
+    },
+    "terra-draw": {
+      "optional": true
+    },
+    "terra-draw-maplibre-gl-adapter": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "@arethetypeswrong/cli": "^0.18.0",
+    "@guolao/vue-monaco-editor": "^1.6.0",
+    "@milkdown/crepe": "^7.23.0",
+    "@milkdown/kit": "^7.23.0",
+    "@tanstack/vue-query": "^5.0.0",
+    "@turf/buffer": "^7.4.0",
+    "@turf/difference": "^7.4.0",
+    "@turf/simplify": "^7.4.0",
+    "@turf/union": "^7.4.0",
+    "@types/papaparse": "^5.5.2",
+    "@vitejs/plugin-vue": "^6.0.0",
+    "@vue/test-utils": "^2.4.0",
+    "jsdom": "^26.0.0",
+    "maplibre-gl": "^6",
+    "monaco-editor": "^0.57.0",
+    "osm2geojson-lite": "^2.0.1",
+    "papaparse": "^5.7.0",
+    "publint": "^0.3.0",
+    "shadcn-vue": "2.9.0",
+    "terra-draw": "^1.39.0",
+    "terra-draw-maplibre-gl-adapter": "^1.5.0",
+    "vite": "^7.0.0",
+    "vitest": "^3.0.0",
+    "vue": "^3.4.0",
+    "vue-router": "^4.0.0",
+    "vue-tsc": "^2.0.0",
+    "zod": "^3.24.0",
+    "@chelone/supabase": "0.1.0"
+  },
+  "scripts": {
+    "build": "vite build && vue-tsc -p tsconfig.build.json && node ../../scripts/strip-dts-css-imports.mjs dist && node ../../scripts/dts-extensions.mjs dist",
+    "check:pack": "publint --pack pnpm --strict && d=$(mktemp -d) && trap 'rm -rf $d' EXIT && pnpm pack --pack-destination $d && attw $d/*.tgz --profile esm-only --exclude-entrypoints ./mdx-editor.css",
+    "test": "vitest run --typecheck",
+    "typecheck": "vue-tsc --noEmit",
+    "registry:generate": "node ../../scripts/registry/generate-registry.mjs",
+    "registry:build": "node ../../scripts/registry/build-registry.mjs",
+    "registry:test-local": "node scripts/test-registry-local.mjs"
+  }
 }