@01.software/sdk 0.5.6 → 0.5.8

package/dist/ui/form.d.cts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { F as Form } from '../payload-types-B98DjTLi.cjs';
+import { F as Form } from '../payload-types-CyaSGIFI.cjs';
 import { RichTextData } from './rich-text.cjs';
 import '@payloadcms/richtext-lexical';
 import '@payloadcms/richtext-lexical/lexical';

package/dist/ui/form.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { F as Form } from '../payload-types-B98DjTLi.js';
+import { F as Form } from '../payload-types-CyaSGIFI.js';
 import { RichTextData } from './rich-text.js';
 import '@payloadcms/richtext-lexical';
 import '@payloadcms/richtext-lexical/lexical';

package/dist/ui/image.cjs

@@ -95,7 +95,8 @@ function Image({
   objectFit = "cover",
   priority = false,
   fill = false,
-  imageRendering
+  imageRendering,
+  alt: altProp
 }) {
   const [loaded, setLoaded] = (0, import_react.useState)(false);
   const firedRef = (0, import_react.useRef)(false);
@@ -178,7 +179,7 @@ function Image({
     "img",
     {
       ref: imgRef,
-      alt: image.alt ?? "",
+      alt: altProp ?? image.alt ?? "",
       src,
       srcSet: srcSet || void 0,
       sizes,

package/dist/ui/image.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ui/Image/index.tsx","../../src/utils/image.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef, useState } from 'react'\nimport type { CSSProperties } from 'react'\nimport type { ImageData } from '../../utils/image'\nimport { getImageSrcSet, getImagePlaceholderStyle } from '../../utils/image'\n\nexport interface ImageProps {\n  /** Payload image document */\n  image: ImageData\n  /** Display width in CSS pixels (for selecting optimal srcset size) */\n  width?: number\n  /** Device pixel ratio (default: 1) */\n  dpr?: number\n  /** Placeholder strategy (default: 'blur'; defaults to 'none' when imageRendering is 'pixelated' or 'crisp-edges') */\n  placeholder?: 'blur' | 'color' | 'none'\n  /** Container className */\n  className?: string\n  /** Container style */\n  style?: CSSProperties\n  /** Inner `<img>` className */\n  imgClassName?: string\n  /** Inner `<img>` style */\n  imgStyle?: CSSProperties\n  /** HTML sizes attribute */\n  sizes?: string\n  /** Loading strategy (default: 'lazy'; automatically 'eager' when priority is true) */\n  loading?: 'lazy' | 'eager'\n  /** Callback when image finishes loading */\n  onLoad?: () => void\n  /** Object-fit for the image (default: 'cover') */\n  objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down'\n  /** When true, loads eagerly with high fetch priority (for LCP images) */\n  priority?: boolean\n  /** When true, fills parent container (width/height: 100%, no aspect ratio) */\n  fill?: boolean\n  /** CSS image-rendering mode (e.g. 'pixelated' for pixel art) */\n  imageRendering?: 'auto' | 'pixelated' | 'crisp-edges'\n}\n\n/**\n * Image component with blur-up / color placeholder support.\n *\n * Uses LQIP (Low Quality Image Placeholder) for a smooth blur-up effect,\n * falling back to palette color or no placeholder.\n */\nexport function Image({\n  image,\n  width,\n  dpr = 1,\n  placeholder: placeholderProp,\n  className,\n  style,\n  imgClassName,\n  imgStyle,\n  sizes,\n  loading: loadingProp,\n  onLoad,\n  objectFit = 'cover',\n  priority = false,\n  fill = false,\n  imageRendering,\n}: ImageProps) {\n  const [loaded, setLoaded] = useState(false)\n  const firedRef = useRef(false)\n\n  // Resolve defaults based on other props\n  const isPixelRendering =\n    imageRendering === 'pixelated' || imageRendering === 'crisp-edges'\n  const placeholder = placeholderProp ?? (isPixelRendering ? 'none' : 'blur')\n  const loading = priority ? 'eager' : (loadingProp ?? 'lazy')\n\n  const aspectRatio =\n    !fill && image.width && image.height\n      ? `${image.width} / ${image.height}`\n      : undefined\n\n  const srcSet = getImageSrcSet(image)\n  const src = image.url ?? undefined\n\n  // Placeholder: LQIP overlay or color overlay (mutually exclusive)\n  const hasLqip = placeholder === 'blur' && !!image.lqip\n  const placeholderStyle = getImagePlaceholderStyle(image, {\n    type: placeholder,\n  })\n  const placeholderColor =\n    !hasLqip && 'backgroundColor' in placeholderStyle\n      ? placeholderStyle.backgroundColor\n      : undefined\n\n  const fireLoad = useCallback(() => {\n    if (firedRef.current) return\n    firedRef.current = true\n    setLoaded(true)\n    onLoad?.()\n  }, [onLoad])\n\n  // Callback ref: detect SSR-cached images that are already loaded\n  const imgRef = useCallback(\n    (node: HTMLImageElement | null) => {\n      if (node && node.complete && node.naturalWidth > 0) {\n        fireLoad()\n      }\n    },\n    [fireLoad],\n  )\n\n  // Container styles\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    overflow: 'hidden',\n    ...(fill ? { width: '100%', height: '100%' } : {}),\n    ...(aspectRatio ? { aspectRatio } : {}),\n    ...style,\n  }\n\n  // Shared overlay styles (LQIP and color)\n  const overlayBase: CSSProperties = {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    opacity: loaded ? 0 : 1,\n    transition: 'opacity 0.3s ease',\n    pointerEvents: 'none',\n  }\n\n  // Main image styles\n  const mainImgStyle: CSSProperties = {\n    display: 'block',\n    width: '100%',\n    height: '100%',\n    objectFit,\n    ...(imageRendering ? { imageRendering } : {}),\n    opacity: loaded ? 1 : 0,\n    transition: 'opacity 0.3s ease',\n    ...imgStyle,\n  }\n\n  return (\n    <div className={className} style={containerStyle}>\n      {hasLqip && (\n        <img\n          aria-hidden\n          alt=\"\"\n          src={image.lqip!}\n          style={{\n            ...overlayBase,\n            display: 'block',\n            objectFit,\n            filter: 'blur(20px)',\n            transform: 'scale(1.1)',\n          }}\n        />\n      )}\n      {placeholderColor && (\n        <div\n          aria-hidden\n          style={{\n            ...overlayBase,\n            backgroundColor: placeholderColor,\n          }}\n        />\n      )}\n      <img\n        ref={imgRef}\n        alt={image.alt ?? ''}\n        src={src}\n        srcSet={srcSet || undefined}\n        sizes={sizes}\n        width={width ? width * dpr : undefined}\n        loading={loading}\n        decoding=\"async\"\n        fetchPriority={priority ? 'high' : undefined}\n        onLoad={fireLoad}\n        className={imgClassName}\n        style={mainImgStyle}\n      />\n    </div>\n  )\n}\n","/** Palette colors extracted from an image */\nexport interface ImagePalette {\n  vibrant?: string | null\n  muted?: string | null\n  darkVibrant?: string | null\n  darkMuted?: string | null\n  lightVibrant?: string | null\n  lightMuted?: string | null\n}\n\n/** Common image data shape from Payload CMS upload collections */\nexport interface ImageData {\n  url?: string | null\n  width?: number | null\n  height?: number | null\n  alt?: string | null\n  lqip?: string | null\n  palette?: ImagePalette | null\n  sizes?: Record<\n    string,\n    | {\n        url?: string | null\n        width?: number | null\n        height?: number | null\n      }\n    | undefined\n  >\n}\n\n/** Pre-generated image size breakpoints (px) */\nexport const IMAGE_SIZES = [384, 768, 1536] as const\n\n/**\n * Returns the optimal image URL for a given display width.\n *\n * Picks the smallest pre-generated size whose width >= displayWidth × dpr.\n * Falls back to the original URL when no matching size exists.\n *\n * @param image - Payload image document\n * @param displayWidth - CSS pixel width the image will be displayed at\n * @param dpr - Device pixel ratio (default: 1)\n * @returns URL string, or empty string if no URL is available\n */\nexport function getImageUrl(\n  image: ImageData,\n  displayWidth: number,\n  dpr: number = 1,\n): string {\n  const target = displayWidth * dpr\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      if (size >= target) {\n        const entry = sizes[String(size)]\n        if (entry?.url) return entry.url\n      }\n    }\n  }\n\n  return image.url ?? ''\n}\n\n/**\n * Generates an HTML `srcset` attribute string from pre-generated sizes.\n *\n * Includes all available sizes plus the original image.\n * Example output: `\"url-384 384w, url-768 768w, url-1536 1536w, url-original 2000w\"`\n *\n * @param image - Payload image document\n * @returns srcset string, or empty string if no URLs are available\n */\nexport function getImageSrcSet(image: ImageData): string {\n  const parts: string[] = []\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      const entry = sizes[String(size)]\n      if (entry?.url && entry.width) {\n        parts.push(`${entry.url} ${entry.width}w`)\n      }\n    }\n  }\n\n  if (image.url && image.width) {\n    parts.push(`${image.url} ${image.width}w`)\n  }\n\n  return parts.join(', ')\n}\n\n/**\n * Returns the LQIP (Low Quality Image Placeholder) data URL for an image.\n *\n * @param image - Payload image document\n * @returns LQIP data URL string, or undefined if not available\n */\nexport function getImageLqip(image: ImageData): string | undefined {\n  return image.lqip ?? undefined\n}\n\n/**\n * Returns the extracted color palette for an image.\n *\n * @param image - Payload image document\n * @returns ImagePalette object, or undefined if not available\n */\nexport function getImagePalette(image: ImageData): ImagePalette | undefined {\n  return image.palette ?? undefined\n}\n\n/** Options for `getImagePlaceholderStyle` */\nexport interface ImagePlaceholderOptions {\n  /** Placeholder strategy (default: 'blur') */\n  type?: 'blur' | 'color' | 'none'\n  /** Which palette color to use for 'color' strategy (default: 'muted') */\n  paletteColor?: keyof ImagePalette\n}\n\n/**\n * Returns inline CSS styles for an image placeholder.\n *\n * - `blur`: uses LQIP as background, falls back to palette color, then empty\n * - `color`: uses palette color as background, falls back to empty\n * - `none`: always returns empty\n *\n * @param image - Payload image document\n * @param options - Placeholder options\n * @returns CSS style object compatible with React CSSProperties\n */\nexport function getImagePlaceholderStyle(\n  image: ImageData,\n  options?: ImagePlaceholderOptions,\n): Record<string, string> {\n  const type = options?.type ?? 'blur'\n  const paletteColor = options?.paletteColor ?? 'muted'\n\n  if (type === 'none') return {}\n\n  const color = image.palette?.[paletteColor]\n\n  if (type === 'blur') {\n    const lqip = image.lqip\n    if (lqip) {\n      return {\n        backgroundImage: `url(${lqip})`,\n        backgroundSize: 'cover',\n        backgroundPosition: 'center',\n      }\n    }\n    // Cascade: fall back to color\n    if (color) {\n      return { backgroundColor: color }\n    }\n    return {}\n  }\n\n  // type === 'color'\n  if (color) {\n    return { backgroundColor: color }\n  }\n  return {}\n}\n"],"mappings":"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","names":["React"]}
+{"version":3,"sources":["../../src/ui/Image/index.tsx","../../src/utils/image.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef, useState } from 'react'\nimport type { CSSProperties } from 'react'\nimport type { ImageData } from '../../utils/image'\nimport { getImageSrcSet, getImagePlaceholderStyle } from '../../utils/image'\n\nexport interface ImageProps {\n  /** Payload image document */\n  image: ImageData\n  /** Display width in CSS pixels (for selecting optimal srcset size) */\n  width?: number\n  /** Device pixel ratio (default: 1) */\n  dpr?: number\n  /** Placeholder strategy (default: 'blur'; defaults to 'none' when imageRendering is 'pixelated' or 'crisp-edges') */\n  placeholder?: 'blur' | 'color' | 'none'\n  /** Container className */\n  className?: string\n  /** Container style */\n  style?: CSSProperties\n  /** Inner `<img>` className */\n  imgClassName?: string\n  /** Inner `<img>` style */\n  imgStyle?: CSSProperties\n  /** HTML sizes attribute */\n  sizes?: string\n  /** Loading strategy (default: 'lazy'; automatically 'eager' when priority is true) */\n  loading?: 'lazy' | 'eager'\n  /** Callback when image finishes loading */\n  onLoad?: () => void\n  /** Object-fit for the image (default: 'cover') */\n  objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down'\n  /** When true, loads eagerly with high fetch priority (for LCP images) */\n  priority?: boolean\n  /** When true, fills parent container (width/height: 100%, no aspect ratio) */\n  fill?: boolean\n  /** CSS image-rendering mode (e.g. 'pixelated' for pixel art) */\n  imageRendering?: 'auto' | 'pixelated' | 'crisp-edges'\n  /** alt text override (falls back to image.alt, then empty string) */\n  alt?: string\n}\n\n/**\n * Image component with blur-up / color placeholder support.\n *\n * Uses LQIP (Low Quality Image Placeholder) for a smooth blur-up effect,\n * falling back to palette color or no placeholder.\n */\nexport function Image({\n  image,\n  width,\n  dpr = 1,\n  placeholder: placeholderProp,\n  className,\n  style,\n  imgClassName,\n  imgStyle,\n  sizes,\n  loading: loadingProp,\n  onLoad,\n  objectFit = 'cover',\n  priority = false,\n  fill = false,\n  imageRendering,\n  alt: altProp,\n}: ImageProps) {\n  const [loaded, setLoaded] = useState(false)\n  const firedRef = useRef(false)\n\n  // Resolve defaults based on other props\n  const isPixelRendering =\n    imageRendering === 'pixelated' || imageRendering === 'crisp-edges'\n  const placeholder = placeholderProp ?? (isPixelRendering ? 'none' : 'blur')\n  const loading = priority ? 'eager' : (loadingProp ?? 'lazy')\n\n  const aspectRatio =\n    !fill && image.width && image.height\n      ? `${image.width} / ${image.height}`\n      : undefined\n\n  const srcSet = getImageSrcSet(image)\n  const src = image.url ?? undefined\n\n  // Placeholder: LQIP overlay or color overlay (mutually exclusive)\n  const hasLqip = placeholder === 'blur' && !!image.lqip\n  const placeholderStyle = getImagePlaceholderStyle(image, {\n    type: placeholder,\n  })\n  const placeholderColor =\n    !hasLqip && 'backgroundColor' in placeholderStyle\n      ? placeholderStyle.backgroundColor\n      : undefined\n\n  const fireLoad = useCallback(() => {\n    if (firedRef.current) return\n    firedRef.current = true\n    setLoaded(true)\n    onLoad?.()\n  }, [onLoad])\n\n  // Callback ref: detect SSR-cached images that are already loaded\n  const imgRef = useCallback(\n    (node: HTMLImageElement | null) => {\n      if (node && node.complete && node.naturalWidth > 0) {\n        fireLoad()\n      }\n    },\n    [fireLoad],\n  )\n\n  // Container styles\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    overflow: 'hidden',\n    ...(fill ? { width: '100%', height: '100%' } : {}),\n    ...(aspectRatio ? { aspectRatio } : {}),\n    ...style,\n  }\n\n  // Shared overlay styles (LQIP and color)\n  const overlayBase: CSSProperties = {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    opacity: loaded ? 0 : 1,\n    transition: 'opacity 0.3s ease',\n    pointerEvents: 'none',\n  }\n\n  // Main image styles\n  const mainImgStyle: CSSProperties = {\n    display: 'block',\n    width: '100%',\n    height: '100%',\n    objectFit,\n    ...(imageRendering ? { imageRendering } : {}),\n    opacity: loaded ? 1 : 0,\n    transition: 'opacity 0.3s ease',\n    ...imgStyle,\n  }\n\n  return (\n    <div className={className} style={containerStyle}>\n      {hasLqip && (\n        <img\n          aria-hidden\n          alt=\"\"\n          src={image.lqip!}\n          style={{\n            ...overlayBase,\n            display: 'block',\n            objectFit,\n            filter: 'blur(20px)',\n            transform: 'scale(1.1)',\n          }}\n        />\n      )}\n      {placeholderColor && (\n        <div\n          aria-hidden\n          style={{\n            ...overlayBase,\n            backgroundColor: placeholderColor,\n          }}\n        />\n      )}\n      <img\n        ref={imgRef}\n        alt={altProp ?? image.alt ?? ''}\n        src={src}\n        srcSet={srcSet || undefined}\n        sizes={sizes}\n        width={width ? width * dpr : undefined}\n        loading={loading}\n        decoding=\"async\"\n        fetchPriority={priority ? 'high' : undefined}\n        onLoad={fireLoad}\n        className={imgClassName}\n        style={mainImgStyle}\n      />\n    </div>\n  )\n}\n","/** Palette colors extracted from an image */\nexport interface ImagePalette {\n  vibrant?: string | null\n  muted?: string | null\n  darkVibrant?: string | null\n  darkMuted?: string | null\n  lightVibrant?: string | null\n  lightMuted?: string | null\n}\n\n/** Common image data shape from Payload CMS upload collections */\nexport interface ImageData {\n  url?: string | null\n  width?: number | null\n  height?: number | null\n  alt?: string | null\n  lqip?: string | null\n  palette?: ImagePalette | null\n  sizes?: Record<\n    string,\n    | {\n        url?: string | null\n        width?: number | null\n        height?: number | null\n      }\n    | undefined\n  >\n}\n\n/** Pre-generated image size breakpoints (px) */\nexport const IMAGE_SIZES = [384, 768, 1536] as const\n\n/**\n * Returns the optimal image URL for a given display width.\n *\n * Picks the smallest pre-generated size whose width >= displayWidth × dpr.\n * Falls back to the original URL when no matching size exists.\n *\n * @param image - Payload image document\n * @param displayWidth - CSS pixel width the image will be displayed at\n * @param dpr - Device pixel ratio (default: 1)\n * @returns URL string, or empty string if no URL is available\n */\nexport function getImageUrl(\n  image: ImageData,\n  displayWidth: number,\n  dpr: number = 1,\n): string {\n  const target = displayWidth * dpr\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      if (size >= target) {\n        const entry = sizes[String(size)]\n        if (entry?.url) return entry.url\n      }\n    }\n  }\n\n  return image.url ?? ''\n}\n\n/**\n * Generates an HTML `srcset` attribute string from pre-generated sizes.\n *\n * Includes all available sizes plus the original image.\n * Example output: `\"url-384 384w, url-768 768w, url-1536 1536w, url-original 2000w\"`\n *\n * @param image - Payload image document\n * @returns srcset string, or empty string if no URLs are available\n */\nexport function getImageSrcSet(image: ImageData): string {\n  const parts: string[] = []\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      const entry = sizes[String(size)]\n      if (entry?.url && entry.width) {\n        parts.push(`${entry.url} ${entry.width}w`)\n      }\n    }\n  }\n\n  if (image.url && image.width) {\n    parts.push(`${image.url} ${image.width}w`)\n  }\n\n  return parts.join(', ')\n}\n\n/**\n * Returns the LQIP (Low Quality Image Placeholder) data URL for an image.\n *\n * @param image - Payload image document\n * @returns LQIP data URL string, or undefined if not available\n */\nexport function getImageLqip(image: ImageData): string | undefined {\n  return image.lqip ?? undefined\n}\n\n/**\n * Returns the extracted color palette for an image.\n *\n * @param image - Payload image document\n * @returns ImagePalette object, or undefined if not available\n */\nexport function getImagePalette(image: ImageData): ImagePalette | undefined {\n  return image.palette ?? undefined\n}\n\n/** Options for `getImagePlaceholderStyle` */\nexport interface ImagePlaceholderOptions {\n  /** Placeholder strategy (default: 'blur') */\n  type?: 'blur' | 'color' | 'none'\n  /** Which palette color to use for 'color' strategy (default: 'muted') */\n  paletteColor?: keyof ImagePalette\n}\n\n/**\n * Returns inline CSS styles for an image placeholder.\n *\n * - `blur`: uses LQIP as background, falls back to palette color, then empty\n * - `color`: uses palette color as background, falls back to empty\n * - `none`: always returns empty\n *\n * @param image - Payload image document\n * @param options - Placeholder options\n * @returns CSS style object compatible with React CSSProperties\n */\nexport function getImagePlaceholderStyle(\n  image: ImageData,\n  options?: ImagePlaceholderOptions,\n): Record<string, string> {\n  const type = options?.type ?? 'blur'\n  const paletteColor = options?.paletteColor ?? 'muted'\n\n  if (type === 'none') return {}\n\n  const color = image.palette?.[paletteColor]\n\n  if (type === 'blur') {\n    const lqip = image.lqip\n    if (lqip) {\n      return {\n        backgroundImage: `url(${lqip})`,\n        backgroundSize: 'cover',\n        backgroundPosition: 'center',\n      }\n    }\n    // Cascade: fall back to color\n    if (color) {\n      return { backgroundColor: color }\n    }\n    return {}\n  }\n\n  // type === 'color'\n  if (color) {\n    return { backgroundColor: color }\n  }\n  return {}\n}\n"],"mappings":"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","names":["React"]}

package/dist/ui/image.d.cts

@@ -32,6 +32,8 @@ interface ImageProps {
     fill?: boolean;
     /** CSS image-rendering mode (e.g. 'pixelated' for pixel art) */
     imageRendering?: 'auto' | 'pixelated' | 'crisp-edges';
+    /** alt text override (falls back to image.alt, then empty string) */
+    alt?: string;
 }
 /**
  * Image component with blur-up / color placeholder support.
@@ -39,6 +41,6 @@ interface ImageProps {
  * Uses LQIP (Low Quality Image Placeholder) for a smooth blur-up effect,
  * falling back to palette color or no placeholder.
  */
-declare function Image({ image, width, dpr, placeholder: placeholderProp, className, style, imgClassName, imgStyle, sizes, loading: loadingProp, onLoad, objectFit, priority, fill, imageRendering, }: ImageProps): React.JSX.Element;
+declare function Image({ image, width, dpr, placeholder: placeholderProp, className, style, imgClassName, imgStyle, sizes, loading: loadingProp, onLoad, objectFit, priority, fill, imageRendering, alt: altProp, }: ImageProps): React.JSX.Element;
 
 export { Image, type ImageProps };

package/dist/ui/image.d.ts

@@ -32,6 +32,8 @@ interface ImageProps {
     fill?: boolean;
     /** CSS image-rendering mode (e.g. 'pixelated' for pixel art) */
     imageRendering?: 'auto' | 'pixelated' | 'crisp-edges';
+    /** alt text override (falls back to image.alt, then empty string) */
+    alt?: string;
 }
 /**
  * Image component with blur-up / color placeholder support.
@@ -39,6 +41,6 @@ interface ImageProps {
  * Uses LQIP (Low Quality Image Placeholder) for a smooth blur-up effect,
  * falling back to palette color or no placeholder.
  */
-declare function Image({ image, width, dpr, placeholder: placeholderProp, className, style, imgClassName, imgStyle, sizes, loading: loadingProp, onLoad, objectFit, priority, fill, imageRendering, }: ImageProps): React.JSX.Element;
+declare function Image({ image, width, dpr, placeholder: placeholderProp, className, style, imgClassName, imgStyle, sizes, loading: loadingProp, onLoad, objectFit, priority, fill, imageRendering, alt: altProp, }: ImageProps): React.JSX.Element;
 
 export { Image, type ImageProps };

package/dist/ui/image.js

@@ -62,7 +62,8 @@ function Image({
   objectFit = "cover",
   priority = false,
   fill = false,
-  imageRendering
+  imageRendering,
+  alt: altProp
 }) {
   const [loaded, setLoaded] = useState(false);
   const firedRef = useRef(false);
@@ -145,7 +146,7 @@ function Image({
     "img",
     {
       ref: imgRef,
-      alt: image.alt ?? "",
+      alt: altProp ?? image.alt ?? "",
       src,
       srcSet: srcSet || void 0,
       sizes,

package/dist/ui/image.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ui/Image/index.tsx","../../src/utils/image.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef, useState } from 'react'\nimport type { CSSProperties } from 'react'\nimport type { ImageData } from '../../utils/image'\nimport { getImageSrcSet, getImagePlaceholderStyle } from '../../utils/image'\n\nexport interface ImageProps {\n  /** Payload image document */\n  image: ImageData\n  /** Display width in CSS pixels (for selecting optimal srcset size) */\n  width?: number\n  /** Device pixel ratio (default: 1) */\n  dpr?: number\n  /** Placeholder strategy (default: 'blur'; defaults to 'none' when imageRendering is 'pixelated' or 'crisp-edges') */\n  placeholder?: 'blur' | 'color' | 'none'\n  /** Container className */\n  className?: string\n  /** Container style */\n  style?: CSSProperties\n  /** Inner `<img>` className */\n  imgClassName?: string\n  /** Inner `<img>` style */\n  imgStyle?: CSSProperties\n  /** HTML sizes attribute */\n  sizes?: string\n  /** Loading strategy (default: 'lazy'; automatically 'eager' when priority is true) */\n  loading?: 'lazy' | 'eager'\n  /** Callback when image finishes loading */\n  onLoad?: () => void\n  /** Object-fit for the image (default: 'cover') */\n  objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down'\n  /** When true, loads eagerly with high fetch priority (for LCP images) */\n  priority?: boolean\n  /** When true, fills parent container (width/height: 100%, no aspect ratio) */\n  fill?: boolean\n  /** CSS image-rendering mode (e.g. 'pixelated' for pixel art) */\n  imageRendering?: 'auto' | 'pixelated' | 'crisp-edges'\n}\n\n/**\n * Image component with blur-up / color placeholder support.\n *\n * Uses LQIP (Low Quality Image Placeholder) for a smooth blur-up effect,\n * falling back to palette color or no placeholder.\n */\nexport function Image({\n  image,\n  width,\n  dpr = 1,\n  placeholder: placeholderProp,\n  className,\n  style,\n  imgClassName,\n  imgStyle,\n  sizes,\n  loading: loadingProp,\n  onLoad,\n  objectFit = 'cover',\n  priority = false,\n  fill = false,\n  imageRendering,\n}: ImageProps) {\n  const [loaded, setLoaded] = useState(false)\n  const firedRef = useRef(false)\n\n  // Resolve defaults based on other props\n  const isPixelRendering =\n    imageRendering === 'pixelated' || imageRendering === 'crisp-edges'\n  const placeholder = placeholderProp ?? (isPixelRendering ? 'none' : 'blur')\n  const loading = priority ? 'eager' : (loadingProp ?? 'lazy')\n\n  const aspectRatio =\n    !fill && image.width && image.height\n      ? `${image.width} / ${image.height}`\n      : undefined\n\n  const srcSet = getImageSrcSet(image)\n  const src = image.url ?? undefined\n\n  // Placeholder: LQIP overlay or color overlay (mutually exclusive)\n  const hasLqip = placeholder === 'blur' && !!image.lqip\n  const placeholderStyle = getImagePlaceholderStyle(image, {\n    type: placeholder,\n  })\n  const placeholderColor =\n    !hasLqip && 'backgroundColor' in placeholderStyle\n      ? placeholderStyle.backgroundColor\n      : undefined\n\n  const fireLoad = useCallback(() => {\n    if (firedRef.current) return\n    firedRef.current = true\n    setLoaded(true)\n    onLoad?.()\n  }, [onLoad])\n\n  // Callback ref: detect SSR-cached images that are already loaded\n  const imgRef = useCallback(\n    (node: HTMLImageElement | null) => {\n      if (node && node.complete && node.naturalWidth > 0) {\n        fireLoad()\n      }\n    },\n    [fireLoad],\n  )\n\n  // Container styles\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    overflow: 'hidden',\n    ...(fill ? { width: '100%', height: '100%' } : {}),\n    ...(aspectRatio ? { aspectRatio } : {}),\n    ...style,\n  }\n\n  // Shared overlay styles (LQIP and color)\n  const overlayBase: CSSProperties = {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    opacity: loaded ? 0 : 1,\n    transition: 'opacity 0.3s ease',\n    pointerEvents: 'none',\n  }\n\n  // Main image styles\n  const mainImgStyle: CSSProperties = {\n    display: 'block',\n    width: '100%',\n    height: '100%',\n    objectFit,\n    ...(imageRendering ? { imageRendering } : {}),\n    opacity: loaded ? 1 : 0,\n    transition: 'opacity 0.3s ease',\n    ...imgStyle,\n  }\n\n  return (\n    <div className={className} style={containerStyle}>\n      {hasLqip && (\n        <img\n          aria-hidden\n          alt=\"\"\n          src={image.lqip!}\n          style={{\n            ...overlayBase,\n            display: 'block',\n            objectFit,\n            filter: 'blur(20px)',\n            transform: 'scale(1.1)',\n          }}\n        />\n      )}\n      {placeholderColor && (\n        <div\n          aria-hidden\n          style={{\n            ...overlayBase,\n            backgroundColor: placeholderColor,\n          }}\n        />\n      )}\n      <img\n        ref={imgRef}\n        alt={image.alt ?? ''}\n        src={src}\n        srcSet={srcSet || undefined}\n        sizes={sizes}\n        width={width ? width * dpr : undefined}\n        loading={loading}\n        decoding=\"async\"\n        fetchPriority={priority ? 'high' : undefined}\n        onLoad={fireLoad}\n        className={imgClassName}\n        style={mainImgStyle}\n      />\n    </div>\n  )\n}\n","/** Palette colors extracted from an image */\nexport interface ImagePalette {\n  vibrant?: string | null\n  muted?: string | null\n  darkVibrant?: string | null\n  darkMuted?: string | null\n  lightVibrant?: string | null\n  lightMuted?: string | null\n}\n\n/** Common image data shape from Payload CMS upload collections */\nexport interface ImageData {\n  url?: string | null\n  width?: number | null\n  height?: number | null\n  alt?: string | null\n  lqip?: string | null\n  palette?: ImagePalette | null\n  sizes?: Record<\n    string,\n    | {\n        url?: string | null\n        width?: number | null\n        height?: number | null\n      }\n    | undefined\n  >\n}\n\n/** Pre-generated image size breakpoints (px) */\nexport const IMAGE_SIZES = [384, 768, 1536] as const\n\n/**\n * Returns the optimal image URL for a given display width.\n *\n * Picks the smallest pre-generated size whose width >= displayWidth × dpr.\n * Falls back to the original URL when no matching size exists.\n *\n * @param image - Payload image document\n * @param displayWidth - CSS pixel width the image will be displayed at\n * @param dpr - Device pixel ratio (default: 1)\n * @returns URL string, or empty string if no URL is available\n */\nexport function getImageUrl(\n  image: ImageData,\n  displayWidth: number,\n  dpr: number = 1,\n): string {\n  const target = displayWidth * dpr\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      if (size >= target) {\n        const entry = sizes[String(size)]\n        if (entry?.url) return entry.url\n      }\n    }\n  }\n\n  return image.url ?? ''\n}\n\n/**\n * Generates an HTML `srcset` attribute string from pre-generated sizes.\n *\n * Includes all available sizes plus the original image.\n * Example output: `\"url-384 384w, url-768 768w, url-1536 1536w, url-original 2000w\"`\n *\n * @param image - Payload image document\n * @returns srcset string, or empty string if no URLs are available\n */\nexport function getImageSrcSet(image: ImageData): string {\n  const parts: string[] = []\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      const entry = sizes[String(size)]\n      if (entry?.url && entry.width) {\n        parts.push(`${entry.url} ${entry.width}w`)\n      }\n    }\n  }\n\n  if (image.url && image.width) {\n    parts.push(`${image.url} ${image.width}w`)\n  }\n\n  return parts.join(', ')\n}\n\n/**\n * Returns the LQIP (Low Quality Image Placeholder) data URL for an image.\n *\n * @param image - Payload image document\n * @returns LQIP data URL string, or undefined if not available\n */\nexport function getImageLqip(image: ImageData): string | undefined {\n  return image.lqip ?? undefined\n}\n\n/**\n * Returns the extracted color palette for an image.\n *\n * @param image - Payload image document\n * @returns ImagePalette object, or undefined if not available\n */\nexport function getImagePalette(image: ImageData): ImagePalette | undefined {\n  return image.palette ?? undefined\n}\n\n/** Options for `getImagePlaceholderStyle` */\nexport interface ImagePlaceholderOptions {\n  /** Placeholder strategy (default: 'blur') */\n  type?: 'blur' | 'color' | 'none'\n  /** Which palette color to use for 'color' strategy (default: 'muted') */\n  paletteColor?: keyof ImagePalette\n}\n\n/**\n * Returns inline CSS styles for an image placeholder.\n *\n * - `blur`: uses LQIP as background, falls back to palette color, then empty\n * - `color`: uses palette color as background, falls back to empty\n * - `none`: always returns empty\n *\n * @param image - Payload image document\n * @param options - Placeholder options\n * @returns CSS style object compatible with React CSSProperties\n */\nexport function getImagePlaceholderStyle(\n  image: ImageData,\n  options?: ImagePlaceholderOptions,\n): Record<string, string> {\n  const type = options?.type ?? 'blur'\n  const paletteColor = options?.paletteColor ?? 'muted'\n\n  if (type === 'none') return {}\n\n  const color = image.palette?.[paletteColor]\n\n  if (type === 'blur') {\n    const lqip = image.lqip\n    if (lqip) {\n      return {\n        backgroundImage: `url(${lqip})`,\n        backgroundSize: 'cover',\n        backgroundPosition: 'center',\n      }\n    }\n    // Cascade: fall back to color\n    if (color) {\n      return { backgroundColor: color }\n    }\n    return {}\n  }\n\n  // type === 'color'\n  if (color) {\n    return { backgroundColor: color }\n  }\n  return {}\n}\n"],"mappings":";;;AAEA,OAAO,SAAS,aAAa,QAAQ,gBAAgB;;;AC4B9C,IAAM,cAAc,CAAC,KAAK,KAAK,IAAI;AA0CnC,SAAS,eAAe,OAA0B;AACvD,QAAM,QAAkB,CAAC;AACzB,QAAM,QAAQ,MAAM;AAEpB,MAAI,OAAO;AACT,eAAW,QAAQ,aAAa;AAC9B,YAAM,QAAQ,MAAM,OAAO,IAAI,CAAC;AAChC,UAAI,OAAO,OAAO,MAAM,OAAO;AAC7B,cAAM,KAAK,GAAG,MAAM,GAAG,IAAI,MAAM,KAAK,GAAG;AAAA,MAC3C;AAAA,IACF;AAAA,EACF;AAEA,MAAI,MAAM,OAAO,MAAM,OAAO;AAC5B,UAAM,KAAK,GAAG,MAAM,GAAG,IAAI,MAAM,KAAK,GAAG;AAAA,EAC3C;AAEA,SAAO,MAAM,KAAK,IAAI;AACxB;AAyCO,SAAS,yBACd,OACA,SACwB;AACxB,QAAM,OAAO,SAAS,QAAQ;AAC9B,QAAM,eAAe,SAAS,gBAAgB;AAE9C,MAAI,SAAS,OAAQ,QAAO,CAAC;AAE7B,QAAM,QAAQ,MAAM,UAAU,YAAY;AAE1C,MAAI,SAAS,QAAQ;AACnB,UAAM,OAAO,MAAM;AACnB,QAAI,MAAM;AACR,aAAO;AAAA,QACL,iBAAiB,OAAO,IAAI;AAAA,QAC5B,gBAAgB;AAAA,QAChB,oBAAoB;AAAA,MACtB;AAAA,IACF;AAEA,QAAI,OAAO;AACT,aAAO,EAAE,iBAAiB,MAAM;AAAA,IAClC;AACA,WAAO,CAAC;AAAA,EACV;AAGA,MAAI,OAAO;AACT,WAAO,EAAE,iBAAiB,MAAM;AAAA,EAClC;AACA,SAAO,CAAC;AACV;;;ADrHO,SAAS,MAAM;AAAA,EACpB;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,OAAO;AAAA,EACP;AACF,GAAe;AACb,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAC1C,QAAM,WAAW,OAAO,KAAK;AAG7B,QAAM,mBACJ,mBAAmB,eAAe,mBAAmB;AACvD,QAAM,cAAc,oBAAoB,mBAAmB,SAAS;AACpE,QAAM,UAAU,WAAW,UAAW,eAAe;AAErD,QAAM,cACJ,CAAC,QAAQ,MAAM,SAAS,MAAM,SAC1B,GAAG,MAAM,KAAK,MAAM,MAAM,MAAM,KAChC;AAEN,QAAM,SAAS,eAAe,KAAK;AACnC,QAAM,MAAM,MAAM,OAAO;AAGzB,QAAM,UAAU,gBAAgB,UAAU,CAAC,CAAC,MAAM;AAClD,QAAM,mBAAmB,yBAAyB,OAAO;AAAA,IACvD,MAAM;AAAA,EACR,CAAC;AACD,QAAM,mBACJ,CAAC,WAAW,qBAAqB,mBAC7B,iBAAiB,kBACjB;AAEN,QAAM,WAAW,YAAY,MAAM;AACjC,QAAI,SAAS,QAAS;AACtB,aAAS,UAAU;AACnB,cAAU,IAAI;AACd,aAAS;AAAA,EACX,GAAG,CAAC,MAAM,CAAC;AAGX,QAAM,SAAS;AAAA,IACb,CAAC,SAAkC;AACjC,UAAI,QAAQ,KAAK,YAAY,KAAK,eAAe,GAAG;AAClD,iBAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAGA,QAAM,iBAAgC;AAAA,IACpC,UAAU;AAAA,IACV,UAAU;AAAA,IACV,GAAI,OAAO,EAAE,OAAO,QAAQ,QAAQ,OAAO,IAAI,CAAC;AAAA,IAChD,GAAI,cAAc,EAAE,YAAY,IAAI,CAAC;AAAA,IACrC,GAAG;AAAA,EACL;AAGA,QAAM,cAA6B;AAAA,IACjC,UAAU;AAAA,IACV,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,SAAS,SAAS,IAAI;AAAA,IACtB,YAAY;AAAA,IACZ,eAAe;AAAA,EACjB;AAGA,QAAM,eAA8B;AAAA,IAClC,SAAS;AAAA,IACT,OAAO;AAAA,IACP,QAAQ;AAAA,IACR;AAAA,IACA,GAAI,iBAAiB,EAAE,eAAe,IAAI,CAAC;AAAA,IAC3C,SAAS,SAAS,IAAI;AAAA,IACtB,YAAY;AAAA,IACZ,GAAG;AAAA,EACL;AAEA,SACE,oCAAC,SAAI,WAAsB,OAAO,kBAC/B,WACC;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,MACX,KAAI;AAAA,MACJ,KAAK,MAAM;AAAA,MACX,OAAO;AAAA,QACL,GAAG;AAAA,QACH,SAAS;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QACR,WAAW;AAAA,MACb;AAAA;AAAA,EACF,GAED,oBACC;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,MACX,OAAO;AAAA,QACL,GAAG;AAAA,QACH,iBAAiB;AAAA,MACnB;AAAA;AAAA,EACF,GAEF;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,KAAK,MAAM,OAAO;AAAA,MAClB;AAAA,MACA,QAAQ,UAAU;AAAA,MAClB;AAAA,MACA,OAAO,QAAQ,QAAQ,MAAM;AAAA,MAC7B;AAAA,MACA,UAAS;AAAA,MACT,eAAe,WAAW,SAAS;AAAA,MACnC,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,OAAO;AAAA;AAAA,EACT,CACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/ui/Image/index.tsx","../../src/utils/image.ts"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useRef, useState } from 'react'\nimport type { CSSProperties } from 'react'\nimport type { ImageData } from '../../utils/image'\nimport { getImageSrcSet, getImagePlaceholderStyle } from '../../utils/image'\n\nexport interface ImageProps {\n  /** Payload image document */\n  image: ImageData\n  /** Display width in CSS pixels (for selecting optimal srcset size) */\n  width?: number\n  /** Device pixel ratio (default: 1) */\n  dpr?: number\n  /** Placeholder strategy (default: 'blur'; defaults to 'none' when imageRendering is 'pixelated' or 'crisp-edges') */\n  placeholder?: 'blur' | 'color' | 'none'\n  /** Container className */\n  className?: string\n  /** Container style */\n  style?: CSSProperties\n  /** Inner `<img>` className */\n  imgClassName?: string\n  /** Inner `<img>` style */\n  imgStyle?: CSSProperties\n  /** HTML sizes attribute */\n  sizes?: string\n  /** Loading strategy (default: 'lazy'; automatically 'eager' when priority is true) */\n  loading?: 'lazy' | 'eager'\n  /** Callback when image finishes loading */\n  onLoad?: () => void\n  /** Object-fit for the image (default: 'cover') */\n  objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down'\n  /** When true, loads eagerly with high fetch priority (for LCP images) */\n  priority?: boolean\n  /** When true, fills parent container (width/height: 100%, no aspect ratio) */\n  fill?: boolean\n  /** CSS image-rendering mode (e.g. 'pixelated' for pixel art) */\n  imageRendering?: 'auto' | 'pixelated' | 'crisp-edges'\n  /** alt text override (falls back to image.alt, then empty string) */\n  alt?: string\n}\n\n/**\n * Image component with blur-up / color placeholder support.\n *\n * Uses LQIP (Low Quality Image Placeholder) for a smooth blur-up effect,\n * falling back to palette color or no placeholder.\n */\nexport function Image({\n  image,\n  width,\n  dpr = 1,\n  placeholder: placeholderProp,\n  className,\n  style,\n  imgClassName,\n  imgStyle,\n  sizes,\n  loading: loadingProp,\n  onLoad,\n  objectFit = 'cover',\n  priority = false,\n  fill = false,\n  imageRendering,\n  alt: altProp,\n}: ImageProps) {\n  const [loaded, setLoaded] = useState(false)\n  const firedRef = useRef(false)\n\n  // Resolve defaults based on other props\n  const isPixelRendering =\n    imageRendering === 'pixelated' || imageRendering === 'crisp-edges'\n  const placeholder = placeholderProp ?? (isPixelRendering ? 'none' : 'blur')\n  const loading = priority ? 'eager' : (loadingProp ?? 'lazy')\n\n  const aspectRatio =\n    !fill && image.width && image.height\n      ? `${image.width} / ${image.height}`\n      : undefined\n\n  const srcSet = getImageSrcSet(image)\n  const src = image.url ?? undefined\n\n  // Placeholder: LQIP overlay or color overlay (mutually exclusive)\n  const hasLqip = placeholder === 'blur' && !!image.lqip\n  const placeholderStyle = getImagePlaceholderStyle(image, {\n    type: placeholder,\n  })\n  const placeholderColor =\n    !hasLqip && 'backgroundColor' in placeholderStyle\n      ? placeholderStyle.backgroundColor\n      : undefined\n\n  const fireLoad = useCallback(() => {\n    if (firedRef.current) return\n    firedRef.current = true\n    setLoaded(true)\n    onLoad?.()\n  }, [onLoad])\n\n  // Callback ref: detect SSR-cached images that are already loaded\n  const imgRef = useCallback(\n    (node: HTMLImageElement | null) => {\n      if (node && node.complete && node.naturalWidth > 0) {\n        fireLoad()\n      }\n    },\n    [fireLoad],\n  )\n\n  // Container styles\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    overflow: 'hidden',\n    ...(fill ? { width: '100%', height: '100%' } : {}),\n    ...(aspectRatio ? { aspectRatio } : {}),\n    ...style,\n  }\n\n  // Shared overlay styles (LQIP and color)\n  const overlayBase: CSSProperties = {\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    opacity: loaded ? 0 : 1,\n    transition: 'opacity 0.3s ease',\n    pointerEvents: 'none',\n  }\n\n  // Main image styles\n  const mainImgStyle: CSSProperties = {\n    display: 'block',\n    width: '100%',\n    height: '100%',\n    objectFit,\n    ...(imageRendering ? { imageRendering } : {}),\n    opacity: loaded ? 1 : 0,\n    transition: 'opacity 0.3s ease',\n    ...imgStyle,\n  }\n\n  return (\n    <div className={className} style={containerStyle}>\n      {hasLqip && (\n        <img\n          aria-hidden\n          alt=\"\"\n          src={image.lqip!}\n          style={{\n            ...overlayBase,\n            display: 'block',\n            objectFit,\n            filter: 'blur(20px)',\n            transform: 'scale(1.1)',\n          }}\n        />\n      )}\n      {placeholderColor && (\n        <div\n          aria-hidden\n          style={{\n            ...overlayBase,\n            backgroundColor: placeholderColor,\n          }}\n        />\n      )}\n      <img\n        ref={imgRef}\n        alt={altProp ?? image.alt ?? ''}\n        src={src}\n        srcSet={srcSet || undefined}\n        sizes={sizes}\n        width={width ? width * dpr : undefined}\n        loading={loading}\n        decoding=\"async\"\n        fetchPriority={priority ? 'high' : undefined}\n        onLoad={fireLoad}\n        className={imgClassName}\n        style={mainImgStyle}\n      />\n    </div>\n  )\n}\n","/** Palette colors extracted from an image */\nexport interface ImagePalette {\n  vibrant?: string | null\n  muted?: string | null\n  darkVibrant?: string | null\n  darkMuted?: string | null\n  lightVibrant?: string | null\n  lightMuted?: string | null\n}\n\n/** Common image data shape from Payload CMS upload collections */\nexport interface ImageData {\n  url?: string | null\n  width?: number | null\n  height?: number | null\n  alt?: string | null\n  lqip?: string | null\n  palette?: ImagePalette | null\n  sizes?: Record<\n    string,\n    | {\n        url?: string | null\n        width?: number | null\n        height?: number | null\n      }\n    | undefined\n  >\n}\n\n/** Pre-generated image size breakpoints (px) */\nexport const IMAGE_SIZES = [384, 768, 1536] as const\n\n/**\n * Returns the optimal image URL for a given display width.\n *\n * Picks the smallest pre-generated size whose width >= displayWidth × dpr.\n * Falls back to the original URL when no matching size exists.\n *\n * @param image - Payload image document\n * @param displayWidth - CSS pixel width the image will be displayed at\n * @param dpr - Device pixel ratio (default: 1)\n * @returns URL string, or empty string if no URL is available\n */\nexport function getImageUrl(\n  image: ImageData,\n  displayWidth: number,\n  dpr: number = 1,\n): string {\n  const target = displayWidth * dpr\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      if (size >= target) {\n        const entry = sizes[String(size)]\n        if (entry?.url) return entry.url\n      }\n    }\n  }\n\n  return image.url ?? ''\n}\n\n/**\n * Generates an HTML `srcset` attribute string from pre-generated sizes.\n *\n * Includes all available sizes plus the original image.\n * Example output: `\"url-384 384w, url-768 768w, url-1536 1536w, url-original 2000w\"`\n *\n * @param image - Payload image document\n * @returns srcset string, or empty string if no URLs are available\n */\nexport function getImageSrcSet(image: ImageData): string {\n  const parts: string[] = []\n  const sizes = image.sizes\n\n  if (sizes) {\n    for (const size of IMAGE_SIZES) {\n      const entry = sizes[String(size)]\n      if (entry?.url && entry.width) {\n        parts.push(`${entry.url} ${entry.width}w`)\n      }\n    }\n  }\n\n  if (image.url && image.width) {\n    parts.push(`${image.url} ${image.width}w`)\n  }\n\n  return parts.join(', ')\n}\n\n/**\n * Returns the LQIP (Low Quality Image Placeholder) data URL for an image.\n *\n * @param image - Payload image document\n * @returns LQIP data URL string, or undefined if not available\n */\nexport function getImageLqip(image: ImageData): string | undefined {\n  return image.lqip ?? undefined\n}\n\n/**\n * Returns the extracted color palette for an image.\n *\n * @param image - Payload image document\n * @returns ImagePalette object, or undefined if not available\n */\nexport function getImagePalette(image: ImageData): ImagePalette | undefined {\n  return image.palette ?? undefined\n}\n\n/** Options for `getImagePlaceholderStyle` */\nexport interface ImagePlaceholderOptions {\n  /** Placeholder strategy (default: 'blur') */\n  type?: 'blur' | 'color' | 'none'\n  /** Which palette color to use for 'color' strategy (default: 'muted') */\n  paletteColor?: keyof ImagePalette\n}\n\n/**\n * Returns inline CSS styles for an image placeholder.\n *\n * - `blur`: uses LQIP as background, falls back to palette color, then empty\n * - `color`: uses palette color as background, falls back to empty\n * - `none`: always returns empty\n *\n * @param image - Payload image document\n * @param options - Placeholder options\n * @returns CSS style object compatible with React CSSProperties\n */\nexport function getImagePlaceholderStyle(\n  image: ImageData,\n  options?: ImagePlaceholderOptions,\n): Record<string, string> {\n  const type = options?.type ?? 'blur'\n  const paletteColor = options?.paletteColor ?? 'muted'\n\n  if (type === 'none') return {}\n\n  const color = image.palette?.[paletteColor]\n\n  if (type === 'blur') {\n    const lqip = image.lqip\n    if (lqip) {\n      return {\n        backgroundImage: `url(${lqip})`,\n        backgroundSize: 'cover',\n        backgroundPosition: 'center',\n      }\n    }\n    // Cascade: fall back to color\n    if (color) {\n      return { backgroundColor: color }\n    }\n    return {}\n  }\n\n  // type === 'color'\n  if (color) {\n    return { backgroundColor: color }\n  }\n  return {}\n}\n"],"mappings":"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","names":[]}

package/dist/ui/video.d.cts

@@ -1,7 +1,7 @@
 import React, { CSSProperties } from 'react';
 import { MuxPlayerProps, MuxPlayerRefAttributes } from '@mux/mux-player-react';
 export { MuxPlayerRefAttributes as VideoPlayerRef } from '@mux/mux-player-react';
-import { V as Video } from '../payload-types-B98DjTLi.cjs';
+import { V as Video } from '../payload-types-CyaSGIFI.cjs';
 export { e as VideoGifOptions, V as VideoThumbnailOptions, a as getVideoGif, c as getVideoMp4Url, d as getVideoStoryboard, b as getVideoStreamUrl, g as getVideoThumbnail } from '../video-DbLL8yuc.cjs';
 
 interface VideoPlayerCSSProperties extends CSSProperties {

package/dist/ui/video.d.ts

@@ -1,7 +1,7 @@
 import React, { CSSProperties } from 'react';
 import { MuxPlayerProps, MuxPlayerRefAttributes } from '@mux/mux-player-react';
 export { MuxPlayerRefAttributes as VideoPlayerRef } from '@mux/mux-player-react';
-import { V as Video } from '../payload-types-B98DjTLi.js';
+import { V as Video } from '../payload-types-CyaSGIFI.js';
 export { e as VideoGifOptions, V as VideoThumbnailOptions, a as getVideoGif, c as getVideoMp4Url, d as getVideoStoryboard, b as getVideoStreamUrl, g as getVideoThumbnail } from '../video-DbLL8yuc.js';
 
 interface VideoPlayerCSSProperties extends CSSProperties {

package/dist/{webhook-D8HqaKUG.d.cts → webhook-D78o4MiB.d.cts}

@@ -1,5 +1,5 @@
-import { C as Collection } from './const-DbDP4kYA.cjs';
-import { C as Config } from './payload-types-B98DjTLi.cjs';
+import { C as Collection } from './const-MzPYopC7.cjs';
+import { C as Config } from './payload-types-CyaSGIFI.cjs';
 
 type CollectionType<T extends string> = T extends keyof Config['collections'] ? Config['collections'][T] : never;
 

package/dist/{webhook-DdVG08Bs.d.ts → webhook-cfGx5lXy.d.ts}

@@ -1,5 +1,5 @@
-import { C as Collection } from './const-Blyfn0_b.js';
-import { C as Config } from './payload-types-B98DjTLi.js';
+import { C as Collection } from './const-Dde6Z3er.js';
+import { C as Config } from './payload-types-CyaSGIFI.js';
 
 type CollectionType<T extends string> = T extends keyof Config['collections'] ? Config['collections'][T] : never;
 

package/dist/webhook.d.cts

@@ -1,3 +1,3 @@
-export { a as WebhookEvent, b as WebhookHandler, W as WebhookOperation, c as WebhookOptions, d as createTypedWebhookHandler, h as handleWebhook, i as isValidWebhookEvent } from './webhook-D8HqaKUG.cjs';
-import './const-DbDP4kYA.cjs';
-import './payload-types-B98DjTLi.cjs';
+export { a as WebhookEvent, b as WebhookHandler, W as WebhookOperation, c as WebhookOptions, d as createTypedWebhookHandler, h as handleWebhook, i as isValidWebhookEvent } from './webhook-D78o4MiB.cjs';
+import './const-MzPYopC7.cjs';
+import './payload-types-CyaSGIFI.cjs';

package/dist/webhook.d.ts

@@ -1,3 +1,3 @@
-export { a as WebhookEvent, b as WebhookHandler, W as WebhookOperation, c as WebhookOptions, d as createTypedWebhookHandler, h as handleWebhook, i as isValidWebhookEvent } from './webhook-DdVG08Bs.js';
-import './const-Blyfn0_b.js';
-import './payload-types-B98DjTLi.js';
+export { a as WebhookEvent, b as WebhookHandler, W as WebhookOperation, c as WebhookOptions, d as createTypedWebhookHandler, h as handleWebhook, i as isValidWebhookEvent } from './webhook-cfGx5lXy.js';
+import './const-Dde6Z3er.js';
+import './payload-types-CyaSGIFI.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@01.software/sdk",
-  "version": "0.5.6",
+  "version": "0.5.8",
   "description": "01.software SDK",
   "author": "<office@01.works>",
   "keywords": [],