bunnyhls 1.0.0

package/README.md

@@ -0,0 +1,123 @@
+# bunnyHLS
+
+A full-stack npm package for BunnyNet HLS video playback with React components and Next.js API handlers.
+
+## Installation
+
+```bash
+npm install bunnyhls
+```
+
+## Features
+
+- 🎥 React component for HLS video playback with auto-token refresh
+- 🔐 Server-side URL signing handler for Next.js
+- 🔄 Automatic token refresh on 403 errors
+- 📦 TypeScript support
+- ⚡ Works with both Next.js App Router and Pages Router
+
+## Usage
+
+### Step 1: Create the API Route
+
+#### Next.js Pages Router (`/app/api/video-token.js`)
+
+```javascript
+import { createBunnyHandler } from 'bunnyhls/server';
+
+export default createBunnyHandler(process.env.BUNNY_SECURITY_KEY);
+```
+
+#### Next.js App Router (`/app/api/video-token/route.ts`)
+
+```typescript
+import { createBunnyHandler } from 'bunnyhls/server';
+import { NextRequest } from 'next/server';
+
+const handler = createBunnyHandler({
+  securityKey: process.env.BUNNY_SECURITY_KEY!,
+  libraryHost: process.env.LIBRARY_HOST,  //eg. hvz-c561dc91-370.b-cdn.net
+  expirationTime: 3600, // optional, default: 3600
+  isDirectory: true // optional, default: true
+});
+
+export async function GET(request: NextRequest) {
+  return handler(request);
+}
+```
+
+### Step 2: Use the Component
+
+#### Next.js App Router (`/app/page.tsx`)
+
+```tsx
+import { BunnyVideoPlayer } from 'bunnyhls/client';
+
+export default function Page() {
+  return (
+    <BunnyVideoPlayer 
+      videoId="7f142e98-c6df-4e3c-8ee4-9b98b6abf73f"
+      tokenUrl="/api/video-token"
+    />
+  );
+}
+```
+
+
+## API
+
+### `BunnyVideoPlayer` Component
+
+Props:
+
+- `videoId` (string, required): The BunnyNet video ID
+- `tokenUrl` (string, required): The API endpoint that returns signed URLs
+- `libraryHost` (string, required): Your BunnyNet library host
+- `controls` (boolean, optional): Show video controls (default: `true`)
+- `style` (CSSProperties, optional): Custom styles for the video element
+- `className` (string, optional): Custom CSS class for the video element
+
+### `createBunnyHandler` Function
+
+Creates a handler function for your API route.
+
+**Simple usage:**
+```javascript
+createBunnyHandler(securityKey)
+```
+
+**Advanced usage:**
+```javascript
+createBunnyHandler({
+  securityKey: 'your-security-key',
+  libraryHost: 'vz-c561dc91-370.b-cdn.net',
+  expirationTime: 3600,
+  isDirectory: true
+})
+```
+
+Options:
+
+- `securityKey` (string, required): Your BunnyNet security key
+- `libraryHost` (string, optional): Your BunnyNet library host
+- `expirationTime` (number, optional): Token expiration time in seconds (default: 3600)
+- `isDirectory` (boolean, optional): Whether to sign as directory (default: true)
+
+## Environment Variables
+
+Make sure to set your BunnyNet security key:
+
+```bash
+BUNNY_SECURITY_KEY=your-security-key-here
+```
+
+## How It Works
+
+1. The `BunnyVideoPlayer` component requests a signed URL from your API endpoint
+2. The API handler uses your security key to sign the HLS playlist URL
+3. The component loads the signed URL using hls.js
+4. If a 403 error occurs, the component automatically requests a new token and retries
+
+## License
+
+ISC

package/dist/client/index.d.mts

@@ -0,0 +1,12 @@
+import React from 'react';
+
+interface BunnyVideoPlayerProps {
+    videoId: string;
+    tokenUrl: string;
+    controls?: boolean;
+    style?: React.CSSProperties;
+    className?: string;
+}
+declare const BunnyVideoPlayer: React.FC<BunnyVideoPlayerProps>;
+
+export { BunnyVideoPlayer, type BunnyVideoPlayerProps };

package/dist/client/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+
+interface BunnyVideoPlayerProps {
+    videoId: string;
+    tokenUrl: string;
+    controls?: boolean;
+    style?: React.CSSProperties;
+    className?: string;
+}
+declare const BunnyVideoPlayer: React.FC<BunnyVideoPlayerProps>;
+
+export { BunnyVideoPlayer, type BunnyVideoPlayerProps };

package/dist/client/index.js

@@ -0,0 +1,107 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/client/index.ts
+var client_exports = {};
+__export(client_exports, {
+  BunnyVideoPlayer: () => BunnyVideoPlayer
+});
+module.exports = __toCommonJS(client_exports);
+
+// src/client/BunnyVideoPlayer.tsx
+var import_react = __toESM(require("react"));
+var import_hls = __toESM(require("hls.js"));
+var BunnyVideoPlayer = ({
+  videoId,
+  tokenUrl,
+  controls = true,
+  style,
+  className
+}) => {
+  const videoRef = (0, import_react.useRef)(null);
+  const hlsRef = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    if (!videoRef.current) return;
+    const hls = new import_hls.default();
+    hlsRef.current = hls;
+    const loadSourceWithToken = async () => {
+      try {
+        const res = await fetch(`${tokenUrl}?videoId=${videoId}`);
+        if (!res.ok) {
+          throw new Error(`Failed to fetch token: ${res.statusText}`);
+        }
+        const { signedUrl } = await res.json();
+        hls.loadSource(signedUrl);
+      } catch (error) {
+        console.error("Error loading video token:", error);
+      }
+    };
+    hls.attachMedia(videoRef.current);
+    loadSourceWithToken();
+    hls.on(import_hls.default.Events.ERROR, async (event, data) => {
+      if (data.fatal) {
+        switch (data.type) {
+          case import_hls.default.ErrorTypes.NETWORK_ERROR:
+            if (data.response?.code === 403) {
+              await loadSourceWithToken();
+              hls.startLoad();
+            } else {
+              hls.startLoad();
+            }
+            break;
+          case import_hls.default.ErrorTypes.MEDIA_ERROR:
+            hls.recoverMediaError();
+            break;
+          default:
+            hls.destroy();
+            break;
+        }
+      }
+    });
+    return () => {
+      if (hlsRef.current) {
+        hlsRef.current.destroy();
+        hlsRef.current = null;
+      }
+    };
+  }, [videoId, tokenUrl]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    "video",
+    {
+      ref: videoRef,
+      controls,
+      style: style || { width: "100%" },
+      className
+    }
+  );
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  BunnyVideoPlayer
+});

package/dist/client/index.mjs

@@ -0,0 +1,70 @@
+// src/client/BunnyVideoPlayer.tsx
+import React, { useEffect, useRef } from "react";
+import Hls from "hls.js";
+var BunnyVideoPlayer = ({
+  videoId,
+  tokenUrl,
+  controls = true,
+  style,
+  className
+}) => {
+  const videoRef = useRef(null);
+  const hlsRef = useRef(null);
+  useEffect(() => {
+    if (!videoRef.current) return;
+    const hls = new Hls();
+    hlsRef.current = hls;
+    const loadSourceWithToken = async () => {
+      try {
+        const res = await fetch(`${tokenUrl}?videoId=${videoId}`);
+        if (!res.ok) {
+          throw new Error(`Failed to fetch token: ${res.statusText}`);
+        }
+        const { signedUrl } = await res.json();
+        hls.loadSource(signedUrl);
+      } catch (error) {
+        console.error("Error loading video token:", error);
+      }
+    };
+    hls.attachMedia(videoRef.current);
+    loadSourceWithToken();
+    hls.on(Hls.Events.ERROR, async (event, data) => {
+      if (data.fatal) {
+        switch (data.type) {
+          case Hls.ErrorTypes.NETWORK_ERROR:
+            if (data.response?.code === 403) {
+              await loadSourceWithToken();
+              hls.startLoad();
+            } else {
+              hls.startLoad();
+            }
+            break;
+          case Hls.ErrorTypes.MEDIA_ERROR:
+            hls.recoverMediaError();
+            break;
+          default:
+            hls.destroy();
+            break;
+        }
+      }
+    });
+    return () => {
+      if (hlsRef.current) {
+        hlsRef.current.destroy();
+        hlsRef.current = null;
+      }
+    };
+  }, [videoId, tokenUrl]);
+  return /* @__PURE__ */ React.createElement(
+    "video",
+    {
+      ref: videoRef,
+      controls,
+      style: style || { width: "100%" },
+      className
+    }
+  );
+};
+export {
+  BunnyVideoPlayer
+};

package/dist/server/index.d.mts

@@ -0,0 +1,9 @@
+interface BunnyHandlerOptions {
+    securityKey: string;
+    libraryHost: string;
+    expirationTime?: number;
+    isDirectory?: boolean;
+}
+declare const createBunnyHandler: (options: BunnyHandlerOptions) => (req: any, res?: any) => Promise<any>;
+
+export { type BunnyHandlerOptions, createBunnyHandler };

package/dist/server/index.d.ts

@@ -0,0 +1,9 @@
+interface BunnyHandlerOptions {
+    securityKey: string;
+    libraryHost: string;
+    expirationTime?: number;
+    isDirectory?: boolean;
+}
+declare const createBunnyHandler: (options: BunnyHandlerOptions) => (req: any, res?: any) => Promise<any>;
+
+export { type BunnyHandlerOptions, createBunnyHandler };

package/dist/server/index.js

@@ -0,0 +1,182 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/server/index.ts
+var server_exports = {};
+__export(server_exports, {
+  createBunnyHandler: () => createBunnyHandler
+});
+module.exports = __toCommonJS(server_exports);
+
+// src/server/signUtils.ts
+var crypto = __toESM(require("crypto"));
+var querystring = __toESM(require("querystring"));
+function addCountries(url, countriesAllowed, countriesBlocked) {
+  let tempUrl = url;
+  if (countriesAllowed != null) {
+    const tempUrlOne = new URL(tempUrl);
+    tempUrl += (tempUrlOne.search === "" ? "?" : "&") + "token_countries=" + countriesAllowed;
+  }
+  if (countriesBlocked != null) {
+    const tempUrlTwo = new URL(tempUrl);
+    tempUrl += (tempUrlTwo.search === "" ? "?" : "&") + "token_countries_blocked=" + countriesBlocked;
+  }
+  return tempUrl;
+}
+function signUrl(url, securityKey, expirationTime = 3600, userIp = null, isDirectory = false, pathAllowed = "", countriesAllowed = null, countriesBlocked = null) {
+  console.log("[BunnyHLS signUrl] Starting URL signing process");
+  console.log("[BunnyHLS signUrl] Input URL:", url);
+  console.log("[BunnyHLS signUrl] Parameters:", {
+    expirationTime,
+    userIp: userIp || "(none)",
+    isDirectory,
+    pathAllowed: pathAllowed || "(none)",
+    countriesAllowed: countriesAllowed || "(none)",
+    countriesBlocked: countriesBlocked || "(none)"
+  });
+  let parameterData = "";
+  let parameterDataUrl = "";
+  let signaturePath = "";
+  let hashableBase = "";
+  let token = "";
+  const expires = Math.floor((/* @__PURE__ */ new Date()).getTime() / 1e3) + expirationTime;
+  console.log("[BunnyHLS signUrl] Expiration timestamp:", expires, `(${expirationTime}s from now)`);
+  const urlWithCountries = addCountries(url, countriesAllowed, countriesBlocked);
+  const parsedUrl = new URL(urlWithCountries);
+  const parameters = new URL(urlWithCountries).searchParams;
+  if (pathAllowed !== "") {
+    signaturePath = pathAllowed;
+    parameters.set("token_path", signaturePath);
+    console.log("[BunnyHLS signUrl] Using pathAllowed:", signaturePath);
+  } else {
+    signaturePath = decodeURIComponent(parsedUrl.pathname);
+    console.log("[BunnyHLS signUrl] Using parsed pathname:", signaturePath);
+  }
+  const sortedParams = Array.from(parameters.entries()).sort();
+  console.log("[BunnyHLS signUrl] Sorted parameters:", sortedParams);
+  sortedParams.forEach(([key, value]) => {
+    if (value === "") {
+      return;
+    }
+    if (parameterData.length > 0) {
+      parameterData += "&";
+    }
+    parameterData += key + "=" + value;
+    parameterDataUrl += "&" + key + "=" + querystring.escape(value);
+  });
+  console.log("[BunnyHLS signUrl] Parameter data:", parameterData);
+  console.log("[BunnyHLS signUrl] Parameter data URL:", parameterDataUrl);
+  hashableBase = securityKey + signaturePath + expires + (userIp != null ? userIp : "") + parameterData;
+  console.log("[BunnyHLS signUrl] Hashable base length:", hashableBase.length);
+  console.log("[BunnyHLS signUrl] Hashable base preview:", hashableBase.substring(0, 50) + "...");
+  token = Buffer.from(crypto.createHash("sha256").update(hashableBase).digest()).toString("base64");
+  token = token.replace(/\n/g, "").replace(/\+/g, "-").replace(/\//g, "_").replace(/=/g, "");
+  console.log("[BunnyHLS signUrl] Generated token:", token.substring(0, 20) + "...");
+  let finalUrl;
+  if (isDirectory) {
+    finalUrl = parsedUrl.protocol + "//" + parsedUrl.host + "/bcdn_token=" + token + parameterDataUrl + "&expires=" + expires + parsedUrl.pathname;
+    console.log("[BunnyHLS signUrl] Directory mode - Final URL generated");
+  } else {
+    finalUrl = parsedUrl.protocol + "//" + parsedUrl.host + parsedUrl.pathname + "?token=" + token + parameterDataUrl + "&expires=" + expires;
+    console.log("[BunnyHLS signUrl] File mode - Final URL generated");
+  }
+  console.log("[BunnyHLS signUrl] Signing complete");
+  return finalUrl;
+}
+
+// src/server/index.ts
+var createBunnyHandler = (options) => {
+  const {
+    securityKey,
+    libraryHost,
+    expirationTime = 3600,
+    isDirectory = true
+  } = options;
+  return async (req, res) => {
+    console.log("[BunnyHLS] Handler called at", (/* @__PURE__ */ new Date()).toISOString());
+    let videoId;
+    if (req.nextUrl) {
+      videoId = req.nextUrl.searchParams.get("videoId") || "";
+      console.log("[BunnyHLS] App Router - Request URL:", req.nextUrl.toString());
+    } else if (req.query) {
+      videoId = req.query.videoId || "";
+      console.log("[BunnyHLS] Pages Router - Query params:", req.query);
+    } else {
+      videoId = "";
+      console.log("[BunnyHLS] No videoId found in request");
+    }
+    console.log("[BunnyHLS] Extracted videoId:", videoId || "(empty)");
+    if (!videoId) {
+      console.error("[BunnyHLS] ERROR: videoId is required");
+      const errorResponse = { error: "videoId is required" };
+      if (res) {
+        return res.status(400).json(errorResponse);
+      }
+      return new Response(JSON.stringify(errorResponse), {
+        status: 400,
+        headers: { "Content-Type": "application/json" }
+      });
+    }
+    const pathAllowed = `/${videoId}/`;
+    const url = `https://${libraryHost}/${videoId}/playlist.m3u8`;
+    console.log("[BunnyHLS] Signing URL:", url);
+    console.log("[BunnyHLS] Config:", {
+      libraryHost,
+      expirationTime,
+      isDirectory,
+      pathAllowed,
+      securityKeyLength: securityKey?.length || 0
+    });
+    const signedUrl = signUrl(
+      url,
+      securityKey,
+      expirationTime,
+      null,
+      isDirectory,
+      pathAllowed,
+      null,
+      null
+    );
+    console.log("[BunnyHLS] Signed URL generated:", signedUrl);
+    console.log("[BunnyHLS] Response prepared successfully");
+    const response = { signedUrl };
+    if (res) {
+      return res.status(200).json(response);
+    } else {
+      return new Response(JSON.stringify(response), {
+        status: 200,
+        headers: { "Content-Type": "application/json" }
+      });
+    }
+  };
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createBunnyHandler
+});

package/dist/server/index.mjs

@@ -0,0 +1,145 @@
+// src/server/signUtils.ts
+import * as crypto from "crypto";
+import * as querystring from "querystring";
+function addCountries(url, countriesAllowed, countriesBlocked) {
+  let tempUrl = url;
+  if (countriesAllowed != null) {
+    const tempUrlOne = new URL(tempUrl);
+    tempUrl += (tempUrlOne.search === "" ? "?" : "&") + "token_countries=" + countriesAllowed;
+  }
+  if (countriesBlocked != null) {
+    const tempUrlTwo = new URL(tempUrl);
+    tempUrl += (tempUrlTwo.search === "" ? "?" : "&") + "token_countries_blocked=" + countriesBlocked;
+  }
+  return tempUrl;
+}
+function signUrl(url, securityKey, expirationTime = 3600, userIp = null, isDirectory = false, pathAllowed = "", countriesAllowed = null, countriesBlocked = null) {
+  console.log("[BunnyHLS signUrl] Starting URL signing process");
+  console.log("[BunnyHLS signUrl] Input URL:", url);
+  console.log("[BunnyHLS signUrl] Parameters:", {
+    expirationTime,
+    userIp: userIp || "(none)",
+    isDirectory,
+    pathAllowed: pathAllowed || "(none)",
+    countriesAllowed: countriesAllowed || "(none)",
+    countriesBlocked: countriesBlocked || "(none)"
+  });
+  let parameterData = "";
+  let parameterDataUrl = "";
+  let signaturePath = "";
+  let hashableBase = "";
+  let token = "";
+  const expires = Math.floor((/* @__PURE__ */ new Date()).getTime() / 1e3) + expirationTime;
+  console.log("[BunnyHLS signUrl] Expiration timestamp:", expires, `(${expirationTime}s from now)`);
+  const urlWithCountries = addCountries(url, countriesAllowed, countriesBlocked);
+  const parsedUrl = new URL(urlWithCountries);
+  const parameters = new URL(urlWithCountries).searchParams;
+  if (pathAllowed !== "") {
+    signaturePath = pathAllowed;
+    parameters.set("token_path", signaturePath);
+    console.log("[BunnyHLS signUrl] Using pathAllowed:", signaturePath);
+  } else {
+    signaturePath = decodeURIComponent(parsedUrl.pathname);
+    console.log("[BunnyHLS signUrl] Using parsed pathname:", signaturePath);
+  }
+  const sortedParams = Array.from(parameters.entries()).sort();
+  console.log("[BunnyHLS signUrl] Sorted parameters:", sortedParams);
+  sortedParams.forEach(([key, value]) => {
+    if (value === "") {
+      return;
+    }
+    if (parameterData.length > 0) {
+      parameterData += "&";
+    }
+    parameterData += key + "=" + value;
+    parameterDataUrl += "&" + key + "=" + querystring.escape(value);
+  });
+  console.log("[BunnyHLS signUrl] Parameter data:", parameterData);
+  console.log("[BunnyHLS signUrl] Parameter data URL:", parameterDataUrl);
+  hashableBase = securityKey + signaturePath + expires + (userIp != null ? userIp : "") + parameterData;
+  console.log("[BunnyHLS signUrl] Hashable base length:", hashableBase.length);
+  console.log("[BunnyHLS signUrl] Hashable base preview:", hashableBase.substring(0, 50) + "...");
+  token = Buffer.from(crypto.createHash("sha256").update(hashableBase).digest()).toString("base64");
+  token = token.replace(/\n/g, "").replace(/\+/g, "-").replace(/\//g, "_").replace(/=/g, "");
+  console.log("[BunnyHLS signUrl] Generated token:", token.substring(0, 20) + "...");
+  let finalUrl;
+  if (isDirectory) {
+    finalUrl = parsedUrl.protocol + "//" + parsedUrl.host + "/bcdn_token=" + token + parameterDataUrl + "&expires=" + expires + parsedUrl.pathname;
+    console.log("[BunnyHLS signUrl] Directory mode - Final URL generated");
+  } else {
+    finalUrl = parsedUrl.protocol + "//" + parsedUrl.host + parsedUrl.pathname + "?token=" + token + parameterDataUrl + "&expires=" + expires;
+    console.log("[BunnyHLS signUrl] File mode - Final URL generated");
+  }
+  console.log("[BunnyHLS signUrl] Signing complete");
+  return finalUrl;
+}
+
+// src/server/index.ts
+var createBunnyHandler = (options) => {
+  const {
+    securityKey,
+    libraryHost,
+    expirationTime = 3600,
+    isDirectory = true
+  } = options;
+  return async (req, res) => {
+    console.log("[BunnyHLS] Handler called at", (/* @__PURE__ */ new Date()).toISOString());
+    let videoId;
+    if (req.nextUrl) {
+      videoId = req.nextUrl.searchParams.get("videoId") || "";
+      console.log("[BunnyHLS] App Router - Request URL:", req.nextUrl.toString());
+    } else if (req.query) {
+      videoId = req.query.videoId || "";
+      console.log("[BunnyHLS] Pages Router - Query params:", req.query);
+    } else {
+      videoId = "";
+      console.log("[BunnyHLS] No videoId found in request");
+    }
+    console.log("[BunnyHLS] Extracted videoId:", videoId || "(empty)");
+    if (!videoId) {
+      console.error("[BunnyHLS] ERROR: videoId is required");
+      const errorResponse = { error: "videoId is required" };
+      if (res) {
+        return res.status(400).json(errorResponse);
+      }
+      return new Response(JSON.stringify(errorResponse), {
+        status: 400,
+        headers: { "Content-Type": "application/json" }
+      });
+    }
+    const pathAllowed = `/${videoId}/`;
+    const url = `https://${libraryHost}/${videoId}/playlist.m3u8`;
+    console.log("[BunnyHLS] Signing URL:", url);
+    console.log("[BunnyHLS] Config:", {
+      libraryHost,
+      expirationTime,
+      isDirectory,
+      pathAllowed,
+      securityKeyLength: securityKey?.length || 0
+    });
+    const signedUrl = signUrl(
+      url,
+      securityKey,
+      expirationTime,
+      null,
+      isDirectory,
+      pathAllowed,
+      null,
+      null
+    );
+    console.log("[BunnyHLS] Signed URL generated:", signedUrl);
+    console.log("[BunnyHLS] Response prepared successfully");
+    const response = { signedUrl };
+    if (res) {
+      return res.status(200).json(response);
+    } else {
+      return new Response(JSON.stringify(response), {
+        status: 200,
+        headers: { "Content-Type": "application/json" }
+      });
+    }
+  };
+};
+export {
+  createBunnyHandler
+};

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "bunnyhls",
+  "version": "1.0.0",
+  "description": "Full-stack npm package for BunnyNet HLS video playback with React components and Next.js API handlers",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "private": false,
+  "exports": {
+    ".": "./dist/index.js",
+    "./client": "./dist/client/index.js",
+    "./server": "./dist/server/index.js"
+  },
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "start": "node sign.js",
+    "build": "tsup src/client/index.ts src/server/index.ts --format cjs,esm --dts --clean",
+    "prepublishOnly": "npm run build"
+  },
+  "author": "Samuel Petros Kelbiso (sampk7)",
+  "license": "ISC",
+  "dependencies": {
+    "hls.js": "^1.4.12"
+  },
+  "devDependencies": {
+    "@types/node": "^20.0.0",
+    "@types/react": "^18.0.0",
+    "typescript": "^5.0.0",
+    "tsup": "^8.0.0"
+  },
+  "peerDependencies": {
+    "react": "^18.0.0 || ^19.0.0",
+    "react-dom": "^18.0.0 || ^19.0.0"
+  },
+  "peerDependenciesMeta": {
+    "react-dom": {
+      "optional": false
+    }
+  }
+}