@neut/ui 0.0.9 → 0.0.11

package/dist/components/image/Image.utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"Image.utils.js","names":[],"sources":["../../../src/components/image/Image.utils.ts"],"sourcesContent":["/**\n * handle-loading.ts\n * 单一职责：封装图片加载完成后的所有副作用——decode、回调触发、开发环境警告。\n * 纯 TypeScript，不包含任何 JSX 或组件代码。\n */\n\nimport { mergeProps, splitProps } from \"solid-js\";\nimport { warnOnce } from \"~/utils\";\nimport { imageConfigDefault } from \"./Image.config\";\nimport type {\n  ImageConfig,\n  ImageConfigComplete,\n  ImageLoaderProps,\n  ImageLoaderWithConfig,\n  ImageProps,\n  ImgProps,\n  ImgPropsResult,\n  LoadingValue,\n  OnLoad,\n  OnLoadingComplete,\n  PlaceholderStyle,\n  PlaceholderValue,\n  StaticImageData,\n  StaticImport,\n  StaticRequire,\n} from \"./Image.types\";\n\n// ─── 类型补充 ─────────────────────────────────────────────────────────────────\n\n/** 用于追踪每个 img 节点已处理的 src，避免重复触发 */\ntype ImgWithDataProp = HTMLImageElement & { \"data-loaded-src\"?: string };\n\n// ─── 主函数 ───────────────────────────────────────────────────────────────────\n\n/**\n * 在图片加载/hydrate 后调用。\n * - 使用 img.decode() 确保像素已解码再触发回调\n * - 清除 blur placeholder\n * - 开发环境下输出 fill / sizes 相关警告\n */\nexport function handleLoading(\n  img: ImgWithDataProp,\n  placeholder: PlaceholderValue,\n  onLoad: OnLoad | undefined,\n  onLoadingComplete: OnLoadingComplete | undefined,\n  setBlurComplete: (v: boolean) => void,\n  unoptimized: boolean,\n  sizesInput: string | undefined,\n): void {\n  const src = img?.src;\n  // 同一张图只处理一次\n  if (!img || img[\"data-loaded-src\"] === src) return;\n  img[\"data-loaded-src\"] = src;\n\n  const p: Promise<void> = \"decode\" in img ? img.decode() : Promise.resolve();\n\n  p.catch(() => {}).then(() => {\n    // 若组件已卸载则提前退出\n    if (!img.parentElement || !img.isConnected) return;\n\n    if (placeholder !== \"empty\") {\n      setBlurComplete(true);\n    }\n\n    if (onLoad) {\n      const event = new Event(\"load\");\n      Object.defineProperty(event, \"target\", { writable: false, value: img });\n      onLoad(\n        event as Event & { currentTarget: HTMLImageElement; target: Element },\n      );\n    }\n\n    if (onLoadingComplete) {\n      onLoadingComplete(img);\n    }\n\n    if (import.meta.env.DEV) {\n      warnFillUsage(img, unoptimized, sizesInput);\n      warnAspectRatioMismatch(img);\n    }\n  });\n}\n\n// ─── 开发警告辅助 ──────────────────────────────────────────────────────────────\n\nfunction warnFillUsage(\n  img: HTMLImageElement,\n  unoptimized: boolean,\n  sizesInput: string | undefined,\n): void {\n  if (img.getAttribute(\"data-nimg\") !== \"fill\") return;\n\n  const origSrc =\n    new URL(img.src, \"http://n\").searchParams.get(\"url\") || img.src;\n\n  if (!unoptimized) {\n    const widthViewportRatio =\n      img.getBoundingClientRect().width / window.innerWidth;\n    if (widthViewportRatio < 0.6) {\n      if (sizesInput === \"100vw\") {\n        console.warn(\n          `[Image] src=\"${origSrc}\" 设置了 fill 和 sizes=\"100vw\"，但实际渲染宽度不足视口宽度，请调整 sizes 以提升性能。`,\n        );\n      } else if (!sizesInput) {\n        console.warn(\n          `[Image] src=\"${origSrc}\" 设置了 fill 但缺少 sizes 属性，请添加以提升性能。`,\n        );\n      }\n    }\n  }\n\n  if (img.parentElement) {\n    const { position } = window.getComputedStyle(img.parentElement);\n    const valid = [\"absolute\", \"fixed\", \"relative\"];\n    if (!valid.includes(position)) {\n      console.warn(\n        `[Image] src=\"${origSrc}\" 设置了 fill，但父元素 position=\"${position}\"，应为 ${valid.join(\" | \")} 之一。`,\n      );\n    }\n  }\n\n  if (img.height === 0) {\n    console.warn(\n      `[Image] src=\"${origSrc}\" 设置了 fill 且高度为 0，请为父元素设置明确高度。`,\n    );\n  }\n}\n\nfunction warnAspectRatioMismatch(img: HTMLImageElement): void {\n  const heightModified = img.height.toString() !== img.getAttribute(\"height\");\n  const widthModified = img.width.toString() !== img.getAttribute(\"width\");\n  if (\n    (heightModified && !widthModified) ||\n    (!heightModified && widthModified)\n  ) {\n    const origSrc =\n      new URL(img.src, \"http://n\").searchParams.get(\"url\") || img.src;\n    console.warn(\n      `[Image] src=\"${origSrc}\" 仅修改了 width 或 height 其中之一，请同时添加 width: \"auto\" 或 height: \"auto\" 样式以保持宽高比。`,\n    );\n  }\n}\n\ninterface GetImgPropsOptions {\n  imgConf: ImageConfigComplete;\n  blurComplete: boolean;\n  showAltText: boolean;\n}\n\nexport const VALID_LOADING_VALUES = [\"lazy\", \"eager\", undefined] as const;\n// Object-fit values that are not valid background-size values\nconst INVALID_BACKGROUND_SIZE_VALUES = [\n  \"-moz-initial\",\n  \"fill\",\n  \"none\",\n  \"scale-down\",\n  undefined,\n];\n\nlet perfObserver: PerformanceObserver | undefined;\nconst allImgs = new Map<\n  string,\n  { src: string; loading: LoadingValue; placeholder: PlaceholderValue }\n>();\n\nexport function getImgProps(\n  props: ImageProps,\n  { imgConf, blurComplete, showAltText }: GetImgPropsOptions,\n): ImgPropsResult {\n  const merged = mergeProps(\n    {\n      // loader: defaultLoader,\n      fill: false,\n      priority: false,\n      preload: false,\n      placeholder: \"empty\",\n      unoptimized: imgConf.unoptimized,\n      decoding: \"async\",\n    } as const,\n    props,\n  );\n  const [local, others] = splitProps(merged, [\n    \"src\",\n    \"loader\",\n    \"quality\",\n    \"width\",\n    \"height\",\n    \"fill\",\n    \"sizes\",\n    \"priority\",\n    \"placeholder\",\n    \"blurDataURL\",\n    \"unoptimized\",\n    \"overrideSrc\",\n    \"onLoad\",\n    \"onLoadingComplete\",\n    \"layout\",\n    \"style\",\n    \"preload\",\n    \"loading\",\n    \"objectFit\",\n    \"objectPosition\",\n    \"lazyBoundary\",\n    \"lazyRoot\",\n    \"fetchpriority\",\n    \"class\",\n    \"decoding\",\n  ]);\n\n  let config: ImageConfig;\n  const c = imgConf || imageConfigDefault;\n\n  if (\"allSizes\" in c) {\n    config = c as ImageConfig;\n  } else {\n    const allSizes = [...c.deviceSizes, ...c.imageSizes].sort((a, b) => a - b);\n    const deviceSizes = c.deviceSizes.sort((a, b) => a - b);\n    const qualities = c.qualities?.sort((a, b) => a - b);\n    config = { ...c, allSizes, deviceSizes, qualities };\n  }\n\n  if (typeof defaultLoader === \"undefined\") {\n    throw new Error(\n      \"images.loaderFile detected but the file is missing default export.\\nRead more: https://nextjs.org/docs/messages/invalid-images-config\",\n    );\n  }\n\n  let style = local.style;\n  let sizes = local.sizes;\n  let fill = local.fill;\n\n  const loader: ImageLoaderWithConfig = local.loader || defaultLoader;\n\n  if (local.layout) {\n    if (local.layout === \"fill\") {\n      fill = true;\n    }\n    const layoutToStyle: Record<string, Record<string, string> | undefined> = {\n      intrinsic: { maxWidth: \"100%\", height: \"auto\" },\n      responsive: { width: \"100%\", height: \"auto\" },\n    };\n    const layoutToSizes: Record<string, string | undefined> = {\n      responsive: \"100vw\",\n      fill: \"100vw\",\n    };\n    const layoutStyle = layoutToStyle[local.layout];\n    if (layoutStyle) {\n      style = { ...style, ...layoutStyle };\n    }\n    const layoutSizes = layoutToSizes[local.layout];\n    if (layoutSizes && !sizes) {\n      sizes = layoutSizes;\n    }\n  }\n\n  let staticSrc = \"\";\n  let blurDataURL = local.blurDataURL;\n  let widthInt = getInt(local.width);\n  let heightInt = getInt(local.height);\n  let blurWidth: number | undefined;\n  let blurHeight: number | undefined;\n\n  if (isStaticImport(local.src)) {\n    const staticImageData = isStaticRequire(local.src)\n      ? local.src.default\n      : local.src;\n\n    if (!staticImageData.src) {\n      throw new Error(\n        `An object should only be passed to the image component src parameter if it comes from a static image import. It must include src. Received ${JSON.stringify(\n          staticImageData,\n        )}`,\n      );\n    }\n    if (!staticImageData.height || !staticImageData.width) {\n      throw new Error(\n        `An object should only be passed to the image component src parameter if it comes from a static image import. It must include height and width. Received ${JSON.stringify(\n          staticImageData,\n        )}`,\n      );\n    }\n\n    blurWidth = staticImageData.blurWidth;\n    blurHeight = staticImageData.blurHeight;\n    blurDataURL = blurDataURL || staticImageData.blurDataURL;\n    staticSrc = staticImageData.src;\n\n    if (!fill) {\n      if (!widthInt && !heightInt) {\n        widthInt = staticImageData.width;\n        heightInt = staticImageData.height;\n      } else if (widthInt && !heightInt) {\n        const ratio = widthInt / staticImageData.width;\n        heightInt = Math.round(staticImageData.height * ratio);\n      } else if (!widthInt && heightInt) {\n        const ratio = heightInt / staticImageData.height;\n        widthInt = Math.round(staticImageData.width * ratio);\n      }\n    }\n  }\n  const src = typeof local.src === \"string\" ? local.src : staticSrc;\n\n  let unoptimized = local.unoptimized;\n  let isLazy =\n    !local.priority &&\n    !local.preload &&\n    (local.loading === \"lazy\" || typeof local.loading === \"undefined\");\n  if (!src || src.startsWith(\"data:\") || src.startsWith(\"blob:\")) {\n    // https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs\n    unoptimized = true;\n    isLazy = false;\n  }\n  if (config.unoptimized) {\n    unoptimized = true;\n  }\n  if (!config.dangerouslyAllowSVG && src.split(\"?\", 1)[0].endsWith(\".svg\")) {\n    // Special case to make svg serve as-is to avoid proxying\n    // through the built-in Image Optimization API.\n    unoptimized = true;\n  }\n\n  const qualityInt = getInt(local.quality);\n\n  if (!import.meta.env.PROD) {\n    if (config.output === \"export\" && !unoptimized) {\n      throw new Error(\n        `Image Optimization using the default loader is not compatible with \\`{ output: 'export' }\\`.\n    Possible solutions:\n      - Remove \\`{ output: 'export' }\\` and run \"next start\" to run server mode including the Image Optimization API.\n      - Configure \\`{ images: { unoptimized: true } }\\` in \\`next.config.js\\` to disable the Image Optimization API.\n    Read more: https://nextjs.org/docs/messages/export-image-api`,\n      );\n    }\n    if (!src) {\n      // React doesn't show the stack trace and there's\n      // no `src` to help identify which image, so we\n      // instead console.error(ref) during mount.\n      unoptimized = true;\n    } else {\n      if (fill) {\n        if (local.width) {\n          throw new Error(\n            `Image with src \"${src}\" has both \"width\" and \"fill\" properties. Only one should be used.`,\n          );\n        }\n        if (local.height) {\n          throw new Error(\n            `Image with src \"${src}\" has both \"height\" and \"fill\" properties. Only one should be used.`,\n          );\n        }\n        if (style?.position && style.position !== \"absolute\") {\n          throw new Error(\n            `Image with src \"${src}\" has both \"fill\" and \"style.position\" properties. Images with \"fill\" always use position absolute - it cannot be modified.`,\n          );\n        }\n        if (style?.width && style.width !== \"100%\") {\n          throw new Error(\n            `Image with src \"${src}\" has both \"fill\" and \"style.width\" properties. Images with \"fill\" always use width 100% - it cannot be modified.`,\n          );\n        }\n        if (style?.height && style.height !== \"100%\") {\n          throw new Error(\n            `Image with src \"${src}\" has both \"fill\" and \"style.height\" properties. Images with \"fill\" always use height 100% - it cannot be modified.`,\n          );\n        }\n      } else {\n        if (typeof widthInt === \"undefined\") {\n          throw new Error(\n            `Image with src \"${src}\" is missing required \"width\" property.`,\n          );\n        } else if (Number.isNaN(widthInt)) {\n          throw new Error(\n            `Image with src \"${src}\" has invalid \"width\" property. Expected a numeric value in pixels but received \"${local.width}\".`,\n          );\n        }\n        if (typeof heightInt === \"undefined\") {\n          throw new Error(\n            `Image with src \"${src}\" is missing required \"height\" property.`,\n          );\n        } else if (Number.isNaN(heightInt)) {\n          throw new Error(\n            `Image with src \"${src}\" has invalid \"height\" property. Expected a numeric value in pixels but received \"${local.height}\".`,\n          );\n        }\n\n        // biome-ignore lint/suspicious/noControlCharactersInRegex: no-control-regex\n        if (/^[\\x00-\\x20]/.test(src)) {\n          throw new Error(\n            `Image with src \"${src}\" cannot start with a space or control character. Use src.trimStart() to remove it or encodeURIComponent(src) to keep it.`,\n          );\n        }\n        // biome-ignore lint/suspicious/noControlCharactersInRegex: no-control-regex\n        if (/[\\x00-\\x20]$/.test(src)) {\n          throw new Error(\n            `Image with src \"${src}\" cannot end with a space or control character. Use src.trimEnd() to remove it or encodeURIComponent(src) to keep it.`,\n          );\n        }\n      }\n    }\n    if (!VALID_LOADING_VALUES.includes(local.loading)) {\n      throw new Error(\n        `Image with src \"${src}\" has invalid \"loading\" property. Provided \"${local.loading}\" should be one of ${VALID_LOADING_VALUES.map(\n          String,\n        ).join(\",\")}.`,\n      );\n    }\n    if (local.priority && local.loading === \"lazy\") {\n      throw new Error(\n        `Image with src \"${src}\" has both \"priority\" and \"loading='lazy'\" properties. Only one should be used.`,\n      );\n    }\n    if (local.preload && local.loading === \"lazy\") {\n      throw new Error(\n        `Image with src \"${src}\" has both \"preload\" and \"loading='lazy'\" properties. Only one should be used.`,\n      );\n    }\n    if (local.preload && local.priority) {\n      throw new Error(\n        `Image with src \"${src}\" has both \"preload\" and \"priority\" properties. Only \"preload\" should be used.`,\n      );\n    }\n    if (\n      local.placeholder !== \"empty\" &&\n      local.placeholder !== \"blur\" &&\n      !local.placeholder.startsWith(\"data:image/\")\n    ) {\n      throw new Error(\n        `Image with src \"${src}\" has invalid \"placeholder\" property \"${local.placeholder}\".`,\n      );\n    }\n    if (local.placeholder !== \"empty\") {\n      if (widthInt && heightInt && widthInt * heightInt < 1600) {\n        warnOnce(\n          `Image with src \"${src}\" is smaller than 40x40. Consider removing the \"placeholder\" property to improve performance.`,\n        );\n      }\n    }\n    if (\n      qualityInt &&\n      config.qualities &&\n      !config.qualities.includes(qualityInt)\n    ) {\n      warnOnce(\n        `Image with src \"${src}\" is using quality \"${qualityInt}\" which is not configured in images.qualities [${config.qualities.join(\", \")}]. Please update your config to [${[...config.qualities, qualityInt].sort().join(\", \")}].` +\n          `\\nRead more: https://nextjs.org/docs/messages/next-image-unconfigured-qualities`,\n      );\n    }\n    if (local.placeholder === \"blur\" && !blurDataURL) {\n      const VALID_BLUR_EXT = [\"jpeg\", \"png\", \"webp\", \"avif\"]; // should match next-image-loader\n\n      throw new Error(\n        `Image with src \"${src}\" has \"placeholder='blur'\" property but is missing the \"blurDataURL\" property.\n          Possible solutions:\n            - Add a \"blurDataURL\" property, the contents should be a small Data URL to represent the image\n            - Change the \"src\" property to a static import with one of the supported file types: ${VALID_BLUR_EXT.join(\n              \",\",\n            )} (animated images not supported)\n            - Remove the \"placeholder\" property, effectively no blur effect\n          Read more: https://nextjs.org/docs/messages/placeholder-blur-data-url`,\n      );\n    }\n    if (\"ref\" in others) {\n      warnOnce(\n        `Image with src \"${src}\" is using unsupported \"ref\" property. Consider using the \"onLoad\" property instead.`,\n      );\n    }\n\n    if (!unoptimized) {\n      const urlStr = loader({\n        config,\n        src,\n        width: widthInt || 400,\n        quality: qualityInt || 75,\n      });\n      let url: URL | undefined;\n      try {\n        url = new URL(urlStr);\n      } catch (err) {\n        console.error(err);\n      }\n      if (urlStr === src || (url && url.pathname === src && !url.search)) {\n        warnOnce(\n          `Image with src \"${src}\" has a \"loader\" property that does not implement width. Please implement it or use the \"unoptimized\" property instead.` +\n            `\\nRead more: https://nextjs.org/docs/messages/next-image-missing-loader-width`,\n        );\n      }\n    }\n\n    if (local.onLoadingComplete) {\n      warnOnce(\n        `Image with src \"${src}\" is using deprecated \"onLoadingComplete\" property. Please use the \"onLoad\" property instead.`,\n      );\n    }\n\n    for (const [legacyKey, legacyValue] of Object.entries({\n      layout: local.layout,\n      objectFit: local.objectFit,\n      objectPosition: local.objectPosition,\n      lazyBoundary: local.lazyBoundary,\n      lazyRoot: local.lazyRoot,\n    })) {\n      if (legacyValue) {\n        warnOnce(\n          `Image with src \"${src}\" has legacy prop \"${legacyKey}\". Did you forget to run the codemod?` +\n            `\\nRead more: https://nextjs.org/docs/messages/next-image-upgrade-to-13`,\n        );\n      }\n    }\n\n    if (\n      typeof window !== \"undefined\" &&\n      !perfObserver &&\n      window.PerformanceObserver\n    ) {\n      perfObserver = new PerformanceObserver((entryList) => {\n        for (const entry of entryList.getEntries()) {\n          // @ts-expect-error - missing \"LargestContentfulPaint\" class with \"element\" prop\n          const imgSrc = entry?.element?.src || \"\";\n          const lcpImage = allImgs.get(imgSrc);\n          if (\n            lcpImage &&\n            lcpImage.loading === \"lazy\" &&\n            lcpImage.placeholder === \"empty\" &&\n            !lcpImage.src.startsWith(\"data:\") &&\n            !lcpImage.src.startsWith(\"blob:\")\n          ) {\n            // https://web.dev/lcp/#measure-lcp-in-javascript\n            warnOnce(\n              `Image with src \"${lcpImage.src}\" was detected as the Largest Contentful Paint (LCP). Please add the \\`loading=\"eager\"\\` property if this image is above the fold.` +\n                `\\nRead more: https://nextjs.org/docs/app/api-reference/components/image#loading`,\n            );\n          }\n        }\n      });\n      try {\n        perfObserver.observe({\n          type: \"largest-contentful-paint\",\n          buffered: true,\n        });\n      } catch (err) {\n        // Log error but don't crash the app\n        console.error(err);\n      }\n    }\n  }\n\n  const imgStyle = Object.assign(\n    fill\n      ? {\n          position: \"absolute\",\n          height: \"100%\",\n          width: \"100%\",\n          left: 0,\n          top: 0,\n          right: 0,\n          bottom: 0,\n          objectFit: local.objectFit,\n          objectPosition: local.objectPosition,\n        }\n      : {},\n    showAltText ? {} : { color: \"transparent\" },\n    style,\n  );\n\n  const backgroundImage =\n    !blurComplete && local.placeholder !== \"empty\"\n      ? local.placeholder === \"blur\"\n        ? `url(\"data:image/svg+xml;charset=utf-8,${getImageBlurSvg({\n            widthInt,\n            heightInt,\n            blurWidth,\n            blurHeight,\n            blurDataURL: blurDataURL || \"\", // assume not undefined\n            objectFit: imgStyle.objectFit,\n          })}\")`\n        : `url(\"${local.placeholder}\")` // assume `data:image/`\n      : null;\n\n  const backgroundSize = !INVALID_BACKGROUND_SIZE_VALUES.includes(\n    imgStyle.objectFit,\n  )\n    ? imgStyle.objectFit\n    : imgStyle.objectFit === \"fill\"\n      ? \"100% 100%\" // the background-size equivalent of `fill`\n      : \"cover\";\n\n  const placeholderStyle: PlaceholderStyle = backgroundImage\n    ? {\n        \"background-size\": backgroundSize,\n        \"background-position\": imgStyle.objectPosition || \"50% 50%\",\n        \"background-repeat\": \"no-repeat\",\n        \"background-image\": backgroundImage,\n      }\n    : {};\n\n  if (import.meta.env.DEV) {\n    if (\n      placeholderStyle[\"background-image\"] &&\n      local.placeholder === \"blur\" &&\n      blurDataURL?.startsWith(\"/\")\n    ) {\n      // During `next dev`, we don't want to generate blur placeholders with webpack\n      // because it can delay starting the dev server. Instead, `next-image-loader.js`\n      // will inline a special url to lazily generate the blur placeholder at request time.\n      placeholderStyle[\"background-image\"] = `url(\"${blurDataURL}\")`;\n    }\n  }\n\n  const imgAttributes = generateImgAttrs({\n    config,\n    src,\n    unoptimized,\n    width: widthInt,\n    quality: qualityInt,\n    sizes,\n    loader,\n  });\n\n  const loadingFinal = isLazy ? \"lazy\" : local.loading;\n\n  if (!import.meta.env.PROD) {\n    if (typeof window !== \"undefined\") {\n      let fullUrl: URL;\n      try {\n        fullUrl = new URL(imgAttributes.src);\n      } catch (e) {\n        console.error(e);\n        fullUrl = new URL(imgAttributes.src, window.location.href);\n      }\n      allImgs.set(fullUrl.href, {\n        src,\n        loading: loadingFinal,\n        placeholder: local.placeholder,\n      });\n    }\n  }\n\n  const newProps: ImgProps = {\n    ...others,\n    loading: loadingFinal,\n    fetchpriority: local.fetchpriority,\n    width: widthInt,\n    height: heightInt,\n    decoding: local.decoding,\n    class: local.class,\n    style: { ...imgStyle, ...placeholderStyle },\n    sizes: imgAttributes.sizes,\n    srcSet: imgAttributes.srcSet,\n    src: local.overrideSrc || imgAttributes.src,\n  };\n  const meta = {\n    unoptimized,\n    preload: local.preload || local.priority,\n    placeholder: local.placeholder,\n    fill,\n  };\n  return { props: newProps, meta };\n}\n\nfunction defaultLoader({ src, width, quality }: ImageLoaderProps): string {\n  if (import.meta.env.DEV) {\n    const missingValues: string[] = [];\n    if (!src) missingValues.push(\"src\");\n    if (!width) missingValues.push(\"width\");\n    if (missingValues.length > 0) {\n      throw new Error(\n        `[defaultLoader] 缺少必要属性：${missingValues.join(\", \")}。` +\n          `请确认调用方式正确，或提供自定义 loader。`,\n      );\n    }\n  }\n\n  // 如果 src 本身已是带参数的 URL（外部图片），直接返回\n  if (src.startsWith(\"http://\") || src.startsWith(\"https://\")) {\n    return src;\n  }\n\n  // 本地图片：追加 w / q 参数（供自定义服务器处理）\n  const params = new URLSearchParams();\n  params.set(\"url\", src);\n  params.set(\"w\", String(width));\n  if (quality) params.set(\"q\", String(quality));\n  return `/_image?${params.toString()}`;\n}\n\nfunction getInt(x: unknown): number | undefined {\n  if (typeof x === \"undefined\") {\n    return x;\n  }\n  if (typeof x === \"number\") {\n    return Number.isFinite(x) ? x : NaN;\n  }\n  if (typeof x === \"string\" && /^[0-9]+$/.test(x)) {\n    return parseInt(x, 10);\n  }\n  return NaN;\n}\n\nfunction isStaticRequire(\n  src: StaticRequire | StaticImageData,\n): src is StaticRequire {\n  return (src as StaticRequire).default !== undefined;\n}\n\nfunction isStaticImageData(\n  src: StaticRequire | StaticImageData,\n): src is StaticImageData {\n  return (src as StaticImageData).src !== undefined;\n}\n\nfunction isStaticImport(src: string | StaticImport): src is StaticImport {\n  return (\n    !!src &&\n    typeof src === \"object\" &&\n    (isStaticRequire(src as StaticImport) ||\n      isStaticImageData(src as StaticImport))\n  );\n}\n\nfunction getImageBlurSvg({\n  widthInt,\n  heightInt,\n  blurWidth,\n  blurHeight,\n  blurDataURL,\n  objectFit,\n}: {\n  widthInt?: number;\n  heightInt?: number;\n  blurWidth?: number;\n  blurHeight?: number;\n  blurDataURL: string;\n  objectFit?: string;\n}): string {\n  const std = 20;\n  const svgWidth = blurWidth ? blurWidth * 40 : widthInt;\n  const svgHeight = blurHeight ? blurHeight * 40 : heightInt;\n\n  const viewBox =\n    svgWidth && svgHeight ? `viewBox='0 0 ${svgWidth} ${svgHeight}'` : \"\";\n  const preserveAspectRatio = viewBox\n    ? \"none\"\n    : objectFit === \"contain\"\n      ? \"xMidYMid\"\n      : objectFit === \"cover\"\n        ? \"xMidYMid slice\"\n        : \"none\";\n\n  return `%3Csvg xmlns='http://www.w3.org/2000/svg' ${viewBox}%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='${std}'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='${std}'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='${preserveAspectRatio}' style='filter: url(%23b);' href='${blurDataURL}'/%3E%3C/svg%3E`;\n}\n\ntype GenImgAttrsData = {\n  config: ImageConfig;\n  src: string;\n  unoptimized: boolean;\n  loader: ImageLoaderWithConfig;\n  width?: number;\n  quality?: number;\n  sizes?: string;\n};\n\ntype GenImgAttrsResult = {\n  src: string;\n  srcSet: string | undefined;\n  sizes: string | undefined;\n};\n\nfunction generateImgAttrs({\n  config,\n  src,\n  unoptimized,\n  width,\n  quality,\n  sizes,\n  loader,\n}: GenImgAttrsData): GenImgAttrsResult {\n  if (unoptimized) {\n    return { src, srcSet: undefined, sizes: undefined };\n  }\n\n  const { widths, kind } = getWidths(config, width, sizes);\n  const last = widths.length - 1;\n\n  return {\n    sizes: !sizes && kind === \"w\" ? \"100vw\" : sizes,\n    srcSet: widths\n      .map(\n        (w, i) =>\n          `${loader({ config, src, quality, width: w })} ${\n            kind === \"w\" ? w : i + 1\n          }${kind}`,\n      )\n      .join(\", \"),\n\n    // It's intended to keep `src` the last attribute because React updates\n    // attributes in order. If we keep `src` the first one, Safari will\n    // immediately start to fetch `src`, before `sizes` and `srcSet` are even\n    // updated by React. That causes multiple unnecessary requests if `srcSet`\n    // and `sizes` are defined.\n    // This bug cannot be reproduced in Chrome or Firefox.\n    src: loader({ config, src, quality, width: widths[last] }),\n  };\n}\n\nfunction getWidths(\n  { deviceSizes, allSizes }: ImageConfig,\n  width: number | undefined,\n  sizes: string | undefined,\n): { widths: number[]; kind: \"w\" | \"x\" } {\n  if (sizes) {\n    // Find all the \"vw\" percent sizes used in the sizes prop\n    const viewportWidthRe = /(^|\\s)(1?\\d?\\d)vw/g;\n    const percentSizes = [];\n    for (\n      let match: RegExpExecArray | null;\n      // biome-ignore lint/suspicious/noAssignInExpressions: nextjs code\n      (match = viewportWidthRe.exec(sizes));\n      match\n    ) {\n      percentSizes.push(Number.parseInt(match[2], 10));\n    }\n    if (percentSizes.length) {\n      const smallestRatio = Math.min(...percentSizes) * 0.01;\n      return {\n        widths: allSizes.filter((s) => s >= deviceSizes[0] * smallestRatio),\n        kind: \"w\",\n      };\n    }\n    return { widths: allSizes, kind: \"w\" };\n  }\n  if (typeof width !== \"number\") {\n    return { widths: deviceSizes, kind: \"w\" };\n  }\n\n  const widths = [\n    ...new Set(\n      // > This means that most OLED screens that say they are 3x resolution,\n      // > are actually 3x in the green color, but only 1.5x in the red and\n      // > blue colors. Showing a 3x resolution image in the app vs a 2x\n      // > resolution image will be visually the same, though the 3x image\n      // > takes significantly more data. Even true 3x resolution screens are\n      // > wasteful as the human eye cannot see that level of detail without\n      // > something like a magnifying glass.\n      // https://blog.twitter.com/engineering/en_us/topics/infrastructure/2019/capping-image-fidelity-on-ultra-high-resolution-devices.html\n      [width, width * 2 /*, width * 3*/].map(\n        (w) => allSizes.find((p) => p >= w) || allSizes[allSizes.length - 1],\n      ),\n    ),\n  ];\n  return { widths, kind: \"x\" };\n}\n"],"mappings":"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"}
+{"version":3,"file":"Image.utils.js","names":[],"sources":["../../../src/components/image/Image.utils.ts"],"sourcesContent":["/**\n * handle-loading.ts\n * 单一职责：封装图片加载完成后的所有副作用——decode、回调触发、开发环境警告。\n * 纯 TypeScript，不包含任何 JSX 或组件代码。\n */\n\nimport { mergeProps, splitProps } from \"solid-js\";\nimport { warnOnce } from \"~/utils\";\nimport { imageConfigDefault } from \"./Image.config\";\nimport type {\n  ImageConfig,\n  ImageConfigComplete,\n  ImageLoaderProps,\n  ImageLoaderWithConfig,\n  ImageProps,\n  ImgProps,\n  ImgPropsResult,\n  LoadingValue,\n  OnLoad,\n  OnLoadingComplete,\n  PlaceholderStyle,\n  PlaceholderValue,\n  StaticImageData,\n  StaticImport,\n  StaticRequire,\n} from \"./Image.types\";\n\n// ─── 类型补充 ─────────────────────────────────────────────────────────────────\n\n/** 用于追踪每个 img 节点已处理的 src，避免重复触发 */\ntype ImgWithDataProp = HTMLImageElement & { \"data-loaded-src\"?: string };\n\n// ─── 主函数 ───────────────────────────────────────────────────────────────────\n\n/**\n * 在图片加载/hydrate 后调用。\n * - 使用 img.decode() 确保像素已解码再触发回调\n * - 清除 blur placeholder\n * - 开发环境下输出 fill / sizes 相关警告\n */\nexport function handleLoading(\n  img: ImgWithDataProp,\n  placeholder: PlaceholderValue,\n  onLoad: OnLoad | undefined,\n  onLoadingComplete: OnLoadingComplete | undefined,\n  setBlurComplete: (v: boolean) => void,\n  unoptimized: boolean,\n  sizesInput: string | undefined,\n): void {\n  const src = img?.src;\n  // 同一张图只处理一次\n  if (!img || img[\"data-loaded-src\"] === src) return;\n  img[\"data-loaded-src\"] = src;\n\n  const p: Promise<void> = \"decode\" in img ? img.decode() : Promise.resolve();\n\n  p.catch(() => {}).then(() => {\n    // 若组件已卸载则提前退出\n    if (!img.parentElement || !img.isConnected) return;\n\n    if (placeholder !== \"empty\") {\n      setBlurComplete(true);\n    }\n\n    if (onLoad) {\n      const event = new Event(\"load\");\n      Object.defineProperty(event, \"target\", { writable: false, value: img });\n      onLoad(\n        event as Event & { currentTarget: HTMLImageElement; target: Element },\n      );\n    }\n\n    if (onLoadingComplete) {\n      onLoadingComplete(img);\n    }\n\n    if (import.meta.env.DEV) {\n      warnFillUsage(img, unoptimized, sizesInput);\n      warnAspectRatioMismatch(img);\n    }\n  });\n}\n\n// ─── 开发警告辅助 ──────────────────────────────────────────────────────────────\n\nfunction warnFillUsage(\n  img: HTMLImageElement,\n  unoptimized: boolean,\n  sizesInput: string | undefined,\n): void {\n  if (img.getAttribute(\"data-nimg\") !== \"fill\") return;\n\n  const origSrc =\n    new URL(img.src, \"http://n\").searchParams.get(\"url\") || img.src;\n\n  if (!unoptimized) {\n    const widthViewportRatio =\n      img.getBoundingClientRect().width / window.innerWidth;\n    if (widthViewportRatio < 0.6) {\n      if (sizesInput === \"100vw\") {\n        console.warn(\n          `[Image] src=\"${origSrc}\" 设置了 fill 和 sizes=\"100vw\"，但实际渲染宽度不足视口宽度，请调整 sizes 以提升性能。`,\n        );\n      } else if (!sizesInput) {\n        console.warn(\n          `[Image] src=\"${origSrc}\" 设置了 fill 但缺少 sizes 属性，请添加以提升性能。`,\n        );\n      }\n    }\n  }\n\n  if (img.parentElement) {\n    const { position } = window.getComputedStyle(img.parentElement);\n    const valid = [\"absolute\", \"fixed\", \"relative\"];\n    if (!valid.includes(position)) {\n      console.warn(\n        `[Image] src=\"${origSrc}\" 设置了 fill，但父元素 position=\"${position}\"，应为 ${valid.join(\" | \")} 之一。`,\n      );\n    }\n  }\n\n  if (img.height === 0) {\n    console.warn(\n      `[Image] src=\"${origSrc}\" 设置了 fill 且高度为 0，请为父元素设置明确高度。`,\n    );\n  }\n}\n\nfunction warnAspectRatioMismatch(img: HTMLImageElement): void {\n  const heightModified = img.height.toString() !== img.getAttribute(\"height\");\n  const widthModified = img.width.toString() !== img.getAttribute(\"width\");\n  if (\n    (heightModified && !widthModified) ||\n    (!heightModified && widthModified)\n  ) {\n    const origSrc =\n      new URL(img.src, \"http://n\").searchParams.get(\"url\") || img.src;\n    console.warn(\n      `[Image] src=\"${origSrc}\" 仅修改了 width 或 height 其中之一，请同时添加 width: \"auto\" 或 height: \"auto\" 样式以保持宽高比。`,\n    );\n  }\n}\n\ninterface GetImgPropsOptions {\n  imgConf: ImageConfigComplete;\n  blurComplete: boolean;\n  showAltText: boolean;\n}\n\nexport const VALID_LOADING_VALUES = [\"lazy\", \"eager\", undefined] as const;\n// Object-fit values that are not valid background-size values\nconst INVALID_BACKGROUND_SIZE_VALUES = [\n  \"-moz-initial\",\n  \"fill\",\n  \"none\",\n  \"scale-down\",\n  undefined,\n];\n\nlet perfObserver: PerformanceObserver | undefined;\nconst allImgs = new Map<\n  string,\n  { src: string; loading: LoadingValue; placeholder: PlaceholderValue }\n>();\n\nexport function getImgProps(\n  props: ImageProps,\n  { imgConf, blurComplete, showAltText }: GetImgPropsOptions,\n): ImgPropsResult {\n  const merged = mergeProps(\n    {\n      // loader: defaultLoader,\n      fill: false,\n      priority: false,\n      preload: false,\n      placeholder: \"empty\",\n      unoptimized: imgConf.unoptimized,\n      decoding: \"async\",\n    } as const,\n    props,\n  );\n  const [local, others] = splitProps(merged, [\n    \"src\",\n    \"loader\",\n    \"quality\",\n    \"width\",\n    \"height\",\n    \"fill\",\n    \"sizes\",\n    \"priority\",\n    \"placeholder\",\n    \"blurDataURL\",\n    \"unoptimized\",\n    \"overrideSrc\",\n    \"onLoad\",\n    \"onLoadingComplete\",\n    \"layout\",\n    \"style\",\n    \"preload\",\n    \"loading\",\n    \"objectFit\",\n    \"objectPosition\",\n    \"lazyBoundary\",\n    \"lazyRoot\",\n    \"fetchpriority\",\n    \"class\",\n    \"decoding\",\n  ]);\n\n  let config: ImageConfig;\n  const c = imgConf || imageConfigDefault;\n\n  if (\"allSizes\" in c) {\n    config = c as ImageConfig;\n  } else {\n    const allSizes = [...c.deviceSizes, ...c.imageSizes].sort((a, b) => a - b);\n    const deviceSizes = c.deviceSizes.sort((a, b) => a - b);\n    const qualities = c.qualities?.sort((a, b) => a - b);\n    config = { ...c, allSizes, deviceSizes, qualities };\n  }\n\n  if (typeof defaultLoader === \"undefined\") {\n    throw new Error(\n      \"images.loaderFile detected but the file is missing default export.\\nRead more: https://nextjs.org/docs/messages/invalid-images-config\",\n    );\n  }\n\n  let style = local.style;\n  let sizes = local.sizes;\n  let fill = local.fill;\n\n  const loader: ImageLoaderWithConfig = local.loader || defaultLoader;\n\n  if (local.layout) {\n    if (local.layout === \"fill\") {\n      fill = true;\n    }\n    const layoutToStyle: Record<string, Record<string, string> | undefined> = {\n      intrinsic: { maxWidth: \"100%\", height: \"auto\" },\n      responsive: { width: \"100%\", height: \"auto\" },\n    };\n    const layoutToSizes: Record<string, string | undefined> = {\n      responsive: \"100vw\",\n      fill: \"100vw\",\n    };\n    const layoutStyle = layoutToStyle[local.layout];\n    if (layoutStyle) {\n      style = { ...style, ...layoutStyle };\n    }\n    const layoutSizes = layoutToSizes[local.layout];\n    if (layoutSizes && !sizes) {\n      sizes = layoutSizes;\n    }\n  }\n\n  let staticSrc = \"\";\n  let blurDataURL = local.blurDataURL;\n  let widthInt = getInt(local.width);\n  let heightInt = getInt(local.height);\n  let blurWidth: number | undefined;\n  let blurHeight: number | undefined;\n\n  if (isStaticImport(local.src)) {\n    const staticImageData = isStaticRequire(local.src)\n      ? local.src.default\n      : local.src;\n\n    if (!staticImageData.src) {\n      throw new Error(\n        `An object should only be passed to the image component src parameter if it comes from a static image import. It must include src. Received ${JSON.stringify(\n          staticImageData,\n        )}`,\n      );\n    }\n    if (!staticImageData.height || !staticImageData.width) {\n      throw new Error(\n        `An object should only be passed to the image component src parameter if it comes from a static image import. It must include height and width. Received ${JSON.stringify(\n          staticImageData,\n        )}`,\n      );\n    }\n\n    blurWidth = staticImageData.blurWidth;\n    blurHeight = staticImageData.blurHeight;\n    blurDataURL = blurDataURL || staticImageData.blurDataURL;\n    staticSrc = staticImageData.src;\n\n    if (!fill) {\n      if (!widthInt && !heightInt) {\n        widthInt = staticImageData.width;\n        heightInt = staticImageData.height;\n      } else if (widthInt && !heightInt) {\n        const ratio = widthInt / staticImageData.width;\n        heightInt = Math.round(staticImageData.height * ratio);\n      } else if (!widthInt && heightInt) {\n        const ratio = heightInt / staticImageData.height;\n        widthInt = Math.round(staticImageData.width * ratio);\n      }\n    }\n  }\n  const src = typeof local.src === \"string\" ? local.src : staticSrc;\n\n  let unoptimized = local.unoptimized;\n  let isLazy =\n    !local.priority &&\n    !local.preload &&\n    (local.loading === \"lazy\" || typeof local.loading === \"undefined\");\n  if (!src || src.startsWith(\"data:\") || src.startsWith(\"blob:\")) {\n    // https://developer.mozilla.org/docs/Web/HTTP/Basics_of_HTTP/Data_URIs\n    unoptimized = true;\n    isLazy = false;\n  }\n  if (config.unoptimized) {\n    unoptimized = true;\n  }\n  if (!config.dangerouslyAllowSVG && src.split(\"?\", 1)[0].endsWith(\".svg\")) {\n    // Special case to make svg serve as-is to avoid proxying\n    // through the built-in Image Optimization API.\n    unoptimized = true;\n  }\n\n  const qualityInt = getInt(local.quality);\n\n  if (!import.meta.env.PROD) {\n    if (config.output === \"export\" && !unoptimized) {\n      throw new Error(\n        `Image Optimization using the default loader is not compatible with \\`{ output: 'export' }\\`.\n    Possible solutions:\n      - Remove \\`{ output: 'export' }\\` and run \"next start\" to run server mode including the Image Optimization API.\n      - Configure \\`{ images: { unoptimized: true } }\\` in \\`next.config.js\\` to disable the Image Optimization API.\n    Read more: https://nextjs.org/docs/messages/export-image-api`,\n      );\n    }\n    if (!src) {\n      // React doesn't show the stack trace and there's\n      // no `src` to help identify which image, so we\n      // instead console.error(ref) during mount.\n      unoptimized = true;\n    } else {\n      if (fill) {\n        if (local.width) {\n          throw new Error(\n            `Image with src \"${src}\" has both \"width\" and \"fill\" properties. Only one should be used.`,\n          );\n        }\n        if (local.height) {\n          throw new Error(\n            `Image with src \"${src}\" has both \"height\" and \"fill\" properties. Only one should be used.`,\n          );\n        }\n        if (style?.position && style.position !== \"absolute\") {\n          throw new Error(\n            `Image with src \"${src}\" has both \"fill\" and \"style.position\" properties. Images with \"fill\" always use position absolute - it cannot be modified.`,\n          );\n        }\n        if (style?.width && style.width !== \"100%\") {\n          throw new Error(\n            `Image with src \"${src}\" has both \"fill\" and \"style.width\" properties. Images with \"fill\" always use width 100% - it cannot be modified.`,\n          );\n        }\n        if (style?.height && style.height !== \"100%\") {\n          throw new Error(\n            `Image with src \"${src}\" has both \"fill\" and \"style.height\" properties. Images with \"fill\" always use height 100% - it cannot be modified.`,\n          );\n        }\n      } else {\n        if (typeof widthInt === \"undefined\") {\n          throw new Error(\n            `Image with src \"${src}\" is missing required \"width\" property.`,\n          );\n        } else if (Number.isNaN(widthInt)) {\n          throw new Error(\n            `Image with src \"${src}\" has invalid \"width\" property. Expected a numeric value in pixels but received \"${local.width}\".`,\n          );\n        }\n        if (typeof heightInt === \"undefined\") {\n          throw new Error(\n            `Image with src \"${src}\" is missing required \"height\" property.`,\n          );\n        } else if (Number.isNaN(heightInt)) {\n          throw new Error(\n            `Image with src \"${src}\" has invalid \"height\" property. Expected a numeric value in pixels but received \"${local.height}\".`,\n          );\n        }\n\n        // biome-ignore lint/suspicious/noControlCharactersInRegex: no-control-regex\n        if (/^[\\x00-\\x20]/.test(src)) {\n          throw new Error(\n            `Image with src \"${src}\" cannot start with a space or control character. Use src.trimStart() to remove it or encodeURIComponent(src) to keep it.`,\n          );\n        }\n        // biome-ignore lint/suspicious/noControlCharactersInRegex: no-control-regex\n        if (/[\\x00-\\x20]$/.test(src)) {\n          throw new Error(\n            `Image with src \"${src}\" cannot end with a space or control character. Use src.trimEnd() to remove it or encodeURIComponent(src) to keep it.`,\n          );\n        }\n      }\n    }\n    if (!VALID_LOADING_VALUES.includes(local.loading)) {\n      throw new Error(\n        `Image with src \"${src}\" has invalid \"loading\" property. Provided \"${local.loading}\" should be one of ${VALID_LOADING_VALUES.map(\n          String,\n        ).join(\",\")}.`,\n      );\n    }\n    if (local.priority && local.loading === \"lazy\") {\n      throw new Error(\n        `Image with src \"${src}\" has both \"priority\" and \"loading='lazy'\" properties. Only one should be used.`,\n      );\n    }\n    if (local.preload && local.loading === \"lazy\") {\n      throw new Error(\n        `Image with src \"${src}\" has both \"preload\" and \"loading='lazy'\" properties. Only one should be used.`,\n      );\n    }\n    if (local.preload && local.priority) {\n      throw new Error(\n        `Image with src \"${src}\" has both \"preload\" and \"priority\" properties. Only \"preload\" should be used.`,\n      );\n    }\n    if (\n      local.placeholder !== \"empty\" &&\n      local.placeholder !== \"blur\" &&\n      !local.placeholder.startsWith(\"data:image/\")\n    ) {\n      throw new Error(\n        `Image with src \"${src}\" has invalid \"placeholder\" property \"${local.placeholder}\".`,\n      );\n    }\n    if (local.placeholder !== \"empty\") {\n      if (widthInt && heightInt && widthInt * heightInt < 1600) {\n        warnOnce(\n          `Image with src \"${src}\" is smaller than 40x40. Consider removing the \"placeholder\" property to improve performance.`,\n        );\n      }\n    }\n    if (\n      qualityInt &&\n      config.qualities &&\n      !config.qualities.includes(qualityInt)\n    ) {\n      warnOnce(\n        `Image with src \"${src}\" is using quality \"${qualityInt}\" which is not configured in images.qualities [${config.qualities.join(\", \")}]. Please update your config to [${[...config.qualities, qualityInt].sort().join(\", \")}].` +\n          `\\nRead more: https://nextjs.org/docs/messages/next-image-unconfigured-qualities`,\n      );\n    }\n    if (local.placeholder === \"blur\" && !blurDataURL) {\n      const VALID_BLUR_EXT = [\"jpeg\", \"png\", \"webp\", \"avif\"]; // should match next-image-loader\n\n      throw new Error(\n        `Image with src \"${src}\" has \"placeholder='blur'\" property but is missing the \"blurDataURL\" property.\n          Possible solutions:\n            - Add a \"blurDataURL\" property, the contents should be a small Data URL to represent the image\n            - Change the \"src\" property to a static import with one of the supported file types: ${VALID_BLUR_EXT.join(\n              \",\",\n            )} (animated images not supported)\n            - Remove the \"placeholder\" property, effectively no blur effect\n          Read more: https://nextjs.org/docs/messages/placeholder-blur-data-url`,\n      );\n    }\n    if (\"ref\" in others) {\n      warnOnce(\n        `Image with src \"${src}\" is using unsupported \"ref\" property. Consider using the \"onLoad\" property instead.`,\n      );\n    }\n\n    if (!unoptimized) {\n      const urlStr = loader({\n        config,\n        src,\n        width: widthInt || 400,\n        quality: qualityInt || 75,\n      });\n      let url: URL | undefined;\n      try {\n        url = new URL(urlStr);\n      } catch (err) {\n        console.error(err);\n      }\n      if (urlStr === src || (url && url.pathname === src && !url.search)) {\n        warnOnce(\n          `Image with src \"${src}\" has a \"loader\" property that does not implement width. Please implement it or use the \"unoptimized\" property instead.` +\n            `\\nRead more: https://nextjs.org/docs/messages/next-image-missing-loader-width`,\n        );\n      }\n    }\n\n    if (local.onLoadingComplete) {\n      warnOnce(\n        `Image with src \"${src}\" is using deprecated \"onLoadingComplete\" property. Please use the \"onLoad\" property instead.`,\n      );\n    }\n\n    for (const [legacyKey, legacyValue] of Object.entries({\n      layout: local.layout,\n      objectFit: local.objectFit,\n      objectPosition: local.objectPosition,\n      lazyBoundary: local.lazyBoundary,\n      lazyRoot: local.lazyRoot,\n    })) {\n      if (legacyValue) {\n        warnOnce(\n          `Image with src \"${src}\" has legacy prop \"${legacyKey}\". Did you forget to run the codemod?` +\n            `\\nRead more: https://nextjs.org/docs/messages/next-image-upgrade-to-13`,\n        );\n      }\n    }\n\n    if (\n      typeof window !== \"undefined\" &&\n      !perfObserver &&\n      window.PerformanceObserver\n    ) {\n      perfObserver = new PerformanceObserver((entryList) => {\n        for (const entry of entryList.getEntries()) {\n          // @ts-expect-error - missing \"LargestContentfulPaint\" class with \"element\" prop\n          const imgSrc = entry?.element?.src || \"\";\n          const lcpImage = allImgs.get(imgSrc);\n          if (\n            lcpImage &&\n            lcpImage.loading === \"lazy\" &&\n            lcpImage.placeholder === \"empty\" &&\n            !lcpImage.src.startsWith(\"data:\") &&\n            !lcpImage.src.startsWith(\"blob:\")\n          ) {\n            // https://web.dev/lcp/#measure-lcp-in-javascript\n            warnOnce(\n              `Image with src \"${lcpImage.src}\" was detected as the Largest Contentful Paint (LCP). Please add the \\`loading=\"eager\"\\` property if this image is above the fold.` +\n                `\\nRead more: https://nextjs.org/docs/app/api-reference/components/image#loading`,\n            );\n          }\n        }\n      });\n      try {\n        perfObserver.observe({\n          type: \"largest-contentful-paint\",\n          buffered: true,\n        });\n      } catch (err) {\n        // Log error but don't crash the app\n        console.error(err);\n      }\n    }\n  }\n\n  const imgStyle = Object.assign(\n    fill\n      ? {\n          position: \"absolute\",\n          height: \"100%\",\n          width: \"100%\",\n          left: 0,\n          top: 0,\n          right: 0,\n          bottom: 0,\n          objectFit: local.objectFit,\n          objectPosition: local.objectPosition,\n        }\n      : {},\n    showAltText ? {} : { color: \"transparent\" },\n    style,\n  );\n\n  const backgroundImage =\n    !blurComplete && local.placeholder !== \"empty\"\n      ? local.placeholder === \"blur\"\n        ? `url(\"data:image/svg+xml;charset=utf-8,${getImageBlurSvg({\n            widthInt,\n            heightInt,\n            blurWidth,\n            blurHeight,\n            blurDataURL: blurDataURL || \"\", // assume not undefined\n            objectFit: imgStyle.objectFit,\n          })}\")`\n        : `url(\"${local.placeholder}\")` // assume `data:image/`\n      : null;\n\n  const backgroundSize = !INVALID_BACKGROUND_SIZE_VALUES.includes(\n    imgStyle.objectFit,\n  )\n    ? imgStyle.objectFit\n    : imgStyle.objectFit === \"fill\"\n      ? \"100% 100%\" // the background-size equivalent of `fill`\n      : \"cover\";\n\n  const placeholderStyle: PlaceholderStyle = backgroundImage\n    ? {\n        \"background-size\": backgroundSize,\n        \"background-position\": imgStyle.objectPosition || \"50% 50%\",\n        \"background-repeat\": \"no-repeat\",\n        \"background-image\": backgroundImage,\n      }\n    : {};\n\n  if (import.meta.env.DEV) {\n    if (\n      placeholderStyle[\"background-image\"] &&\n      local.placeholder === \"blur\" &&\n      blurDataURL?.startsWith(\"/\")\n    ) {\n      // During `next dev`, we don't want to generate blur placeholders with webpack\n      // because it can delay starting the dev server. Instead, `next-image-loader.js`\n      // will inline a special url to lazily generate the blur placeholder at request time.\n      placeholderStyle[\"background-image\"] = `url(\"${blurDataURL}\")`;\n    }\n  }\n\n  const imgAttributes = generateImgAttrs({\n    config,\n    src,\n    unoptimized,\n    width: widthInt,\n    quality: qualityInt,\n    sizes,\n    loader,\n  });\n\n  const loadingFinal = isLazy ? \"lazy\" : local.loading;\n\n  if (!import.meta.env.PROD) {\n    if (typeof window !== \"undefined\") {\n      let fullUrl: URL;\n      try {\n        fullUrl = new URL(imgAttributes.src);\n      } catch (e) {\n        console.error(e);\n        fullUrl = new URL(imgAttributes.src, window.location.href);\n      }\n      allImgs.set(fullUrl.href, {\n        src,\n        loading: loadingFinal,\n        placeholder: local.placeholder,\n      });\n    }\n  }\n\n  const newProps: ImgProps = {\n    ...others,\n    loading: loadingFinal,\n    fetchpriority: local.fetchpriority,\n    width: widthInt,\n    height: heightInt,\n    decoding: local.decoding,\n    class: local.class,\n    style: { ...imgStyle, ...placeholderStyle },\n    sizes: imgAttributes.sizes,\n    srcSet: imgAttributes.srcSet,\n    src: local.overrideSrc || imgAttributes.src,\n  };\n  const meta = {\n    unoptimized,\n    preload: local.preload || local.priority,\n    placeholder: local.placeholder,\n    fill,\n  };\n  return { props: newProps, meta };\n}\n\nfunction defaultLoader({ src, width, quality }: ImageLoaderProps): string {\n  if (import.meta.env.DEV) {\n    const missingValues: string[] = [];\n    if (!src) missingValues.push(\"src\");\n    if (!width) missingValues.push(\"width\");\n    if (missingValues.length > 0) {\n      throw new Error(\n        `[defaultLoader] 缺少必要属性：${missingValues.join(\", \")}。` +\n          `请确认调用方式正确，或提供自定义 loader。`,\n      );\n    }\n  }\n\n  // 如果 src 本身已是带参数的 URL（外部图片），直接返回\n  if (src.startsWith(\"http://\") || src.startsWith(\"https://\")) {\n    return src;\n  }\n\n  // 本地图片：追加 w / q 参数（供自定义服务器处理）\n  const params = new URLSearchParams();\n  params.set(\"url\", src);\n  params.set(\"w\", String(width));\n  if (quality) params.set(\"q\", String(quality));\n  return `/_image?${params.toString()}`;\n}\n\nfunction getInt(x: unknown): number | undefined {\n  if (typeof x === \"undefined\") {\n    return x;\n  }\n  if (typeof x === \"number\") {\n    return Number.isFinite(x) ? x : NaN;\n  }\n  if (typeof x === \"string\" && /^[0-9]+$/.test(x)) {\n    return parseInt(x, 10);\n  }\n  return NaN;\n}\n\nfunction isStaticRequire(\n  src: StaticRequire | StaticImageData,\n): src is StaticRequire {\n  return (src as StaticRequire).default !== undefined;\n}\n\nfunction isStaticImageData(\n  src: StaticRequire | StaticImageData,\n): src is StaticImageData {\n  return (src as StaticImageData).src !== undefined;\n}\n\nfunction isStaticImport(src: string | StaticImport): src is StaticImport {\n  return (\n    !!src &&\n    typeof src === \"object\" &&\n    (isStaticRequire(src as StaticImport) ||\n      isStaticImageData(src as StaticImport))\n  );\n}\n\nfunction getImageBlurSvg({\n  widthInt,\n  heightInt,\n  blurWidth,\n  blurHeight,\n  blurDataURL,\n  objectFit,\n}: {\n  widthInt?: number;\n  heightInt?: number;\n  blurWidth?: number;\n  blurHeight?: number;\n  blurDataURL: string;\n  objectFit?: string;\n}): string {\n  const std = 20;\n  const svgWidth = blurWidth ? blurWidth * 40 : widthInt;\n  const svgHeight = blurHeight ? blurHeight * 40 : heightInt;\n\n  const viewBox =\n    svgWidth && svgHeight ? `viewBox='0 0 ${svgWidth} ${svgHeight}'` : \"\";\n  const preserveAspectRatio = viewBox\n    ? \"none\"\n    : objectFit === \"contain\"\n      ? \"xMidYMid\"\n      : objectFit === \"cover\"\n        ? \"xMidYMid slice\"\n        : \"none\";\n\n  return `%3Csvg xmlns='http://www.w3.org/2000/svg' ${viewBox}%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='${std}'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='${std}'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='${preserveAspectRatio}' style='filter: url(%23b);' href='${blurDataURL}'/%3E%3C/svg%3E`;\n}\n\ntype GenImgAttrsData = {\n  config: ImageConfig;\n  src: string;\n  unoptimized: boolean;\n  loader: ImageLoaderWithConfig;\n  width?: number;\n  quality?: number;\n  sizes?: string;\n};\n\ntype GenImgAttrsResult = {\n  src: string;\n  srcSet: string | undefined;\n  sizes: string | undefined;\n};\n\nfunction generateImgAttrs({\n  config,\n  src,\n  unoptimized,\n  width,\n  quality,\n  sizes,\n  loader,\n}: GenImgAttrsData): GenImgAttrsResult {\n  if (unoptimized) {\n    return { src, srcSet: undefined, sizes: undefined };\n  }\n\n  const { widths, kind } = getWidths(config, width, sizes);\n  const last = widths.length - 1;\n\n  return {\n    sizes: !sizes && kind === \"w\" ? \"100vw\" : sizes,\n    srcSet: widths\n      .map(\n        (w, i) =>\n          `${loader({ config, src, quality, width: w })} ${\n            kind === \"w\" ? w : i + 1\n          }${kind}`,\n      )\n      .join(\", \"),\n\n    // It's intended to keep `src` the last attribute because React updates\n    // attributes in order. If we keep `src` the first one, Safari will\n    // immediately start to fetch `src`, before `sizes` and `srcSet` are even\n    // updated by React. That causes multiple unnecessary requests if `srcSet`\n    // and `sizes` are defined.\n    // This bug cannot be reproduced in Chrome or Firefox.\n    src: loader({ config, src, quality, width: widths[last] }),\n  };\n}\n\nfunction getWidths(\n  { deviceSizes, allSizes }: ImageConfig,\n  width: number | undefined,\n  sizes: string | undefined,\n): { widths: number[]; kind: \"w\" | \"x\" } {\n  if (sizes) {\n    // Find all the \"vw\" percent sizes used in the sizes prop\n    const viewportWidthRe = /(^|\\s)(1?\\d?\\d)vw/g;\n    const percentSizes = [];\n    for (\n      let match: RegExpExecArray | null;\n      // biome-ignore lint/suspicious/noAssignInExpressions: nextjs code\n      (match = viewportWidthRe.exec(sizes));\n      match\n    ) {\n      percentSizes.push(Number.parseInt(match[2], 10));\n    }\n    if (percentSizes.length) {\n      const smallestRatio = Math.min(...percentSizes) * 0.01;\n      return {\n        widths: allSizes.filter((s) => s >= deviceSizes[0] * smallestRatio),\n        kind: \"w\",\n      };\n    }\n    return { widths: allSizes, kind: \"w\" };\n  }\n  if (typeof width !== \"number\") {\n    return { widths: deviceSizes, kind: \"w\" };\n  }\n\n  const widths = [\n    ...new Set(\n      // > This means that most OLED screens that say they are 3x resolution,\n      // > are actually 3x in the green color, but only 1.5x in the red and\n      // > blue colors. Showing a 3x resolution image in the app vs a 2x\n      // > resolution image will be visually the same, though the 3x image\n      // > takes significantly more data. Even true 3x resolution screens are\n      // > wasteful as the human eye cannot see that level of detail without\n      // > something like a magnifying glass.\n      // https://blog.twitter.com/engineering/en_us/topics/infrastructure/2019/capping-image-fidelity-on-ultra-high-resolution-devices.html\n      [width, width * 2 /*, width * 3*/].map(\n        (w) => allSizes.find((p) => p >= w) || allSizes[allSizes.length - 1],\n      ),\n    ),\n  ];\n  return { widths, kind: \"x\" };\n}\n"],"mappings":"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"}

package/dist/components/image/ImageElement.js

@@ -2,8 +2,8 @@ import { handleLoading as e } from "./Image.utils.js";
 import { mergeProps as t, spread as n, template as r, use as i } from "solid-js/web";
 import { mergeProps as a, splitProps as o } from "solid-js";
 //#region src/components/image/ImageElement.tsx
-var s = /* @__PURE__ */ r("<img>", !0, !1, !1), c = (r) => {
-	let [c, l] = o(a({ decoding: "async" }, r), [
+var s = /*#__PURE__*/ r("<img>", !0, !1, !1), c = (r) => {
+	let c = a({ decoding: "async" }, r), [l, u] = o(c, [
 		"src",
 		"srcSet",
 		"sizes",
@@ -27,51 +27,51 @@ var s = /* @__PURE__ */ r("<img>", !0, !1, !1), c = (r) => {
 		"ref",
 		"alt"
 	]);
-	function u(t) {
-		t && (c.onError && (t.src = t.src), t.complete && e(t, c.placeholder, c.onLoad, c.onLoadingComplete, c.setBlurComplete, c.unoptimized, c.sizesInput), c.ref?.(t));
+	function d(t) {
+		t && (l.onError && (t.src = t.src), t.complete && e(t, l.placeholder, l.onLoad, l.onLoadingComplete, l.setBlurComplete, l.unoptimized, l.sizesInput), l.ref?.(t));
 	}
 	return (() => {
-		var r = s(), a = u;
-		return typeof a == "function" ? i(a, r) : u = r, n(r, t(l, {
+		var r = s(), a = d;
+		return typeof a == "function" ? i(a, r) : d = r, n(r, t(u, {
 			get alt() {
-				return c.alt;
+				return l.alt;
 			},
 			get loading() {
-				return c.loading;
+				return l.loading;
 			},
 			get width() {
-				return c.width;
+				return l.width;
 			},
 			get height() {
-				return c.height;
+				return l.height;
 			},
 			get decoding() {
-				return c.decoding;
+				return l.decoding;
 			},
 			get "data-nimg"() {
-				return c.fill ? "fill" : "1";
+				return l.fill ? "fill" : "1";
 			},
 			get class() {
-				return c.class;
+				return l.class;
 			},
 			get style() {
-				return c.style;
+				return l.style;
 			},
 			get sizes() {
-				return c.sizes;
+				return l.sizes;
 			},
 			get srcset() {
-				return c.srcSet;
+				return l.srcSet;
 			},
 			get src() {
-				return c.src;
+				return l.src;
 			},
 			onLoad: (t) => {
 				let n = t.currentTarget;
-				e(n, c.placeholder, c.onLoad, c.onLoadingComplete, c.setBlurComplete, c.unoptimized, c.sizesInput);
+				e(n, l.placeholder, l.onLoad, l.onLoadingComplete, l.setBlurComplete, l.unoptimized, l.sizesInput);
 			},
 			onError: (e) => {
-				c.setShowAltText(!0), c.placeholder !== "empty" && c.setBlurComplete(!0), c.onError && typeof c.onError == "function" && c.onError(e);
+				l.setShowAltText(!0), l.placeholder !== "empty" && l.setBlurComplete(!0), l.onError && typeof l.onError == "function" && l.onError(e);
 			}
 		}), !1, !1), r;
 	})();

package/dist/components/image/ImageElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageElement.js","names":["Component","mergeProps","splitProps","ImgProps","OnLoad","OnLoadingComplete","PlaceholderValue","handleLoading","ImageElementProps","unoptimized","placeholder","setBlurComplete","v","setShowAltText","sizesInput","onLoad","onLoadingComplete","ref","el","HTMLImageElement","ImageElement","rawProps","props","decoding","const","internal","imgAttrs","handleRef","img","onError","src","import","meta","env","PROD","console","error","getAttribute","alt","undefined","complete","_el$","_tmpl$","_ref$","_$use","_$spread","_$mergeProps","loading","width","height","data-nimg","fill","class","style","sizes","srcset","srcSet","e","currentTarget"],"sources":["../../../src/components/image/ImageElement.tsx"],"sourcesContent":["/**\n * ImageElement.tsx\n * 单一职责：仅负责渲染原生 <img> 元素，并将 ref 回调、onLoad、onError 事件桥接到\n * 上层传入的副作用函数。不包含配置解析、preload 或 blur placeholder 逻辑。\n */\n\nimport { type Component, mergeProps, splitProps } from \"solid-js\";\nimport type {\n  ImgProps,\n  OnLoad,\n  OnLoadingComplete,\n  PlaceholderValue,\n} from \"./Image.types\";\nimport { handleLoading } from \"./Image.utils\";\n\n// ─── 额外内部 Props ────────────────────────────────────────────────────────────\n\nexport interface ImageElementProps extends ImgProps {\n  unoptimized: boolean;\n  placeholder: PlaceholderValue;\n  /** 上层通过 signal setter 传入，避免在此组件内管理状态 */\n  setBlurComplete: (v: boolean) => void;\n  setShowAltText: (v: boolean) => void;\n  sizesInput: string | undefined;\n  onLoad?: OnLoad;\n  onLoadingComplete?: OnLoadingComplete;\n  // onError?: (e: Event) => void;\n  /** 透传给原生 img 的 ref */\n  ref?: (el: HTMLImageElement) => void;\n}\n\n// ─── 组件 ─────────────────────────────────────────────────────────────────────\n\nconst ImageElement: Component<ImageElementProps> = (rawProps) => {\n  const props = mergeProps({ decoding: \"async\" as const }, rawProps);\n\n  // 分离内部 props 与透传给 <img> 的 props\n  const [internal, imgAttrs] = splitProps(props, [\n    \"src\",\n    \"srcSet\",\n    \"sizes\",\n    \"height\",\n    \"width\",\n    \"decoding\",\n    \"class\",\n    \"classList\",\n    \"style\",\n    \"fetchpriority\",\n    \"placeholder\",\n    \"loading\",\n    \"unoptimized\",\n    \"fill\",\n    \"setBlurComplete\",\n    \"setShowAltText\",\n    \"sizesInput\",\n    \"onLoad\",\n    \"onError\",\n    \"onLoadingComplete\",\n    \"ref\",\n    \"alt\",\n  ]);\n\n  /**\n   * ref 回调：在元素挂载后立即处理\"图片在 hydrate 前已加载完成\"的情况，\n   * 并将 ref 透传给调用方（如需要访问 img 节点）。\n   */\n  function handleRef(img: HTMLImageElement) {\n    if (!img) return;\n\n    // 让 Safari 重新触发 onerror（如果图片在 hydrate 前就已失败）\n    if (internal.onError) {\n      // biome-ignore lint/correctness/noSelfAssign: If the image has an error before react hydrates, then the error is lost. The workaround is to wait until the image is mounted which is after hydration, then we set the src again to trigger the error handler (if there was an error).\n      img.src = img.src;\n    }\n\n    if (!import.meta.env.PROD) {\n      if (!internal.src) {\n        console.error('[Image] 缺少必填属性 \"src\"', img);\n      }\n      if (img.getAttribute(\"alt\") === null && internal.alt === undefined) {\n        console.error('[Image] 缺少必填属性 \"alt\"...');\n      }\n    }\n\n    // 图片在组件挂载前已完成加载（cached 场景）\n    if (img.complete) {\n      handleLoading(\n        img,\n        internal.placeholder,\n        internal.onLoad,\n        internal.onLoadingComplete,\n        internal.setBlurComplete,\n        internal.unoptimized,\n        internal.sizesInput,\n      );\n    }\n\n    // 透传 ref\n    internal.ref?.(img);\n  }\n\n  return (\n    // 注意属性顺序：\n    // 1. loading 在 src 之前，修复 Safari/Firefox 懒加载时机问题\n    // 2. sizes / srcSet 在 src 之前，避免 Safari 提前请求错误尺寸\n    // 3. src 最后设置\n    <img\n      {...imgAttrs}\n      // React 19 使用 camelCase fetchPriority；SolidJS 直接透传 JSX 属性即可\n      alt={internal.alt}\n      loading={internal.loading}\n      width={internal.width}\n      height={internal.height}\n      decoding={internal.decoding}\n      data-nimg={internal.fill ? \"fill\" : \"1\"}\n      class={internal.class}\n      style={internal.style}\n      sizes={internal.sizes}\n      srcset={internal.srcSet}\n      src={internal.src}\n      ref={handleRef}\n      onLoad={(e) => {\n        const img = e.currentTarget as HTMLImageElement;\n        handleLoading(\n          img,\n          internal.placeholder,\n          internal.onLoad,\n          internal.onLoadingComplete,\n          internal.setBlurComplete,\n          internal.unoptimized,\n          internal.sizesInput,\n        );\n      }}\n      onError={(e) => {\n        // 图片加载失败时显示 alt 文本\n        internal.setShowAltText(true);\n        if (internal.placeholder !== \"empty\") {\n          // 即使真实图片失败，也要移除 blur placeholder\n          internal.setBlurComplete(true);\n        }\n\n        if (!internal.onError) return;\n\n        if (typeof internal.onError !== \"function\") return;\n\n        internal.onError(e);\n      }}\n    />\n  );\n};\n\nexport default ImageElement;\n"],"mappings":";;;;gDAiCMoB,KAA8CC,MAAa;CAI/D,IAAM,CAACI,GAAUC,KAAYxB,EAHfD,EAAW,EAAEsB,UAAU,SAAkB,EAAEF,EAAS,EAGnB;EAC7C;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAMF,SAASM,EAAUC,GAAuB;AACnCA,QAGDH,EAASI,YAEXD,EAAIE,MAAMF,EAAIE,MAaZF,EAAIY,YACNjC,EACEqB,GACAH,EAASf,aACTe,EAASV,QACTU,EAAST,mBACTS,EAASd,iBACTc,EAAShB,aACTgB,EAASX,WACV,EAIHW,EAASR,MAAMW,EAAI;;AAGrB,eAIE;EAAA,IAAAa,IAAAC,GAAA,EAAAC,IAeOhB;AA0BJ,SA1Ba,OAAAgB,KAAA,aAAAC,EAAAD,GAAAF,EAAA,GAATd,IAASc,GAAAI,EAAAJ,GAAAK,EAbVpB,GAAQ;GAAA,IAEZY,MAAG;AAAA,WAAEb,EAASa;;GAAG,IACjBS,UAAO;AAAA,WAAEtB,EAASsB;;GAAO,IACzBC,QAAK;AAAA,WAAEvB,EAASuB;;GAAK,IACrBC,SAAM;AAAA,WAAExB,EAASwB;;GAAM,IACvB1B,WAAQ;AAAA,WAAEE,EAASF;;GAAQ,IAAA,cAAA;AAAA,WAChBE,EAAS0B,OAAO,SAAS;;GAAG,IAAA,QAAA;AAAA,WAChC1B,EAAS2B;;GAAK,IACrBC,QAAK;AAAA,WAAE5B,EAAS4B;;GAAK,IACrBC,QAAK;AAAA,WAAE7B,EAAS6B;;GAAK,IACrBC,SAAM;AAAA,WAAE9B,EAAS+B;;GAAM,IACvB1B,MAAG;AAAA,WAAEL,EAASK;;GAAG,SAER2B,MAAM;IACb,IAAM7B,IAAM6B,EAAEC;AACdnD,MACEqB,GACAH,EAASf,aACTe,EAASV,QACTU,EAAST,mBACTS,EAASd,iBACTc,EAAShB,aACTgB,EAASX,WACV;;GACF,UACS2C,MAAM;AAEdhC,MAASZ,eAAe,GAAK,EACzBY,EAASf,gBAAgB,WAE3Be,EAASd,gBAAgB,GAAK,EAG3Bc,EAASI,WAEV,OAAOJ,EAASI,WAAY,cAEhCJ,EAASI,QAAQ4B,EAAE;;GACpB,CAAA,EAAA,IAAA,GAAA,EAAAhB;KAAA"}
+{"version":3,"file":"ImageElement.js","names":["Component","mergeProps","splitProps","ImgProps","OnLoad","OnLoadingComplete","PlaceholderValue","handleLoading","ImageElementProps","unoptimized","placeholder","setBlurComplete","v","setShowAltText","sizesInput","onLoad","onLoadingComplete","ref","el","HTMLImageElement","ImageElement","rawProps","props","decoding","const","internal","imgAttrs","handleRef","img","onError","src","import","meta","env","PROD","console","error","getAttribute","alt","undefined","complete","_el$","_tmpl$","_ref$","_$use","_$spread","_$mergeProps","loading","width","height","data-nimg","fill","class","style","sizes","srcset","srcSet","e","currentTarget"],"sources":["../../../src/components/image/ImageElement.tsx"],"sourcesContent":["/**\n * ImageElement.tsx\n * 单一职责：仅负责渲染原生 <img> 元素，并将 ref 回调、onLoad、onError 事件桥接到\n * 上层传入的副作用函数。不包含配置解析、preload 或 blur placeholder 逻辑。\n */\n\nimport { type Component, mergeProps, splitProps } from \"solid-js\";\nimport type {\n  ImgProps,\n  OnLoad,\n  OnLoadingComplete,\n  PlaceholderValue,\n} from \"./Image.types\";\nimport { handleLoading } from \"./Image.utils\";\n\n// ─── 额外内部 Props ────────────────────────────────────────────────────────────\n\nexport interface ImageElementProps extends ImgProps {\n  unoptimized: boolean;\n  placeholder: PlaceholderValue;\n  /** 上层通过 signal setter 传入，避免在此组件内管理状态 */\n  setBlurComplete: (v: boolean) => void;\n  setShowAltText: (v: boolean) => void;\n  sizesInput: string | undefined;\n  onLoad?: OnLoad;\n  onLoadingComplete?: OnLoadingComplete;\n  // onError?: (e: Event) => void;\n  /** 透传给原生 img 的 ref */\n  ref?: (el: HTMLImageElement) => void;\n}\n\n// ─── 组件 ─────────────────────────────────────────────────────────────────────\n\nconst ImageElement: Component<ImageElementProps> = (rawProps) => {\n  const props = mergeProps({ decoding: \"async\" as const }, rawProps);\n\n  // 分离内部 props 与透传给 <img> 的 props\n  const [internal, imgAttrs] = splitProps(props, [\n    \"src\",\n    \"srcSet\",\n    \"sizes\",\n    \"height\",\n    \"width\",\n    \"decoding\",\n    \"class\",\n    \"classList\",\n    \"style\",\n    \"fetchpriority\",\n    \"placeholder\",\n    \"loading\",\n    \"unoptimized\",\n    \"fill\",\n    \"setBlurComplete\",\n    \"setShowAltText\",\n    \"sizesInput\",\n    \"onLoad\",\n    \"onError\",\n    \"onLoadingComplete\",\n    \"ref\",\n    \"alt\",\n  ]);\n\n  /**\n   * ref 回调：在元素挂载后立即处理\"图片在 hydrate 前已加载完成\"的情况，\n   * 并将 ref 透传给调用方（如需要访问 img 节点）。\n   */\n  function handleRef(img: HTMLImageElement) {\n    if (!img) return;\n\n    // 让 Safari 重新触发 onerror（如果图片在 hydrate 前就已失败）\n    if (internal.onError) {\n      // biome-ignore lint/correctness/noSelfAssign: If the image has an error before react hydrates, then the error is lost. The workaround is to wait until the image is mounted which is after hydration, then we set the src again to trigger the error handler (if there was an error).\n      img.src = img.src;\n    }\n\n    if (!import.meta.env.PROD) {\n      if (!internal.src) {\n        console.error('[Image] 缺少必填属性 \"src\"', img);\n      }\n      if (img.getAttribute(\"alt\") === null && internal.alt === undefined) {\n        console.error('[Image] 缺少必填属性 \"alt\"...');\n      }\n    }\n\n    // 图片在组件挂载前已完成加载（cached 场景）\n    if (img.complete) {\n      handleLoading(\n        img,\n        internal.placeholder,\n        internal.onLoad,\n        internal.onLoadingComplete,\n        internal.setBlurComplete,\n        internal.unoptimized,\n        internal.sizesInput,\n      );\n    }\n\n    // 透传 ref\n    internal.ref?.(img);\n  }\n\n  return (\n    // 注意属性顺序：\n    // 1. loading 在 src 之前，修复 Safari/Firefox 懒加载时机问题\n    // 2. sizes / srcSet 在 src 之前，避免 Safari 提前请求错误尺寸\n    // 3. src 最后设置\n    <img\n      {...imgAttrs}\n      // React 19 使用 camelCase fetchPriority；SolidJS 直接透传 JSX 属性即可\n      alt={internal.alt}\n      loading={internal.loading}\n      width={internal.width}\n      height={internal.height}\n      decoding={internal.decoding}\n      data-nimg={internal.fill ? \"fill\" : \"1\"}\n      class={internal.class}\n      style={internal.style}\n      sizes={internal.sizes}\n      srcset={internal.srcSet}\n      src={internal.src}\n      ref={handleRef}\n      onLoad={(e) => {\n        const img = e.currentTarget as HTMLImageElement;\n        handleLoading(\n          img,\n          internal.placeholder,\n          internal.onLoad,\n          internal.onLoadingComplete,\n          internal.setBlurComplete,\n          internal.unoptimized,\n          internal.sizesInput,\n        );\n      }}\n      onError={(e) => {\n        // 图片加载失败时显示 alt 文本\n        internal.setShowAltText(true);\n        if (internal.placeholder !== \"empty\") {\n          // 即使真实图片失败，也要移除 blur placeholder\n          internal.setBlurComplete(true);\n        }\n\n        if (!internal.onError) return;\n\n        if (typeof internal.onError !== \"function\") return;\n\n        internal.onError(e);\n      }}\n    />\n  );\n};\n\nexport default ImageElement;\n"],"mappings":";;;;8CAiCMoB,KAA8CC,MAAa;CAC/D,IAAMC,IAAQrB,EAAW,EAAEsB,UAAU,QAAiB,GAAGF,CAAQ,GAG3D,CAACI,GAAUC,KAAYxB,EAAWoB,GAAO;EAC7C;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAK,CACN;CAMD,SAASK,EAAUC,GAAuB;EACnCA,MAGDH,EAASI,YAEXD,EAAIE,MAAMF,EAAIE,MAaZF,EAAIY,YACNjC,EACEqB,GACAH,EAASf,aACTe,EAASV,QACTU,EAAST,mBACTS,EAASd,iBACTc,EAAShB,aACTgB,EAASX,UACX,GAIFW,EAASR,MAAMW,CAAG;CACpB;CAEA,cAIE;EAAA,IAAAa,IAAAC,EAAA,GAAAC,IAeOhB;EA0BJ,OA1Ba,OAAAgB,KAAA,aAAAC,EAAAD,GAAAF,CAAA,IAATd,IAASc,GAAAI,EAAAJ,GAAAK,EAbVpB,GAAQ;GAAA,IAEZY,MAAG;IAAA,OAAEb,EAASa;GAAG;GAAA,IACjBS,UAAO;IAAA,OAAEtB,EAASsB;GAAO;GAAA,IACzBC,QAAK;IAAA,OAAEvB,EAASuB;GAAK;GAAA,IACrBC,SAAM;IAAA,OAAExB,EAASwB;GAAM;GAAA,IACvB1B,WAAQ;IAAA,OAAEE,EAASF;GAAQ;GAAA,IAAA,cAAA;IAAA,OAChBE,EAAS0B,OAAO,SAAS;GAAG;GAAA,IAAA,QAAA;IAAA,OAChC1B,EAAS2B;GAAK;GAAA,IACrBC,QAAK;IAAA,OAAE5B,EAAS4B;GAAK;GAAA,IACrBC,QAAK;IAAA,OAAE7B,EAAS6B;GAAK;GAAA,IACrBC,SAAM;IAAA,OAAE9B,EAAS+B;GAAM;GAAA,IACvB1B,MAAG;IAAA,OAAEL,EAASK;GAAG;GAAA,SAER2B,MAAM;IACb,IAAM7B,IAAM6B,EAAEC;IACdnD,EACEqB,GACAH,EAASf,aACTe,EAASV,QACTU,EAAST,mBACTS,EAASd,iBACTc,EAAShB,aACTgB,EAASX,UACX;GACF;GAAC,UACS2C,MAAM;IAEdhC,EAASZ,eAAe,EAAI,GACxBY,EAASf,gBAAgB,WAE3Be,EAASd,gBAAgB,EAAI,GAG1Bc,EAASI,WAEV,OAAOJ,EAASI,WAAY,cAEhCJ,EAASI,QAAQ4B,CAAC;GACpB;EAAC,CAAA,GAAA,IAAA,EAAA,GAAAhB;CAAA,EAAA,CAAA;AAGP"}

package/dist/components/image/ImagePreload.js

@@ -1,6 +1,6 @@
 import { Portal as e, createComponent as t, effect as n, setAttribute as r, template as i } from "solid-js/web";
 //#region src/components/image/ImagePreload.tsx
-var a = /* @__PURE__ */ i("<link rel=preload as=image>"), o = (i) => {
+var a = /*#__PURE__*/ i("<link rel=preload as=image>"), o = (i) => {
 	let { imgAttributes: o } = i, s = `__img-preload-${o.src}-${o.srcSet ?? ""}-${o.sizes ?? ""}`;
 	return typeof document < "u" && document.head.querySelector(`link[data-img-key="${s}"]`) ? null : t(e, {
 		get mount() {

package/dist/components/image/ImagePreload.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImagePreload.js","names":["Component","Portal","ImgProps","ImagePreloadProps","imgAttributes","Pick","ImagePreload","props","a","linkKey","src","srcSet","sizes","document","head","querySelector","_$createComponent","mount","children","_el$","_tmpl$","_$setAttribute","_$effect","_p$","_v$","undefined","_v$2","_v$3","_v$4","crossOrigin","_v$5","referrerPolicy","_v$6","fetchpriority","e","t","o","i","n"],"sources":["../../../src/components/image/ImagePreload.tsx"],"sourcesContent":["/**\n * ImagePreload.tsx\n * 单一职责：仅负责向 <head> 注入 <link rel=\"preload\"> 标签，\n * 以提升 LCP 图片的加载优先级。不包含任何 <img> 渲染逻辑。\n */\n\nimport type { Component } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport type { ImgProps } from \"./Image.types\";\n\n// ─── Props ────────────────────────────────────────────────────────────────────\n\nexport interface ImagePreloadProps {\n  imgAttributes: Pick<\n    ImgProps,\n    | \"src\"\n    | \"srcSet\"\n    | \"sizes\"\n    | \"crossOrigin\"\n    | \"referrerPolicy\"\n    | \"fetchpriority\"\n  >;\n}\n\n// ─── 组件 ─────────────────────────────────────────────────────────────────────\n\n/**\n * 通过 SolidJS <Portal> 将 <link> 插入 document.head。\n *\n * 注意：\n * - 故意省略 href（当 imagesrcset 存在时），以避免不支持 srcset 的浏览器\n *   加载错误尺寸的图片。详见 HTML spec §attr-link-imagesrcset。\n * - SolidJS SSR 环境可将此组件替换为 server-side head injection。\n */\nconst ImagePreload: Component<ImagePreloadProps> = (props) => {\n  const { imgAttributes: a } = props;\n\n  // 唯一 key 避免重复插入相同的 preload\n  const linkKey = `__img-preload-${a.src}-${a.srcSet ?? \"\"}-${a.sizes ?? \"\"}`;\n\n  // 若已存在相同 key 的 link，则跳过（SSR hydrate 场景）\n  if (typeof document !== \"undefined\") {\n    if (document.head.querySelector(`link[data-img-key=\"${linkKey}\"]`)) {\n      return null;\n    }\n  }\n\n  return (\n    <Portal mount={document.head}>\n      <link\n        rel=\"preload\"\n        as=\"image\"\n        data-img-key={linkKey}\n        // 当存在 srcset 时不设置 href，遵从 spec\n        href={a.srcSet ? undefined : a.src}\n        imagesrcset={a.srcSet}\n        imagesizes={a.sizes}\n        crossorigin={a.crossOrigin}\n        referrerpolicy={a.referrerPolicy}\n        fetchpriority={a.fetchpriority}\n      />\n    </Portal>\n  );\n};\n\nexport default ImagePreload;\n"],"mappings":";;0DAkCMM,KAA8CC,MAAU;CAC5D,IAAM,EAAEH,eAAeI,MAAMD,GAGvBE,IAAU,iBAAiBD,EAAEE,IAAG,GAAIF,EAAEG,UAAU,GAAE,GAAIH,EAAEI,SAAS;AASvE,QANI,OAAOC,WAAa,OAClBA,SAASC,KAAKC,cAAc,sBAAsBN,EAAO,IAAK,GACzD,OAIXO,EACGf,GAAM;EAAA,IAACgB,QAAK;AAAA,UAAEJ,SAASC;;EAAI,IAAAI,WAAA;GAAA,IAAAC,IAAAC,GAAA;AAWM,UAXNC,EAAAF,GAAA,gBAIVV,EAAO,EAAAa,GAAAC,MAAA;IAAA,IAAAC,IAEfhB,EAAEG,SAASc,KAAAA,IAAYjB,EAAEE,KAAGgB,IACrBlB,EAAEG,QAAMgB,IACTnB,EAAEI,OAAKgB,IACNpB,EAAEqB,aAAWC,IACVtB,EAAEuB,gBAAcC,IACjBxB,EAAEyB;AAAa,WAAAT,MAAAD,EAAAW,KAAAb,EAAAF,GAAA,QAAAI,EAAAW,IAAAV,EAAA,EAAAE,MAAAH,EAAAY,KAAAd,EAAAF,GAAA,eAAAI,EAAAY,IAAAT,EAAA,EAAAC,MAAAJ,EAAAf,KAAAa,EAAAF,GAAA,cAAAI,EAAAf,IAAAmB,EAAA,EAAAC,MAAAL,EAAAa,KAAAf,EAAAF,GAAA,eAAAI,EAAAa,IAAAR,EAAA,EAAAE,MAAAP,EAAAc,KAAAhB,EAAAF,GAAA,kBAAAI,EAAAc,IAAAP,EAAA,EAAAE,MAAAT,EAAAe,KAAAjB,EAAAF,GAAA,iBAAAI,EAAAe,IAAAN,EAAA,EAAAT;MAAA;IAAAW,GAAAT,KAAAA;IAAAU,GAAAV,KAAAA;IAAAjB,GAAAiB,KAAAA;IAAAW,GAAAX,KAAAA;IAAAY,GAAAZ,KAAAA;IAAAa,GAAAb,KAAAA;IAAA,CAAA,EAAAN;;EAAA,CAAA"}
+{"version":3,"file":"ImagePreload.js","names":["Component","Portal","ImgProps","ImagePreloadProps","imgAttributes","Pick","ImagePreload","props","a","linkKey","src","srcSet","sizes","document","head","querySelector","_$createComponent","mount","children","_el$","_tmpl$","_$setAttribute","_$effect","_p$","_v$","undefined","_v$2","_v$3","_v$4","crossOrigin","_v$5","referrerPolicy","_v$6","fetchpriority","e","t","o","i","n"],"sources":["../../../src/components/image/ImagePreload.tsx"],"sourcesContent":["/**\n * ImagePreload.tsx\n * 单一职责：仅负责向 <head> 注入 <link rel=\"preload\"> 标签，\n * 以提升 LCP 图片的加载优先级。不包含任何 <img> 渲染逻辑。\n */\n\nimport type { Component } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport type { ImgProps } from \"./Image.types\";\n\n// ─── Props ────────────────────────────────────────────────────────────────────\n\nexport interface ImagePreloadProps {\n  imgAttributes: Pick<\n    ImgProps,\n    | \"src\"\n    | \"srcSet\"\n    | \"sizes\"\n    | \"crossOrigin\"\n    | \"referrerPolicy\"\n    | \"fetchpriority\"\n  >;\n}\n\n// ─── 组件 ─────────────────────────────────────────────────────────────────────\n\n/**\n * 通过 SolidJS <Portal> 将 <link> 插入 document.head。\n *\n * 注意：\n * - 故意省略 href（当 imagesrcset 存在时），以避免不支持 srcset 的浏览器\n *   加载错误尺寸的图片。详见 HTML spec §attr-link-imagesrcset。\n * - SolidJS SSR 环境可将此组件替换为 server-side head injection。\n */\nconst ImagePreload: Component<ImagePreloadProps> = (props) => {\n  const { imgAttributes: a } = props;\n\n  // 唯一 key 避免重复插入相同的 preload\n  const linkKey = `__img-preload-${a.src}-${a.srcSet ?? \"\"}-${a.sizes ?? \"\"}`;\n\n  // 若已存在相同 key 的 link，则跳过（SSR hydrate 场景）\n  if (typeof document !== \"undefined\") {\n    if (document.head.querySelector(`link[data-img-key=\"${linkKey}\"]`)) {\n      return null;\n    }\n  }\n\n  return (\n    <Portal mount={document.head}>\n      <link\n        rel=\"preload\"\n        as=\"image\"\n        data-img-key={linkKey}\n        // 当存在 srcset 时不设置 href，遵从 spec\n        href={a.srcSet ? undefined : a.src}\n        imagesrcset={a.srcSet}\n        imagesizes={a.sizes}\n        crossorigin={a.crossOrigin}\n        referrerpolicy={a.referrerPolicy}\n        fetchpriority={a.fetchpriority}\n      />\n    </Portal>\n  );\n};\n\nexport default ImagePreload;\n"],"mappings":";;wDAkCMM,KAA8CC,MAAU;CAC5D,IAAM,EAAEH,eAAeI,MAAMD,GAGvBE,IAAU,iBAAiBD,EAAEE,IAAG,GAAIF,EAAEG,UAAU,GAAE,GAAIH,EAAEI,SAAS;CASvE,OANI,OAAOC,WAAa,OAClBA,SAASC,KAAKC,cAAc,sBAAsBN,EAAO,GAAI,IACxD,OAIXO,EACGf,GAAM;EAAA,IAACgB,QAAK;GAAA,OAAEJ,SAASC;EAAI;EAAA,IAAAI,WAAA;GAAA,IAAAC,IAAAC,EAAA;GAWM,OAXNC,EAAAF,GAAA,gBAIVV,CAAO,GAAAa,GAAAC,MAAA;IAAA,IAAAC,IAEfhB,EAAEG,SAASc,KAAAA,IAAYjB,EAAEE,KAAGgB,IACrBlB,EAAEG,QAAMgB,IACTnB,EAAEI,OAAKgB,IACNpB,EAAEqB,aAAWC,IACVtB,EAAEuB,gBAAcC,IACjBxB,EAAEyB;IAAa,OAAAT,MAAAD,EAAAW,KAAAb,EAAAF,GAAA,QAAAI,EAAAW,IAAAV,CAAA,GAAAE,MAAAH,EAAAY,KAAAd,EAAAF,GAAA,eAAAI,EAAAY,IAAAT,CAAA,GAAAC,MAAAJ,EAAAf,KAAAa,EAAAF,GAAA,cAAAI,EAAAf,IAAAmB,CAAA,GAAAC,MAAAL,EAAAa,KAAAf,EAAAF,GAAA,eAAAI,EAAAa,IAAAR,CAAA,GAAAE,MAAAP,EAAAc,KAAAhB,EAAAF,GAAA,kBAAAI,EAAAc,IAAAP,CAAA,GAAAE,MAAAT,EAAAe,KAAAjB,EAAAF,GAAA,iBAAAI,EAAAe,IAAAN,CAAA,GAAAT;GAAA,GAAA;IAAAW,GAAAT,KAAAA;IAAAU,GAAAV,KAAAA;IAAAjB,GAAAiB,KAAAA;IAAAW,GAAAX,KAAAA;IAAAY,GAAAZ,KAAAA;IAAAa,GAAAb,KAAAA;GAAA,CAAA,GAAAN;EAAA;CAAA,CAAA;AAItC"}

package/dist/components/input/Input.js

@@ -2,37 +2,37 @@ import { clsx as e } from "../../utils/clsx.js";
 import { delegateEvents as t, mergeProps as n, spread as r, template as i } from "solid-js/web";
 import { createMemo as a, createUniqueId as o, mergeProps as s, splitProps as c } from "solid-js";
 //#region src/components/input/Input.tsx
-var l = /* @__PURE__ */ i("<input data-slot=input>"), u = (t) => {
-	let [i, u] = c(s({
+var l = /*#__PURE__*/ i("<input data-slot=input>"), u = (t) => {
+	let i = s({
 		id: o(),
 		type: "text"
-	}, t), [
+	}, t), [u, d] = c(i, [
 		"value",
 		"defaultValue",
 		"type",
 		"onInput",
 		"onChange",
 		"class"
-	]), d = (e) => {
+	]), f = (e) => {
 		let t = e.target.value;
-		i.type === "number" && (t = Number(e.target.value)), i.onInput?.(t);
-	}, f = (e) => {
+		u.type === "number" && (t = Number(e.target.value)), u.onInput?.(t);
+	}, p = (e) => {
 		let t = e.target.value;
-		i.type === "number" && (t = Number(e.target.value)), i.onChange?.(t);
-	}, p = a(() => i.value === void 0 ? i.defaultValue : i.value);
+		u.type === "number" && (t = Number(e.target.value)), u.onChange?.(t);
+	}, m = a(() => u.value === void 0 ? u.defaultValue : u.value);
 	return (() => {
 		var t = l();
-		return t.addEventListener("change", f), t.$$input = d, r(t, n({
+		return t.addEventListener("change", p), t.$$input = f, r(t, n({
 			get type() {
-				return i.type;
+				return u.type;
 			},
 			get value() {
-				return p();
+				return m();
 			},
 			get class() {
-				return e("h-8 w-full min-w-0 rounded-lg border border-neutral-200 dark:border-white/15 bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-neutral-950 dark:file:text-neutral-50 placeholder:text-neutral-500 dark:placeholder:text-neutral-400 focus-visible:border-neutral-400 dark:focus-visible:border-neutral-500 focus-visible:ring-3 focus-visible:ring-neutral-400/50 dark:focus-visible:ring-neutral-500/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:select-none disabled:bg-neutral-200/50 disabled:opacity-50 aria-invalid:border-red-600 aria-invalid:ring-3 aria-invalid:ring-red-600/20 md:text-sm dark:bg-white/4.5 dark:disabled:bg-white/12 dark:aria-invalid:border-red-400/50 dark:aria-invalid:ring-red-400/40", i.class);
+				return e("h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", u.class);
 			}
-		}, u), !1, !1), t;
+		}, d), !1, !1), t;
 	})();
 };
 t(["input"]);

package/dist/components/input/Input.js.map

@@ -1 +1 @@
-{"version":3,"file":"Input.js","names":["createMemo","createUniqueId","JSX","mergeProps","splitProps","InputProps","clsx","Input","props","merged","id","type","const","local","others","handleInput","IntrinsicElements","e","value","target","Number","onInput","handleChange","onChange","undefined","defaultValue","_el$","_tmpl$","addEventListener","$$input","_$spread","_$mergeProps","class","_$delegateEvents"],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import {\n  createMemo,\n  createUniqueId,\n  type JSX,\n  mergeProps,\n  splitProps,\n} from \"solid-js\";\nimport type { InputProps } from \"./Input.types\";\nimport { clsx } from \"~/utils\";\n\nexport const Input = (props: InputProps) => {\n  const merged = mergeProps(\n    { id: createUniqueId(), type: \"text\" } as const,\n    props,\n  );\n\n  const [local, others] = splitProps(merged, [\n    \"value\",\n    \"defaultValue\",\n    \"type\",\n    \"onInput\",\n    \"onChange\",\n    \"class\",\n  ]);\n\n  const handleInput: JSX.IntrinsicElements[\"input\"][\"onInput\"] = (e) => {\n    let value: string | number = e.target.value;\n    if (local.type === \"number\") {\n      value = Number(e.target.value);\n    }\n    // @ts-expect-error\n    local.onInput?.(value);\n  };\n\n  const handleChange: JSX.IntrinsicElements[\"input\"][\"onChange\"] = (e) => {\n    let value: string | number = e.target.value;\n    if (local.type === \"number\") {\n      value = Number(e.target.value);\n    }\n    // @ts-expect-error\n    local.onChange?.(value);\n  };\n\n  const value = createMemo(() =>\n    local.value !== undefined ? local.value : local.defaultValue,\n  );\n\n  return (\n    <input\n      type={local.type}\n      value={value()}\n      data-slot=\"input\"\n      class={clsx(\n        \"h-8 w-full min-w-0 rounded-lg border border-neutral-200 dark:border-white/15 bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-neutral-950 dark:file:text-neutral-50 placeholder:text-neutral-500 dark:placeholder:text-neutral-400 focus-visible:border-neutral-400 dark:focus-visible:border-neutral-500 focus-visible:ring-3 focus-visible:ring-neutral-400/50 dark:focus-visible:ring-neutral-500/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:select-none disabled:bg-neutral-200/50 disabled:opacity-50 aria-invalid:border-red-600 aria-invalid:ring-3 aria-invalid:ring-red-600/20 md:text-sm dark:bg-white/4.5 dark:disabled:bg-white/12 dark:aria-invalid:border-red-400/50 dark:aria-invalid:ring-red-400/40\",\n        local.class,\n      )}\n      onInput={handleInput}\n      onChange={handleChange}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;sDAUaO,KAASC,MAAsB;CAM1C,IAAM,CAACK,GAAOC,KAAUV,EALTD,EACb;EAAEO,IAAIT,GAAgB;EAAEU,MAAM;EAAQ,EACtCH,EACD,EAE0C;EACzC;EACA;EACA;EACA;EACA;EACA;EACD,CAAC,EAEIO,KAA0DE,MAAM;EACpE,IAAIC,IAAyBD,EAAEE,OAAOD;AAKtCL,EAJIA,EAAMF,SAAS,aACjBO,IAAQE,OAAOH,EAAEE,OAAOD,MAAM,GAGhCL,EAAMQ,UAAUH,EAAM;IAGlBI,KAA4DL,MAAM;EACtE,IAAIC,IAAyBD,EAAEE,OAAOD;AAKtCL,EAJIA,EAAMF,SAAS,aACjBO,IAAQE,OAAOH,EAAEE,OAAOD,MAAM,GAGhCL,EAAMU,WAAWL,EAAM;IAGnBA,IAAQlB,QACZa,EAAMK,UAAUM,KAAAA,IAA0BX,EAAMY,eAApBZ,EAAMK,MACnC;AAED,eAAA;EAAA,IAAAQ,IAAAC,GAAA;AAWc,SAXdD,EAAAE,iBAAA,UAUcN,EAAY,EAAAI,EAAAG,UADbd,GAAWe,EAAAJ,GAAAK,EAAA;GAAA,IAPpBpB,OAAI;AAAA,WAAEE,EAAMF;;GAAI,IAChBO,QAAK;AAAA,WAAEA,GAAO;;GAAA,IAAA,QAAA;AAAA,WAEPZ,EACL,y0BACAO,EAAMmB,MACP;;GAAA,EAGGlB,EAAM,EAAA,IAAA,GAAA,EAAAY;KAAA;;AAGdO,EAAA,CAAA,QAAA,CAAA"}
+{"version":3,"file":"Input.js","names":["createMemo","createUniqueId","JSX","mergeProps","splitProps","InputProps","clsx","Input","props","merged","id","type","const","local","others","handleInput","IntrinsicElements","e","value","target","Number","onInput","handleChange","onChange","undefined","defaultValue","_el$","_tmpl$","addEventListener","$$input","_$spread","_$mergeProps","class","_$delegateEvents"],"sources":["../../../src/components/input/Input.tsx"],"sourcesContent":["import {\n  createMemo,\n  createUniqueId,\n  type JSX,\n  mergeProps,\n  splitProps,\n} from \"solid-js\";\nimport type { InputProps } from \"./Input.types\";\nimport { clsx } from \"~/utils\";\n\nexport const Input = (props: InputProps) => {\n  const merged = mergeProps(\n    { id: createUniqueId(), type: \"text\" } as const,\n    props,\n  );\n\n  const [local, others] = splitProps(merged, [\n    \"value\",\n    \"defaultValue\",\n    \"type\",\n    \"onInput\",\n    \"onChange\",\n    \"class\",\n  ]);\n\n  const handleInput: JSX.IntrinsicElements[\"input\"][\"onInput\"] = (e) => {\n    let value: string | number = e.target.value;\n    if (local.type === \"number\") {\n      value = Number(e.target.value);\n    }\n    // @ts-expect-error\n    local.onInput?.(value);\n  };\n\n  const handleChange: JSX.IntrinsicElements[\"input\"][\"onChange\"] = (e) => {\n    let value: string | number = e.target.value;\n    if (local.type === \"number\") {\n      value = Number(e.target.value);\n    }\n    // @ts-expect-error\n    local.onChange?.(value);\n  };\n\n  const value = createMemo(() =>\n    local.value !== undefined ? local.value : local.defaultValue,\n  );\n\n  return (\n    <input\n      type={local.type}\n      value={value()}\n      data-slot=\"input\"\n      class={clsx(\n        \"h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40\",\n        local.class,\n      )}\n      onInput={handleInput}\n      onChange={handleChange}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;oDAUaO,KAASC,MAAsB;CAC1C,IAAMC,IAASN,EACb;EAAEO,IAAIT,EAAe;EAAGU,MAAM;CAAO,GACrCH,CACF,GAEM,CAACK,GAAOC,KAAUV,EAAWK,GAAQ;EACzC;EACA;EACA;EACA;EACA;EACA;CAAO,CACR,GAEKM,KAA0DE,MAAM;EACpE,IAAIC,IAAyBD,EAAEE,OAAOD;EAKtCL,AAJIA,EAAMF,SAAS,aACjBO,IAAQE,OAAOH,EAAEE,OAAOD,KAAK,IAG/BL,EAAMQ,UAAUH,CAAK;CACvB,GAEMI,KAA4DL,MAAM;EACtE,IAAIC,IAAyBD,EAAEE,OAAOD;EAKtCL,AAJIA,EAAMF,SAAS,aACjBO,IAAQE,OAAOH,EAAEE,OAAOD,KAAK,IAG/BL,EAAMU,WAAWL,CAAK;CACxB,GAEMA,IAAQlB,QACZa,EAAMK,UAAUM,KAAAA,IAA0BX,EAAMY,eAApBZ,EAAMK,KACpC;CAEA,cAAA;EAAA,IAAAQ,IAAAC,EAAA;EAWc,OAXdD,EAAAE,iBAAA,UAUcN,CAAY,GAAAI,EAAAG,UADbd,GAAWe,EAAAJ,GAAAK,EAAA;GAAA,IAPpBpB,OAAI;IAAA,OAAEE,EAAMF;GAAI;GAAA,IAChBO,QAAK;IAAA,OAAEA,EAAM;GAAC;GAAA,IAAA,QAAA;IAAA,OAEPZ,EACL,+oBACAO,EAAMmB,KACR;GAAC;EAAA,GAGGlB,CAAM,GAAA,IAAA,EAAA,GAAAY;CAAA,EAAA,CAAA;AAGhB;AAAEO,EAAA,CAAA,OAAA,CAAA"}

package/dist/components/input-group/InputGroup/InputGroup.js

@@ -2,12 +2,12 @@ import { clsx as e } from "../../../utils/clsx.js";
 import { mergeProps as t, spread as n, template as r } from "solid-js/web";
 import { splitProps as i } from "solid-js";
 //#region src/components/input-group/InputGroup/InputGroup.tsx
-var a = /* @__PURE__ */ r("<div data-slot=input-group role=group>"), o = (r) => {
+var a = /*#__PURE__*/ r("<div data-slot=input-group role=group>"), o = (r) => {
 	let [o, s] = i(r, ["class", "classList"]);
 	return (() => {
 		var r = a();
 		return n(r, t({ get class() {
-			return e("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", "border-neutral-200 has-disabled:bg-neutral-200/50 has-[[data-slot=input-group-control]:focus-visible]:border-neutral-400 has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-400/50 has-[[data-slot][aria-invalid=true]]:border-red-600 has-[[data-slot][aria-invalid=true]]:ring-red-600/20", "dark:border-white/15 dark:bg-white/4.5 dark:has-disabled:bg-white/12 dark:has-[[data-slot=input-group-control]:focus-visible]:border-neutral-500 dark:has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-500/50 dark:has-[[data-slot][aria-invalid=true]]:border-red-400 dark:has-[[data-slot][aria-invalid=true]]:ring-red-400/40", o.class);
+			return e("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", o.class);
 		} }, s), !1, !1), r;
 	})();
 };

package/dist/components/input-group/InputGroup/InputGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroup.js","names":["splitProps","InputGroupProps","clsx","InputGroup","props","local","others","_el$","_tmpl$","_$spread","_$mergeProps","class"],"sources":["../../../../src/components/input-group/InputGroup/InputGroup.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\nimport type { InputGroupProps } from \"./InputGroup.types\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroup = (props: InputGroupProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n  return (\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      class={clsx(\n        \"group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-3 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n        \"border-neutral-200 has-disabled:bg-neutral-200/50 has-[[data-slot=input-group-control]:focus-visible]:border-neutral-400 has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-400/50 has-[[data-slot][aria-invalid=true]]:border-red-600 has-[[data-slot][aria-invalid=true]]:ring-red-600/20\",\n        \"dark:border-white/15 dark:bg-white/4.5 dark:has-disabled:bg-white/12 dark:has-[[data-slot=input-group-control]:focus-visible]:border-neutral-500 dark:has-[[data-slot=input-group-control]:focus-visible]:ring-neutral-500/50 dark:has-[[data-slot][aria-invalid=true]]:border-red-400 dark:has-[[data-slot][aria-invalid=true]]:ring-red-400/40\",\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;qEAIaG,KAAcC,MAA2B;CACpD,IAAM,CAACC,GAAOC,KAAUN,EAAWI,GAAO,CAAC,SAAS,YAAY,CAAC;AACjE,eAAA;EAAA,IAAAG,IAAAC,GAAA;AAUc,SAVdC,EAAAF,GAAAG,EAAA,EAAA,IAAA,QAAA;AAAA,UAIWR,EACL,otBACA,6SACA,oVACAG,EAAMM,MACP;KAAA,EACGL,EAAM,EAAA,IAAA,GAAA,EAAAC;KAAA"}
+{"version":3,"file":"InputGroup.js","names":["splitProps","InputGroupProps","clsx","InputGroup","props","local","others","_el$","_tmpl$","_$spread","_$mergeProps","class"],"sources":["../../../../src/components/input-group/InputGroup/InputGroup.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\nimport type { InputGroupProps } from \"./InputGroup.types\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroup = (props: InputGroupProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n  return (\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      class={clsx(\n        \"group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input transition-colors outline-none in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:border-destructive has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>textarea]:h-auto dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;mEAIaG,KAAcC,MAA2B;CACpD,IAAM,CAACC,GAAOC,KAAUN,EAAWI,GAAO,CAAC,SAAS,WAAW,CAAC;CAChE,cAAA;EAAA,IAAAG,IAAAC,EAAA;EAQc,OARdC,EAAAF,GAAAG,EAAA,EAAA,IAAA,QAAA;GAAA,OAIWR,EACL,ylCACAG,EAAMM,KACR;EAAC,EAAA,GACGL,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB"}

package/dist/components/input-group/InputGroupAddon/InputGroupAddon.js

@@ -3,8 +3,8 @@ import { inputGroupAddonVariants as t } from "./InputGroupAddon.styles.js";
 import { delegateEvents as n, mergeProps as r, spread as i, template as a } from "solid-js/web";
 import { mergeProps as o, splitProps as s } from "solid-js";
 //#region src/components/input-group/InputGroupAddon/InputGroupAddon.tsx
-var c = /* @__PURE__ */ a("<div role=group data-slot=input-group-addon>"), l = (n) => {
-	let [a, l] = s(o({ align: "inline-start" }, n), [
+var c = /*#__PURE__*/ a("<div role=group data-slot=input-group-addon>"), l = (n) => {
+	let a = o({ align: "inline-start" }, n), [l, u] = s(a, [
 		"align",
 		"class",
 		"classList"
@@ -15,12 +15,12 @@ var c = /* @__PURE__ */ a("<div role=group data-slot=input-group-addon>"), l = (
 			e.target.closest("button") || e.currentTarget.parentElement?.querySelector("input")?.focus();
 		}, i(n, r({
 			get "data-align"() {
-				return a.align;
+				return l.align;
 			},
 			get class() {
-				return e(t({ align: a.align }), a.class);
+				return e(t({ align: l.align }), l.class);
 			}
-		}, l), !1, !1), n;
+		}, u), !1, !1), n;
 	})();
 };
 n(["click"]);

package/dist/components/input-group/InputGroupAddon/InputGroupAddon.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroupAddon.js","names":["InputGroupAddonProps","inputGroupAddonVariants","mergeProps","splitProps","clsx","InputGroupAddon","props","merged","align","const","local","others","_el$","_tmpl$","$$click","e","target","HTMLElement","closest","currentTarget","parentElement","querySelector","focus","_$spread","_$mergeProps","data-align","class","_$delegateEvents"],"sources":["../../../../src/components/input-group/InputGroupAddon/InputGroupAddon.tsx"],"sourcesContent":["import type { InputGroupAddonProps } from \"./InputGroupAddon.types\";\nimport { inputGroupAddonVariants } from \"./InputGroupAddon.styles\";\nimport { mergeProps, splitProps } from \"solid-js\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupAddon = (props: InputGroupAddonProps) => {\n  const merged = mergeProps({ align: \"inline-start\" } as const, props);\n\n  const [local, others] = splitProps(merged, [\"align\", \"class\", \"classList\"]);\n\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={local.align}\n      class={clsx(inputGroupAddonVariants({ align: local.align }), local.class)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return;\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus();\n      }}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;2EAKaK,KAAmBC,MAAgC;CAG9D,IAAM,CAACI,GAAOC,KAAUR,EAFTD,EAAW,EAAEM,OAAO,gBAAgB,EAAWF,EAAM,EAEzB;EAAC;EAAS;EAAS;EAAY,CAAC;AAE3E,eAAA;EAAA,IAAAM,IAAAC,GAAA;AAYc,SAZdD,EAAAE,WAMcC,MAAM;AACTA,KAAEC,OAAuBE,QAAQ,SAAS,IAG/CH,EAAEI,cAAcC,eAAeC,cAAc,QAAQ,EAAEC,OAAO;KAC/DC,EAAAX,GAAAY,EAAA;GAAA,IAAA,eAAA;AAAA,WAPWd,EAAMF;;GAAK,IAAA,QAAA;AAAA,WAChBJ,EAAKH,EAAwB,EAAEO,OAAOE,EAAMF,OAAO,CAAC,EAAEE,EAAMgB,MAAM;;GAAA,EAOrEf,EAAM,EAAA,IAAA,GAAA,EAAAC;KAAA;;AAGde,EAAA,CAAA,QAAA,CAAA"}
+{"version":3,"file":"InputGroupAddon.js","names":["InputGroupAddonProps","inputGroupAddonVariants","mergeProps","splitProps","clsx","InputGroupAddon","props","merged","align","const","local","others","_el$","_tmpl$","$$click","e","target","HTMLElement","closest","currentTarget","parentElement","querySelector","focus","_$spread","_$mergeProps","data-align","class","_$delegateEvents"],"sources":["../../../../src/components/input-group/InputGroupAddon/InputGroupAddon.tsx"],"sourcesContent":["import type { InputGroupAddonProps } from \"./InputGroupAddon.types\";\nimport { inputGroupAddonVariants } from \"./InputGroupAddon.styles\";\nimport { mergeProps, splitProps } from \"solid-js\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupAddon = (props: InputGroupAddonProps) => {\n  const merged = mergeProps({ align: \"inline-start\" } as const, props);\n\n  const [local, others] = splitProps(merged, [\"align\", \"class\", \"classList\"]);\n\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={local.align}\n      class={clsx(inputGroupAddonVariants({ align: local.align }), local.class)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return;\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus();\n      }}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;yEAKaK,KAAmBC,MAAgC;CAC9D,IAAMC,IAASL,EAAW,EAAEM,OAAO,eAAe,GAAYF,CAAK,GAE7D,CAACI,GAAOC,KAAUR,EAAWI,GAAQ;EAAC;EAAS;EAAS;CAAW,CAAC;CAE1E,cAAA;EAAA,IAAAK,IAAAC,EAAA;EAYc,OAZdD,EAAAE,WAMcC,MAAM;GACTA,EAAEC,OAAuBE,QAAQ,QAAQ,KAG9CH,EAAEI,cAAcC,eAAeC,cAAc,OAAO,CAAC,EAAEC,MAAM;EAC/D,GAACC,EAAAX,GAAAY,EAAA;GAAA,IAAA,eAAA;IAAA,OAPWd,EAAMF;GAAK;GAAA,IAAA,QAAA;IAAA,OAChBJ,EAAKH,EAAwB,EAAEO,OAAOE,EAAMF,MAAM,CAAC,GAAGE,EAAMgB,KAAK;GAAC;EAAA,GAOrEf,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB;AAAEe,EAAA,CAAA,OAAA,CAAA"}

package/dist/components/input-group/InputGroupAddon/InputGroupAddon.styles.js

@@ -1,6 +1,6 @@
 import { cva as e } from "class-variance-authority";
 //#region src/components/input-group/InputGroupAddon/InputGroupAddon.styles.ts
-var t = e("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-neutral-500 dark:text-neutral-400 select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
+var t = e("flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4", {
 	variants: { align: {
 		"inline-start": "order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]",
 		"inline-end": "order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]",

package/dist/components/input-group/InputGroupAddon/InputGroupAddon.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroupAddon.styles.js","names":[],"sources":["../../../../src/components/input-group/InputGroupAddon/InputGroupAddon.styles.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\n\nexport const inputGroupAddonVariants = cva(\n  \"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-neutral-500 dark:text-neutral-400 select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      align: {\n        \"inline-start\":\n          \"order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]\",\n        \"inline-end\":\n          \"order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]\",\n        \"block-start\":\n          \"order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2\",\n        \"block-end\":\n          \"order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  },\n);\n"],"mappings":";;AAEA,IAAa,IAA0B,EACrC,4QACA;CACE,UAAU,EACR,OAAO;EACL,gBACE;EACF,cACE;EACF,eACE;EACF,aACE;EACH,EACF;CACD,iBAAiB,EACf,OAAO,gBACR;CACF,CACF"}
+{"version":3,"file":"InputGroupAddon.styles.js","names":[],"sources":["../../../../src/components/input-group/InputGroupAddon/InputGroupAddon.styles.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\n\nexport const inputGroupAddonVariants = cva(\n  \"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      align: {\n        \"inline-start\":\n          \"order-first pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem]\",\n        \"inline-end\":\n          \"order-last pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem]\",\n        \"block-start\":\n          \"order-first w-full justify-start px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2\",\n        \"block-end\":\n          \"order-last w-full justify-start px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  },\n);\n"],"mappings":";;AAEA,IAAa,IAA0B,EACrC,2PACA;CACE,UAAU,EACR,OAAO;EACL,gBACE;EACF,cACE;EACF,eACE;EACF,aACE;CACJ,EACF;CACA,iBAAiB,EACf,OAAO,eACT;AACF,CACF"}

package/dist/components/input-group/InputGroupButton/InputGroupButton.js

@@ -5,28 +5,28 @@ import { createComponent as r, mergeProps as i } from "solid-js/web";
 import { createMemo as a, mergeProps as o, splitProps as s } from "solid-js";
 //#region src/components/input-group/InputGroupButton/InputGroupButton.tsx
 var c = (c) => {
-	let [l, u] = s(o({
+	let l = o({
 		type: "button",
 		variant: "ghost",
 		size: "xs"
-	}, c), [
+	}, c), [u, d] = s(l, [
 		"size",
 		"variant",
 		"class",
 		"classList"
-	]), d = a(() => u.icon && typeof u.icon == "object" && "ariaLabel" in u.icon && "icon" in u.icon || !!u.icon && !u.children);
-	return r(t, i(u, {
+	]), f = a(() => !!d.icon && !d.children);
+	return r(t, i(d, {
 		get "data-size"() {
-			return l.size;
+			return u.size;
 		},
 		get variant() {
-			return l.variant;
+			return u.variant;
 		},
 		get class() {
 			return e(n({
-				size: d() ? void 0 : l.size,
-				iconSize: d() ? l.size : void 0
-			}), l.class);
+				size: f() ? void 0 : u.size,
+				iconSize: f() ? u.size : void 0
+			}), u.class);
 		}
 	}));
 };

package/dist/components/input-group/InputGroupButton/InputGroupButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroupButton.js","names":["Button","InputGroupButtonProps","createMemo","mergeProps","splitProps","clsx","inputGroupButtonVariants","InputGroupButton","props","merged","type","variant","size","const","local","others","iconOnly","icon","children","_$createComponent","_$mergeProps","data-size","class","undefined","iconSize"],"sources":["../../../../src/components/input-group/InputGroupButton/InputGroupButton.tsx"],"sourcesContent":["import { Button } from \"~/components/button/Button\";\nimport type { InputGroupButtonProps } from \"./InputGroupButton.types\";\nimport { createMemo, mergeProps, splitProps } from \"solid-js\";\nimport { clsx } from \"~/utils\";\nimport { inputGroupButtonVariants } from \"./InputGroupButton.styles\";\n\nexport const InputGroupButton = (props: InputGroupButtonProps) => {\n  const merged = mergeProps(\n    { type: \"button\", variant: \"ghost\", size: \"xs\" } as const,\n    props,\n  );\n  const [local, others] = splitProps(merged, [\n    \"size\",\n    \"variant\",\n    \"class\",\n    \"classList\",\n  ]);\n\n  const iconOnly = createMemo(\n    () =>\n      (others.icon &&\n        typeof others.icon === \"object\" &&\n        \"ariaLabel\" in others.icon &&\n        \"icon\" in others.icon) ||\n      // @ts-expect-error\n      (!!others.icon && !others.children),\n  );\n\n  return (\n    // @ts-expect-error\n    <Button\n      {...others}\n      data-size={local.size}\n      variant={local.variant}\n      class={clsx(\n        inputGroupButtonVariants({\n          size: iconOnly() ? undefined : local.size,\n          iconSize: iconOnly() ? local.size : undefined,\n        }),\n        local.class,\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;AAMA,IAAaO,KAAoBC,MAAiC;CAKhE,IAAM,CAACM,GAAOC,KAAUX,EAJTD,EACb;EAAEO,MAAM;EAAUC,SAAS;EAASC,MAAM;EAAM,EAChDJ,EACD,EAC0C;EACzC;EACA;EACA;EACA;EACD,CAAC,EAEIQ,IAAWd,QAEZa,EAAOE,QACN,OAAOF,EAAOE,QAAS,YACvB,eAAeF,EAAOE,QACtB,UAAUF,EAAOE,QAElB,CAAC,CAACF,EAAOE,QAAQ,CAACF,EAAOG,SAC7B;AAED,QACEC,EACCnB,GAAMoB,EACDL,GAAM;EAAA,IAAA,cAAA;AAAA,UACCD,EAAMF;;EAAI,IACrBD,UAAO;AAAA,UAAEG,EAAMH;;EAAO,IAAA,QAAA;AAAA,UACfN,EACLC,EAAyB;IACvBM,MAAMI,GAAU,GAAGO,KAAAA,IAAYT,EAAMF;IACrCY,UAAUR,GAAU,GAAGF,EAAMF,OAAOW,KAAAA;IACrC,CAAC,EACFT,EAAMQ,MACP;;EAAA,CAAA,CAAA"}
+{"version":3,"file":"InputGroupButton.js","names":["Button","InputGroupButtonProps","createMemo","mergeProps","splitProps","clsx","inputGroupButtonVariants","InputGroupButton","props","merged","type","variant","size","const","local","others","iconOnly","icon","children","_$createComponent","_$mergeProps","data-size","class","undefined","iconSize"],"sources":["../../../../src/components/input-group/InputGroupButton/InputGroupButton.tsx"],"sourcesContent":["import { Button } from \"~/components/button/Button\";\nimport type { InputGroupButtonProps } from \"./InputGroupButton.types\";\nimport { createMemo, mergeProps, splitProps } from \"solid-js\";\nimport { clsx } from \"~/utils\";\nimport { inputGroupButtonVariants } from \"./InputGroupButton.styles\";\n\nexport const InputGroupButton = (props: InputGroupButtonProps) => {\n  const merged = mergeProps(\n    { type: \"button\", variant: \"ghost\", size: \"xs\" } as const,\n    props,\n  );\n  const [local, others] = splitProps(merged, [\n    \"size\",\n    \"variant\",\n    \"class\",\n    \"classList\",\n  ]);\n\n  const iconOnly = createMemo(() => !!others.icon && !others.children);\n\n  return (\n    <Button\n      {...others}\n      data-size={local.size}\n      variant={local.variant}\n      class={clsx(\n        inputGroupButtonVariants({\n          size: iconOnly() ? undefined : local.size,\n          iconSize: iconOnly() ? local.size : undefined,\n        }),\n        local.class,\n      )}\n    />\n  );\n};\n"],"mappings":";;;;;;AAMA,IAAaO,KAAoBC,MAAiC;CAChE,IAAMC,IAASN,EACb;EAAEO,MAAM;EAAUC,SAAS;EAASC,MAAM;CAAK,GAC/CJ,CACF,GACM,CAACM,GAAOC,KAAUX,EAAWK,GAAQ;EACzC;EACA;EACA;EACA;CAAW,CACZ,GAEKO,IAAWd,QAAiB,CAAC,CAACa,EAAOE,QAAQ,CAACF,EAAOG,QAAQ;CAEnE,OAAAC,EACGnB,GAAMoB,EACDL,GAAM;EAAA,IAAA,cAAA;GAAA,OACCD,EAAMF;EAAI;EAAA,IACrBD,UAAO;GAAA,OAAEG,EAAMH;EAAO;EAAA,IAAA,QAAA;GAAA,OACfN,EACLC,EAAyB;IACvBM,MAAMI,EAAS,IAAIO,KAAAA,IAAYT,EAAMF;IACrCY,UAAUR,EAAS,IAAIF,EAAMF,OAAOW,KAAAA;GACtC,CAAC,GACDT,EAAMQ,KACR;EAAC;CAAA,CAAA,CAAA;AAGP"}

package/dist/components/input-group/InputGroupButton/InputGroupButton.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroupButton.styles.js","names":[],"sources":["../../../../src/components/input-group/InputGroupButton/InputGroupButton.styles.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\n\nexport const inputGroupButtonVariants = cva(\n  \"flex items-center gap-2 text-sm shadow-none\",\n  {\n    variants: {\n      size: {\n        xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n        sm: \"\",\n      },\n      iconSize: {\n        xs: \"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0\",\n        sm: \"size-8 p-0 has-[>svg]:p-0\",\n      },\n    },\n    defaultVariants: {\n      size: \"xs\",\n    },\n  },\n);\n"],"mappings":";;AAEA,IAAa,IAA2B,EACtC,+CACA;CACE,UAAU;EACR,MAAM;GACJ,IAAI;GACJ,IAAI;GACL;EACD,UAAU;GACR,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CACF"}
+{"version":3,"file":"InputGroupButton.styles.js","names":[],"sources":["../../../../src/components/input-group/InputGroupButton/InputGroupButton.styles.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\n\nexport const inputGroupButtonVariants = cva(\n  \"flex items-center gap-2 text-sm shadow-none\",\n  {\n    variants: {\n      size: {\n        xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n        sm: \"\",\n      },\n      iconSize: {\n        xs: \"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0\",\n        sm: \"size-8 p-0 has-[>svg]:p-0\",\n      },\n    },\n    defaultVariants: {\n      size: \"xs\",\n    },\n  },\n);\n"],"mappings":";;AAEA,IAAa,IAA2B,EACtC,+CACA;CACE,UAAU;EACR,MAAM;GACJ,IAAI;GACJ,IAAI;EACN;EACA,UAAU;GACR,IAAI;GACJ,IAAI;EACN;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CACF"}