@sanity/vision - npm Package Compare versions

Comparing version 3.37.3-canary.53 to 3.37.3-canary.62

lib/_chunks-cjs/index.js

@@ -22,3 +22,4 @@ "use strict";
         options: config,
-        router: router.route.create("/*")
+        // eslint-disable-next-line camelcase
+        router: router.route.create("/*", { __unsafe_disableScopedSearchParams: !0 })
       }
@@ -25,0 +26,0 @@ ],

lib/_chunks-cjs/SanityVision.js

 "use strict";
-var jsxRuntime = require("react/jsx-runtime"), sanity = require("sanity"), ui = require("@sanity/ui"), react = require("react"), SplitPane = require("@rexxars/react-split-pane"), icons = require("@sanity/icons"), isHotkeyEsm = require("is-hotkey-esm"), CodeMirror = require("@uiw/react-codemirror"), autocomplete = require("@codemirror/autocomplete"), commands = require("@codemirror/commands"), langJavascript = require("@codemirror/lang-javascript"), language = require("@codemirror/language"), search = require("@codemirror/search"), view = require("@codemirror/view"), highlight = require("@lezer/highlight"), color = require("@sanity/color"), styledComponents = require("styled-components"), resizeObserver = require("@juggle/resize-observer"), JSON5 = require("json5"), debounce = require("lodash/debounce.js"), index = require("./index.js"), JSONInspector = require("@rexxars/react-json-inspector"), HLRU = require("hashlru");
+var jsxRuntime = require("react/jsx-runtime"), sanity = require("sanity"), ui = require("@sanity/ui"), react = require("react"), router = require("sanity/router"), SplitPane = require("@rexxars/react-split-pane"), icons = require("@sanity/icons"), isHotkeyEsm = require("is-hotkey-esm"), CodeMirror = require("@uiw/react-codemirror"), autocomplete = require("@codemirror/autocomplete"), commands = require("@codemirror/commands"), langJavascript = require("@codemirror/lang-javascript"), language = require("@codemirror/language"), search = require("@codemirror/search"), view = require("@codemirror/view"), highlight = require("@lezer/highlight"), color = require("@sanity/color"), styledComponents = require("styled-components"), resizeObserver = require("@juggle/resize-observer"), JSON5 = require("json5"), debounce = require("lodash/debounce.js"), index = require("./index.js"), JSONInspector = require("@rexxars/react-json-inspector"), HLRU = require("hashlru");
 function _interopDefaultCompat(e) {
@@ -150,51 +150,2 @@ return e && typeof e == "object" && "default" in e ? e : { default: e };
 }
-function isPlainObject(obj) {
-  return !!obj && typeof obj == "object" && Object.prototype.toString.call(obj) === "[object Object]";
-}
-const hasLocalStorage = supportsLocalStorage(), keyPrefix = "sanityVision:";
-function clearLocalStorage() {
-  if (hasLocalStorage)
-    for (let i = 0; i < localStorage.length; i++) {
-      const key = localStorage.key(i);
-      key != null && key.startsWith(keyPrefix) && localStorage.removeItem(key);
-    }
-}
-function getLocalStorage(namespace) {
-  const storageKey = `${keyPrefix}${namespace}`;
-  let loadedState = null;
-  return { get, set, merge };
-  function get(key, defaultVal) {
-    const state = ensureState();
-    return typeof state[key] > "u" ? defaultVal : state[key];
-  }
-  function set(key, value) {
-    const state = ensureState();
-    return state[key] = value, localStorage.setItem(storageKey, JSON.stringify(loadedState)), value;
-  }
-  function merge(props) {
-    const state = { ...ensureState(), ...props };
-    return localStorage.setItem(storageKey, JSON.stringify(state)), state;
-  }
-  function ensureState() {
-    return loadedState === null && (loadedState = loadState()), loadedState;
-  }
-  function loadState() {
-    if (!hasLocalStorage)
-      return {};
-    try {
-      const stored = JSON.parse(localStorage.getItem(storageKey) || "{}");
-      return isPlainObject(stored) ? stored : {};
-    } catch {
-      return {};
-    }
-  }
-}
-function supportsLocalStorage() {
-  const mod = "lsCheck";
-  try {
-    return localStorage.setItem(mod, mod), localStorage.removeItem(mod), !0;
-  } catch {
-    return !1;
-  }
-}
 function parseApiQueryString(qs) {
@@ -214,5 +165,2 @@ const params = {}, options = {};
 }
-function prefixApiVersion(version) {
-  return version[0] !== "v" && version !== "other" ? `v${version}` : version;
-}
 const RO = typeof document > "u" ? resizeObserver.ResizeObserver : window.ResizeObserver;
@@ -638,12 +586,7 @@ function tryParseParams(val, t) {
   constructor(props) {
-    super(props), __publicField$1(this, "_visionRoot"), __publicField$1(this, "_queryEditorContainer"), __publicField$1(this, "_paramsEditorContainer"), __publicField$1(this, "_operationUrlElement"), __publicField$1(this, "_customApiVersionElement"), __publicField$1(this, "_resizeListener"), __publicField$1(this, "_querySubscription"), __publicField$1(this, "_listenSubscription"), __publicField$1(this, "_client"), __publicField$1(this, "_localStorage");
-    const { client, datasets, config } = props;
-    this._localStorage = getLocalStorage(client.config().projectId || "default");
-    const defaultDataset = config.defaultDataset || client.config().dataset || datasets[0], defaultApiVersion = prefixApiVersion(`${config.defaultApiVersion}`), defaultPerspective = DEFAULT_PERSPECTIVE;
-    let dataset = this._localStorage.get("dataset", defaultDataset), apiVersion = this._localStorage.get("apiVersion", defaultApiVersion), lastQuery = this._localStorage.get("query", ""), lastParams = this._localStorage.get("params", `{
-  
-}`);
+    super(props), __publicField$1(this, "_visionRoot"), __publicField$1(this, "_queryEditorContainer"), __publicField$1(this, "_paramsEditorContainer"), __publicField$1(this, "_operationUrlElement"), __publicField$1(this, "_customApiVersionElement"), __publicField$1(this, "_resizeListener"), __publicField$1(this, "_querySubscription"), __publicField$1(this, "_listenSubscription"), __publicField$1(this, "_client");
+    const { perspective, dataset, apiVersion } = props;
+    let { query: lastQuery, params: lastParams } = props;
     const customApiVersion = API_VERSIONS.includes(apiVersion) ? !1 : apiVersion;
-    let perspective = this._localStorage.get("perspective", defaultPerspective);
-    datasets.includes(dataset) || (dataset = datasets.includes(defaultDataset) ? defaultDataset : datasets[0]), API_VERSIONS.includes(apiVersion) || (apiVersion = DEFAULT_API_VERSION), PERSPECTIVES.includes(perspective) || (perspective = DEFAULT_PERSPECTIVE), typeof lastQuery != "string" && (lastQuery = ""), typeof lastParams != "string" && (lastParams = `{
+    typeof lastQuery != "string" && (lastQuery = ""), typeof lastParams != "string" && (lastParams = `{
   
@@ -728,12 +671,6 @@ }`), this._visionRoot = react.createRef(), this._operationUrlElement = react.createRef(), this._queryEditorContainer = react.createRef(), this._paramsEditorContainer = react.createRef(), this._customApiVersionElement = react.createRef(), this._client = props.client.withConfig({
       () => {
-        this._localStorage.merge({
-          query: this.state.query,
-          params: this.state.rawParams,
+        this.props.setPersistedState("query", this.state.query), this.props.setPersistedState("params", this.state.rawParams), this.props.setPersistedState("dataset", this.state.dataset), this.props.setPersistedState("apiVersion", customApiVersion || apiVersion), this.props.setPersistedState("perspective", this.state.perspective), this._client.config({
           dataset: this.state.dataset,
           apiVersion: customApiVersion || apiVersion,
           perspective: this.state.perspective
-        }), this._client.config({
-          dataset: this.state.dataset,
-          apiVersion: customApiVersion || apiVersion,
-          perspective: this.state.perspective
         }), this.handleQueryExecution(), this.props.toast.push({
@@ -759,3 +696,3 @@ closable: !0,
     const dataset = evt.target.value;
-    this._localStorage.set("dataset", dataset), this.setState({ dataset }), this._client.config({ dataset }), this.handleQueryExecution();
+    this.props.setPersistedState("dataset", dataset), this.setState({ dataset }), this._client.config({ dataset }), this.handleQueryExecution();
   }
@@ -772,3 +709,3 @@ handleChangeApiVersion(evt) {
     this.setState({ apiVersion, customApiVersion: !1 }, () => {
-      this._localStorage.set("apiVersion", this.state.apiVersion), this._client.config({
+      this.props.setPersistedState("apiVersion", this.state.apiVersion), this._client.config({
         apiVersion: this.state.apiVersion
@@ -787,3 +724,3 @@ }), this.handleQueryExecution();
       () => {
-        !this.state.isValidApiVersion || typeof this.state.customApiVersion != "string" || (this._localStorage.set("apiVersion", this.state.customApiVersion), this._client.config({ apiVersion: this.state.customApiVersion }));
+        !this.state.isValidApiVersion || typeof this.state.customApiVersion != "string" || (this.props.setPersistedState("apiVersion", this.state.customApiVersion), this._client.config({ apiVersion: this.state.customApiVersion }));
       }
@@ -795,3 +732,3 @@ );
     isPerspective(perspective) && this.setState({ perspective }, () => {
-      this._localStorage.set("perspective", this.state.perspective), this._client.config({
+      this.props.setPersistedState("perspective", this.state.perspective), this._client.config({
         perspective: this.state.perspective
@@ -831,3 +768,3 @@ }), this.handleQueryExecution();
     const paramsError = params instanceof Error ? params : void 0, encodeParams = params instanceof Error ? {} : params || {}, url = this._client.getDataUrl("listen", encodeQueryString(query, encodeParams, {})), shouldExecute = !paramsError && query.trim().length > 0;
-    this._localStorage.set("query", query), this._localStorage.set("params", rawParams), this.cancelQuery(), this.setState({
+    this.props.setPersistedState("query", query), this.props.setPersistedState("params", rawParams), this.cancelQuery(), this.setState({
       url,
@@ -855,3 +792,3 @@ listenMutations: [],
     const paramsError = params instanceof Error && params;
-    if (this._localStorage.set("query", query), this._localStorage.set("params", rawParams), this.cancelListener(), this.setState({
+    if (this.props.setPersistedState("query", query), this.props.setPersistedState("params", rawParams), this.cancelListener(), this.setState({
       queryInProgress: !paramsError && !!query,
@@ -900,3 +837,3 @@ listenInProgress: !1,
       },
-      () => this._localStorage.set("params", raw)
+      () => this.props.setPersistedState("params", raw)
     );
@@ -1144,14 +1081,129 @@ }
 }
+function isPlainObject(obj) {
+  return !!obj && typeof obj == "object" && Object.prototype.toString.call(obj) === "[object Object]";
+}
+const hasLocalStorage = supportsLocalStorage(), keyPrefix = "sanityVision:";
+function clearLocalStorage() {
+  if (hasLocalStorage)
+    for (let i = 0; i < localStorage.length; i++) {
+      const key = localStorage.key(i);
+      key != null && key.startsWith(keyPrefix) && localStorage.removeItem(key);
+    }
+}
+function getLocalStorage(namespace) {
+  const storageKey = `${keyPrefix}${namespace}`;
+  let loadedState = null;
+  return { get, set, merge };
+  function get(key, defaultVal) {
+    const state = ensureState();
+    return typeof state[key] > "u" ? defaultVal : state[key];
+  }
+  function set(key, value) {
+    const state = ensureState();
+    return state[key] = value, localStorage.setItem(storageKey, JSON.stringify(loadedState)), value;
+  }
+  function merge(props) {
+    const state = { ...ensureState(), ...props };
+    return localStorage.setItem(storageKey, JSON.stringify(state)), state;
+  }
+  function ensureState() {
+    return loadedState === null && (loadedState = loadState()), loadedState;
+  }
+  function loadState() {
+    if (!hasLocalStorage)
+      return {};
+    try {
+      const stored = JSON.parse(localStorage.getItem(storageKey) || "{}");
+      return isPlainObject(stored) ? stored : {};
+    } catch {
+      return {};
+    }
+  }
+}
+function supportsLocalStorage() {
+  const mod = "lsCheck";
+  try {
+    return localStorage.setItem(mod, mod), localStorage.removeItem(mod), !0;
+  } catch {
+    return !1;
+  }
+}
+function prefixApiVersion(version) {
+  return version[0] !== "v" && version !== "other" ? `v${version}` : version;
+}
 function VisionContainer(props) {
-  const toast = ui.useToast(), loadedDatasets = useDatasets(props.client), { t } = sanity.useTranslation(index.visionLocaleNamespace);
-  if (!loadedDatasets)
-    return /* @__PURE__ */ jsxRuntime.jsx(DelayedSpinner, {});
-  const datasets = loadedDatasets instanceof Error ? (
-    // On error, use the clients configured dataset
-    [props.client.config().dataset || "production"]
-  ) : (
-    // Otherwise use the loaded list, obviously
-    loadedDatasets
+  const toast = ui.useToast(), loadedDatasets = useDatasets(props.client), { t } = sanity.useTranslation(index.visionLocaleNamespace), _localStorage = react.useMemo(
+    () => getLocalStorage(props.client.config().projectId || "default"),
+    [props.client]
+  ), router$1 = router.useRouter(), searchParams = react.useMemo(
+    () => new URLSearchParams(router$1.state._searchParams),
+    [router$1.state._searchParams]
+  ), searchParamsAsString = react.useMemo(
+    () => new URLSearchParams(router$1.state._searchParams).toString(),
+    [router$1.state._searchParams]
+  ), nextSearchParams = react.useRef();
+  nextSearchParams.current || (nextSearchParams.current = new URLSearchParams());
+  const [shouldNavigate, setShouldNavigate] = react.useState(!1), setPersistedState = react.useCallback(
+    (key, value) => {
+      nextSearchParams.current.set(key, value), _localStorage.set(key, value), setShouldNavigate(!0);
+    },
+    [_localStorage]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(VisionGui, { ...props, datasets, toast, t });
+  react.useEffect(() => {
+    if (shouldNavigate && nextSearchParams.current) {
+      setShouldNavigate(!1);
+      const finalSearchParams = new URLSearchParams(searchParamsAsString);
+      for (const [key, value] of nextSearchParams.current.entries())
+        finalSearchParams.set(key, value), nextSearchParams.current.delete(key);
+      router$1.navigate({ _searchParams: [...finalSearchParams.entries()] }, { replace: !0 });
+    }
+  }, [router$1, searchParamsAsString, shouldNavigate]);
+  const datasets = react.useMemo(
+    () => !loadedDatasets || loadedDatasets instanceof Error ? (
+      // On error, use the clients configured dataset
+      [props.client.config().dataset || "production"]
+    ) : (
+      // Otherwise use the loaded list, obviously
+      loadedDatasets
+    ),
+    [loadedDatasets, props.client]
+  ), defaultDataset = react.useMemo(
+    () => props.config.defaultDataset || props.client.config().dataset || datasets[0],
+    [datasets, props.client, props.config.defaultDataset]
+  ), defaultApiVersion = react.useMemo(
+    () => props.config.defaultApiVersion ? prefixApiVersion(`${props.config.defaultApiVersion}`) : DEFAULT_API_VERSION,
+    [props.config.defaultApiVersion]
+  ), dataset = react.useMemo(() => {
+    const unsafeDataset = searchParams.get("dataset") || _localStorage.get("dataset", defaultDataset);
+    return datasets.includes(unsafeDataset) ? unsafeDataset : datasets.includes(defaultDataset) ? defaultDataset : datasets[0];
+  }, [_localStorage, datasets, defaultDataset, searchParams]), perspective = react.useMemo(() => {
+    const unsafePerspective = searchParams.get("perspective") || _localStorage.get("perspective", DEFAULT_PERSPECTIVE);
+    return PERSPECTIVES.includes(unsafePerspective) ? unsafePerspective : DEFAULT_PERSPECTIVE;
+  }, [_localStorage, searchParams]), apiVersion = react.useMemo(() => {
+    const unsafeApiVersion = searchParams.get("apiVersion") || _localStorage.get("apiVersion", defaultApiVersion);
+    return validateApiVersion(unsafeApiVersion) ? unsafeApiVersion : defaultApiVersion;
+  }, [_localStorage, defaultApiVersion, searchParams]), query = react.useMemo(
+    () => searchParams.get("query") || _localStorage.get("query", ""),
+    [_localStorage, searchParams]
+  ), params = react.useMemo(
+    () => searchParams.get("params") || _localStorage.get("params", `{
+  
+}`),
+    [_localStorage, searchParams]
+  );
+  return loadedDatasets ? /* @__PURE__ */ jsxRuntime.jsx(
+    VisionGui,
+    {
+      ...props,
+      datasets,
+      toast,
+      t,
+      apiVersion,
+      dataset,
+      perspective,
+      setPersistedState,
+      query,
+      params
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(DelayedSpinner, {});
 }
@@ -1158,0 +1210,0 @@ var __defProp = Object.defineProperty, __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __publicField = (obj, key, value) => (__defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value), value);

lib/_legacy/index.esm.js

@@ -20,3 +20,4 @@ import { EyeOpenIcon } from "@sanity/icons";
         options: config,
-        router: route.create("/*")
+        // eslint-disable-next-line camelcase
+        router: route.create("/*", { __unsafe_disableScopedSearchParams: !0 })
       }
@@ -23,0 +24,0 @@ ],

lib/_legacy/SanityVision.esm.js

 import { jsx, jsxs } from "react/jsx-runtime";
 import { useTranslation, useClient } from "sanity";
 import { Spinner, rem, useTheme, Box, useClickOutside, Popover, Stack, Inline, Text, Badge, Card, Button, Code, Flex, Label, Grid, Select, TextInput, Tooltip, Hotkeys, useToast, Container, Heading } from "@sanity/ui";
-import { useState, useEffect, useMemo, useCallback, PureComponent, createRef, Component } from "react";
+import { useState, useEffect, useMemo, useCallback, PureComponent, createRef, useRef, Component } from "react";
+import { useRouter } from "sanity/router";
 import SplitPane from "@rexxars/react-split-pane";
@@ -167,51 +168,2 @@ import { HelpCircleIcon, CopyIcon, ErrorOutlineIcon, StopIcon, PlayIcon } from "@sanity/icons";
 }
-function isPlainObject(obj) {
-  return !!obj && typeof obj == "object" && Object.prototype.toString.call(obj) === "[object Object]";
-}
-const hasLocalStorage = supportsLocalStorage(), keyPrefix = "sanityVision:";
-function clearLocalStorage() {
-  if (hasLocalStorage)
-    for (let i = 0; i < localStorage.length; i++) {
-      const key = localStorage.key(i);
-      key != null && key.startsWith(keyPrefix) && localStorage.removeItem(key);
-    }
-}
-function getLocalStorage(namespace) {
-  const storageKey = `${keyPrefix}${namespace}`;
-  let loadedState = null;
-  return { get, set, merge };
-  function get(key, defaultVal) {
-    const state = ensureState();
-    return typeof state[key] > "u" ? defaultVal : state[key];
-  }
-  function set(key, value) {
-    const state = ensureState();
-    return state[key] = value, localStorage.setItem(storageKey, JSON.stringify(loadedState)), value;
-  }
-  function merge(props) {
-    const state = { ...ensureState(), ...props };
-    return localStorage.setItem(storageKey, JSON.stringify(state)), state;
-  }
-  function ensureState() {
-    return loadedState === null && (loadedState = loadState()), loadedState;
-  }
-  function loadState() {
-    if (!hasLocalStorage)
-      return {};
-    try {
-      const stored = JSON.parse(localStorage.getItem(storageKey) || "{}");
-      return isPlainObject(stored) ? stored : {};
-    } catch {
-      return {};
-    }
-  }
-}
-function supportsLocalStorage() {
-  const mod = "lsCheck";
-  try {
-    return localStorage.setItem(mod, mod), localStorage.removeItem(mod), !0;
-  } catch {
-    return !1;
-  }
-}
 function parseApiQueryString(qs) {
@@ -231,5 +183,2 @@ const params = {}, options = {};
 }
-function prefixApiVersion(version) {
-  return version[0] !== "v" && version !== "other" ? `v${version}` : version;
-}
 const RO = typeof document > "u" ? ResizeObserver : window.ResizeObserver;
@@ -655,12 +604,7 @@ function tryParseParams(val, t) {
   constructor(props) {
-    super(props), __publicField$1(this, "_visionRoot"), __publicField$1(this, "_queryEditorContainer"), __publicField$1(this, "_paramsEditorContainer"), __publicField$1(this, "_operationUrlElement"), __publicField$1(this, "_customApiVersionElement"), __publicField$1(this, "_resizeListener"), __publicField$1(this, "_querySubscription"), __publicField$1(this, "_listenSubscription"), __publicField$1(this, "_client"), __publicField$1(this, "_localStorage");
-    const { client, datasets, config } = props;
-    this._localStorage = getLocalStorage(client.config().projectId || "default");
-    const defaultDataset = config.defaultDataset || client.config().dataset || datasets[0], defaultApiVersion = prefixApiVersion(`${config.defaultApiVersion}`), defaultPerspective = DEFAULT_PERSPECTIVE;
-    let dataset = this._localStorage.get("dataset", defaultDataset), apiVersion = this._localStorage.get("apiVersion", defaultApiVersion), lastQuery = this._localStorage.get("query", ""), lastParams = this._localStorage.get("params", `{
-  
-}`);
+    super(props), __publicField$1(this, "_visionRoot"), __publicField$1(this, "_queryEditorContainer"), __publicField$1(this, "_paramsEditorContainer"), __publicField$1(this, "_operationUrlElement"), __publicField$1(this, "_customApiVersionElement"), __publicField$1(this, "_resizeListener"), __publicField$1(this, "_querySubscription"), __publicField$1(this, "_listenSubscription"), __publicField$1(this, "_client");
+    const { perspective, dataset, apiVersion } = props;
+    let { query: lastQuery, params: lastParams } = props;
     const customApiVersion = API_VERSIONS.includes(apiVersion) ? !1 : apiVersion;
-    let perspective = this._localStorage.get("perspective", defaultPerspective);
-    datasets.includes(dataset) || (dataset = datasets.includes(defaultDataset) ? defaultDataset : datasets[0]), API_VERSIONS.includes(apiVersion) || (apiVersion = DEFAULT_API_VERSION), PERSPECTIVES.includes(perspective) || (perspective = DEFAULT_PERSPECTIVE), typeof lastQuery != "string" && (lastQuery = ""), typeof lastParams != "string" && (lastParams = `{
+    typeof lastQuery != "string" && (lastQuery = ""), typeof lastParams != "string" && (lastParams = `{
   
@@ -745,12 +689,6 @@ }`), this._visionRoot = createRef(), this._operationUrlElement = createRef(), this._queryEditorContainer = createRef(), this._paramsEditorContainer = createRef(), this._customApiVersionElement = createRef(), this._client = props.client.withConfig({
       () => {
-        this._localStorage.merge({
-          query: this.state.query,
-          params: this.state.rawParams,
+        this.props.setPersistedState("query", this.state.query), this.props.setPersistedState("params", this.state.rawParams), this.props.setPersistedState("dataset", this.state.dataset), this.props.setPersistedState("apiVersion", customApiVersion || apiVersion), this.props.setPersistedState("perspective", this.state.perspective), this._client.config({
           dataset: this.state.dataset,
           apiVersion: customApiVersion || apiVersion,
           perspective: this.state.perspective
-        }), this._client.config({
-          dataset: this.state.dataset,
-          apiVersion: customApiVersion || apiVersion,
-          perspective: this.state.perspective
         }), this.handleQueryExecution(), this.props.toast.push({
@@ -776,3 +714,3 @@ closable: !0,
     const dataset = evt.target.value;
-    this._localStorage.set("dataset", dataset), this.setState({ dataset }), this._client.config({ dataset }), this.handleQueryExecution();
+    this.props.setPersistedState("dataset", dataset), this.setState({ dataset }), this._client.config({ dataset }), this.handleQueryExecution();
   }
@@ -789,3 +727,3 @@ handleChangeApiVersion(evt) {
     this.setState({ apiVersion, customApiVersion: !1 }, () => {
-      this._localStorage.set("apiVersion", this.state.apiVersion), this._client.config({
+      this.props.setPersistedState("apiVersion", this.state.apiVersion), this._client.config({
         apiVersion: this.state.apiVersion
@@ -804,3 +742,3 @@ }), this.handleQueryExecution();
       () => {
-        !this.state.isValidApiVersion || typeof this.state.customApiVersion != "string" || (this._localStorage.set("apiVersion", this.state.customApiVersion), this._client.config({ apiVersion: this.state.customApiVersion }));
+        !this.state.isValidApiVersion || typeof this.state.customApiVersion != "string" || (this.props.setPersistedState("apiVersion", this.state.customApiVersion), this._client.config({ apiVersion: this.state.customApiVersion }));
       }
@@ -812,3 +750,3 @@ );
     isPerspective(perspective) && this.setState({ perspective }, () => {
-      this._localStorage.set("perspective", this.state.perspective), this._client.config({
+      this.props.setPersistedState("perspective", this.state.perspective), this._client.config({
         perspective: this.state.perspective
@@ -848,3 +786,3 @@ }), this.handleQueryExecution();
     const paramsError = params instanceof Error ? params : void 0, encodeParams = params instanceof Error ? {} : params || {}, url = this._client.getDataUrl("listen", encodeQueryString(query, encodeParams, {})), shouldExecute = !paramsError && query.trim().length > 0;
-    this._localStorage.set("query", query), this._localStorage.set("params", rawParams), this.cancelQuery(), this.setState({
+    this.props.setPersistedState("query", query), this.props.setPersistedState("params", rawParams), this.cancelQuery(), this.setState({
       url,
@@ -872,3 +810,3 @@ listenMutations: [],
     const paramsError = params instanceof Error && params;
-    if (this._localStorage.set("query", query), this._localStorage.set("params", rawParams), this.cancelListener(), this.setState({
+    if (this.props.setPersistedState("query", query), this.props.setPersistedState("params", rawParams), this.cancelListener(), this.setState({
       queryInProgress: !paramsError && !!query,
@@ -917,3 +855,3 @@ listenInProgress: !1,
       },
-      () => this._localStorage.set("params", raw)
+      () => this.props.setPersistedState("params", raw)
     );
@@ -1161,14 +1099,129 @@ }
 }
+function isPlainObject(obj) {
+  return !!obj && typeof obj == "object" && Object.prototype.toString.call(obj) === "[object Object]";
+}
+const hasLocalStorage = supportsLocalStorage(), keyPrefix = "sanityVision:";
+function clearLocalStorage() {
+  if (hasLocalStorage)
+    for (let i = 0; i < localStorage.length; i++) {
+      const key = localStorage.key(i);
+      key != null && key.startsWith(keyPrefix) && localStorage.removeItem(key);
+    }
+}
+function getLocalStorage(namespace) {
+  const storageKey = `${keyPrefix}${namespace}`;
+  let loadedState = null;
+  return { get, set, merge };
+  function get(key, defaultVal) {
+    const state = ensureState();
+    return typeof state[key] > "u" ? defaultVal : state[key];
+  }
+  function set(key, value) {
+    const state = ensureState();
+    return state[key] = value, localStorage.setItem(storageKey, JSON.stringify(loadedState)), value;
+  }
+  function merge(props) {
+    const state = { ...ensureState(), ...props };
+    return localStorage.setItem(storageKey, JSON.stringify(state)), state;
+  }
+  function ensureState() {
+    return loadedState === null && (loadedState = loadState()), loadedState;
+  }
+  function loadState() {
+    if (!hasLocalStorage)
+      return {};
+    try {
+      const stored = JSON.parse(localStorage.getItem(storageKey) || "{}");
+      return isPlainObject(stored) ? stored : {};
+    } catch {
+      return {};
+    }
+  }
+}
+function supportsLocalStorage() {
+  const mod = "lsCheck";
+  try {
+    return localStorage.setItem(mod, mod), localStorage.removeItem(mod), !0;
+  } catch {
+    return !1;
+  }
+}
+function prefixApiVersion(version) {
+  return version[0] !== "v" && version !== "other" ? `v${version}` : version;
+}
 function VisionContainer(props) {
-  const toast = useToast(), loadedDatasets = useDatasets(props.client), { t } = useTranslation(visionLocaleNamespace);
-  if (!loadedDatasets)
-    return /* @__PURE__ */ jsx(DelayedSpinner, {});
-  const datasets = loadedDatasets instanceof Error ? (
-    // On error, use the clients configured dataset
-    [props.client.config().dataset || "production"]
-  ) : (
-    // Otherwise use the loaded list, obviously
-    loadedDatasets
+  const toast = useToast(), loadedDatasets = useDatasets(props.client), { t } = useTranslation(visionLocaleNamespace), _localStorage = useMemo(
+    () => getLocalStorage(props.client.config().projectId || "default"),
+    [props.client]
+  ), router = useRouter(), searchParams = useMemo(
+    () => new URLSearchParams(router.state._searchParams),
+    [router.state._searchParams]
+  ), searchParamsAsString = useMemo(
+    () => new URLSearchParams(router.state._searchParams).toString(),
+    [router.state._searchParams]
+  ), nextSearchParams = useRef();
+  nextSearchParams.current || (nextSearchParams.current = new URLSearchParams());
+  const [shouldNavigate, setShouldNavigate] = useState(!1), setPersistedState = useCallback(
+    (key, value) => {
+      nextSearchParams.current.set(key, value), _localStorage.set(key, value), setShouldNavigate(!0);
+    },
+    [_localStorage]
   );
-  return /* @__PURE__ */ jsx(VisionGui, { ...props, datasets, toast, t });
+  useEffect(() => {
+    if (shouldNavigate && nextSearchParams.current) {
+      setShouldNavigate(!1);
+      const finalSearchParams = new URLSearchParams(searchParamsAsString);
+      for (const [key, value] of nextSearchParams.current.entries())
+        finalSearchParams.set(key, value), nextSearchParams.current.delete(key);
+      router.navigate({ _searchParams: [...finalSearchParams.entries()] }, { replace: !0 });
+    }
+  }, [router, searchParamsAsString, shouldNavigate]);
+  const datasets = useMemo(
+    () => !loadedDatasets || loadedDatasets instanceof Error ? (
+      // On error, use the clients configured dataset
+      [props.client.config().dataset || "production"]
+    ) : (
+      // Otherwise use the loaded list, obviously
+      loadedDatasets
+    ),
+    [loadedDatasets, props.client]
+  ), defaultDataset = useMemo(
+    () => props.config.defaultDataset || props.client.config().dataset || datasets[0],
+    [datasets, props.client, props.config.defaultDataset]
+  ), defaultApiVersion = useMemo(
+    () => props.config.defaultApiVersion ? prefixApiVersion(`${props.config.defaultApiVersion}`) : DEFAULT_API_VERSION,
+    [props.config.defaultApiVersion]
+  ), dataset = useMemo(() => {
+    const unsafeDataset = searchParams.get("dataset") || _localStorage.get("dataset", defaultDataset);
+    return datasets.includes(unsafeDataset) ? unsafeDataset : datasets.includes(defaultDataset) ? defaultDataset : datasets[0];
+  }, [_localStorage, datasets, defaultDataset, searchParams]), perspective = useMemo(() => {
+    const unsafePerspective = searchParams.get("perspective") || _localStorage.get("perspective", DEFAULT_PERSPECTIVE);
+    return PERSPECTIVES.includes(unsafePerspective) ? unsafePerspective : DEFAULT_PERSPECTIVE;
+  }, [_localStorage, searchParams]), apiVersion = useMemo(() => {
+    const unsafeApiVersion = searchParams.get("apiVersion") || _localStorage.get("apiVersion", defaultApiVersion);
+    return validateApiVersion(unsafeApiVersion) ? unsafeApiVersion : defaultApiVersion;
+  }, [_localStorage, defaultApiVersion, searchParams]), query = useMemo(
+    () => searchParams.get("query") || _localStorage.get("query", ""),
+    [_localStorage, searchParams]
+  ), params = useMemo(
+    () => searchParams.get("params") || _localStorage.get("params", `{
+  
+}`),
+    [_localStorage, searchParams]
+  );
+  return loadedDatasets ? /* @__PURE__ */ jsx(
+    VisionGui,
+    {
+      ...props,
+      datasets,
+      toast,
+      t,
+      apiVersion,
+      dataset,
+      perspective,
+      setPersistedState,
+      query,
+      params
+    }
+  ) : /* @__PURE__ */ jsx(DelayedSpinner, {});
 }
@@ -1175,0 +1228,0 @@ var __defProp = Object.defineProperty, __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value, __publicField = (obj, key, value) => (__defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value), value);

package.json

 {
   "name": "@sanity/vision",
-  "version": "3.37.3-canary.53+3849b5370c",
+  "version": "3.37.3-canary.62+d826b664c5",
   "description": "Sanity plugin for running/debugging GROQ-queries against Sanity datasets",
@@ -74,16 +74,16 @@ "keywords": [
     "@repo/package.config": "3.37.2",
-    "@sanity/block-tools": "3.37.3-canary.53+3849b5370c",
-    "@sanity/cli": "3.37.3-canary.53+3849b5370c",
+    "@sanity/block-tools": "3.37.3-canary.62+d826b664c5",
+    "@sanity/cli": "3.37.3-canary.62+d826b664c5",
     "@sanity/client": "^6.15.14",
-    "@sanity/codegen": "3.37.3-canary.53+3849b5370c",
-    "@sanity/diff": "3.37.3-canary.53+3849b5370c",
-    "@sanity/migrate": "3.37.3-canary.53+3849b5370c",
-    "@sanity/mutator": "3.37.3-canary.53+3849b5370c",
-    "@sanity/portable-text-editor": "3.37.3-canary.53+3849b5370c",
-    "@sanity/schema": "3.37.3-canary.53+3849b5370c",
-    "@sanity/types": "3.37.3-canary.53+3849b5370c",
-    "@sanity/util": "3.37.3-canary.53+3849b5370c",
+    "@sanity/codegen": "3.37.3-canary.62+d826b664c5",
+    "@sanity/diff": "3.37.3-canary.62+d826b664c5",
+    "@sanity/migrate": "3.37.3-canary.62+d826b664c5",
+    "@sanity/mutator": "3.37.3-canary.62+d826b664c5",
+    "@sanity/portable-text-editor": "3.37.3-canary.62+d826b664c5",
+    "@sanity/schema": "3.37.3-canary.62+d826b664c5",
+    "@sanity/types": "3.37.3-canary.62+d826b664c5",
+    "@sanity/util": "3.37.3-canary.62+d826b664c5",
     "@types/lodash": "^4.14.149",
     "react": "^18.2.0",
-    "sanity": "3.37.3-canary.53+3849b5370c",
+    "sanity": "3.37.3-canary.62+d826b664c5",
     "styled-components": "^6.1.8"
@@ -95,3 +95,3 @@ },
   },
-  "gitHead": "3849b5370c4c11a0cb20f97c05c68f6a1adff511"
+  "gitHead": "d826b664c5da8fe2618e9f6d043495d3d7aa8c3e"
 }

src/visionTool.ts

@@ -20,3 +20,4 @@ import {EyeOpenIcon} from '@sanity/icons'
         options: config,
-        router: route.create('/*'),
+        // eslint-disable-next-line camelcase
+        router: route.create('/*', {__unsafe_disableScopedSearchParams: true}),
       },
@@ -23,0 +24,0 @@ ],

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

589821

increased by4.59%

Lines of code

6139

increased by4.33%

No dependency changes