@picked/svelte 0.0.1-dev.1765971320697 → 0.0.1-dev.1765991816856

package/dist/components/LazyImage.svelte

@@ -71,64 +71,35 @@
     }
   }
 
-  function isShopifyDomain(url: URL): boolean {
-    try {
-      return url.hostname === 'cdn.shopify.com'
-    } catch {
-      return false
-    }
-  }
-
-  /**
-   * Add dpl param to Convincely domain URLs for deployment-specific routing.
-   */
-  function addDplParamIfNeeded(imageSrc: string): string {
+  function getOptimizedImageUrl(imageSrc: string, targetWidth: number): string {
     try {
-      const url = new URL(imageSrc, import.meta.url)
-      
-      if (isConvincelyDomain(url)) {
-        // Check for Vercel deployment ID (works in both browser and server contexts)
-        const vercelDeploymentId = typeof import.meta.env !== 'undefined' 
-          ? import.meta.env.VERCEL_DEPLOYMENT_ID 
-          : undefined
-        const vercelSkewProtection = typeof import.meta.env !== 'undefined'
-          ? import.meta.env.VERCEL_SKEW_PROTECTION_ENABLED
-          : undefined
-
-        if (vercelDeploymentId && vercelSkewProtection === '1') {
-          url.searchParams.set('dpl', vercelDeploymentId)
+      // If a custom loader is provided, use it first
+      if (loader) {
+        const result = loader({ src: imageSrc, width: targetWidth })
+        if (result !== undefined) {
+          return result
         }
-        return url.toString()
       }
-      
-      return imageSrc
-    } catch {
-      return imageSrc
-    }
-  }
 
-  function getOptimizedImageUrl(imageSrc: string, targetWidth: number): string {
-    const width = findClosestSize(targetWidth)
-    
-    try {
       const url = new URL(imageSrc, import.meta.url)
-      
-      // If it's a Shopify domain and a custom loader is provided, use the loader
-      if (isShopifyDomain(url) && loader) {
-        const customUrl = loader({ src: imageSrc, width })
-        if (customUrl) return customUrl
+
+      // Handle Convincely domain optimization through the image optimization service
+      if (isConvincelyDomain(url)) {
+        const encodedUrl = encodeURIComponent(url.toString())
+        const optimizedSize = findClosestSize(targetWidth)
+        return `https://img.convincely.io/_next/image?url=${encodedUrl}&w=${optimizedSize}&q=75`
       }
+
+      // For other domains, return the original URL
+      return getImgUrl(imageSrc)
     } catch {
-      // If URL parsing fails, continue with default behavior
+      // If URL parsing fails, fall back to original behavior
+      return getImgUrl(imageSrc)
     }
-
-    // Default optimization: use img.convincely.io for all images
-    const imgUrl = getImgUrl(imageSrc)
-    const encodedUrl = encodeURIComponent(imgUrl)
-    return `https://img.convincely.io/_next/image?url=${encodedUrl}&w=${width}&q=75`
   }
 
   function getImgUrl(imageSrc: string): string {
+    // Skip base64 images
     if (imageSrc.startsWith('data:')) {
       return imageSrc
     }
@@ -137,9 +108,6 @@
     return imageSrc.startsWith('http') ? imageSrc : `${baseUrl}${imageSrc}`
   }
 
-  // Add dpl param to src if it's a Convincely domain
-  const processedSrc = $derived(addDplParamIfNeeded(src))
-
   function handleLoad() {
     isLoaded = true
   }
@@ -161,6 +129,7 @@
             rootMargin: '50px',
           },
         )
+
         observer.observe(elementToObserve)
 
         return () => {
@@ -184,11 +153,12 @@
   })
 
   const srcSet = $derived.by(() =>
-    widthCandidates.map((w) => `${getOptimizedImageUrl(processedSrc, w)} ${w}w`).join(', '),
+    widthCandidates.map((w) => `${getOptimizedImageUrl(src, w)} ${w}w`).join(', '),
   )
 
-  const fallbackSrc = $derived.by(() => getOptimizedImageUrl(processedSrc, widthCandidates[0]))
+  const fallbackSrc = $derived.by(() => getOptimizedImageUrl(src, widthCandidates[0]))
 
+  // Only apply fade-in when loading is not eager
   const fadeClasses = $derived.by(() => {
     if (loading === 'eager') return ''
     return `transition-opacity duration-300 ${isLoaded ? 'opacity-100' : 'opacity-0'}`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@picked/svelte",
-  "version": "0.0.1-dev.1765971320697",
+  "version": "0.0.1-dev.1765991816856",
   "dependencies": {
     "d3": "^7.9.0"
   },
@@ -75,7 +75,7 @@
   ],
   "module": "./dist/index.js",
   "peerDependencies": {
-    "@picked/client": "0.0.1-dev.1765971320697",
+    "@picked/client": "0.0.1-dev.1765991816856",
     "effector": "^23.3.0",
     "svelte": "^5.34.3"
   },