@neut/ui 0.0.16 → 0.0.18

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","mergeProps","_$use","_$mergeProps","mergeProps$1","_tmpl$","ImageElement","props","rawProps","internal","imgAttrs","splitProps","handleRef","img","handleLoading","_el$","_ref$","use","spread","mergeProps","\"class\"","\"onLoad\"","e","\"onError\""],"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;EACxC,AAAKA,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,IAAA2B,QAAA;IAAA,OAChCrD,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;GAAAiD,SAERtB,MAAM;IACb,IAAM7B,IAAM6B,EAAEC;IACdnD,EACEqB,GACAH,EAASf,aACTe,EAASV,QACTU,EAAST,mBACTS,EAASd,iBACTc,EAAShB,aACTgB,EAASX,UACX;GACF;GAACmE,UACSxB,MAAM;IAQd,AANAhC,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"}
+{"version":3,"file":"ImageElement.js","names":["Component","mergeProps","splitProps","ImgProps","OnLoad","OnLoadingComplete","PlaceholderValue","callEventHandler","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","classList","style","sizes","srcset","srcSet","e","currentTarget","mergeProps","_$use","_$mergeProps","mergeProps$1","_tmpl$","ImageElement","props","rawProps","internal","imgAttrs","splitProps","handleRef","img","handleLoading","_el$","_ref$","use","spread","mergeProps","\"class\"","\"onLoad\"","\"onError\"","callEventHandler","e"],"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 { callEventHandler } from \"~/utils\";\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      classList={internal.classList}\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        // 此前这里用 `typeof internal.onError !== \"function\"` 直接 return，\n        // 等于把 Solid 的数组/绑定形式**静默丢掉**（既不报错也不回调）。\n        // 统一走仓库的 callEventHandler（数组=多个处理器，非函数项跳过）。\n        callEventHandler(internal.onError, e);\n      }}\n    />\n  );\n};\n\nexport default ImageElement;\n"],"mappings":";;;;;8CAkCMqB,KAA8CC,MAAa;CAC/D,IAAMC,IAAQtB,EAAW,EAAEuB,UAAU,QAAiB,GAAGF,CAAQ,GAG3D,CAACI,GAAUC,KAAYzB,EAAWqB,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;EACxC,AAAKA,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,IAgBOhB;EAyBJ,OAzBa,OAAAgB,KAAA,aAAAC,EAAAD,GAAAF,CAAA,IAATd,IAASc,GAAAI,EAAAJ,GAAAK,EAdVpB,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,IAAA4B,QAAA;IAAA,OAChCtD,EAAS2B;GAAK;GAAA,IACrBC,YAAS;IAAA,OAAE5B,EAAS4B;GAAS;GAAA,IAC7BC,QAAK;IAAA,OAAE7B,EAAS6B;GAAK;GAAA,IACrBC,QAAK;IAAA,OAAE9B,EAAS8B;GAAK;GAAA,IACrBC,SAAM;IAAA,OAAE/B,EAASgC;GAAM;GAAA,IACvB3B,MAAG;IAAA,OAAEL,EAASK;GAAG;GAAAkD,SAERtB,MAAM;IACb,IAAM9B,IAAM8B,EAAEC;IACdpD,EACEqB,GACAH,EAASf,aACTe,EAASV,QACTU,EAAST,mBACTS,EAASd,iBACTc,EAAShB,aACTgB,EAASX,UACX;GACF;GAACmE,UACSvB,MAAM;IAWdpD,AATAmB,EAASZ,eAAe,EAAI,GACxBY,EAASf,gBAAgB,WAE3Be,EAASd,gBAAgB,EAAI,GAM/BL,EAAiBmB,EAASI,SAAS6B,CAAC;GACtC;EAAC,CAAA,GAAA,IAAA,EAAA,GAAAjB;CAAA,EAAA,CAAA;AAGP"}

package/dist/components/image/lib/blur.d.ts

@@ -0,0 +1,31 @@
+import { PlaceholderStyle } from '../Image.types';
+interface BlurSvgOptions {
+    widthInt?: number;
+    heightInt?: number;
+    blurWidth?: number;
+    blurHeight?: number;
+    /** 省略时按空串处理（生产构建跳过开发期校验时可能出现没有 blurDataURL 的情况） */
+    blurDataURL?: string;
+    objectFit?: string;
+}
+/**
+ * 生成内联的 blur SVG（URL 编码为 data URL 的 payload）。
+ *
+ * 采用与 next/image 相同的手法：把原图按放大 40 倍绘制，再叠加高斯模糊滤镜，
+ * 得到"低分辨率占位图"的观感，而不必真的生成缩略图。
+ */
+export declare function getImageBlurSvg({ widthInt, heightInt, blurWidth, blurHeight, blurDataURL, objectFit, }: BlurSvgOptions): string;
+interface PlaceholderOptions {
+    /** 已解码完成则不必再显示占位 */
+    blurComplete: boolean;
+    placeholder: string;
+    objectFit?: string;
+    objectPosition?: string;
+    backgroundImage: string | null;
+}
+/**
+ * 由背景图字符串得到完整的占位样式。
+ * 没有背景图（`placeholder="empty"` 或已解码）时返回空对象，不产生多余样式。
+ */
+export declare function getPlaceholderStyle({ backgroundImage, objectFit, objectPosition, }: PlaceholderOptions): PlaceholderStyle;
+export {};

package/dist/components/image/lib/blur.js

@@ -0,0 +1,24 @@
+//#region src/components/image/lib/blur.ts
+var e = [
+	"-moz-initial",
+	"fill",
+	"none",
+	"scale-down",
+	void 0
+];
+function t({ widthInt: e, heightInt: t, blurWidth: n, blurHeight: r, blurDataURL: i = "", objectFit: a }) {
+	let o = n ? n * 40 : e, s = r ? r * 40 : t, c = o && s ? `viewBox='0 0 ${o} ${s}'` : "";
+	return `%3Csvg xmlns='http://www.w3.org/2000/svg' ${c}%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='20'/%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='20'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='${c ? "none" : a === "contain" ? "xMidYMid" : a === "cover" ? "xMidYMid slice" : "none"}' style='filter: url(%23b);' href='${i}'/%3E%3C/svg%3E`;
+}
+function n({ backgroundImage: t, objectFit: n, objectPosition: r }) {
+	return t ? {
+		"background-size": e.includes(n) ? n === "fill" ? "100% 100%" : "cover" : n,
+		"background-position": r || "50% 50%",
+		"background-repeat": "no-repeat",
+		"background-image": t
+	} : {};
+}
+//#endregion
+export { t as getImageBlurSvg, n as getPlaceholderStyle };
+
+//# sourceMappingURL=blur.js.map

package/dist/components/image/lib/blur.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"blur.js","names":["INVALID_BACKGROUND_SIZE_VALUES","getImageBlurSvg","svgWidth","blurWidth","widthInt","svgHeight","blurHeight","heightInt","viewBox","objectFit","blurDataURL","getPlaceholderStyle","backgroundImage","objectPosition"],"sources":["../../../../src/components/image/lib/blur.ts"],"sourcesContent":["/**\n * blur placeholder 的 SVG 生成与背景样式计算。\n *\n * 单一职责：把 blur 数据与目标尺寸转换成可直接写进 `style` 的 CSS 值。\n */\n\nimport type { PlaceholderStyle } from \"../Image.types\";\n\n/** `object-fit` 里不能直接当 `background-size` 用的值 */\nconst INVALID_BACKGROUND_SIZE_VALUES = [\n  \"-moz-initial\",\n  \"fill\",\n  \"none\",\n  \"scale-down\",\n  undefined,\n];\n\ninterface BlurSvgOptions {\n  widthInt?: number;\n  heightInt?: number;\n  blurWidth?: number;\n  blurHeight?: number;\n  /** 省略时按空串处理（生产构建跳过开发期校验时可能出现没有 blurDataURL 的情况） */\n  blurDataURL?: string;\n  objectFit?: string;\n}\n\n/**\n * 生成内联的 blur SVG（URL 编码为 data URL 的 payload）。\n *\n * 采用与 next/image 相同的手法：把原图按放大 40 倍绘制，再叠加高斯模糊滤镜，\n * 得到\"低分辨率占位图\"的观感，而不必真的生成缩略图。\n */\nexport function getImageBlurSvg({\n  widthInt,\n  heightInt,\n  blurWidth,\n  blurHeight,\n  blurDataURL = \"\",\n  objectFit,\n}: BlurSvgOptions): 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\ninterface PlaceholderOptions {\n  /** 已解码完成则不必再显示占位 */\n  blurComplete: boolean;\n  placeholder: string;\n  objectFit?: string;\n  objectPosition?: string;\n  backgroundImage: string | null;\n}\n\n/**\n * 由背景图字符串得到完整的占位样式。\n * 没有背景图（`placeholder=\"empty\"` 或已解码）时返回空对象，不产生多余样式。\n */\nexport function getPlaceholderStyle({\n  backgroundImage,\n  objectFit,\n  objectPosition,\n}: PlaceholderOptions): PlaceholderStyle {\n  if (!backgroundImage) return {};\n\n  const backgroundSize = !INVALID_BACKGROUND_SIZE_VALUES.includes(objectFit)\n    ? objectFit\n    : objectFit === \"fill\"\n      ? \"100% 100%\" // `fill` 在 background-size 下的等价写法\n      : \"cover\";\n\n  return {\n    \"background-size\": backgroundSize,\n    \"background-position\": objectPosition || \"50% 50%\",\n    \"background-repeat\": \"no-repeat\",\n    \"background-image\": backgroundImage,\n  };\n}\n"],"mappings":";AASA,IAAMA,IAAiC;CACrC;CACA;CACA;CACA;CACA,KAAA;AACF;AAkBA,SAAgBC,EAAgB,EAC9B,aACA,cACA,cACA,eACA,iBAAc,IACd,gBACyB;CACzB,IACMC,IAAWC,IAAYA,IAAY,KAAKC,GACxCC,IAAYC,IAAaA,IAAa,KAAKC,GAE3CC,IACJN,KAAYG,IAAY,gBAAgBH,EAAS,GAAGG,EAAU,KAAK;CASrE,OAAO,6CAA6CG,EAAQ,ybARhCA,IACxB,SACAC,MAAc,YACZ,aACAA,MAAc,UACZ,mBACA,OAEygB,qCAAqCC,EAAY;AACpkB;AAeA,SAAgBC,EAAoB,EAClC,oBACA,cACA,qBACuC;CASvC,OARKC,IAQE;EACL,mBAPsBZ,EAA+B,SAASS,CAAS,IAErEA,MAAc,SACZ,cACA,UAHFA;EAOF,uBAAuBI,KAAkB;EACzC,qBAAqB;EACrB,oBAAoBD;CACtB,IAb6B,CAAC;AAchC"}

package/dist/components/image/lib/dev-checks.d.ts

@@ -0,0 +1,52 @@
+import { ImageConfig, ImageLoaderWithConfig, ImageProps } from '../Image.types';
+/** `loading` 的合法取值（含"未传"，表示交给 `isLazy` 决定） */
+export declare const VALID_LOADING_VALUES: readonly ["lazy", "eager", undefined];
+export type ValidLoadingValue = (typeof VALID_LOADING_VALUES)[number];
+/** 是否是可用的 loading 值 */
+export declare function isValidLoading(value: unknown): value is ValidLoadingValue;
+interface DevCheckContext {
+    /** 已解析出的最终 src（可能是空串） */
+    src: string;
+    config: ImageConfig;
+    loader: ImageLoaderWithConfig;
+    fill: boolean;
+    /** 解析后的宽高（`NaN` 表示非法） */
+    widthInt: number | undefined;
+    heightInt: number | undefined;
+    qualityInt: number | undefined;
+    /** `unoptimized` 的当前值，可能会被本函数改写 */
+    unoptimized: boolean;
+    /** 生效后的内联样式（用于检测与 `fill` 冲突的宽高） */
+    style: ImageProps["style"];
+    /** 用户在 placeholder / loading / priority / preload / 旧属性上的原始输入 */
+    props: {
+        width?: unknown;
+        height?: unknown;
+        loading?: unknown;
+        priority?: boolean;
+        preload?: boolean;
+        placeholder: string;
+        blurDataURL?: string;
+    };
+    /** 未被子组件消费的剩余属性名（用于探测 `ref` 之类不支持的用法） */
+    otherKeys: string[];
+    /** next 13 之前的旧属性（有值就发 codemod 提示） */
+    legacyProps: Record<string, unknown>;
+}
+/**
+ * 入口：执行全部开发期校验。
+ * 返回可能被改写的 `unoptimized`（`src` 为空时会强制为 true）。
+ */
+export declare function runDevChecks(ctx: DevCheckContext): boolean;
+/**
+ * 记录本次渲染的图片，并（首次）注册 LCP 观察器。
+ * 目的是在开发环境提示"首屏最大的那张图用了 lazy"。
+ */
+export declare function trackImageForLcp(entry: {
+    src: string;
+    loading: ValidLoadingValue;
+    placeholder: string;
+}): void;
+/** 仅供测试：重置模块级状态（观察器与已记录图片） */
+export declare function resetLcpTracking(): void;
+export {};

package/dist/components/image/lib/handle-loading.d.ts

@@ -0,0 +1,13 @@
+import { OnLoad, OnLoadingComplete, PlaceholderValue } from '../Image.types';
+/** 用于追踪每个 img 节点已处理的 src，避免重复触发 */
+type ImgWithDataProp = HTMLImageElement & {
+    "data-loaded-src"?: string;
+};
+/**
+ * 在图片加载/hydrate 后调用。
+ * - 使用 img.decode() 确保像素已解码再触发回调
+ * - 清除 blur placeholder
+ * - 开发环境下输出 fill / sizes 相关警告
+ */
+export declare function handleLoading(img: ImgWithDataProp, placeholder: PlaceholderValue, onLoad: OnLoad | undefined, onLoadingComplete: OnLoadingComplete | undefined, setBlurComplete: (v: boolean) => void, unoptimized: boolean, sizesInput: string | undefined): void;
+export {};

package/dist/components/image/lib/handle-loading.js

@@ -0,0 +1,20 @@
+//#region src/components/image/lib/handle-loading.ts
+function e(e, t, n, r, i, a, o) {
+	let s = e?.src;
+	e && e["data-loaded-src"] !== s && (e["data-loaded-src"] = s, ("decode" in e ? e.decode() : Promise.resolve()).catch(() => {}).then(() => {
+		if (e.parentElement && e.isConnected) {
+			if (t !== "empty" && i(!0), n) {
+				let t = new Event("load");
+				Object.defineProperty(t, "target", {
+					writable: !1,
+					value: e
+				}), n(t);
+			}
+			r && r(e);
+		}
+	}));
+}
+//#endregion
+export { e as handleLoading };
+
+//# sourceMappingURL=handle-loading.js.map

package/dist/components/image/lib/handle-loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handle-loading.js","names":["handleLoading","src","img","placeholder","setBlurComplete","onLoad","event","onLoadingComplete"],"sources":["../../../../src/components/image/lib/handle-loading.ts"],"sourcesContent":["/**\n * 图片加载完成后的副作用。\n *\n * 单一职责：decode 完成后触发回调、清除 blur 占位、在开发环境输出\n * fill / sizes 与宽高比相关的使用警告。纯 TypeScript，无 JSX。\n */\n\nimport type {\n  OnLoad,\n  OnLoadingComplete,\n  PlaceholderValue,\n} from \"../Image.types\";\n\n/** 用于追踪每个 img 节点已处理的 src，避免重复触发 */\ntype ImgWithDataProp = HTMLImageElement & { \"data-loaded-src\"?: string };\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  // 走到这里说明 img.parentElement 一定存在（函数开头的 `!img.parentElement ||`\n  // 已经把脱离 DOM 的情况挡掉了），因此不需要再判空\n  const { position } = window.getComputedStyle(\n    img.parentElement as HTMLElement,\n  );\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  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"],"mappings":";AAsBA,SAAgBA,EACd,GACA,GACA,GACA,GACA,GACA,GACA,GACM;CACN,IAAMC,IAAMC,GAAK;CAEjB,AAAKA,KAAOA,EAAI,uBAAuBD,MACvC,EAAI,qBAAqBA,IAEA,YAAYC,IAAMA,EAAI,OAAO,IAAI,QAAQ,QAAQ,EAAA,CAExE,YAAY,CAAC,CAAC,CAAC,CAAC,WAAW;EAE3B,IAAKA,EAAI,iBAAkBA,EAAI,aAM/B;OAJIC,MAAgB,WAClBC,EAAgB,EAAI,GAGlBC,GAAQ;IACV,IAAMC,IAAQ,IAAI,MAAM,MAAM;IAE9B,AADA,OAAO,eAAeA,GAAO,UAAU;KAAE,UAAU;KAAO,OAAOJ;IAAI,CAAC,GACtEG,EACEC,CACF;GACF;GAEA,AAAIC,KACFA,EAAkBL,CAAG;EAHvB;CAUF,CAAC;AACH"}

package/dist/components/image/lib/loader.d.ts

@@ -0,0 +1,39 @@
+import { ImageConfig, ImageLoaderProps, ImageLoaderWithConfig } from '../Image.types';
+/**
+ * 默认 loader。
+ * - 外部 URL（http/https）原样返回，不经过优化服务
+ * - 本地图片追加 `url` / `w` / `q` 参数，交给服务端的 `/_image` 处理
+ *
+ * 开发环境下缺失 `src` / `width` 会直接抛错，避免静默生成坏 URL。
+ */
+export declare function defaultLoader({ src, width, quality, }: ImageLoaderProps): string;
+interface ImgAttrsData {
+    config: ImageConfig;
+    src: string;
+    unoptimized: boolean;
+    loader: ImageLoaderWithConfig;
+    width?: number;
+    quality?: number;
+    sizes?: string;
+}
+interface ImgAttrsResult {
+    src: string;
+    srcSet: string | undefined;
+    sizes: string | undefined;
+}
+/**
+ * 生成 `src` / `srcSet` / `sizes`。
+ * `unoptimized` 时不做任何加工（`srcSet` 与 `sizes` 返回 `undefined`，从 DOM 上消失）。
+ */
+export declare function generateImgAttrs({ config, src, unoptimized, width, quality, sizes, loader, }: ImgAttrsData): ImgAttrsResult;
+/**
+ * 决定要生成哪些宽度，以及 `srcSet` 描述符用 `w` 还是 `x`：
+ * - 显式 `sizes`：解析其中的 `vw` 百分比，据此过滤 `deviceSizes`，用 `w`
+ * - 未传 `sizes` 但传了 `width`：用 `width` / `2x`，用 `x`
+ * - 都没有：直接用 `deviceSizes`，用 `w`
+ */
+export declare function getWidths({ deviceSizes, allSizes }: ImageConfig, width: number | undefined, sizes: string | undefined): {
+    widths: number[];
+    kind: "w" | "x";
+};
+export {};

package/dist/components/image/lib/loader.js

@@ -0,0 +1,57 @@
+//#region src/components/image/lib/loader.ts
+function e({ src: e, width: t, quality: n }) {
+	if (e.startsWith("http://") || e.startsWith("https://")) return e;
+	let r = new URLSearchParams();
+	return r.set("url", e), r.set("w", String(t)), n && r.set("q", String(n)), `/_image?${r.toString()}`;
+}
+function t({ config: e, src: t, unoptimized: r, width: i, quality: a, sizes: o, loader: s }) {
+	if (r) return {
+		src: t,
+		srcSet: void 0,
+		sizes: void 0
+	};
+	let { widths: c, kind: l } = n(e, i, o), u = c.length - 1;
+	return {
+		sizes: !o && l === "w" ? "100vw" : o,
+		srcSet: c.map((n, r) => `${s({
+			config: e,
+			src: t,
+			quality: a,
+			width: n
+		})} ${l === "w" ? n : r + 1}${l}`).join(", "),
+		src: s({
+			config: e,
+			src: t,
+			quality: a,
+			width: c[u]
+		})
+	};
+}
+function n({ deviceSizes: e, allSizes: t }, n, r) {
+	if (r) {
+		let n = /(^|\s)(1?\d?\d)vw/g, i = [];
+		for (let e; e = n.exec(r);) i.push(Number.parseInt(e[2], 10));
+		if (i.length) {
+			let n = Math.min(...i) * .01;
+			return {
+				widths: t.filter((t) => t >= e[0] * n),
+				kind: "w"
+			};
+		}
+		return {
+			widths: t,
+			kind: "w"
+		};
+	}
+	return typeof n == "number" ? {
+		widths: [...new Set([n, n * 2].map((e) => t.find((t) => t >= e) || t[t.length - 1]))],
+		kind: "x"
+	} : {
+		widths: e,
+		kind: "w"
+	};
+}
+//#endregion
+export { e as defaultLoader, t as generateImgAttrs, n as getWidths };
+
+//# sourceMappingURL=loader.js.map

package/dist/components/image/lib/loader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"loader.js","names":["defaultLoader","src","params","width","quality","generateImgAttrs","unoptimized","getWidths","config","sizes","last","widths","kind","loader","w","i","viewportWidthRe","percentSizes","match","smallestRatio","allSizes","s","deviceSizes","p"],"sources":["../../../../src/components/image/lib/loader.ts"],"sourcesContent":["/**\n * 图片 URL 与 `srcSet` 生成。\n *\n * 单一职责：把「配置 + src + 宽度」变成最终的 URL / `srcSet` / `sizes` 字符串。\n * 不含 props 解析、不含校验、不含样式。\n */\n\nimport type {\n  ImageConfig,\n  ImageLoaderProps,\n  ImageLoaderWithConfig,\n} from \"../Image.types\";\n\n/**\n * 默认 loader。\n * - 外部 URL（http/https）原样返回，不经过优化服务\n * - 本地图片追加 `url` / `w` / `q` 参数，交给服务端的 `/_image` 处理\n *\n * 开发环境下缺失 `src` / `width` 会直接抛错，避免静默生成坏 URL。\n */\nexport function defaultLoader({\n  src,\n  width,\n  quality,\n}: 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  if (src.startsWith(\"http://\") || src.startsWith(\"https://\")) {\n    return src;\n  }\n\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\ninterface ImgAttrsData {\n  config: ImageConfig;\n  src: string;\n  unoptimized: boolean;\n  loader: ImageLoaderWithConfig;\n  width?: number;\n  quality?: number;\n  sizes?: string;\n}\n\ninterface ImgAttrsResult {\n  src: string;\n  srcSet: string | undefined;\n  sizes: string | undefined;\n}\n\n/**\n * 生成 `src` / `srcSet` / `sizes`。\n * `unoptimized` 时不做任何加工（`srcSet` 与 `sizes` 返回 `undefined`，从 DOM 上消失）。\n */\nexport function generateImgAttrs({\n  config,\n  src,\n  unoptimized,\n  width,\n  quality,\n  sizes,\n  loader,\n}: ImgAttrsData): ImgAttrsResult {\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    // `src` 刻意放在最后：浏览器（尤其 Safari）会按属性出现顺序立即发起请求，\n    // 若 `src` 在 `srcSet`/`sizes` 之前，会先请求一次再被替换，造成多余请求。\n    src: loader({ config, src, quality, width: widths[last] }),\n  };\n}\n\n/**\n * 决定要生成哪些宽度，以及 `srcSet` 描述符用 `w` 还是 `x`：\n * - 显式 `sizes`：解析其中的 `vw` 百分比，据此过滤 `deviceSizes`，用 `w`\n * - 未传 `sizes` 但传了 `width`：用 `width` / `2x`，用 `x`\n * - 都没有：直接用 `deviceSizes`，用 `w`\n */\nexport function getWidths(\n  { deviceSizes, allSizes }: ImageConfig,\n  width: number | undefined,\n  sizes: string | undefined,\n): { widths: number[]; kind: \"w\" | \"x\" } {\n  if (sizes) {\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: 上游 next 的实现，保持逐字移植\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      // 3x 屏不给 3x 图：多数标称 3x 的 OLED 屏实际只有绿色子像素是 3x，\n      // 渲染上与 2x 无差别却显著增加流量。\n      // https://blog.twitter.com/engineering/en_us/topics/infrastructure/2019/capping-image-fidelity-on-ultra-high-resolution-devices.html\n      [width, width * 2].map(\n        (w) => allSizes.find((p) => p >= w) || allSizes[allSizes.length - 1],\n      ),\n    ),\n  ];\n  return { widths, kind: \"x\" };\n}\n"],"mappings":";AAoBA,SAAgBA,EAAc,EAC5B,QACA,UACA,cAC2B;CAa3B,IAAIC,EAAI,WAAW,SAAS,KAAKA,EAAI,WAAW,UAAU,GACxD,OAAOA;CAGT,IAAMC,IAAS,IAAI,gBAAgB;CAInC,OAHAA,EAAO,IAAI,OAAOD,CAAG,GACrBC,EAAO,IAAI,KAAK,OAAOC,CAAK,CAAC,GACzBC,KAASF,EAAO,IAAI,KAAK,OAAOE,CAAO,CAAC,GACrC,WAAWF,EAAO,SAAS;AACpC;AAsBA,SAAgBG,EAAiB,EAC/B,WACA,QACA,gBACA,UACA,YACA,UACA,aAC+B;CAC/B,IAAIC,GACF,OAAO;EAAE;EAAK,QAAQ,KAAA;EAAW,OAAO,KAAA;CAAU;CAGpD,IAAM,EAAE,WAAQ,YAASC,EAAUC,GAAQL,GAAOM,CAAK,GACjDC,IAAOC,EAAO,SAAS;CAE7B,OAAO;EACL,OAAO,CAACF,KAASG,MAAS,MAAM,UAAUH;EAC1C,QAAQE,EACL,KACE,GAAG,MACF,GAAGE,EAAO;GAAE;GAAQ;GAAK;GAAS,OAAOC;EAAE,CAAC,EAAE,GAC5CF,MAAS,MAAME,IAAIC,IAAI,IACtBH,GACP,CAAC,CACA,KAAK,IAAI;EAIZ,KAAKC,EAAO;GAAE;GAAQ;GAAK;GAAS,OAAOF,EAAOD;EAAM,CAAC;CAC3D;AACF;AAQA,SAAgBH,EACd,EAAE,gBAAa,eACf,GACA,GACuC;CACvC,IAAIE,GAAO;EACT,IAAMO,IAAkB,sBAClBC,IAAe,CAAC;EACtB,KACE,IAAIC,GAEH,IAAQF,EAAgB,KAAKP,CAAK,IAGnC,EAAa,KAAK,OAAO,SAASS,EAAM,IAAI,EAAE,CAAC;EAEjD,IAAID,EAAa,QAAQ;GACvB,IAAME,IAAgB,KAAK,IAAI,GAAGF,CAAY,IAAI;GAClD,OAAO;IACL,QAAQG,EAAS,QAAQ,MAAMC,KAAKC,EAAY,KAAKH,CAAa;IAClE,MAAM;GACR;EACF;EACA,OAAO;GAAE,QAAQC;GAAU,MAAM;EAAI;CACvC;CAeA,OAdI,OAAOjB,KAAU,WAcd;EAAE,QAAA,CATP,GAAG,IAAI,IAIL,CAACA,GAAOA,IAAQ,CAAC,CAAC,CAAC,KAChB,MAAMiB,EAAS,MAAM,MAAMG,KAAKT,CAAC,KAAKM,EAASA,EAAS,SAAS,EACpE,CACF,CAEO;EAAQ,MAAM;CAAI,IAblB;EAAE,QAAQE;EAAa,MAAM;CAAI;AAc5C"}

package/dist/components/image/lib/static-import.d.ts

@@ -0,0 +1,14 @@
+import { StaticImageData, StaticImport, StaticRequire } from '../Image.types';
+/**
+ * 把 `width` / `height` / `quality` 这类既可传数字也可传数字字符串的输入解析成数字。
+ * - `undefined` 原样返回（表示"未提供"，与 `NaN` 表示"非法"区分开）
+ * - 纯数字字符串按十进制解析
+ * - 其它一律返回 `NaN`，由调用方决定是否抛错
+ */
+export declare function getInt(x: unknown): number | undefined;
+/** 是否是 webpack 的 `require().default` 形态 */
+export declare function isStaticRequire(src: StaticRequire | StaticImageData): src is StaticRequire;
+/** 是否已是 StaticImageData（自带 src/width/height） */
+export declare function isStaticImageData(src: StaticRequire | StaticImageData): src is StaticImageData;
+/** 是否是任何一种静态导入对象（`require()` 或 `import` 的结果） */
+export declare function isStaticImport(src: string | StaticImport): src is StaticImport;

package/dist/components/image/lib/static-import.js

@@ -0,0 +1,17 @@
+//#region src/components/image/lib/static-import.ts
+function e(e) {
+	return e === void 0 ? e : typeof e == "number" ? Number.isFinite(e) ? e : NaN : typeof e == "string" && /^[0-9]+$/.test(e) ? Number.parseInt(e, 10) : NaN;
+}
+function t(e) {
+	return e.default !== void 0;
+}
+function n(e) {
+	return e.src !== void 0;
+}
+function r(e) {
+	return !!e && typeof e == "object" && (t(e) || n(e));
+}
+//#endregion
+export { e as getInt, n as isStaticImageData, r as isStaticImport, t as isStaticRequire };
+
+//# sourceMappingURL=static-import.js.map

package/dist/components/image/lib/static-import.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static-import.js","names":["getInt","x","isStaticRequire","src","isStaticImageData","isStaticImport"],"sources":["../../../../src/components/image/lib/static-import.ts"],"sourcesContent":["/**\n * 静态图片导入的识别与数值解析。\n *\n * 单一职责：只处理「src 到底是字符串还是静态导入对象」以及「宽高/quality 这类\n * 松散输入怎么解析成数字」。不涉及 loader、样式或校验。\n */\n\nimport type {\n  StaticImageData,\n  StaticImport,\n  StaticRequire,\n} from \"../Image.types\";\n\n/**\n * 把 `width` / `height` / `quality` 这类既可传数字也可传数字字符串的输入解析成数字。\n * - `undefined` 原样返回（表示\"未提供\"，与 `NaN` 表示\"非法\"区分开）\n * - 纯数字字符串按十进制解析\n * - 其它一律返回 `NaN`，由调用方决定是否抛错\n */\nexport function 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 : Number.NaN;\n  }\n  if (typeof x === \"string\" && /^[0-9]+$/.test(x)) {\n    return Number.parseInt(x, 10);\n  }\n  return Number.NaN;\n}\n\n/** 是否是 webpack 的 `require().default` 形态 */\nexport function isStaticRequire(\n  src: StaticRequire | StaticImageData,\n): src is StaticRequire {\n  return (src as StaticRequire).default !== undefined;\n}\n\n/** 是否已是 StaticImageData（自带 src/width/height） */\nexport function isStaticImageData(\n  src: StaticRequire | StaticImageData,\n): src is StaticImageData {\n  return (src as StaticImageData).src !== undefined;\n}\n\n/** 是否是任何一种静态导入对象（`require()` 或 `import` 的结果） */\nexport function isStaticImport(\n  src: string | StaticImport,\n): src is StaticImport {\n  return (\n    !!src &&\n    typeof src === \"object\" &&\n    (isStaticRequire(src as StaticImport) ||\n      isStaticImageData(src as StaticImport))\n  );\n}\n"],"mappings":";AAmBA,SAAgBA,EAAO,GAAgC;CAUrD,OATWC,MAAM,SACRA,IAEL,OAAOA,KAAM,WACR,OAAO,SAASA,CAAC,IAAIA,IAAI,MAE9B,OAAOA,KAAM,YAAY,WAAW,KAAKA,CAAC,IACrC,OAAO,SAASA,GAAG,EAAE,IAEvB;AACT;AAGA,SAAgBC,EACd,GACsB;CACtB,OAAQC,EAAsB,YAAY,KAAA;AAC5C;AAGA,SAAgBC,EACd,GACwB;CACxB,OAAQD,EAAwB,QAAQ,KAAA;AAC1C;AAGA,SAAgBE,EACd,GACqB;CACrB,OACE,CAAC,CAACF,KACF,OAAOA,KAAQ,aACdD,EAAgBC,CAAmB,KAClCC,EAAkBD,CAAmB;AAE3C"}

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

@@ -6,9 +6,14 @@ 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 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;
+		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 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);
+			},
+			get classList() {
+				return o.classList;
+			}
+		}, s), !1, !1), r;
 	})();
 };
 //#endregion

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","_$mergeProps","_tmpl$","InputGroup","local","others","splitProps","props","_el$","spread","mergeProps","\"class\"","clsx"],"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,IAAAY,QAAA;GAAA,OAIWpB,EACL,ylCACAG,EAAMM,KACR;EAAC,EAAA,GACGL,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB"}
+{"version":3,"file":"InputGroup.js","names":["splitProps","InputGroupProps","clsx","InputGroup","props","local","others","_el$","_tmpl$","_$spread","_$mergeProps","class","classList","_$mergeProps","_tmpl$","InputGroup","local","others","splitProps","props","_el$","spread","mergeProps","\"class\"","clsx"],"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      classList={local.classList}\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;EASc,OATdC,EAAAF,GAAAG,EAAA;GAAA,IAAAa,QAAA;IAAA,OAIWrB,EACL,ylCACAG,EAAMM,KACR;GAAC;GAAA,IACDC,YAAS;IAAA,OAAEP,EAAMO;GAAS;EAAA,GACtBN,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB"}

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

@@ -19,6 +19,9 @@ var c = /*#__PURE__*/ a("<div role=group data-slot=input-group-addon>"), l = (n)
 			},
 			get class() {
 				return e(t({ align: l.align }), l.class);
+			},
+			get classList() {
+				return l.classList;
 			}
 		}, u), !1, !1), n;
 	})();

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","mergeProps","_$mergeProps","_$delegateEvents","mergeProps$1","_tmpl$","InputGroupAddon","merged","props","local","others","splitProps","_el$","spread","mergeProps","\"class\"","clsx","inputGroupAddonVariants","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;GACd,AAAKA,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,IAAAkC,QAAA;IAAA,OAChBtC,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"}
+{"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","classList","_$delegateEvents","mergeProps","_$mergeProps","_$delegateEvents","mergeProps$1","_tmpl$","InputGroupAddon","merged","props","local","others","splitProps","_el$","spread","mergeProps","\"class\"","clsx","inputGroupAddonVariants","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      classList={local.classList}\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;EAac,OAbdD,EAAAE,WAOcC,MAAM;GACd,AAAKA,EAAEC,OAAuBE,QAAQ,QAAQ,KAG9CH,EAAEI,cAAcC,eAAeC,cAAc,OAAO,CAAC,EAAEC,MAAM;EAC/D,GAACC,EAAAX,GAAAY,EAAA;GAAA,IAAA,eAAA;IAAA,OARWd,EAAMF;GAAK;GAAA,IAAAmC,QAAA;IAAA,OAChBvC,EAAKH,EAAwB,EAAEO,OAAOE,EAAMF,MAAM,CAAC,GAAGE,EAAMgB,KAAK;GAAC;GAAA,IACzEC,YAAS;IAAA,OAAEjB,EAAMiB;GAAS;EAAA,GAOtBhB,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB;AAAEgB,EAAA,CAAA,OAAA,CAAA"}

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

@@ -27,6 +27,9 @@ var c = (c) => {
 				size: f() ? void 0 : u.size,
 				iconSize: f() ? u.size : void 0
 			}), u.class);
+		},
+		get classList() {
+			return u.classList;
 		}
 	}));
 };

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","mergeProps","_$createComponent","_$mergeProps","mergeProps$1","InputGroupButton","merged","props","local","others","splitProps","iconOnly","createMemo","createComponent","Button","mergeProps","\"class\"","clsx","inputGroupButtonVariants"],"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,IAAA6B,QAAA;GAAA,OACfnC,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"}
+{"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","classList","mergeProps","_$createComponent","_$mergeProps","mergeProps$1","InputGroupButton","merged","props","local","others","splitProps","iconOnly","createMemo","createComponent","Button","mergeProps","\"class\"","clsx","inputGroupButtonVariants"],"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      classList={local.classList}\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,IAAA8B,QAAA;GAAA,OACfpC,EACLC,EAAyB;IACvBM,MAAMI,EAAS,IAAIO,KAAAA,IAAYT,EAAMF;IACrCY,UAAUR,EAAS,IAAIF,EAAMF,OAAOW,KAAAA;GACtC,CAAC,GACDT,EAAMQ,KACR;EAAC;EAAA,IACDG,YAAS;GAAA,OAAEX,EAAMW;EAAS;CAAA,CAAA,CAAA;AAGhC"}

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

@@ -9,6 +9,9 @@ var a = (a) => {
 		"data-slot": "input-group-control",
 		get class() {
 			return e("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", o.class);
+		},
+		get classList() {
+			return o.classList;
 		}
 	}, s));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"InputGroupInput.js","names":["Input","InputGroupInputProps","splitProps","clsx","InputGroupInput","props","local","others","_$createComponent","_$mergeProps","class","_$createComponent","_$mergeProps","InputGroupInput","local","others","splitProps","props","createComponent","Input","mergeProps","\"class\"","clsx"],"sources":["../../../../src/components/input-group/InputGroupInput/InputGroupInput.tsx"],"sourcesContent":["import { Input } from \"~/components/input/Input\";\nimport type { InputGroupInputProps } from \"./InputGroupInput.types\";\nimport { splitProps } from \"solid-js\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupInput = (props: InputGroupInputProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      class={clsx(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;AAKA,IAAaI,KAAmBC,MAAgC;CAC9D,IAAM,CAACC,GAAOC,KAAUL,EAAWG,GAAO,CAAC,SAAS,WAAW,CAAC;CAEhE,OAAAG,EACGR,GAAKS,EAAA;EAAA,aAAA;EAAA,IAAAY,QAAA;GAAA,OAEGlB,EACL,oLACAG,EAAMI,KACR;EAAC;CAAA,GACGH,CAAM,CAAA;AAGhB"}
+{"version":3,"file":"InputGroupInput.js","names":["Input","InputGroupInputProps","splitProps","clsx","InputGroupInput","props","local","others","_$createComponent","_$mergeProps","class","classList","_$createComponent","_$mergeProps","InputGroupInput","local","others","splitProps","props","createComponent","Input","mergeProps","\"class\"","clsx"],"sources":["../../../../src/components/input-group/InputGroupInput/InputGroupInput.tsx"],"sourcesContent":["import { Input } from \"~/components/input/Input\";\nimport type { InputGroupInputProps } from \"./InputGroupInput.types\";\nimport { splitProps } from \"solid-js\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupInput = (props: InputGroupInputProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      class={clsx(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        local.class,\n      )}\n      classList={local.classList}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;AAKA,IAAaI,KAAmBC,MAAgC;CAC9D,IAAM,CAACC,GAAOC,KAAUL,EAAWG,GAAO,CAAC,SAAS,WAAW,CAAC;CAEhE,OAAAG,EACGR,GAAKS,EAAA;EAAA,aAAA;EAAA,IAAAa,QAAA;GAAA,OAEGnB,EACL,oLACAG,EAAMI,KACR;EAAC;EAAA,IACDC,YAAS;GAAA,OAAEL,EAAMK;EAAS;CAAA,GACtBJ,CAAM,CAAA;AAGhB"}

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

@@ -6,9 +6,14 @@ var a = /*#__PURE__*/ r("<span>"), o = (r) => {
 	let [o, s] = i(r, ["class", "classList"]);
 	return (() => {
 		var r = a();
-		return n(r, t({ get class() {
-			return e("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", o.class);
-		} }, s), !1, !1), r;
+		return n(r, t({
+			get class() {
+				return e("flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", o.class);
+			},
+			get classList() {
+				return o.classList;
+			}
+		}, s), !1, !1), r;
 	})();
 };
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"InputGroupText.js","names":["splitProps","InputGroupTextProps","clsx","InputGroupText","props","local","others","_el$","_tmpl$","_$spread","_$mergeProps","class","_$mergeProps","_tmpl$","InputGroupText","local","others","splitProps","props","_el$","spread","mergeProps","\"class\"","clsx"],"sources":["../../../../src/components/input-group/InputGroupText/InputGroupText.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\nimport type { InputGroupTextProps } from \"./InputGroupText.types\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupText = (props: InputGroupTextProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n\n  return (\n    <span\n      class={clsx(\n        \"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;mCAIaG,KAAkBC,MAA+B;CAC5D,IAAM,CAACC,GAAOC,KAAUN,EAAWI,GAAO,CAAC,SAAS,WAAW,CAAC;CAEhE,cAAA;EAAA,IAAAG,IAAAC,EAAA;EAMc,OANdC,EAAAF,GAAAG,EAAA,EAAA,IAAAY,QAAA;GAAA,OAEWpB,EACL,0HACAG,EAAMM,KACR;EAAC,EAAA,GACGL,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB"}
+{"version":3,"file":"InputGroupText.js","names":["splitProps","InputGroupTextProps","clsx","InputGroupText","props","local","others","_el$","_tmpl$","_$spread","_$mergeProps","class","classList","_$mergeProps","_tmpl$","InputGroupText","local","others","splitProps","props","_el$","spread","mergeProps","\"class\"","clsx"],"sources":["../../../../src/components/input-group/InputGroupText/InputGroupText.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\nimport type { InputGroupTextProps } from \"./InputGroupText.types\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupText = (props: InputGroupTextProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n\n  return (\n    <span\n      class={clsx(\n        \"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n        local.class,\n      )}\n      classList={local.classList}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;mCAIaG,KAAkBC,MAA+B;CAC5D,IAAM,CAACC,GAAOC,KAAUN,EAAWI,GAAO,CAAC,SAAS,WAAW,CAAC;CAEhE,cAAA;EAAA,IAAAG,IAAAC,EAAA;EAOc,OAPdC,EAAAF,GAAAG,EAAA;GAAA,IAAAa,QAAA;IAAA,OAEWrB,EACL,0HACAG,EAAMM,KACR;GAAC;GAAA,IACDC,YAAS;IAAA,OAAEP,EAAMO;GAAS;EAAA,GACtBN,CAAM,GAAA,IAAA,EAAA,GAAAC;CAAA,EAAA,CAAA;AAGhB"}

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

@@ -9,6 +9,9 @@ var a = (a) => {
 		"data-slot": "input-group-control",
 		get class() {
 			return e("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", o.class);
+		},
+		get classList() {
+			return o.classList;
 		}
 	}, s));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"InputGroupTextarea.js","names":["splitProps","InputGroupTextareaProps","Textarea","clsx","InputGroupTextarea","props","local","others","_$createComponent","_$mergeProps","class","_$createComponent","_$mergeProps","InputGroupTextarea","local","others","splitProps","props","createComponent","Textarea","mergeProps","\"class\"","clsx"],"sources":["../../../../src/components/input-group/InputGroupTextarea/InputGroupTextarea.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\nimport type { InputGroupTextareaProps } from \"./InputGroupTextarea.types\";\nimport { Textarea } from \"~/components/textarea\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupTextarea = (props: InputGroupTextareaProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      class={clsx(\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;AAKA,IAAaI,KAAsBC,MAAmC;CACpE,IAAM,CAACC,GAAOC,KAAUP,EAAWK,GAAO,CAAC,SAAS,WAAW,CAAC;CAEhE,OAAAG,EACGN,GAAQO,EAAA;EAAA,aAAA;EAAA,IAAAY,QAAA;GAAA,OAEAlB,EACL,qMACAG,EAAMI,KACR;EAAC;CAAA,GACGH,CAAM,CAAA;AAGhB"}
+{"version":3,"file":"InputGroupTextarea.js","names":["splitProps","InputGroupTextareaProps","Textarea","clsx","InputGroupTextarea","props","local","others","_$createComponent","_$mergeProps","class","classList","_$createComponent","_$mergeProps","InputGroupTextarea","local","others","splitProps","props","createComponent","Textarea","mergeProps","\"class\"","clsx"],"sources":["../../../../src/components/input-group/InputGroupTextarea/InputGroupTextarea.tsx"],"sourcesContent":["import { splitProps } from \"solid-js\";\nimport type { InputGroupTextareaProps } from \"./InputGroupTextarea.types\";\nimport { Textarea } from \"~/components/textarea\";\nimport { clsx } from \"~/utils\";\n\nexport const InputGroupTextarea = (props: InputGroupTextareaProps) => {\n  const [local, others] = splitProps(props, [\"class\", \"classList\"]);\n\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      class={clsx(\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        local.class,\n      )}\n      classList={local.classList}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;AAKA,IAAaI,KAAsBC,MAAmC;CACpE,IAAM,CAACC,GAAOC,KAAUP,EAAWK,GAAO,CAAC,SAAS,WAAW,CAAC;CAEhE,OAAAG,EACGN,GAAQO,EAAA;EAAA,aAAA;EAAA,IAAAa,QAAA;GAAA,OAEAnB,EACL,qMACAG,EAAMI,KACR;EAAC;EAAA,IACDC,YAAS;GAAA,OAAEL,EAAMK;EAAS;CAAA,GACtBJ,CAAM,CAAA;AAGhB"}

package/dist/components/item/Item/Item.js

@@ -20,11 +20,20 @@ var s = (s) => {
 			return l.component;
 		},
 		"data-slot": "item",
+		get "data-variant"() {
+			return l.variant;
+		},
+		get "data-size"() {
+			return l.size;
+		},
 		get class() {
 			return e(t({
 				variant: l.variant,
 				size: l.size
 			}), l.class);
+		},
+		get classList() {
+			return l.classList;
 		}
 	}, u));
 };

package/dist/components/item/Item/Item.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.js","names":["mergeProps","splitProps","ValidComponent","clsx","ItemProps","itemVariants","Dynamic","Item","props","T","merged","variant","size","component","const","local","others","_$createComponent","_$mergeProps","class","mergeProps","_$createComponent","_$mergeProps","mergeProps$1","Item","merged","props","local","others","splitProps","createComponent","Dynamic","mergeProps","\"class\"","clsx","itemVariants"],"sources":["../../../../src/components/item/Item/Item.tsx"],"sourcesContent":["import { mergeProps, splitProps, type ValidComponent } from \"solid-js\";\nimport { clsx } from \"~/utils\";\nimport type { ItemProps } from \"./Item.types\";\nimport { itemVariants } from \"./Item.styles\";\nimport { Dynamic } from \"solid-js/web\";\n\nexport const Item = <T extends ValidComponent = \"div\">(props: ItemProps<T>) => {\n  const merged = mergeProps(\n    { variant: \"ghost\", size: \"sm\", component: \"div\" } as const,\n    props,\n  );\n\n  const [local, others] = splitProps(merged, [\n    \"component\",\n    \"variant\",\n    \"size\",\n    \"class\",\n    \"classList\",\n  ]);\n\n  return (\n    <Dynamic\n      component={local.component as ValidComponent}\n      data-slot=\"item\"\n      class={clsx(\n        itemVariants({ variant: local.variant, size: local.size }),\n        local.class,\n      )}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;AAMA,IAAaO,KAA0CC,MAAwB;CAC7E,IAAME,IAASV,EACb;EAAEW,SAAS;EAASC,MAAM;EAAMC,WAAW;CAAM,GACjDL,CACF,GAEM,CAACO,GAAOC,KAAUf,EAAWS,GAAQ;EACzC;EACA;EACA;EACA;EACA;CAAW,CACZ;CAED,OAAAO,EACGX,GAAOY,EAAA;EAAA,IACNL,YAAS;GAAA,OAAEE,EAAMF;EAA2B;EAAA,aAAA;EAAA,IAAAoB,QAAA;GAAA,OAErC9B,EACLE,EAAa;IAAEM,SAASI,EAAMJ;IAASC,MAAMG,EAAMH;GAAK,CAAC,GACzDG,EAAMI,KACR;EAAC;CAAA,GACGH,CAAM,CAAA;AAGhB"}
+{"version":3,"file":"Item.js","names":["mergeProps","splitProps","ValidComponent","clsx","ItemProps","itemVariants","Dynamic","Item","props","T","merged","variant","size","component","const","local","others","_$createComponent","_$mergeProps","data-variant","data-size","class","classList","mergeProps","_$createComponent","_$mergeProps","mergeProps$1","Item","merged","props","local","others","splitProps","createComponent","Dynamic","mergeProps","\"class\"","clsx","itemVariants"],"sources":["../../../../src/components/item/Item/Item.tsx"],"sourcesContent":["import { mergeProps, splitProps, type ValidComponent } from \"solid-js\";\nimport { clsx } from \"~/utils\";\nimport type { ItemProps } from \"./Item.types\";\nimport { itemVariants } from \"./Item.styles\";\nimport { Dynamic } from \"solid-js/web\";\n\nexport const Item = <T extends ValidComponent = \"div\">(props: ItemProps<T>) => {\n  const merged = mergeProps(\n    { variant: \"ghost\", size: \"sm\", component: \"div\" } as const,\n    props,\n  );\n\n  const [local, others] = splitProps(merged, [\n    \"component\",\n    \"variant\",\n    \"size\",\n    \"class\",\n    \"classList\",\n  ]);\n\n  return (\n    <Dynamic\n      component={local.component as ValidComponent}\n      data-slot=\"item\"\n      // 子部件样式用 group-data-[size=…]/item 与 group-data-[variant=…]/item 选择，\n      // 因此这两个状态必须真的写到元素上（否则那几条响应式样式永远不会生效）\n      data-variant={local.variant}\n      data-size={local.size}\n      class={clsx(\n        itemVariants({ variant: local.variant, size: local.size }),\n        local.class,\n      )}\n      classList={local.classList}\n      {...others}\n    />\n  );\n};\n"],"mappings":";;;;;AAMA,IAAaO,KAA0CC,MAAwB;CAC7E,IAAME,IAASV,EACb;EAAEW,SAAS;EAASC,MAAM;EAAMC,WAAW;CAAM,GACjDL,CACF,GAEM,CAACO,GAAOC,KAAUf,EAAWS,GAAQ;EACzC;EACA;EACA;EACA;EACA;CAAW,CACZ;CAED,OAAAO,EACGX,GAAOY,EAAA;EAAA,IACNL,YAAS;GAAA,OAAEE,EAAMF;EAA2B;EAAA,aAAA;EAAA,IAAA,iBAAA;GAAA,OAI9BE,EAAMJ;EAAO;EAAA,IAAA,cAAA;GAAA,OAChBI,EAAMH;EAAI;EAAA,IAAAwB,QAAA;GAAA,OACdjC,EACLE,EAAa;IAAEM,SAASI,EAAMJ;IAASC,MAAMG,EAAMH;GAAK,CAAC,GACzDG,EAAMM,KACR;EAAC;EAAA,IACDC,YAAS;GAAA,OAAEP,EAAMO;EAAS;CAAA,GACtBN,CAAM,CAAA;AAGhB"}

package/dist/components/item/ItemActions/ItemActions.js

@@ -6,9 +6,14 @@ var a = /*#__PURE__*/ r("<p data-slot=item-actions>"), o = (r) => {
 	let [o, s] = i(r, ["class", "classList"]);
 	return (() => {
 		var r = a();
-		return n(r, t({ get class() {
-			return e("flex items-center gap-2", o.class);
-		} }, s), !1, !1), r;
+		return n(r, t({
+			get class() {
+				return e("flex items-center gap-2", o.class);
+			},
+			get classList() {
+				return o.classList;
+			}
+		}, s), !1, !1), r;
 	})();
 };
 //#endregion