@drawnagency/primitives 0.1.71 → 0.1.73

package/src/lib/video-url.ts

@@ -0,0 +1,39 @@
+export type ParsedVideoUrl = { provider: "youtube" | "vimeo"; id: string };
+
+const YT_ID = /^[\w-]{6,20}$/;
+
+export function parseVideoUrl(raw: string): ParsedVideoUrl | null {
+  let url: URL;
+  try {
+    url = new URL(raw.trim());
+  } catch {
+    return null;
+  }
+  if (url.protocol !== "https:" && url.protocol !== "http:") return null;
+  const host = url.hostname.replace(/^www\./, "");
+
+  if (host === "youtube.com" || host === "m.youtube.com" || host === "youtube-nocookie.com") {
+    if (url.pathname === "/watch") {
+      const v = url.searchParams.get("v");
+      return v && YT_ID.test(v) ? { provider: "youtube", id: v } : null;
+    }
+    const m = url.pathname.match(/^\/(?:embed|shorts|live)\/([\w-]{6,20})$/);
+    return m ? { provider: "youtube", id: m[1] } : null;
+  }
+  if (host === "youtu.be") {
+    const m = url.pathname.match(/^\/([\w-]{6,20})$/);
+    return m ? { provider: "youtube", id: m[1] } : null;
+  }
+  if (host === "vimeo.com" || host === "player.vimeo.com") {
+    // Last numeric path segment: /76979871, /video/76979871, /channels/x/76979871
+    const m = url.pathname.match(/\/(\d{6,12})$/);
+    return m ? { provider: "vimeo", id: m[1] } : null;
+  }
+  return null;
+}
+
+export function embedUrl(p: ParsedVideoUrl): string {
+  return p.provider === "youtube"
+    ? `https://www.youtube-nocookie.com/embed/${p.id}`
+    : `https://player.vimeo.com/video/${p.id}`;
+}

package/src/media/resolve.ts

@@ -68,3 +68,21 @@ export function resolveManifestReferences(
 
   return content;
 }
+
+/**
+ * Keys stamped onto media refs by resolveManifestReferences above — derived
+ * from the referenced media item, never authored by the editor. Must stay in
+ * sync with the `patch` object built in resolveManifestReferences.
+ */
+export const BAKED_MEDIA_KEYS = ["src", "srcset", "alt", "width", "height", "poster"] as const;
+
+/**
+ * Re-point a media ref at a different library item. Drops every baked field so
+ * stale values resolved for the PREVIOUS image can't shadow the new one in the
+ * editor (ResolvedMedia prefers an explicit src prop over live resolution).
+ */
+export function rebindImageRef<T extends { imageId?: string }>(ref: T, imageId: string): T {
+  const fresh = { ...ref, imageId } as Record<string, unknown>;
+  for (const key of BAKED_MEDIA_KEYS) delete fresh[key];
+  return fresh as T;
+}

package/src/media/videoPoster.ts

@@ -1,7 +1,7 @@
 export function generateVideoPoster(
   blob: Blob,
   quality: number,
-): Promise<{ posterBlob: Blob; width: number; height: number }> {
+): Promise<{ posterBlob: Blob; width: number; height: number; duration: number }> {
   return new Promise((resolve, reject) => {
     const video = document.createElement("video");
     const url = URL.createObjectURL(blob);
@@ -59,7 +59,7 @@ export function generateVideoPoster(
                 reject(new Error("Failed to create poster blob"));
                 return;
               }
-              resolve({ posterBlob, width: w, height: h });
+              resolve({ posterBlob, width: w, height: h, duration: video.duration });
             },
             "image/webp",
             quality / 100,

package/src/schemas/link.ts

@@ -21,12 +21,23 @@ export function isSafeHref(href: string): boolean {
 }
 
 export const LinkValueSchema = z.discriminatedUnion("kind", [
-  z.object({ kind: z.literal("external"), href: z.string().refine(isSafeHref, "Unsafe href scheme"), target: LinkTargetSchema }),
+  z.object({
+    kind: z.literal("external"),
+    href: z
+      .string()
+      .refine(isSafeHref, "Unsafe href scheme")
+      .describe("An absolute http(s)/mailto URL, a relative path, or empty (unset). javascript:, data:, and protocol-relative URLs are rejected."),
+    target: LinkTargetSchema.describe("Where the link opens: '_self' (same tab) or '_blank' (new tab)."),
+  }),
   z.object({
     kind: z.literal("internal"),
-    pageId: z.string(),
-    anchorSectionId: z.string().nullable().optional(),
-    target: LinkTargetSchema,
+    pageId: z.string().describe("Id of the page to link to, within the same site."),
+    anchorSectionId: z
+      .string()
+      .nullable()
+      .optional()
+      .describe("Optional section id on the target page to scroll to; null or omitted links to the page itself."),
+    target: LinkTargetSchema.describe("Where the link opens: '_self' (same tab) or '_blank' (new tab)."),
   }),
 ]);
 

package/src/schemas/media.ts

@@ -20,6 +20,15 @@ export const MediaItemSchema = z.object({
   folder: z.string(),
   variants: z.array(VariantSchema),
   alt: z.string().default(""),
+  // Where the original bytes live. "github" = committed to the repo (images,
+  // small loops); "assets" = large original in the AssetStore bucket. Legacy
+  // manifests have no field — default keeps them on the git path.
+  storage: z.enum(["github", "assets"]).default("github"),
+  // Public CDN URL for assets-backed originals, baked at upload time so
+  // resolution needs no env access in the browser or at SSR.
+  url: z.string().optional(),
+  // Seconds; videos only. Informational (library UI).
+  duration: z.number().positive().optional(),
 });
 
 export type MediaItem = z.infer<typeof MediaItemSchema>;
@@ -34,6 +43,9 @@ export const MediaConfigSchema = z.object({
   sizes: z.array(z.number()).default([640, 1080, 1920]),
   maxFileSize: z.number().default(5242880),
   quality: z.number().min(1).max(100).default(85),
+  // Per-file cap for bucket-backed video uploads (bytes). The git-path cap is
+  // maxFileSize; anything between the two routes to the AssetStore.
+  maxAssetSize: z.number().default(209_715_200),
 });
 
 export type MediaConfig = z.infer<typeof MediaConfigSchema>;

package/src/schemas/shared.ts

@@ -33,12 +33,21 @@ export type TextLine = z.infer<typeof TextLineSchema>;
 
 // --- Media References ---
 const BaseMediaRef = z.object({
-  imageId: z.string().default(""),
-  caption: z.union([z.string(), z.array(z.string())]).optional(),
-  background: z.string().optional(),
-  invertFrom: z.string().optional(),
-  border: z.boolean().optional(),
-  objectFit: z.enum(["cover", "contain"]).optional(),
+  imageId: z.string().default("").describe("Media-library id of the image/video asset."),
+  caption: z
+    .union([z.string(), z.array(z.string())])
+    .optional()
+    .describe("Optional caption: a single string, or multiple lines as an array of strings."),
+  background: z.string().optional().describe("Optional CSS background color/value shown behind a transparent image."),
+  invertFrom: z
+    .string()
+    .optional()
+    .describe("Optional CSS color; the image inverts when the page background matches it (e.g. for dark-mode logo swaps)."),
+  border: z.boolean().optional().describe("When true, draw a border around the media."),
+  objectFit: z
+    .enum(["cover", "contain"])
+    .optional()
+    .describe("How the image fills its box: 'contain' (fit whole image) or 'cover' (fill and crop)."),
 });
 
 const ImageRef = BaseMediaRef.extend({
@@ -47,22 +56,22 @@ const ImageRef = BaseMediaRef.extend({
 
 const VideoRef = BaseMediaRef.extend({
   type: z.literal("video"),
-  poster: z.string().optional(),
-  autoplay: z.boolean().optional(),
-  loop: z.boolean().optional(),
-  muted: z.boolean().optional(),
+  poster: z.string().optional().describe("Optional poster-image URL shown before playback starts."),
+  autoplay: z.boolean().optional().describe("When true, the video starts playing automatically."),
+  loop: z.boolean().optional().describe("When true, the video repeats when it finishes."),
+  muted: z.boolean().optional().describe("When true, the video plays without sound."),
 });
 
 const DoDontImageRef = BaseMediaRef.extend({
   type: z.literal("doDontImage"),
-  doDont: z.enum(["do", "dont"]),
+  doDont: z.enum(["do", "dont"]).describe("Whether this is a 'do' (correct) or 'dont' (incorrect) example."),
 });
 
 const LinkedImageRef = BaseMediaRef.extend({
   type: z.literal("linkedImage"),
-  href: z.string(),
-  target: z.string().optional(),
-  linkText: z.string().optional(),
+  href: z.string().describe("URL the image links to."),
+  target: z.string().optional().describe("Link target, e.g. '_self' or '_blank'."),
+  linkText: z.string().optional().describe("Optional accessible link text/label."),
 });
 
 export const MediaReferenceSchema = z.discriminatedUnion("type", [

package/src/storage/index.ts

@@ -1,2 +1,2 @@
-export type { StorageProvider, FileWrite } from "./types";
+export type { StorageProvider, FileWrite, AssetStore } from "./types";
 export { StorageConflictError } from "./types";

package/src/storage/types.ts

@@ -38,3 +38,26 @@ export type FileWrite = {
   content: string | Uint8Array | null;
   encoding?: "utf-8" | "base64";
 };
+
+/**
+ * Optional large-asset store (Supabase Storage bucket). Holds video originals
+ * too big for the git path; deliberately generic so future large kinds (zips)
+ * can slot in. All paths are SITE-RELATIVE ("media/{hash}/original.mp4") —
+ * implementations prepend the tenant prefix ("sites/{siteId}/") themselves so
+ * a caller can never address another tenant's objects.
+ */
+export interface AssetStore {
+  /** Mint a signed direct-upload URL for the browser (PUT). */
+  createUploadUrl(
+    path: string,
+    opts: { contentType: string },
+  ): Promise<{ uploadUrl: string; path: string; publicUrl: string }>;
+
+  /** Deterministic public CDN URL for an object (no network call). */
+  getPublicUrl(path: string): string;
+
+  delete(paths: string[]): Promise<void>;
+
+  /** Recursive listing under a site-relative prefix. */
+  list(prefix: string): Promise<{ path: string; size: number; updatedAt: string }[]>;
+}

package/dist/chunk-4E66N6UV.js

@@ -1,10 +0,0 @@
-// src/components/shared/PagesContext.tsx
-import { createContext, useContext } from "react";
-var PagesContext = createContext({ pages: [], getPageHeadings: () => [] });
-function usePages() {
-  return useContext(PagesContext);
-}
-
-export {
-  usePages
-};

package/dist/chunk-I5737FJY.js

@@ -1,62 +0,0 @@
-import {
-  cn
-} from "./chunk-7EOSDFS3.js";
-
-// src/components/shared/icons.tsx
-import { GripVertical, Plus, Trash2, X, Settings } from "lucide-react";
-import { GripVertical as GripVertical2, Plus as Plus2, Trash2 as Trash22, X as X2, Settings as Settings2 } from "lucide-react";
-import { jsx } from "react/jsx-runtime";
-function DragHandle({ size = 16 }) {
-  return /* @__PURE__ */ jsx(GripVertical, { size });
-}
-function AddIcon({ size = 14 }) {
-  return /* @__PURE__ */ jsx(Plus, { size });
-}
-function DeleteIcon({ size = 14 }) {
-  return /* @__PURE__ */ jsx(Trash2, { size });
-}
-function SettingsIcon({ size = 14 }) {
-  return /* @__PURE__ */ jsx(Settings, { size });
-}
-
-// src/components/shared/IconButton.tsx
-import { forwardRef } from "react";
-import { jsx as jsx2 } from "react/jsx-runtime";
-var sizeClasses = {
-  sm: "h-chrome-sm w-chrome-sm",
-  md: "h-chrome-md w-chrome-md",
-  lg: "h-chrome-lg w-chrome-lg"
-};
-var intentClasses = {
-  default: "text-base-contrast-light hover:text-base-contrast",
-  destructive: "text-destructive hover:text-destructive-hover",
-  primary: "text-primary/60 hover:text-primary"
-};
-var IconButton = forwardRef(
-  function IconButton2({ icon, label, size = "md", intent = "default", className, ...rest }, ref) {
-    return /* @__PURE__ */ jsx2(
-      "button",
-      {
-        ref,
-        type: "button",
-        className: cn(
-          "cursor-pointer flex items-center justify-center rounded transition-colors",
-          sizeClasses[size],
-          intentClasses[intent],
-          className
-        ),
-        "aria-label": label,
-        ...rest,
-        children: icon
-      }
-    );
-  }
-);
-
-export {
-  DragHandle,
-  AddIcon,
-  DeleteIcon,
-  SettingsIcon,
-  IconButton
-};