@flamingo-stack/openframe-frontend-core 0.0.711 → 0.0.712

package/dist/{chunk-FXJ3WWUB.js → chunk-ADBE7QF3.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
-  useChatRuntime
-} from "./chunk-E4ABZWTJ.js";
+  LAYOUT_STEPS
+} from "./chunk-4R2L3DSA.js";
 
 // src/hooks/ui/use-isomorphic-layout-effect.ts
 import { useEffect, useLayoutEffect } from "react";
@@ -9,17 +9,6 @@ var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect
 
 // src/hooks/ui/use-media-query.ts
 import { useState } from "react";
-
-// src/styles/layout-steps.ts
-var LAYOUT_STEPS = {
-  sm: { viewport: 640, content: 640 },
-  md: { viewport: 800, content: 720 },
-  lg: { viewport: 1280, content: 1024 },
-  xl: { viewport: 1440, content: 1216 },
-  "2xl": { viewport: 1536, content: 1312 }
-};
-
-// src/hooks/ui/use-media-query.ts
 function useMediaQuery(query) {
   const [matches, setMatches] = useState(void 0);
   useIsomorphicLayoutEffect(() => {
@@ -75,124 +64,6 @@ function useIsTruncated(value, options) {
   return { ref, isTruncated: element ? isTruncated : false };
 }
 
-// src/hooks/ui/use-content-breakpoint.ts
-import { createContext, createElement, useContext } from "react";
-var CONTENT_BREAKPOINTS = { md: LAYOUT_STEPS.md.content, lg: LAYOUT_STEPS.lg.content };
-var ContentAreaWidthContext = createContext(null);
-function ViewportBreakpoints({ children }) {
-  return createElement(ContentAreaWidthContext.Provider, { value: null }, children);
-}
-function contentBreakpointFor(width) {
-  if (width >= CONTENT_BREAKPOINTS.lg) return "desktop";
-  if (width >= CONTENT_BREAKPOINTS.md) return "tablet";
-  return "mobile";
-}
-function useContentBreakpoint() {
-  const width = useContext(ContentAreaWidthContext);
-  const mdUp = useMdUp();
-  const lgUp = useLgUp();
-  if (width !== null) return contentBreakpointFor(width);
-  if (mdUp === void 0) return void 0;
-  if (lgUp) return "desktop";
-  return mdUp ? "tablet" : "mobile";
-}
-function useContentMdUp() {
-  const breakpoint = useContentBreakpoint();
-  return breakpoint === void 0 ? void 0 : breakpoint !== "mobile";
-}
-function useContentLgUp() {
-  const breakpoint = useContentBreakpoint();
-  return breakpoint === void 0 ? void 0 : breakpoint === "desktop";
-}
-
-// src/hooks/ui/use-image-edge-color.ts
-import { useState as useState3, useEffect as useEffect3 } from "react";
-function extractEdgeColor(img) {
-  const canvas = document.createElement("canvas");
-  const ctx = canvas.getContext("2d");
-  if (!ctx) return "#000000";
-  const maxSize = 100;
-  const scale = Math.min(maxSize / img.naturalWidth, maxSize / img.naturalHeight);
-  const w = Math.round(img.naturalWidth * scale);
-  const h = Math.round(img.naturalHeight * scale);
-  canvas.width = w;
-  canvas.height = h;
-  ctx.drawImage(img, 0, 0, w, h);
-  const data = ctx.getImageData(0, 0, w, h).data;
-  const edgeW = Math.max(2, Math.round(w * 0.15));
-  const edgeH = Math.max(2, Math.round(h * 0.15));
-  const bucketSize = 32;
-  const buckets = /* @__PURE__ */ new Map();
-  for (let y = 0; y < h; y++) {
-    for (let x = 0; x < w; x++) {
-      const isEdge = x < edgeW || x >= w - edgeW || y < edgeH || y >= h - edgeH;
-      if (!isEdge) continue;
-      const i = (y * w + x) * 4;
-      const a = data[i + 3];
-      if (a < 128) continue;
-      const r2 = data[i];
-      const g2 = data[i + 1];
-      const b2 = data[i + 2];
-      const br = Math.floor(r2 / bucketSize) * bucketSize;
-      const bg = Math.floor(g2 / bucketSize) * bucketSize;
-      const bb = Math.floor(b2 / bucketSize) * bucketSize;
-      const key = `${br},${bg},${bb}`;
-      const existing = buckets.get(key);
-      if (existing) {
-        existing.r += r2;
-        existing.g += g2;
-        existing.b += b2;
-        existing.count++;
-      } else {
-        buckets.set(key, { r: r2, g: g2, b: b2, count: 1 });
-      }
-    }
-  }
-  if (buckets.size === 0) return "#000000";
-  let bestBucket = null;
-  for (const bucket of buckets.values()) {
-    if (!bestBucket || bucket.count > bestBucket.count) {
-      bestBucket = bucket;
-    }
-  }
-  if (!bestBucket || bestBucket.count === 0) return "#000000";
-  const r = Math.round(bestBucket.r / bestBucket.count);
-  const g = Math.round(bestBucket.g / bestBucket.count);
-  const b = Math.round(bestBucket.b / bestBucket.count);
-  return `rgb(${r}, ${g}, ${b})`;
-}
-function useImageEdgeColor(imageUrl, fallback = "#000000") {
-  const [color, setColor] = useState3(fallback);
-  const [resetFor, setResetFor] = useState3({ imageUrl, fallback });
-  if (resetFor.imageUrl !== imageUrl || resetFor.fallback !== fallback) {
-    setResetFor({ imageUrl, fallback });
-    if (!imageUrl) setColor(fallback);
-  }
-  useEffect3(() => {
-    if (!imageUrl) return void 0;
-    let cancelled = false;
-    const img = new Image();
-    img.crossOrigin = "anonymous";
-    img.onload = () => {
-      if (cancelled) return;
-      try {
-        setColor(extractEdgeColor(img));
-      } catch {
-        setColor(fallback);
-      }
-    };
-    img.onerror = () => {
-      if (cancelled) return;
-      setColor(fallback);
-    };
-    img.src = imageUrl;
-    return () => {
-      cancelled = true;
-    };
-  }, [imageUrl, fallback]);
-  return color;
-}
-
 // src/utils/platform-identity.ts
 var platformDisplayNames = {
   openmsp: "OpenMSP",
@@ -675,7 +546,7 @@ function assertSameOrigin(url) {
 }
 
 // src/hooks/use-authed-asset-src.ts
-import { useEffect as useEffect4, useReducer } from "react";
+import { useEffect as useEffect3, useReducer } from "react";
 var resolvedCache = /* @__PURE__ */ new Map();
 var inFlight = /* @__PURE__ */ new Map();
 var cacheGeneration = 0;
@@ -745,7 +616,7 @@ function useAuthedAssetSrc(src, accept = "*/*") {
     acquire(bearerSrc);
     return () => release(bearerSrc);
   }, [bearerSrc]);
-  useEffect4(() => {
+  useEffect3(() => {
     if (!bearerSrc || resolvedCache.has(bearerSrc)) return void 0;
     let cancelled = false;
     fetchAsBlobUrl(bearerSrc, accept).catch(() => {
@@ -767,112 +638,6 @@ function useAuthedImageSrc(src) {
 }
 var clearAuthedImageCache = clearAuthedAssetCache;
 
-// src/hooks/use-near-viewport.ts
-import { useEffect as useEffect5, useRef, useState as useState4, useCallback as useCallback2 } from "react";
-var observers = /* @__PURE__ */ new Map();
-var subscribers = /* @__PURE__ */ new WeakMap();
-var THRESHOLD_EPSILON = 0.01;
-function observerKey(rootMargin, threshold) {
-  return `${rootMargin}|${threshold}`;
-}
-function getObserverFor(rootMargin, threshold) {
-  const key = observerKey(rootMargin, threshold);
-  const existing = observers.get(key);
-  if (existing) return existing;
-  const io = new IntersectionObserver(
-    (entries) => {
-      entries.forEach((entry) => {
-        if (!entry.isIntersecting) return;
-        if (entry.intersectionRatio < threshold - THRESHOLD_EPSILON) return;
-        const cb = subscribers.get(entry.target);
-        if (cb) {
-          cb();
-          io.unobserve(entry.target);
-          subscribers.delete(entry.target);
-        }
-      });
-    },
-    { rootMargin, threshold }
-  );
-  observers.set(key, io);
-  return io;
-}
-var NEAR_VIEWPORT_ROOT_MARGIN = "500px";
-function useNearViewport(rootMargin = NEAR_VIEWPORT_ROOT_MARGIN, threshold = 0) {
-  const [isNear, setIsNear] = useState4(false);
-  const elRef = useRef(null);
-  const key = observerKey(rootMargin, threshold);
-  const ref = useCallback2(
-    (node) => {
-      const prev = elRef.current;
-      if (prev) {
-        const stillOurs = subscribers.get(prev);
-        if (stillOurs) {
-          subscribers.delete(prev);
-          observers.get(key)?.unobserve(prev);
-        }
-      }
-      elRef.current = node;
-      if (!node) return;
-      const cb = () => setIsNear(true);
-      subscribers.set(node, cb);
-      getObserverFor(rootMargin, threshold).observe(node);
-    },
-    [key, rootMargin, threshold]
-  );
-  useEffect5(() => {
-    return () => {
-      const el = elRef.current;
-      if (!el) return;
-      if (subscribers.get(el)) {
-        subscribers.delete(el);
-        observers.get(key)?.unobserve(el);
-      }
-    };
-  }, [key]);
-  return { ref, isNear };
-}
-
-// src/utils/og-placeholder.ts
-var DEFAULT_OG_PLACEHOLDER_PATH = "/api/og-placeholder";
-function resolveOgPlaceholderBase(endpoints) {
-  if (endpoints?.ogPlaceholderUrl) return endpoints.ogPlaceholderUrl;
-  const imageProxy = endpoints?.imageProxyUrlPrefix;
-  if (imageProxy) {
-    const derived = imageProxy.replace(/\/image-proxy(?=$|[?/])/, "/og-placeholder");
-    if (derived !== imageProxy) return derived;
-  }
-  return DEFAULT_OG_PLACEHOLDER_PATH;
-}
-function buildOgPlaceholderUrl(endpoints, title, options = {}) {
-  const base = resolveOgPlaceholderBase(endpoints);
-  const qIndex = base.indexOf("?");
-  const path = qIndex === -1 ? base : base.slice(0, qIndex);
-  const params = new URLSearchParams(qIndex === -1 ? "" : base.slice(qIndex + 1));
-  params.set("title", title);
-  if (options.site) params.set("site", options.site);
-  const width = options.width ?? (options.aspect === "square" ? 1024 : void 0);
-  const height = options.height ?? (options.aspect === "square" ? 1024 : void 0);
-  if (Number.isFinite(width)) params.set("w", String(width));
-  if (Number.isFinite(height)) params.set("h", String(height));
-  return `${path}?${params.toString()}`;
-}
-
-// src/hooks/use-og-placeholder-url.ts
-import { useMemo } from "react";
-function useOgPlaceholderUrl({
-  title,
-  siteName = "",
-  aspect = "wide",
-  enabled = true
-}) {
-  const endpoints = useChatRuntime()?.endpoints;
-  return useMemo(() => {
-    if (!enabled || !title) return null;
-    return buildOgPlaceholderUrl(endpoints, title, { site: siteName || void 0, aspect });
-  }, [endpoints, title, siteName, aspect, enabled]);
-}
-
 export {
   useIsomorphicLayoutEffect,
   useMediaQuery,
@@ -881,14 +646,6 @@ export {
   useMdUp,
   useLgUp,
   useIsTruncated,
-  CONTENT_BREAKPOINTS,
-  ContentAreaWidthContext,
-  ViewportBreakpoints,
-  contentBreakpointFor,
-  useContentBreakpoint,
-  useContentMdUp,
-  useContentLgUp,
-  useImageEdgeColor,
   createLocalStorageAdapter,
   platformDisplayNames,
   platformShortNames,
@@ -933,9 +690,5 @@ export {
   clearAuthedAssetCache,
   useAuthedAssetSrc,
   useAuthedImageSrc,
-  clearAuthedImageCache,
-  NEAR_VIEWPORT_ROOT_MARGIN,
-  useNearViewport,
-  buildOgPlaceholderUrl,
-  useOgPlaceholderUrl
+  clearAuthedImageCache
 };

package/dist/chunk-AECTRMGQ.cjs

@@ -0,0 +1,334 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
+
+
+var _chunkUJ7AXHRZcjs = require('./chunk-UJ7AXHRZ.cjs');
+
+// src/hooks/ui/use-image-edge-color.ts
+var _react = require('react');
+function extractEdgeColor(img) {
+  const canvas = document.createElement("canvas");
+  const ctx = canvas.getContext("2d");
+  if (!ctx) return "#000000";
+  const maxSize = 100;
+  const scale = Math.min(maxSize / img.naturalWidth, maxSize / img.naturalHeight);
+  const w = Math.round(img.naturalWidth * scale);
+  const h = Math.round(img.naturalHeight * scale);
+  canvas.width = w;
+  canvas.height = h;
+  ctx.drawImage(img, 0, 0, w, h);
+  const data = ctx.getImageData(0, 0, w, h).data;
+  const edgeW = Math.max(2, Math.round(w * 0.15));
+  const edgeH = Math.max(2, Math.round(h * 0.15));
+  const bucketSize = 32;
+  const buckets = /* @__PURE__ */ new Map();
+  for (let y = 0; y < h; y++) {
+    for (let x = 0; x < w; x++) {
+      const isEdge = x < edgeW || x >= w - edgeW || y < edgeH || y >= h - edgeH;
+      if (!isEdge) continue;
+      const i = (y * w + x) * 4;
+      const a = data[i + 3];
+      if (a < 128) continue;
+      const r2 = data[i];
+      const g2 = data[i + 1];
+      const b2 = data[i + 2];
+      const br = Math.floor(r2 / bucketSize) * bucketSize;
+      const bg = Math.floor(g2 / bucketSize) * bucketSize;
+      const bb = Math.floor(b2 / bucketSize) * bucketSize;
+      const key = `${br},${bg},${bb}`;
+      const existing = buckets.get(key);
+      if (existing) {
+        existing.r += r2;
+        existing.g += g2;
+        existing.b += b2;
+        existing.count++;
+      } else {
+        buckets.set(key, { r: r2, g: g2, b: b2, count: 1 });
+      }
+    }
+  }
+  if (buckets.size === 0) return "#000000";
+  let bestBucket = null;
+  for (const bucket of buckets.values()) {
+    if (!bestBucket || bucket.count > bestBucket.count) {
+      bestBucket = bucket;
+    }
+  }
+  if (!bestBucket || bestBucket.count === 0) return "#000000";
+  const r = Math.round(bestBucket.r / bestBucket.count);
+  const g = Math.round(bestBucket.g / bestBucket.count);
+  const b = Math.round(bestBucket.b / bestBucket.count);
+  return `rgb(${r}, ${g}, ${b})`;
+}
+function useImageEdgeColor(imageUrl, fallback = "#000000") {
+  const [color, setColor] = _react.useState.call(void 0, fallback);
+  const [resetFor, setResetFor] = _react.useState.call(void 0, { imageUrl, fallback });
+  if (resetFor.imageUrl !== imageUrl || resetFor.fallback !== fallback) {
+    setResetFor({ imageUrl, fallback });
+    if (!imageUrl) setColor(fallback);
+  }
+  _react.useEffect.call(void 0, () => {
+    if (!imageUrl) return void 0;
+    let cancelled = false;
+    const img = new Image();
+    img.crossOrigin = "anonymous";
+    img.onload = () => {
+      if (cancelled) return;
+      try {
+        setColor(extractEdgeColor(img));
+      } catch (e) {
+        setColor(fallback);
+      }
+    };
+    img.onerror = () => {
+      if (cancelled) return;
+      setColor(fallback);
+    };
+    img.src = imageUrl;
+    return () => {
+      cancelled = true;
+    };
+  }, [imageUrl, fallback]);
+  return color;
+}
+
+// src/utils/search-params.ts
+function positiveInt(raw, fallback, { min = 1, max } = {}) {
+  const capped = (v) => max == null ? v : Math.min(v, max);
+  if (raw === null || raw === void 0 || raw === "") {
+    return typeof fallback === "number" ? capped(fallback) : fallback;
+  }
+  const n = Math.trunc(Number(raw));
+  if (!Number.isFinite(n) || n < min) {
+    return typeof fallback === "number" ? capped(fallback) : fallback;
+  }
+  return capped(n);
+}
+var PAGE_PARAM_LIMITS = { maxPage: 1e4, maxPageSize: 100 };
+function pageCount(total, pageSize) {
+  if (!Number.isFinite(total) || !Number.isFinite(pageSize) || pageSize <= 0) return 1;
+  return Math.max(1, Math.ceil(total / pageSize));
+}
+function clampPageToTotal(page, totalPages) {
+  return Math.min(page, Math.max(1, totalPages));
+}
+function defineParamSchema(schema) {
+  return schema;
+}
+function fromKeys(keys, value) {
+  return Object.fromEntries(keys.map((k) => [k, value]));
+}
+function firstParamValue(input, key) {
+  if (!input) return void 0;
+  if (input instanceof URLSearchParams) return _nullishCoalesce(input.get(key), () => ( void 0));
+  const value = input[key];
+  return Array.isArray(value) ? value[0] : value;
+}
+function allParamValues(input, key) {
+  if (!input) return [];
+  const raw = input instanceof URLSearchParams ? input.getAll(key) : input[key];
+  const list = Array.isArray(raw) ? raw : raw === void 0 ? [] : [raw];
+  if (list.length === 1 && _optionalChain([list, 'access', _ => _[0], 'optionalAccess', _2 => _2.includes, 'call', _3 => _3(",")])) return list[0].split(",").filter(Boolean);
+  return list.filter((v) => v !== void 0 && v !== "");
+}
+function coerceScalar(raw, config) {
+  if (raw === void 0 || raw === "") return void 0;
+  switch (config.type) {
+    case "int": {
+      const int = config;
+      return positiveInt(raw, int.default, { min: int.min, max: int.max });
+    }
+    case "number": {
+      const n = Number(raw);
+      return Number.isFinite(n) ? n : void 0;
+    }
+    case "boolean":
+      return raw === "true" || raw === "1";
+    case "object":
+      try {
+        return JSON.parse(raw);
+      } catch (e2) {
+        return void 0;
+      }
+    default:
+      return raw;
+  }
+}
+function parseSchemaParams(schema, input, options) {
+  const absent = _optionalChain([options, 'optionalAccess', _4 => _4.absent]) === "null" ? null : void 0;
+  const out = {};
+  for (const [key, config] of Object.entries(schema)) {
+    if (config.type === "array") {
+      const values = allParamValues(input, key);
+      out[key] = values.length > 0 ? values : _nullishCoalesce(config.default, () => ( []));
+      continue;
+    }
+    const coerced = coerceScalar(firstParamValue(input, key), config);
+    out[key] = coerced !== void 0 ? coerced : _nullishCoalesce(config.default, () => ( absent));
+  }
+  return out;
+}
+function shouldIncludeInUrl(value, config) {
+  if (value === null || value === void 0) return false;
+  if (Array.isArray(value) && value.length === 0) return false;
+  if (value === "") return false;
+  const fromDefault = config && "default" in config ? config.default : void 0;
+  const fromLegacy = config && "defaultValue" in config ? config.defaultValue : void 0;
+  const declared = fromDefault !== void 0 ? fromDefault : fromLegacy;
+  if (declared !== void 0 && value === declared) return false;
+  return true;
+}
+function createSearchParams(params, { arrayJoin } = {}) {
+  const search = new URLSearchParams();
+  for (const [key, value] of Object.entries(params)) {
+    if (!shouldIncludeInUrl(value, void 0)) continue;
+    if (Array.isArray(value)) {
+      const items = value.filter((v) => v !== null && v !== void 0 && v !== "");
+      if (items.length === 0) continue;
+      if (arrayJoin) search.set(key, items.join(arrayJoin));
+      else for (const item of items) search.append(key, String(item));
+      continue;
+    }
+    if (typeof value === "object") {
+      search.set(key, JSON.stringify(value));
+      continue;
+    }
+    search.set(key, String(value));
+  }
+  return search;
+}
+function serializeSchemaParams(schema, params, options) {
+  const kept = {};
+  for (const [key, value] of Object.entries(params)) {
+    if (shouldIncludeInUrl(value, schema[key])) kept[key] = value;
+  }
+  return createSearchParams(kept, options).toString();
+}
+function withQuery(path, queryString) {
+  return queryString ? `${path}?${queryString}` : path;
+}
+
+// src/hooks/use-near-viewport.ts
+
+var observers = /* @__PURE__ */ new Map();
+var subscribers = /* @__PURE__ */ new WeakMap();
+var THRESHOLD_EPSILON = 0.01;
+function observerKey(rootMargin, threshold) {
+  return `${rootMargin}|${threshold}`;
+}
+function getObserverFor(rootMargin, threshold) {
+  const key = observerKey(rootMargin, threshold);
+  const existing = observers.get(key);
+  if (existing) return existing;
+  const io = new IntersectionObserver(
+    (entries) => {
+      entries.forEach((entry) => {
+        if (!entry.isIntersecting) return;
+        if (entry.intersectionRatio < threshold - THRESHOLD_EPSILON) return;
+        const cb = subscribers.get(entry.target);
+        if (cb) {
+          cb();
+          io.unobserve(entry.target);
+          subscribers.delete(entry.target);
+        }
+      });
+    },
+    { rootMargin, threshold }
+  );
+  observers.set(key, io);
+  return io;
+}
+var NEAR_VIEWPORT_ROOT_MARGIN = "500px";
+function useNearViewport(rootMargin = NEAR_VIEWPORT_ROOT_MARGIN, threshold = 0) {
+  const [isNear, setIsNear] = _react.useState.call(void 0, false);
+  const elRef = _react.useRef.call(void 0, null);
+  const key = observerKey(rootMargin, threshold);
+  const ref = _react.useCallback.call(void 0, 
+    (node) => {
+      const prev = elRef.current;
+      if (prev) {
+        const stillOurs = subscribers.get(prev);
+        if (stillOurs) {
+          subscribers.delete(prev);
+          _optionalChain([observers, 'access', _5 => _5.get, 'call', _6 => _6(key), 'optionalAccess', _7 => _7.unobserve, 'call', _8 => _8(prev)]);
+        }
+      }
+      elRef.current = node;
+      if (!node) return;
+      const cb = () => setIsNear(true);
+      subscribers.set(node, cb);
+      getObserverFor(rootMargin, threshold).observe(node);
+    },
+    [key, rootMargin, threshold]
+  );
+  _react.useEffect.call(void 0, () => {
+    return () => {
+      const el = elRef.current;
+      if (!el) return;
+      if (subscribers.get(el)) {
+        subscribers.delete(el);
+        _optionalChain([observers, 'access', _9 => _9.get, 'call', _10 => _10(key), 'optionalAccess', _11 => _11.unobserve, 'call', _12 => _12(el)]);
+      }
+    };
+  }, [key]);
+  return { ref, isNear };
+}
+
+// src/utils/og-placeholder.ts
+var DEFAULT_OG_PLACEHOLDER_PATH = "/api/og-placeholder";
+function resolveOgPlaceholderBase(endpoints) {
+  if (_optionalChain([endpoints, 'optionalAccess', _13 => _13.ogPlaceholderUrl])) return endpoints.ogPlaceholderUrl;
+  const imageProxy = _optionalChain([endpoints, 'optionalAccess', _14 => _14.imageProxyUrlPrefix]);
+  if (imageProxy) {
+    const derived = imageProxy.replace(/\/image-proxy(?=$|[?/])/, "/og-placeholder");
+    if (derived !== imageProxy) return derived;
+  }
+  return DEFAULT_OG_PLACEHOLDER_PATH;
+}
+function buildOgPlaceholderUrl(endpoints, title, options = {}) {
+  const base = resolveOgPlaceholderBase(endpoints);
+  const qIndex = base.indexOf("?");
+  const path = qIndex === -1 ? base : base.slice(0, qIndex);
+  const params = new URLSearchParams(qIndex === -1 ? "" : base.slice(qIndex + 1));
+  params.set("title", title);
+  if (options.site) params.set("site", options.site);
+  const width = _nullishCoalesce(options.width, () => ( (options.aspect === "square" ? 1024 : void 0)));
+  const height = _nullishCoalesce(options.height, () => ( (options.aspect === "square" ? 1024 : void 0)));
+  if (Number.isFinite(width)) params.set("w", String(width));
+  if (Number.isFinite(height)) params.set("h", String(height));
+  return `${path}?${params.toString()}`;
+}
+
+// src/hooks/use-og-placeholder-url.ts
+
+function useOgPlaceholderUrl({
+  title,
+  siteName = "",
+  aspect = "wide",
+  enabled = true
+}) {
+  const endpoints = _optionalChain([_chunkUJ7AXHRZcjs.useChatRuntime.call(void 0, ), 'optionalAccess', _15 => _15.endpoints]);
+  return _react.useMemo.call(void 0, () => {
+    if (!enabled || !title) return null;
+    return buildOgPlaceholderUrl(endpoints, title, { site: siteName || void 0, aspect });
+  }, [endpoints, title, siteName, aspect, enabled]);
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+exports.useImageEdgeColor = useImageEdgeColor; exports.positiveInt = positiveInt; exports.PAGE_PARAM_LIMITS = PAGE_PARAM_LIMITS; exports.pageCount = pageCount; exports.clampPageToTotal = clampPageToTotal; exports.defineParamSchema = defineParamSchema; exports.fromKeys = fromKeys; exports.firstParamValue = firstParamValue; exports.parseSchemaParams = parseSchemaParams; exports.shouldIncludeInUrl = shouldIncludeInUrl; exports.createSearchParams = createSearchParams; exports.serializeSchemaParams = serializeSchemaParams; exports.withQuery = withQuery; exports.NEAR_VIEWPORT_ROOT_MARGIN = NEAR_VIEWPORT_ROOT_MARGIN; exports.useNearViewport = useNearViewport; exports.buildOgPlaceholderUrl = buildOgPlaceholderUrl; exports.useOgPlaceholderUrl = useOgPlaceholderUrl;