@cntrl-site/sdk-nextjs 0.12.9 → 0.14.0

package/src/utils/Youtube/YoutubeIframeApi.ts

@@ -0,0 +1,101 @@
+export interface YT {
+  Player: YTPlayerConstructor;
+}
+
+export interface YTPlayerConstructor {
+  new(container: string | Element, params: YTPlayerParams): YTPlayer;
+}
+
+export interface YTEvent<Data> {
+  target: YTPlayer;
+  data: Data;
+}
+
+type YTBool = 0 | 1 | '0' | '1';
+
+export interface YTPlayerParams {
+  width?: string | number;
+  height?: string | number;
+  videoId?: string;
+  playerVars?: Partial<{
+    autoplay: YTBool;
+    cc_lang_pref: string;
+    cc_load_policy: YTBool;
+    color: string;
+    controls: YTBool;
+    disablekb: YTBool;
+    enablejsapi: YTBool;
+    end: number | string;
+    fs: YTBool;
+    hl: string;
+    iv_load_policy: 1 | 3 | '1' | '3';
+    list: string;
+    listType: 'playlist' | 'user_uploads';
+    loop: YTBool;
+    origin: string;
+    playlist: string;
+    playsinline: YTBool;
+    rel: YTBool;
+    start: number | string;
+    widget_referrer: string;
+  }>;
+  events?: Partial<{
+    onReady: (event: YTEvent<void>) => void;
+    onStateChange: (event: YTEvent<YTPlayerState>) => void;
+  }>
+}
+
+export enum YTPlayerState {
+  Unstarted = -1,
+  Ended = 0,
+  Playing = 1,
+  Paused = 2,
+  Buffering = 3,
+  VideoCued = 5
+}
+
+export interface YTPlayer {
+  loadVideoById(videoId: string, startSeconds?: number): void;
+  loadVideoById(params: {
+    videoId: string;
+    startSeconds?: number;
+    endSeconds?: number;
+  }): void;
+
+  loadVideoByUrl(mediaContentUrl: string, startSeconds?: number): void;
+  loadVideoByUrl(params: {
+    mediaContentUrl: string;
+    startSeconds?: number;
+    endSeconds?: number;
+  }): void;
+
+  playVideo(): void;
+  pauseVideo(): void;
+  stopVideo(): void;
+  seekTo(seconds: number, allowSeekAhead: boolean): void;
+
+  mute(): void;
+  unMute(): void;
+  isMuted(): void;
+  setVolume(volume: number): void;
+  getVolume(): void;
+  setSize(width: number, height: number): void;
+  setLoop(loopPlaylists: boolean): void;
+
+  getVideoLoadedFraction(): number;
+  getPlayerState(): YTPlayerState;
+
+  getDuration(): number; // in seconds
+  getVideoUrl(): string;
+  getVideoEmbedCode(): string;
+
+  getIframe(): HTMLIFrameElement | undefined;
+  destroy(): void;
+}
+
+declare global {
+  interface Window {
+    YT?: YT;
+    onYouTubeIframeAPIReady?: () => void;
+  }
+}

package/src/utils/Youtube/useYouTubeIframeApi.ts

@@ -0,0 +1,12 @@
+import { useEffect, useState } from 'react';
+import { YT } from './YoutubeIframeApi';
+import { YouTubeIframeApiLoader } from './YouTubeIframeApiLoader';
+
+export function useYouTubeIframeApi(): YT | undefined {
+  const [YT, setYT] = useState<YT | undefined>(undefined);
+  useEffect(() => {
+    const loader = YouTubeIframeApiLoader.create();
+    loader.getApi().then((YT) => setYT(YT));
+  }, []);
+  return YT;
+}

package/src/utils/getItemTopStyle.ts

@@ -0,0 +1,14 @@
+import { AnchorSide } from '@cntrl-site/sdk';
+
+export function getItemTopStyle(top: number, anchorSide?: AnchorSide) {
+  const defaultValue = `${top * 100}vw`;
+  if (!anchorSide) return defaultValue;
+  switch (anchorSide) {
+    case AnchorSide.Top:
+      return defaultValue;
+    case AnchorSide.Center:
+      return `calc(50% + ${top * 100}vw)`;
+    case AnchorSide.Bottom:
+      return `calc(100% + ${top * 100}vw)`;
+  }
+}

package/.idea/inspectionProfiles/Project_Default.xml

@@ -1,15 +0,0 @@
-<component name="InspectionProjectProfileManager">
-  <profile version="1.0">
-    <option name="myName" value="Project Default" />
-    <inspection_tool class="HtmlUnknownAttribute" enabled="true" level="WARNING" enabled_by_default="true">
-      <option name="myValues">
-        <value>
-          <list size="1">
-            <item index="0" class="java.lang.String" itemvalue="jsx" />
-          </list>
-        </value>
-      </option>
-      <option name="myCustomValuesEnabled" value="true" />
-    </inspection_tool>
-  </profile>
-</component>