@scalar/api-client-react 2.0.3 → 2.0.5

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @scalar/api-client-react
 
+## 2.0.5
+
+## 2.0.4
+
+### Patch Changes
+
+- [#8943](https://github.com/scalar/scalar/pull/8943): feat: added customFetch config to the client
+
 ## 2.0.3
 
 ## 2.0.2

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../src/lazy-load.ts","../src/use-api-client.ts"],"sourcesContent":["import type { ApiClientModalOptions } from '@scalar/api-client/modal'\n\n/**\n * Creates a lazy singleton getter: the factory runs at most once, caches the resulting promise,\n * and clears the cache on failure so the next call can retry.\n *\n * Optional args are forwarded to the factory on the first (cache-miss) call only.\n * Subsequent calls return the cached promise regardless of the args passed.\n */\nconst makeLazySingleton = <T, Args extends unknown[] = []>(\n  factory: (...args: Args) => Promise<T>,\n): ((...args: Args) => Promise<T>) => {\n  let cached: Promise<T> | undefined\n  return (...args: Args) => {\n    cached ??= factory(...args).catch((error) => {\n      cached = undefined\n      throw error\n    })\n    return cached\n  }\n}\n\n/** Lazy load the client modal creator */\nexport const getClientModalCreator = makeLazySingleton(() =>\n  import('@scalar/api-client/modal').then(({ createApiClientModal }) => createApiClientModal),\n)\n\n/** Module-scoped singleton workspace store (lazy-loaded on first use). */\nexport const getWorkspaceStoreSingleton = makeLazySingleton(() =>\n  import('@scalar/workspace-store/client').then(({ createWorkspaceStore }) => createWorkspaceStore()),\n)\n\n/** Module-scoped singleton workspace event bus (lazy-loaded on first use). */\nexport const getWorkspaceEventBusSingleton = makeLazySingleton(() =>\n  import('@scalar/workspace-store/events').then(({ createWorkspaceEventBus }) => createWorkspaceEventBus()),\n)\n\n/**\n * Lazily creates the singleton Vue app, mounts it as the last child of document.body,\n * and returns the controller. Subsequent calls return the same promise.\n *\n * Only modal-supported options are accepted here. Document-specific fields\n * (`url`, `content`) must be registered via `workspaceStore.addDocument` after the client\n * is ready — they are not part of the modal constructor.\n */\nexport const getOrCreateApiClient = makeLazySingleton(async (options: ApiClientModalOptions = {}) => {\n  const el = document.createElement('div')\n  el.className = 'scalar-app'\n  document.body.appendChild(el)\n\n  try {\n    const [createModal, workspaceStore, eventBus] = await Promise.all([\n      getClientModalCreator(),\n      getWorkspaceStoreSingleton(),\n      getWorkspaceEventBusSingleton(),\n    ])\n\n    const apiClient = createModal({\n      el,\n      eventBus,\n      workspaceStore,\n      options,\n      // TODO: map plugins from configuration when available\n      // plugins: mapConfigPlugins(options),\n    })\n\n    return { apiClient, workspaceStore }\n  } catch (error) {\n    el.remove()\n    throw error\n  }\n})\n","'use client'\n\nimport type { ApiClientModal, ApiClientModalOptions, RoutePayload } from '@scalar/api-client/modal'\nimport { useEffect, useRef, useState } from 'react'\n\nimport './style.css'\n\nimport { isObjectEqual } from '@scalar/helpers/object/is-object-equal'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\n\nimport { getOrCreateApiClient } from './lazy-load'\n\nglobalThis.__VUE_OPTIONS_API__ = true\nglobalThis.__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ = true\nglobalThis.__VUE_PROD_DEVTOOLS__ = false\n\nexport type ApiClientConfigurationReact = ApiClientModalOptions & {\n  // content?: Record<string, unknown>\n  url: string\n}\n\nexport type UseApiClientModalProps = {\n  /** Configuration for the Api Client (url or inline content) */\n  configuration: ApiClientConfigurationReact\n}\n\n/** Tracks which documents are/have been loaded so we dont duplicate */\nconst documentSet = new Set<string>()\n\n/**\n * Returns the singleton Api Client\n *\n * On first call the Vue app is lazily created and appended to document.body where it\n * lives for the lifetime of the page — it is never unmounted, so it survives client-side\n * navigation without losing state.\n *\n * Subsequent calls from any component share the same instance of the client but can use the same\n * or different documents\n */\nexport const useApiClient = ({\n  configuration,\n}: UseApiClientModalProps): (Omit<ApiClientModal, 'open'> & { open: (payload: RoutePayload) => void }) | undefined => {\n  const [client, setClient] = useState<ApiClientModal | undefined>(undefined)\n  const [workspaceStore, setWorkspaceStore] = useState<WorkspaceStore | undefined>(undefined)\n  const documentSlugRef = useRef('')\n  const previousModalOptionsRef = useRef<ApiClientModalOptions | undefined>(undefined)\n\n  /** Small wrapper to set the documentSlug */\n  const open = (payload: RoutePayload) => client?.open({ documentSlug: documentSlugRef.current, ...payload })\n\n  useEffect(() => {\n    let cancelled = false\n\n    // Strip document-specific fields before passing to the modal constructor.\n    const { url, ...modalOptions } = configuration\n\n    void getOrCreateApiClient(modalOptions)?.then((_client) => {\n      if (cancelled || !_client) {\n        return\n      }\n\n      // Compute the slug here so we can batch all three state updates into one render,\n      // preventing a render where `client` is set but `documentSlug` is still ''.\n      const slug = url || ''\n\n      // React always provides the complete modal option set for this hook instance,\n      // so we overwrite to clear options removed by consumers.\n      _client.apiClient.updateOptions(modalOptions, true)\n      previousModalOptionsRef.current = modalOptions\n\n      setClient(_client.apiClient)\n      setWorkspaceStore(_client.workspaceStore)\n      documentSlugRef.current = slug\n\n      if (slug && !documentSet.has(slug)) {\n        documentSet.add(slug)\n        void _client.workspaceStore.addDocument({ name: slug, url })\n      }\n    })\n\n    return () => {\n      cancelled = true\n    }\n\n    // Only run once per mount\n  }, [])\n\n  // Register new document when we detect the url has changed\n  useEffect(() => {\n    if (!client || !workspaceStore) {\n      return\n    }\n\n    const slug = configuration.url || 'default'\n    documentSlugRef.current = slug\n\n    if (documentSet.has(slug)) {\n      return\n    }\n    documentSet.add(slug)\n\n    void workspaceStore.addDocument({ name: slug, url: configuration.url })\n  }, [client, configuration.url, workspaceStore])\n\n  // Update the modal options when the configuration changes\n  useEffect(() => {\n    if (!client || !configuration) {\n      return\n    }\n\n    const { url: _, ...modalOptions } = configuration\n    if (isObjectEqual(previousModalOptionsRef.current, modalOptions)) {\n      return\n    }\n\n    client.updateOptions(modalOptions, true)\n    previousModalOptionsRef.current = modalOptions\n  }, [client, configuration])\n\n  return client\n    ? {\n        ...client,\n        open,\n      }\n    : undefined\n}\n"],"mappings":";;;;;;;;;;;AASA,IAAM,qBACJ,YACoC;CACpC,IAAI;AACJ,SAAQ,GAAG,SAAe;AACxB,aAAW,QAAQ,GAAG,KAAK,CAAC,OAAO,UAAU;AAC3C,YAAS,KAAA;AACT,SAAM;IACN;AACF,SAAO;;;;AAKX,IAAa,wBAAwB,wBACnC,OAAO,4BAA4B,MAAM,EAAE,2BAA2B,qBAAqB,CAC5F;;AAGD,IAAa,6BAA6B,wBACxC,OAAO,kCAAkC,MAAM,EAAE,2BAA2B,sBAAsB,CAAC,CACpG;;AAGD,IAAa,gCAAgC,wBAC3C,OAAO,kCAAkC,MAAM,EAAE,8BAA8B,yBAAyB,CAAC,CAC1G;;;;;;;;;AAUD,IAAa,uBAAuB,kBAAkB,OAAO,UAAiC,EAAE,KAAK;CACnG,MAAM,KAAK,SAAS,cAAc,MAAM;AACxC,IAAG,YAAY;AACf,UAAS,KAAK,YAAY,GAAG;AAE7B,KAAI;EACF,MAAM,CAAC,aAAa,gBAAgB,YAAY,MAAM,QAAQ,IAAI;GAChE,uBAAuB;GACvB,4BAA4B;GAC5B,+BAAA;GACD,CAAC;AAWF,SAAO;GAAE,WATS,YAAY;IAC5B;IACA;IACA;IACA;IAGD,CAAC;GAEkB;GAAgB;UAC7B,OAAO;AACd,KAAG,QAAQ;AACX,QAAM;;EAER;;;AC3DF,WAAW,sBAAsB;AACjC,WAAW,0CAA0C;AACrD,WAAW,wBAAwB;;AAanC,IAAM,8BAAc,IAAI,KAAa;;;;;;;;;;;AAYrC,IAAa,gBAAgB,EAC3B,oBACoH;CACpH,MAAM,CAAC,QAAQ,aAAa,SAAqC,KAAA,EAAU;CAC3E,MAAM,CAAC,gBAAgB,qBAAqB,SAAqC,KAAA,EAAU;CAC3F,MAAM,kBAAkB,OAAO,GAAG;CAClC,MAAM,0BAA0B,OAA0C,KAAA,EAAU;;CAGpF,MAAM,QAAQ,YAA0B,QAAQ,KAAK;EAAE,cAAc,gBAAgB;EAAS,GAAG;EAAS,CAAC;AAE3G,iBAAgB;EACd,IAAI,YAAY;EAGhB,MAAM,EAAE,KAAK,GAAG,iBAAiB;AAE5B,uBAAqB,aAAa,EAAE,MAAM,YAAY;AACzD,OAAI,aAAa,CAAC,QAChB;GAKF,MAAM,OAAO,OAAO;AAIpB,WAAQ,UAAU,cAAc,cAAc,KAAK;AACnD,2BAAwB,UAAU;AAElC,aAAU,QAAQ,UAAU;AAC5B,qBAAkB,QAAQ,eAAe;AACzC,mBAAgB,UAAU;AAE1B,OAAI,QAAQ,CAAC,YAAY,IAAI,KAAK,EAAE;AAClC,gBAAY,IAAI,KAAK;AAChB,YAAQ,eAAe,YAAY;KAAE,MAAM;KAAM;KAAK,CAAC;;IAE9D;AAEF,eAAa;AACX,eAAY;;IAIb,EAAE,CAAC;AAGN,iBAAgB;AACd,MAAI,CAAC,UAAU,CAAC,eACd;EAGF,MAAM,OAAO,cAAc,OAAO;AAClC,kBAAgB,UAAU;AAE1B,MAAI,YAAY,IAAI,KAAK,CACvB;AAEF,cAAY,IAAI,KAAK;AAEhB,iBAAe,YAAY;GAAE,MAAM;GAAM,KAAK,cAAc;GAAK,CAAC;IACtE;EAAC;EAAQ,cAAc;EAAK;EAAe,CAAC;AAG/C,iBAAgB;AACd,MAAI,CAAC,UAAU,CAAC,cACd;EAGF,MAAM,EAAE,KAAK,GAAG,GAAG,iBAAiB;AACpC,MAAI,cAAc,wBAAwB,SAAS,aAAa,CAC9D;AAGF,SAAO,cAAc,cAAc,KAAK;AACxC,0BAAwB,UAAU;IACjC,CAAC,QAAQ,cAAc,CAAC;AAE3B,QAAO,SACH;EACE,GAAG;EACH;EACD,GACD,KAAA"}
+{"version":3,"file":"index.js","names":[],"sources":["../src/lazy-load.ts","../src/use-api-client.ts"],"sourcesContent":["import type { ApiClientOptions } from '@scalar/api-client/modal'\n\n/**\n * Creates a lazy singleton getter: the factory runs at most once, caches the resulting promise,\n * and clears the cache on failure so the next call can retry.\n *\n * Optional args are forwarded to the factory on the first (cache-miss) call only.\n * Subsequent calls return the cached promise regardless of the args passed.\n */\nconst makeLazySingleton = <T, Args extends unknown[] = []>(\n  factory: (...args: Args) => Promise<T>,\n): ((...args: Args) => Promise<T>) => {\n  let cached: Promise<T> | undefined\n  return (...args: Args) => {\n    cached ??= factory(...args).catch((error) => {\n      cached = undefined\n      throw error\n    })\n    return cached\n  }\n}\n\n/** Lazy load the client modal creator */\nexport const getClientModalCreator = makeLazySingleton(() =>\n  import('@scalar/api-client/modal').then(({ createApiClientModal }) => createApiClientModal),\n)\n\n/** Module-scoped singleton workspace store (lazy-loaded on first use). */\nexport const getWorkspaceStoreSingleton = makeLazySingleton(() =>\n  import('@scalar/workspace-store/client').then(({ createWorkspaceStore }) => createWorkspaceStore()),\n)\n\n/** Module-scoped singleton workspace event bus (lazy-loaded on first use). */\nexport const getWorkspaceEventBusSingleton = makeLazySingleton(() =>\n  import('@scalar/workspace-store/events').then(({ createWorkspaceEventBus }) => createWorkspaceEventBus()),\n)\n\n/**\n * Lazily creates the singleton Vue app, mounts it as the last child of document.body,\n * and returns the controller. Subsequent calls return the same promise.\n *\n * Only modal-supported options are accepted here. Document-specific fields\n * (`url`, `content`) must be registered via `workspaceStore.addDocument` after the client\n * is ready — they are not part of the modal constructor.\n */\nexport const getOrCreateApiClient = makeLazySingleton(async (options: ApiClientOptions = {}) => {\n  const el = document.createElement('div')\n  el.className = 'scalar-app'\n  document.body.appendChild(el)\n\n  try {\n    const [createModal, workspaceStore, eventBus] = await Promise.all([\n      getClientModalCreator(),\n      getWorkspaceStoreSingleton(),\n      getWorkspaceEventBusSingleton(),\n    ])\n\n    const apiClient = createModal({\n      el,\n      eventBus,\n      workspaceStore,\n      options,\n      // TODO: map plugins from configuration when available\n      // plugins: mapConfigPlugins(options),\n    })\n\n    return { apiClient, workspaceStore }\n  } catch (error) {\n    el.remove()\n    throw error\n  }\n})\n","'use client'\n\nimport type { ApiClientModal, ApiClientOptions, RoutePayload } from '@scalar/api-client/modal'\nimport { useEffect, useRef, useState } from 'react'\n\nimport './style.css'\n\nimport { isObjectEqual } from '@scalar/helpers/object/is-object-equal'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\n\nimport { getOrCreateApiClient } from './lazy-load'\n\nglobalThis.__VUE_OPTIONS_API__ = true\nglobalThis.__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ = true\nglobalThis.__VUE_PROD_DEVTOOLS__ = false\n\nexport type ApiClientConfigurationReact = ApiClientOptions & {\n  // content?: Record<string, unknown>\n  url: string\n}\n\nexport type UseApiClientModalProps = {\n  /** Configuration for the Api Client (url or inline content) */\n  configuration: ApiClientConfigurationReact\n}\n\n/** Tracks which documents are/have been loaded so we dont duplicate */\nconst documentSet = new Set<string>()\n\n/**\n * Returns the singleton Api Client\n *\n * On first call the Vue app is lazily created and appended to document.body where it\n * lives for the lifetime of the page — it is never unmounted, so it survives client-side\n * navigation without losing state.\n *\n * Subsequent calls from any component share the same instance of the client but can use the same\n * or different documents\n */\nexport const useApiClient = ({\n  configuration,\n}: UseApiClientModalProps): (Omit<ApiClientModal, 'open'> & { open: (payload: RoutePayload) => void }) | undefined => {\n  const [client, setClient] = useState<ApiClientModal | undefined>(undefined)\n  const [workspaceStore, setWorkspaceStore] = useState<WorkspaceStore | undefined>(undefined)\n  const documentSlugRef = useRef('')\n  const previousModalOptionsRef = useRef<ApiClientOptions | undefined>(undefined)\n\n  /** Small wrapper to set the documentSlug */\n  const open = (payload: RoutePayload) => client?.open({ documentSlug: documentSlugRef.current, ...payload })\n\n  useEffect(() => {\n    let cancelled = false\n\n    // Strip document-specific fields before passing to the modal constructor.\n    const { url, ...modalOptions } = configuration\n\n    void getOrCreateApiClient(modalOptions)?.then((_client) => {\n      if (cancelled || !_client) {\n        return\n      }\n\n      // Compute the slug here so we can batch all three state updates into one render,\n      // preventing a render where `client` is set but `documentSlug` is still ''.\n      const slug = url || ''\n\n      // React always provides the complete modal option set for this hook instance,\n      // so we overwrite to clear options removed by consumers.\n      _client.apiClient.updateOptions(modalOptions, true)\n      previousModalOptionsRef.current = modalOptions\n\n      setClient(_client.apiClient)\n      setWorkspaceStore(_client.workspaceStore)\n      documentSlugRef.current = slug\n\n      if (slug && !documentSet.has(slug)) {\n        documentSet.add(slug)\n        void _client.workspaceStore.addDocument({ name: slug, url })\n      }\n    })\n\n    return () => {\n      cancelled = true\n    }\n\n    // Only run once per mount\n  }, [])\n\n  // Register new document when we detect the url has changed\n  useEffect(() => {\n    if (!client || !workspaceStore) {\n      return\n    }\n\n    const slug = configuration.url || 'default'\n    documentSlugRef.current = slug\n\n    if (documentSet.has(slug)) {\n      return\n    }\n    documentSet.add(slug)\n\n    void workspaceStore.addDocument({ name: slug, url: configuration.url })\n  }, [client, configuration.url, workspaceStore])\n\n  // Update the modal options when the configuration changes\n  useEffect(() => {\n    if (!client || !configuration) {\n      return\n    }\n\n    const { url: _, ...modalOptions } = configuration\n    if (isObjectEqual(previousModalOptionsRef.current, modalOptions)) {\n      return\n    }\n\n    client.updateOptions(modalOptions, true)\n    previousModalOptionsRef.current = modalOptions\n  }, [client, configuration])\n\n  return client\n    ? {\n        ...client,\n        open,\n      }\n    : undefined\n}\n"],"mappings":";;;;;;;;;;;AASA,IAAM,qBACJ,YACoC;CACpC,IAAI;AACJ,SAAQ,GAAG,SAAe;AACxB,aAAW,QAAQ,GAAG,KAAK,CAAC,OAAO,UAAU;AAC3C,YAAS,KAAA;AACT,SAAM;IACN;AACF,SAAO;;;;AAKX,IAAa,wBAAwB,wBACnC,OAAO,4BAA4B,MAAM,EAAE,2BAA2B,qBAAqB,CAC5F;;AAGD,IAAa,6BAA6B,wBACxC,OAAO,kCAAkC,MAAM,EAAE,2BAA2B,sBAAsB,CAAC,CACpG;;AAGD,IAAa,gCAAgC,wBAC3C,OAAO,kCAAkC,MAAM,EAAE,8BAA8B,yBAAyB,CAAC,CAC1G;;;;;;;;;AAUD,IAAa,uBAAuB,kBAAkB,OAAO,UAA4B,EAAE,KAAK;CAC9F,MAAM,KAAK,SAAS,cAAc,MAAM;AACxC,IAAG,YAAY;AACf,UAAS,KAAK,YAAY,GAAG;AAE7B,KAAI;EACF,MAAM,CAAC,aAAa,gBAAgB,YAAY,MAAM,QAAQ,IAAI;GAChE,uBAAuB;GACvB,4BAA4B;GAC5B,+BAAA;GACD,CAAC;AAWF,SAAO;GAAE,WATS,YAAY;IAC5B;IACA;IACA;IACA;IAGD,CAAC;GAEkB;GAAgB;UAC7B,OAAO;AACd,KAAG,QAAQ;AACX,QAAM;;EAER;;;AC3DF,WAAW,sBAAsB;AACjC,WAAW,0CAA0C;AACrD,WAAW,wBAAwB;;AAanC,IAAM,8BAAc,IAAI,KAAa;;;;;;;;;;;AAYrC,IAAa,gBAAgB,EAC3B,oBACoH;CACpH,MAAM,CAAC,QAAQ,aAAa,SAAqC,KAAA,EAAU;CAC3E,MAAM,CAAC,gBAAgB,qBAAqB,SAAqC,KAAA,EAAU;CAC3F,MAAM,kBAAkB,OAAO,GAAG;CAClC,MAAM,0BAA0B,OAAqC,KAAA,EAAU;;CAG/E,MAAM,QAAQ,YAA0B,QAAQ,KAAK;EAAE,cAAc,gBAAgB;EAAS,GAAG;EAAS,CAAC;AAE3G,iBAAgB;EACd,IAAI,YAAY;EAGhB,MAAM,EAAE,KAAK,GAAG,iBAAiB;AAE5B,uBAAqB,aAAa,EAAE,MAAM,YAAY;AACzD,OAAI,aAAa,CAAC,QAChB;GAKF,MAAM,OAAO,OAAO;AAIpB,WAAQ,UAAU,cAAc,cAAc,KAAK;AACnD,2BAAwB,UAAU;AAElC,aAAU,QAAQ,UAAU;AAC5B,qBAAkB,QAAQ,eAAe;AACzC,mBAAgB,UAAU;AAE1B,OAAI,QAAQ,CAAC,YAAY,IAAI,KAAK,EAAE;AAClC,gBAAY,IAAI,KAAK;AAChB,YAAQ,eAAe,YAAY;KAAE,MAAM;KAAM;KAAK,CAAC;;IAE9D;AAEF,eAAa;AACX,eAAY;;IAIb,EAAE,CAAC;AAGN,iBAAgB;AACd,MAAI,CAAC,UAAU,CAAC,eACd;EAGF,MAAM,OAAO,cAAc,OAAO;AAClC,kBAAgB,UAAU;AAE1B,MAAI,YAAY,IAAI,KAAK,CACvB;AAEF,cAAY,IAAI,KAAK;AAEhB,iBAAe,YAAY;GAAE,MAAM;GAAM,KAAK,cAAc;GAAK,CAAC;IACtE;EAAC;EAAQ,cAAc;EAAK;EAAe,CAAC;AAG/C,iBAAgB;AACd,MAAI,CAAC,UAAU,CAAC,cACd;EAGF,MAAM,EAAE,KAAK,GAAG,GAAG,iBAAiB;AACpC,MAAI,cAAc,wBAAwB,SAAS,aAAa,CAC9D;AAGF,SAAO,cAAc,cAAc,KAAK;AACxC,0BAAwB,UAAU;IACjC,CAAC,QAAQ,cAAc,CAAC;AAE3B,QAAO,SACH;EACE,GAAG;EACH;EACD,GACD,KAAA"}

package/dist/lazy-load.d.ts

@@ -1,4 +1,4 @@
-import type { ApiClientModalOptions } from '@scalar/api-client/modal';
+import type { ApiClientOptions } from '@scalar/api-client/modal';
 /** Lazy load the client modal creator */
 export declare const getClientModalCreator: () => Promise<({ el, eventBus, mountOnInitialize, plugins, workspaceStore, options, }: {
     el: HTMLElement | null;
@@ -6,7 +6,7 @@ export declare const getClientModalCreator: () => Promise<({ el, eventBus, mount
     eventBus?: import("@scalar/workspace-store/events").WorkspaceEventBus;
     workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore;
     plugins?: import("@scalar/oas-utils/helpers").ClientPlugin[];
-    options?: import("vue").MaybeRefOrGetter<ApiClientModalOptions>;
+    options?: import("vue").MaybeRefOrGetter<ApiClientOptions>;
 }) => import("@scalar/api-client/modal").ApiClientModal>;
 /** Module-scoped singleton workspace store (lazy-loaded on first use). */
 export declare const getWorkspaceStoreSingleton: () => Promise<import("@scalar/workspace-store/client").WorkspaceStore>;
@@ -20,7 +20,7 @@ export declare const getWorkspaceEventBusSingleton: () => Promise<import("@scala
  * (`url`, `content`) must be registered via `workspaceStore.addDocument` after the client
  * is ready — they are not part of the modal constructor.
  */
-export declare const getOrCreateApiClient: (options?: Partial<Pick<import("@scalar/types/api-reference").ApiReferenceConfigurationRaw, "authentication" | "baseServerURL" | "hideClientButton" | "proxyUrl" | "oauth2RedirectUri" | "servers" | "hiddenClients">> | undefined) => Promise<{
+export declare const getOrCreateApiClient: (options?: ApiClientOptions | undefined) => Promise<{
     apiClient: import("@scalar/api-client/modal").ApiClientModal;
     workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore;
 }>;

package/dist/lazy-load.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lazy-load.d.ts","sourceRoot":"","sources":["../src/lazy-load.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAA;AAsBrE,yCAAyC;AACzC,eAAO,MAAM,qBAAqB;;;;;;;wDAEjC,CAAA;AAED,0EAA0E;AAC1E,eAAO,MAAM,0BAA0B,wEAEtC,CAAA;AAED,8EAA8E;AAC9E,eAAO,MAAM,6BAA6B,2EAEzC,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB;;;EA0B/B,CAAA"}
+{"version":3,"file":"lazy-load.d.ts","sourceRoot":"","sources":["../src/lazy-load.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAsBhE,yCAAyC;AACzC,eAAO,MAAM,qBAAqB;;;;;;;wDAEjC,CAAA;AAED,0EAA0E;AAC1E,eAAO,MAAM,0BAA0B,wEAEtC,CAAA;AAED,8EAA8E;AAC9E,eAAO,MAAM,6BAA6B,2EAEzC,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,oBAAoB;;;EA0B/B,CAAA"}

package/dist/style.css

@@ -2564,8 +2564,8 @@
 .scalar-app .left-2\.5 {
   left: 10px;
 }
-.scalar-app .left-4 {
-  left: 16px;
+.scalar-app .left-3 {
+  left: 12px;
 }
 .scalar-app .left-border {
   left: var(--scalar-border-width);
@@ -3616,6 +3616,9 @@
 .scalar-app .top-4 {
   top: 16px;
 }
+.scalar-app .top-14 {
+  top: 56px;
+}
 .scalar-app .top-\[calc\(100\%\+4px\)\] {
   top: calc(100% + 4px);
 }
@@ -3661,8 +3664,8 @@
 .scalar-app .left-2 {
   left: 8px;
 }
-.scalar-app .left-3 {
-  left: 12px;
+.scalar-app .left-4 {
+  left: 16px;
 }
 .scalar-app .-z-1 {
   z-index: calc(1 * -1);
@@ -3673,9 +3676,6 @@
 .scalar-app .z-1 {
   z-index: 1;
 }
-.scalar-app .z-2 {
-  z-index: 2;
-}
 .scalar-app .z-10 {
   z-index: 10;
   z-index: 10;
@@ -3684,12 +3684,12 @@
   z-index: 50;
   z-index: 50;
 }
+.scalar-app .z-60 {
+  z-index: 60;
+}
 .scalar-app .z-\[1\] {
   z-index: 1;
 }
-.scalar-app .z-\[60\] {
-  z-index: 60;
-}
 .scalar-app .z-context {
   z-index: 1000;
 }
@@ -4031,6 +4031,9 @@
 .scalar-app .h-full {
   height: 100%;
 }
+.scalar-app .h-header {
+  height: 48px;
+}
 .scalar-app .h-min {
   height: min-content;
 }
@@ -5921,18 +5924,22 @@
     position: absolute !important;
   }
 
-  .scalar-app .max-md\:fixed\! {
-    position: fixed !important;
-  }
-
   .scalar-app .max-md\:inset-y-0 {
     inset-block: 0;
   }
 
+  .scalar-app .max-md\:top-4 {
+    top: 16px;
+  }
+
   .scalar-app .max-md\:z-2 {
     z-index: 2;
   }
 
+  .scalar-app .max-md\:z-5 {
+    z-index: 5;
+  }
+
   .scalar-app .max-md\:flex\! {
     display: flex !important;
   }
@@ -5945,9 +5952,25 @@
     width: 100% !important;
   }
 
+  .scalar-app .max-md\:pt-2 {
+    padding-top: 8px;
+  }
+
   .scalar-app .max-md\:pt-12 {
     padding-top: 48px;
   }
+
+  .scalar-app .max-md\:pl-4\! {
+    padding-left: 16px !important;
+  }
+
+  .scalar-app .max-md\:pl-10 {
+    padding-left: 40px;
+  }
+
+  .scalar-app .max-md\:pl-14 {
+    padding-left: 56px;
+  }
 }
 @media (min-width: 600px) {
   .scalar-app .sm\:not-sr-only {
@@ -6298,23 +6321,23 @@
 /*
    Deep styling for customizing Codemirror
   */
-[data-v-167b1bd5] .cm-editor {
+[data-v-6499ec1f] .cm-editor {
   height: 100%;
   outline: none;
   padding: 0;
   background: transparent;
 }
-[data-v-167b1bd5] .cm-placeholder {
+[data-v-6499ec1f] .cm-placeholder {
   color: var(--scalar-color-3);
 }
-[data-v-167b1bd5] .cm-content {
+[data-v-6499ec1f] .cm-content {
   font-family: var(--scalar-font-code);
   font-size: var(--scalar-small);
   max-height: 20px;
   padding: 8px 0;
 }
 /* Tooltip helper */
-[data-v-167b1bd5] .cm-tooltip {
+[data-v-6499ec1f] .cm-tooltip {
   background: transparent !important;
   filter: brightness(var(--scalar-lifted-brightness));
   border-radius: var(--scalar-radius);
@@ -6323,43 +6346,43 @@
   outline: none !important;
   overflow: hidden !important;
 }
-[data-v-167b1bd5] .cm-tooltip-autocomplete ul li {
+[data-v-6499ec1f] .cm-tooltip-autocomplete ul li {
   padding: 3px 6px !important;
 }
-[data-v-167b1bd5] .cm-completionIcon-type:after {
+[data-v-6499ec1f] .cm-completionIcon-type:after {
   color: var(--scalar-color-3) !important;
 }
-[data-v-167b1bd5] .cm-tooltip-autocomplete ul li[aria-selected] {
+[data-v-6499ec1f] .cm-tooltip-autocomplete ul li[aria-selected] {
   background: var(--scalar-background-2) !important;
   color: var(--scalar-color-1) !important;
 }
-[data-v-167b1bd5] .cm-tooltip-autocomplete ul {
+[data-v-6499ec1f] .cm-tooltip-autocomplete ul {
   padding: 6px !important;
   position: relative;
 }
-[data-v-167b1bd5] .cm-tooltip-autocomplete ul li:hover {
+[data-v-6499ec1f] .cm-tooltip-autocomplete ul li:hover {
   border-radius: 3px;
   color: var(--scalar-color-1) !important;
   background: var(--scalar-background-3) !important;
 }
 /* Disable active line highlighting */
-[data-v-167b1bd5] .cm-activeLine,[data-v-167b1bd5] .cm-activeLineGutter {
+[data-v-6499ec1f] .cm-activeLine,[data-v-6499ec1f] .cm-activeLineGutter {
   background-color: transparent;
 }
 /* Color selection matching */
-[data-v-167b1bd5] .cm-selectionMatch,[data-v-167b1bd5] .cm-matchingBracket {
+[data-v-6499ec1f] .cm-selectionMatch,[data-v-6499ec1f] .cm-matchingBracket {
   border-radius: var(--scalar-radius);
   background: var(--scalar-background-4) !important;
 }
 /* Color Picker Swatches */
-[data-v-167b1bd5] .cm-css-color-picker-wrapper {
+[data-v-6499ec1f] .cm-css-color-picker-wrapper {
   display: inline-flex;
   outline: 1px solid var(--scalar-background-3);
   border-radius: 3px;
   overflow: hidden;
 }
 /* Number gutter */
-[data-v-167b1bd5] .cm-gutters {
+[data-v-6499ec1f] .cm-gutters {
   background-color: transparent;
   border-right: none;
   color: var(--scalar-color-3);
@@ -6367,7 +6390,7 @@
   line-height: 22px;
   border-radius: 0 0 0 3px;
 }
-[data-v-167b1bd5] .cm-gutters:before {
+[data-v-6499ec1f] .cm-gutters:before {
   content: '';
   position: absolute;
   top: 2px;
@@ -6377,7 +6400,7 @@
   border-radius: var(--scalar-radius) 0 0 var(--scalar-radius);
   background-color: var(--scalar-background-1);
 }
-[data-v-167b1bd5] .cm-gutterElement {
+[data-v-6499ec1f] .cm-gutterElement {
   font-family: var(--scalar-font-code) !important;
   padding-left: 0px !important;
   padding-right: 6px !important;
@@ -6386,16 +6409,16 @@
   justify-content: flex-end;
   position: relative;
 }
-[data-v-167b1bd5] .cm-lineNumbers .cm-gutterElement {
+[data-v-6499ec1f] .cm-lineNumbers .cm-gutterElement {
   min-width: fit-content;
 }
-[data-v-167b1bd5] .cm-gutter + .cm-gutter :not(.cm-foldGutter) .cm-gutterElement {
+[data-v-6499ec1f] .cm-gutter + .cm-gutter :not(.cm-foldGutter) .cm-gutterElement {
   padding-left: 0 !important;
 }
-[data-v-167b1bd5] .cm-scroller {
+[data-v-6499ec1f] .cm-scroller {
   overflow: auto;
 }
-.line-wrapping[data-v-167b1bd5]:focus-within .cm-content {
+.line-wrapping[data-v-6499ec1f]:focus-within .cm-content {
   display: inline-table;
   min-height: fit-content;
   padding: 3px 6px;
@@ -6712,7 +6735,7 @@
     var(--scalar-background-2) 20px
   );
 }
-[data-v-e861924b] .cm-content {
+[data-v-06778e40] .cm-content {
   font-size: var(--scalar-small);
 }
 .form-group[data-v-678c9f4a] {
@@ -6730,10 +6753,10 @@
   -ms-overflow-style: none;
   scrollbar-width: none;
 }
-[data-v-3157c3c7] .cm-editor {
+[data-v-819cea32] .cm-editor {
   padding: 0;
 }
-[data-v-3157c3c7] .cm-content {
+[data-v-819cea32] .cm-content {
   align-items: center;
   background-color: transparent;
   display: flex;
@@ -6742,30 +6765,30 @@
   padding: 5px 8px;
   width: 100%;
 }
-[data-v-3157c3c7] .cm-content:has(.cm-pill) {
+[data-v-819cea32] .cm-content:has(.cm-pill) {
   padding: 5px 8px;
 }
-[data-v-3157c3c7] .cm-content .cm-pill:not(:last-of-type) {
+[data-v-819cea32] .cm-content .cm-pill:not(:last-of-type) {
   margin-right: 0.5px;
 }
-[data-v-3157c3c7] .cm-content .cm-pill:not(:first-of-type) {
+[data-v-819cea32] .cm-content .cm-pill:not(:first-of-type) {
   margin-left: 0.5px;
 }
-[data-v-3157c3c7] .cm-line {
+[data-v-819cea32] .cm-line {
   overflow: hidden;
   padding: 0;
   text-overflow: ellipsis;
   word-break: break-word;
 }
-.required[data-v-3157c3c7]::after {
+.required[data-v-819cea32]::after {
   content: 'Required';
 }
 /* Tailwind placeholder is busted */
-input[data-v-3157c3c7]::placeholder {
+input[data-v-819cea32]::placeholder {
   color: var(--scalar-color-3);
 }
 /* we want our inputs to look like a password input but not be one */
-.scalar-password-input[data-v-3157c3c7] {
+.scalar-password-input[data-v-819cea32] {
   text-security: disc;
   -webkit-text-security: disc;
   -moz-text-security: disc;
@@ -6910,33 +6933,33 @@ to {
     transform: translateY(0);
 }
 }
-.request-card[data-v-0e4ddc16] {
+.request-card[data-v-59da314d] {
   font-size: var(--scalar-font-size-3);
 }
-.request-method[data-v-0e4ddc16] {
+.request-method[data-v-59da314d] {
   font-family: var(--scalar-font-code);
   text-transform: uppercase;
   margin-right: 6px;
 }
-.request-card-footer[data-v-0e4ddc16] {
+.request-card-footer[data-v-59da314d] {
   display: flex;
   justify-content: flex-end;
   padding: 6px;
   flex-shrink: 0;
   position: relative;
 }
-.request-card-footer-addon[data-v-0e4ddc16] {
+.request-card-footer-addon[data-v-59da314d] {
   display: flex;
   align-items: center;
 
   flex: 1;
   min-width: 0;
 }
-.request-editor-section[data-v-0e4ddc16] {
+.request-editor-section[data-v-59da314d] {
   display: flex;
   flex: 1;
 }
-.request-card-simple[data-v-0e4ddc16] {
+.request-card-simple[data-v-59da314d] {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -6945,7 +6968,7 @@ to {
 
   font-size: var(--scalar-small);
 }
-.code-snippet[data-v-0e4ddc16] {
+.code-snippet[data-v-59da314d] {
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -6994,27 +7017,27 @@ to {
 .dark-mode .download-app-button[data-v-9b609275]:hover {
   background: linear-gradient(rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0.1));
 }
-.empty-sidebar-item-content[data-v-96a54993] {
+.empty-sidebar-item-content[data-v-8269f62b] {
   display: none;
 }
-.empty-sidebar-item .empty-sidebar-item-content[data-v-96a54993] {
+.empty-sidebar-item .empty-sidebar-item-content[data-v-8269f62b] {
   display: block;
 }
-.rabbitjump[data-v-96a54993] {
+.rabbitjump[data-v-8269f62b] {
   opacity: 0;
 }
-.empty-sidebar-item:hover .rabbitjump[data-v-96a54993] {
+.empty-sidebar-item:hover .rabbitjump[data-v-8269f62b] {
   opacity: 1;
-  animation: rabbitAnimation-96a54993 0.5s steps(1) infinite;
+  animation: rabbitAnimation-8269f62b 0.5s steps(1) infinite;
 }
-.empty-sidebar-item:hover .rabbitsit[data-v-96a54993] {
+.empty-sidebar-item:hover .rabbitsit[data-v-8269f62b] {
   opacity: 0;
-  animation: rabbitAnimation2-96a54993 0.5s steps(1) infinite;
+  animation: rabbitAnimation2-8269f62b 0.5s steps(1) infinite;
 }
-.empty-sidebar-item:hover .rabbit-ascii[data-v-96a54993] {
-  animation: rabbitRun-96a54993 8s infinite linear;
+.empty-sidebar-item:hover .rabbit-ascii[data-v-8269f62b] {
+  animation: rabbitRun-8269f62b 8s infinite linear;
 }
-@keyframes rabbitRun-96a54993 {
+@keyframes rabbitRun-8269f62b {
 0% {
     transform: translate3d(0, 0, 0);
 }
@@ -7034,7 +7057,7 @@ to {
     transform: translate3d(0, 0, 0);
 }
 }
-@keyframes rabbitAnimation-96a54993 {
+@keyframes rabbitAnimation-8269f62b {
 0%,
   100% {
     opacity: 1;
@@ -7043,7 +7066,7 @@ to {
     opacity: 0;
 }
 }
-@keyframes rabbitAnimation2-96a54993 {
+@keyframes rabbitAnimation2-8269f62b {
 0%,
   100% {
     opacity: 0;
@@ -7400,15 +7423,15 @@ to {
 .full-size-styles:has(.sync-conflict-modal-root)::after {
   display: none;
 }
-.scalar-collection-auth[data-v-6bba6b78] {
+.scalar-collection-auth[data-v-d3bc49bd] {
   border: var(--scalar-border-width) solid var(--scalar-border-color);
   border-radius: var(--scalar-radius-lg);
   overflow: hidden;
 }
-[data-v-ddfccc08] .cm-editor {
+[data-v-2f13118d] .cm-editor {
   padding: 0;
 }
-[data-v-ddfccc08] .cm-content {
+[data-v-2f13118d] .cm-content {
   align-items: center;
   background-color: transparent;
   display: flex;
@@ -7417,16 +7440,16 @@ to {
   padding: 5px 8px;
   width: 100%;
 }
-[data-v-ddfccc08] .cm-content:has(.cm-pill) {
+[data-v-2f13118d] .cm-content:has(.cm-pill) {
   padding: 5px 8px;
 }
-[data-v-ddfccc08] .cm-content .cm-pill:not(:last-of-type) {
+[data-v-2f13118d] .cm-content .cm-pill:not(:last-of-type) {
   margin-right: 0.5px;
 }
-[data-v-ddfccc08] .cm-content .cm-pill:not(:first-of-type) {
+[data-v-2f13118d] .cm-content .cm-pill:not(:first-of-type) {
   margin-left: 0.5px;
 }
-[data-v-ddfccc08] .cm-line {
+[data-v-2f13118d] .cm-line {
   overflow: hidden;
   padding: 0;
   text-overflow: ellipsis;

package/dist/use-api-client.d.ts

@@ -1,6 +1,6 @@
-import type { ApiClientModal, ApiClientModalOptions, RoutePayload } from '@scalar/api-client/modal';
+import type { ApiClientModal, ApiClientOptions, RoutePayload } from '@scalar/api-client/modal';
 import './style.css';
-export type ApiClientConfigurationReact = ApiClientModalOptions & {
+export type ApiClientConfigurationReact = ApiClientOptions & {
     url: string;
 };
 export type UseApiClientModalProps = {

package/dist/use-api-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-api-client.d.ts","sourceRoot":"","sources":["../src/use-api-client.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,qBAAqB,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAGnG,OAAO,aAAa,CAAA;AAWpB,MAAM,MAAM,2BAA2B,GAAG,qBAAqB,GAAG;IAEhE,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,+DAA+D;IAC/D,aAAa,EAAE,2BAA2B,CAAA;CAC3C,CAAA;AAKD;;;;;;;;;GASG;AACH,eAAO,MAAM,YAAY,GAAI,oBAE1B,sBAAsB,KAAG,CAAC,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAAE,IAAI,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAA;CAAE,CAAC,GAAG,SAoFxG,CAAA"}
+{"version":3,"file":"use-api-client.d.ts","sourceRoot":"","sources":["../src/use-api-client.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAG9F,OAAO,aAAa,CAAA;AAWpB,MAAM,MAAM,2BAA2B,GAAG,gBAAgB,GAAG;IAE3D,GAAG,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,sBAAsB,GAAG;IACnC,+DAA+D;IAC/D,aAAa,EAAE,2BAA2B,CAAA;CAC3C,CAAA;AAKD;;;;;;;;;GASG;AACH,eAAO,MAAM,YAAY,GAAI,oBAE1B,sBAAsB,KAAG,CAAC,IAAI,CAAC,cAAc,EAAE,MAAM,CAAC,GAAG;IAAE,IAAI,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAA;CAAE,CAAC,GAAG,SAoFxG,CAAA"}

package/package.json

@@ -19,7 +19,7 @@
     "testing",
     "react"
   ],
-  "version": "2.0.3",
+  "version": "2.0.5",
   "engines": {
     "node": ">=22"
   },
@@ -39,9 +39,9 @@
     "CHANGELOG.md"
   ],
   "dependencies": {
-    "@scalar/helpers": "0.5.1",
-    "@scalar/api-client": "3.1.0",
-    "@scalar/workspace-store": "0.46.1"
+    "@scalar/api-client": "3.2.1",
+    "@scalar/workspace-store": "0.46.2",
+    "@scalar/helpers": "0.5.1"
   },
   "devDependencies": {
     "@testing-library/dom": "^10.4.1",