@streamscloud/embeddable 2.3.1 → 2.4.0

package/dist/core/graphql.d.ts

@@ -1,2 +1,4 @@
-export declare const createLocalGQLClient: (graphqlUrl?: string, customFetch?: typeof fetch) => import("@urql/core").Client;
-export declare const resolveGraphQLUrl: (url?: string) => string;
+export declare const createLocalGQLClient: (graphqlOrigin?: string, customFetch?: typeof fetch) => import("@urql/core").Client;
+export declare const resolveGraphQLOrigin: (origin?: string) => string;
+export declare const constructCoreGraphQLUrl: (graphqlOrigin?: string) => string;
+export declare const constructExternalGraphQLUrl: (graphqlOrigin?: string) => string;

package/dist/core/graphql.js

@@ -1,6 +1,6 @@
 import { createClient, fetchExchange } from '@urql/core';
-export const createLocalGQLClient = (graphqlUrl, customFetch) => createClient({
-    url: resolveGraphQLUrl(graphqlUrl),
+export const createLocalGQLClient = (graphqlOrigin, customFetch) => createClient({
+    url: constructCoreGraphQLUrl(resolveGraphQLOrigin(graphqlOrigin)),
     requestPolicy: 'network-only',
     fetchOptions: {
         credentials: 'include'
@@ -8,6 +8,16 @@ export const createLocalGQLClient = (graphqlUrl, customFetch) => createClient({
     fetch: customFetch || fetch,
     exchanges: [fetchExchange]
 });
-export const resolveGraphQLUrl = (url) => {
-    return url || 'https://api.streamscloud.com/graphql';
+export const resolveGraphQLOrigin = (origin) => {
+    return origin || 'https://api.streamscloud.com';
+};
+export const constructCoreGraphQLUrl = (graphqlOrigin) => {
+    let baseUrl = resolveGraphQLOrigin(graphqlOrigin);
+    baseUrl = baseUrl.endsWith('/') ? baseUrl : `${baseUrl}/`;
+    return `${baseUrl}graphql`;
+};
+export const constructExternalGraphQLUrl = (graphqlOrigin) => {
+    let baseUrl = resolveGraphQLOrigin(graphqlOrigin);
+    baseUrl = baseUrl.endsWith('/') ? baseUrl : `${baseUrl}/`;
+    return `${baseUrl}external/graphql`;
 };

package/dist/short-videos/short-videos-player/cmp.short-videos-player.svelte

@@ -10,12 +10,12 @@
 import { handleEsc } from '../../core/document.event-handlers';
 import { createLocalGQLClient } from '../../core/graphql';
 import { mapShortVideoViewerModel, ShortVideoViewer } from '../short-video-viewer';
-import { GetShortVideosDocument } from './operations.generated';
 import { Loading } from '../../ui/loading';
 import { PlayerBuffer, PlayerSlider } from '../../ui/player';
 import { SpotlightLayout } from '../../ui/spotlight-layout';
 import { SwipeIndicator } from '../../ui/swipe-indicator';
 import { default as Controls } from './controls.svelte';
+import { GetShortVideosDocument } from './operations.generated';
 import { ShortVideosPlayerLocalization } from './short-videos-player-localization.svelte';
 import { ShortVideosPlayerUiManager } from './ui-manager.svelte';
 import { onMount, untrack } from 'svelte';
@@ -24,8 +24,9 @@ const localization = $derived(new ShortVideosPlayerLocalization(localizationInit
 let everTouched = $state(false);
 let buffer = $state(input.type === 'provider' ? new PlayerBuffer(input.provider) : null);
 $effect(() => {
-    if (input.type !== 'ids')
+    if (input.type !== 'ids') {
         return;
+    }
     untrack(() => {
         initBuffer(input);
     });
@@ -33,8 +34,8 @@ $effect(() => {
 const initBuffer = (input) => __awaiter(void 0, void 0, void 0, function* () {
     var _a, _b;
     try {
-        const { graphqlUrl, ids, initialId } = input;
-        const graphql = createLocalGQLClient(graphqlUrl);
+        const { graphqlOrigin, ids, initialId } = input;
+        const graphql = createLocalGQLClient(graphqlOrigin);
         const payload = yield graphql
             .query(GetShortVideosDocument, {
             input: {

package/dist/short-videos/short-videos-player/cmp.short-videos-player.svelte.d.ts

@@ -1,5 +1,5 @@
-import type { PlayerInput } from './types';
 import { type IShortVideosPlayerLocalization } from './short-videos-player-localization.svelte';
+import type { PlayerInput } from './types';
 type Props = {
     input: PlayerInput;
     localization?: IShortVideosPlayerLocalization;

package/dist/short-videos/short-videos-player/index.d.ts

@@ -1,5 +1,5 @@
-import { type OpenShortVideosPlayerInit } from './types';
 import type { IShortVideosPlayerLocalization } from './short-videos-player-localization.svelte';
+import { type OpenShortVideosPlayerInit } from './types';
 export type { IShortVideosPlayerLocalization };
 /**
  * Opens the short videos player modal with the specified provider or by fetching videos by IDs.
@@ -51,7 +51,7 @@ export type { IShortVideosPlayerLocalization };
  *
  * openShortVideosPlayer({
  *   ids: ['id1', 'id2', 'id3'],
- *   graphqlUrl: 'https://api.example.com/graphql',
+ *   graphqlOrigin: 'https://api.example.com',
  *   initialId: 'id2',
  *   localization: {
  *     next: 'Next',

package/dist/short-videos/short-videos-player/index.js

@@ -1,7 +1,7 @@
-import { isIdsInit, isShortVideosProviderInit } from './types';
 import { ShadowHost } from '../../ui/shadow-dom';
-import { mount, unmount } from 'svelte';
 import { default as ShortVideosPlayer } from './cmp.short-videos-player.svelte';
+import { isIdsInit, isShortVideosProviderInit } from './types';
+import { mount, unmount } from 'svelte';
 /**
  * Opens the short videos player modal with the specified provider or by fetching videos by IDs.
  *
@@ -52,7 +52,7 @@ import { default as ShortVideosPlayer } from './cmp.short-videos-player.svelte';
  *
  * openShortVideosPlayer({
  *   ids: ['id1', 'id2', 'id3'],
- *   graphqlUrl: 'https://api.example.com/graphql',
+ *   graphqlOrigin: 'https://api.example.com',
  *   initialId: 'id2',
  *   localization: {
  *     next: 'Next',
@@ -79,7 +79,7 @@ export const openShortVideosPlayer = async (init) => {
             type: 'ids',
             ids: init.ids,
             initialId: init.initialId,
-            graphqlUrl: init.graphqlUrl
+            graphqlOrigin: init.graphqlOrigin
         };
     }
     else {

package/dist/short-videos/short-videos-player/types.d.ts

@@ -1,6 +1,6 @@
 import type { ShortVideoViewerModel } from '../..';
-import type { IShortVideosPlayerLocalization } from './short-videos-player-localization.svelte';
 import type { PlayerItemsProvider } from '../../ui/player';
+import type { IShortVideosPlayerLocalization } from './short-videos-player-localization.svelte';
 export type PlayerInput = ProviderPlayerInput | IdsPlayerInput;
 export type ProviderPlayerInput = {
     type: 'provider';
@@ -10,7 +10,7 @@ export type IdsPlayerInput = {
     type: 'ids';
     ids: string[];
     initialId?: string;
-    graphqlUrl?: string;
+    graphqlOrigin?: string;
 };
 export type OpenShortVideosPlayerInit = ProviderInit | IdsInit;
 type ProviderInit = {
@@ -22,7 +22,7 @@ type ProviderInit = {
 };
 type IdsInit = {
     ids: string[];
-    graphqlUrl?: string;
+    graphqlOrigin?: string;
     initialId?: string;
     localization?: IShortVideosPlayerLocalization;
     on?: {

package/dist/streams/stream-player/cmp.stream-player.svelte

@@ -9,7 +9,7 @@
 };
 import { getOrCreateProfileId } from '../../core/analytics.profile-id';
 import { handleEsc } from '../../core/document.event-handlers';
-import { createLocalGQLClient, resolveGraphQLUrl } from '../../core/graphql';
+import { constructExternalGraphQLUrl, createLocalGQLClient } from '../../core/graphql';
 import { toastrWarning } from '../../core/toastr';
 import { ShortVideoViewer } from '../../short-videos/short-video-viewer';
 import { mapToShortVideoViewerModel } from '../layout/models';
@@ -25,9 +25,9 @@ import { default as Overview } from './stream-overview.svelte';
 import { StreamPlayerBuffer } from './stream-player-buffer.svelte';
 import { StreamPlayerLocalization } from './stream-player-localization.svelte';
 import { StreamPlayerUiManager } from './ui-manager.svelte';
-import { onMount } from 'svelte';
 import { AppEventsTracker } from '@streamscloud/streams-analytics-collector';
-let { streamId, graphqlUrl, localization: localizationInit, on } = $props();
+import { onMount } from 'svelte';
+let { streamId, graphqlOrigin, localization: localizationInit, on } = $props();
 const localization = $derived(new StreamPlayerLocalization(localizationInit));
 let model = $state(null);
 let buffer = $state.raw(null);
@@ -56,14 +56,14 @@ onMount(() => __awaiter(void 0, void 0, void 0, function* () {
     var _a, _b, _c, _d;
     uiManager.overviewCollapsed = window && window.innerWidth < window.innerHeight;
     try {
-        const graphql = createLocalGQLClient(graphqlUrl);
+        const graphql = createLocalGQLClient(graphqlOrigin);
         const streamPayload = yield graphql.query(GetStreamDocument, { id: streamId }).toPromise();
         if (!((_a = streamPayload.data) === null || _a === void 0 ? void 0 : _a.stream)) {
             toastrWarning(localization.streamNotFound);
             (_b = on === null || on === void 0 ? void 0 : on.closePlayer) === null || _b === void 0 ? void 0 : _b.call(on);
             return;
         }
-        AppEventsTracker.setEndpoint(resolveGraphQLUrl(graphqlUrl));
+        AppEventsTracker.setEndpoint(constructExternalGraphQLUrl(graphqlOrigin));
         AppEventsTracker.setProfileId(getOrCreateProfileId());
         (_c = on === null || on === void 0 ? void 0 : on.streamActivated) === null || _c === void 0 ? void 0 : _c.call(on, {
             ownerId: streamPayload.data.stream.ownerProfile.id,

package/dist/streams/stream-player/cmp.stream-player.svelte.d.ts

@@ -2,7 +2,7 @@ import { type IStreamPlayerLocalization } from './stream-player-localization.sve
 type Props = {
     streamId: string;
     localization?: IStreamPlayerLocalization;
-    graphqlUrl?: string;
+    graphqlOrigin?: string;
     on?: {
         closePlayer?: () => void;
         streamActivated?: (data: {

package/dist/streams/stream-player/index.d.ts

@@ -15,7 +15,7 @@ export type { IStreamPlayerLocalization };
  *
  * openStreamPlayer({
  *   streamId: '...',
- *   graphqlUrl: 'https://api.example.com/graphql',
+ *   graphqlOrigin: 'https://api.example.com',
  *   localization: {
  *     play: 'Play',
  *     pause: 'Pause'
@@ -25,7 +25,7 @@ export type { IStreamPlayerLocalization };
  */
 export declare const openStreamPlayer: (init: {
     streamId: string;
-    graphqlUrl?: string;
+    graphqlOrigin?: string;
     localization?: IStreamPlayerLocalization;
     on?: {
         streamActivated?: (data: {

package/dist/streams/stream-player/index.js

@@ -17,7 +17,7 @@ import { mount, unmount } from 'svelte';
  *
  * openStreamPlayer({
  *   streamId: '...',
- *   graphqlUrl: 'https://api.example.com/graphql',
+ *   graphqlOrigin: 'https://api.example.com',
  *   localization: {
  *     play: 'Play',
  *     pause: 'Pause'
@@ -26,13 +26,13 @@ import { mount, unmount } from 'svelte';
  * ```
  */
 export const openStreamPlayer = (init) => {
-    const { streamId, graphqlUrl, localization } = init;
+    const { streamId, graphqlOrigin, localization } = init;
     const shadowHost = new ShadowHost();
     const mounted = mount(StreamPlayer, {
         target: shadowHost.shadowRoot,
         props: {
             streamId,
-            graphqlUrl,
+            graphqlOrigin,
             localization,
             on: {
                 streamActivated: (data) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamscloud/embeddable",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "author": "StreamsCloud",
   "repository": "https://github.com/StreamsCloud/streamscloud-frontend-packages.git",
   "type": "module",