@neut/ui 0.0.11 → 0.0.12

package/dist/components/select/SelectItem/useSelectItem.d.ts

@@ -0,0 +1,11 @@
+import { useSelectContext } from '../Select/Select.context';
+import { SelectItemProps } from './SelectItem.types';
+export interface UseSelectItemResult {
+    ctx: ReturnType<typeof useSelectContext>;
+    label: () => string;
+    isSelected: () => boolean;
+    isActive: () => boolean;
+    select: () => void;
+    onMouseEnter: () => void;
+}
+export declare function useSelectItem(props: () => SelectItemProps): UseSelectItemResult;

package/dist/components/select/SelectItem/useSelectItem.js

@@ -0,0 +1,32 @@
+import { useSelectContext as e } from "../Select/Select.context.js";
+import { createMemo as t, onCleanup as n, onMount as r } from "solid-js";
+//#region src/components/select/SelectItem/useSelectItem.ts
+function i(i) {
+	let a = e("SelectItem"), o = () => {
+		let e = i();
+		return e.label ? e.label : typeof e.children == "string" ? e.children : e.value;
+	};
+	return r(() => {
+		let e = i(), t = a.registerItem({
+			value: e.value,
+			label: o(),
+			disabled: e.disabled
+		});
+		n(t);
+	}), {
+		ctx: a,
+		label: o,
+		isSelected: t(() => a.value() === i().value),
+		isActive: t(() => a.activeValue() === i().value),
+		select: () => {
+			i().disabled || a.selectValue(i().value);
+		},
+		onMouseEnter: () => {
+			i().disabled || a.setActiveValue(i().value);
+		}
+	};
+}
+//#endregion
+export { i as useSelectItem };
+
+//# sourceMappingURL=useSelectItem.js.map

package/dist/components/select/SelectItem/useSelectItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectItem.js","names":[],"sources":["../../../../src/components/select/SelectItem/useSelectItem.ts"],"sourcesContent":["import { onMount, onCleanup, createMemo } from \"solid-js\";\nimport { useSelectContext } from \"../Select/Select.context\";\nimport type { SelectItemProps } from \"./SelectItem.types\";\n\nexport interface UseSelectItemResult {\n  ctx: ReturnType<typeof useSelectContext>;\n  label: () => string;\n  isSelected: () => boolean;\n  isActive: () => boolean;\n  select: () => void;\n  onMouseEnter: () => void;\n}\n\nexport function useSelectItem(\n  props: () => SelectItemProps,\n): UseSelectItemResult {\n  const ctx = useSelectContext(\"SelectItem\");\n\n  const label = () => {\n    const p = props();\n    if (p.label) return p.label;\n    return typeof p.children === \"string\" ? p.children : p.value;\n  };\n\n  onMount(() => {\n    const p = props();\n    const unregister = ctx.registerItem({\n      value: p.value,\n      label: label(),\n      disabled: p.disabled,\n    });\n    onCleanup(unregister);\n  });\n\n  const isSelected = createMemo(() => ctx.value() === props().value);\n  const isActive = createMemo(() => ctx.activeValue() === props().value);\n\n  const select = () => {\n    if (props().disabled) return;\n    ctx.selectValue(props().value);\n  };\n\n  const onMouseEnter = () => {\n    if (!props().disabled) ctx.setActiveValue(props().value);\n  };\n\n  return { ctx, label, isSelected, isActive, select, onMouseEnter };\n}\n"],"mappings":";;;AAaA,SAAgB,EACd,GACqB;CACrB,IAAM,IAAM,EAAiB,YAAY,GAEnC,UAAc;EAClB,IAAM,IAAI,EAAM;EAEhB,OADI,EAAE,QAAc,EAAE,QACf,OAAO,EAAE,YAAa,WAAW,EAAE,WAAW,EAAE;CACzD;CAwBA,OAtBA,QAAc;EACZ,IAAM,IAAI,EAAM,GACV,IAAa,EAAI,aAAa;GAClC,OAAO,EAAE;GACT,OAAO,EAAM;GACb,UAAU,EAAE;EACd,CAAC;EACD,EAAU,CAAU;CACtB,CAAC,GAcM;EAAE;EAAK;EAAO,YAZF,QAAiB,EAAI,MAAM,MAAM,EAAM,CAAC,CAAC,KAYvC;EAAY,UAXhB,QAAiB,EAAI,YAAY,MAAM,EAAM,CAAC,CAAC,KAW/B;EAAU,cATtB;GACf,EAAM,CAAC,CAAC,YACZ,EAAI,YAAY,EAAM,CAAC,CAAC,KAAK;EAC/B;EAMmD,oBAJxB;GACzB,AAAK,EAAM,CAAC,CAAC,YAAU,EAAI,eAAe,EAAM,CAAC,CAAC,KAAK;EACzD;CAEgE;AAClE"}

package/dist/components/select/SelectLabel/SelectLabel.d.ts

@@ -0,0 +1,2 @@
+import { LabelProps } from '../../label';
+export declare function SelectLabel(props: LabelProps): import("solid-js").JSX.Element;

package/dist/components/select/SelectLabel/SelectLabel.js

@@ -0,0 +1,13 @@
+import { clsx as e } from "../../../utils/clsx.js";
+import { Label as t } from "../../label/Label.js";
+import { createComponent as n, mergeProps as r } from "solid-js/web";
+//#region src/components/select/SelectLabel/SelectLabel.tsx
+function i(i) {
+	return n(t, r(i, { get class() {
+		return e("px-2 py-1.5 text-xs font-medium text-neutral-500", i.class);
+	} }));
+}
+//#endregion
+export { i as SelectLabel };
+
+//# sourceMappingURL=SelectLabel.js.map

package/dist/components/select/SelectLabel/SelectLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectLabel.js","names":["Label","LabelProps","clsx","SelectLabel","props","_$createComponent","_$mergeProps","class"],"sources":["../../../../src/components/select/SelectLabel/SelectLabel.tsx"],"sourcesContent":["import { Label, type LabelProps } from \"~/components/label\";\nimport { clsx } from \"~/utils\";\n\nexport function SelectLabel(props: LabelProps) {\n  return (\n    <Label\n      {...props}\n      class={clsx(\n        \"px-2 py-1.5 text-xs font-medium text-neutral-500\",\n        props.class,\n      )}\n    />\n  );\n}\n"],"mappings":";;;;AAGA,SAAgBG,EAAYC,GAAmB;CAC7C,OAAAC,EACGL,GAAKM,EACAF,GAAK,EAAA,IAAA,QAAA;EAAA,OACFF,EACL,oDACAE,EAAMG,KACR;CAAC,EAAA,CAAA,CAAA;AAGP"}

package/dist/components/select/SelectLabel/index.d.ts

@@ -0,0 +1 @@
+export { SelectLabel } from './SelectLabel';

package/dist/components/select/SelectSeparator/SelectSeparator.d.ts

@@ -0,0 +1,2 @@
+import { SeparatorProps } from '../../separator';
+export declare function SelectSeparator(props: SeparatorProps): import("solid-js").JSX.Element;

package/dist/components/select/SelectSeparator/SelectSeparator.js

@@ -0,0 +1,13 @@
+import { clsx as e } from "../../../utils/clsx.js";
+import { Separator as t } from "../../separator/Separator.js";
+import { createComponent as n, mergeProps as r } from "solid-js/web";
+//#region src/components/select/SelectSeparator/SelectSeparator.tsx
+function i(i) {
+	return n(t, r(i, { get class() {
+		return e("my-1", i.class);
+	} }));
+}
+//#endregion
+export { i as SelectSeparator };
+
+//# sourceMappingURL=SelectSeparator.js.map

package/dist/components/select/SelectSeparator/SelectSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectSeparator.js","names":["Separator","SeparatorProps","clsx","SelectSeparator","props","_$createComponent","_$mergeProps","class"],"sources":["../../../../src/components/select/SelectSeparator/SelectSeparator.tsx"],"sourcesContent":["import { Separator, type SeparatorProps } from \"~/components/separator\";\nimport { clsx } from \"~/utils\";\n\nexport function SelectSeparator(props: SeparatorProps) {\n  return <Separator {...props} class={clsx(\"my-1\", props.class)} />;\n}\n"],"mappings":";;;;AAGA,SAAgBG,EAAgBC,GAAuB;CACrD,OAAAC,EAAQL,GAASM,EAAKF,GAAK,EAAA,IAAA,QAAA;EAAA,OAASF,EAAK,QAAQE,EAAMG,KAAK;CAAC,EAAA,CAAA,CAAA;AAC/D"}

package/dist/components/select/SelectSeparator/index.d.ts

@@ -0,0 +1 @@
+export { SelectSeparator } from './SelectSeparator';

package/dist/components/select/SelectTrigger/SelectTrigger.d.ts

@@ -0,0 +1,4 @@
+import { ValidComponent } from 'solid-js';
+import { SelectTriggerProps } from './SelectTrigger.types';
+import { Button } from '../../button';
+export declare const SelectTrigger: <T extends ValidComponent = typeof Button<"button">>(props: SelectTriggerProps<T>) => import("solid-js").JSX.Element;

package/dist/components/select/SelectTrigger/SelectTrigger.js

@@ -0,0 +1,50 @@
+import { clsx as e } from "../../../utils/clsx.js";
+import { mergeRefs as t } from "../../../utils/ref.js";
+import { Button as n } from "../../button/Button.js";
+import { useSelectTrigger as r } from "./useSelectTrigger.js";
+import { Dynamic as i, createComponent as a, memo as o, mergeProps as s } from "solid-js/web";
+import { ChevronDown as c } from "lucide-solid";
+//#region src/components/select/SelectTrigger/SelectTrigger.tsx
+var l = (l) => {
+	let { ctx: u, isDisabled: d, attachListeners: f } = r(() => l);
+	return a(i, s(l, {
+		get disabled() {
+			return d();
+		},
+		get icon() {
+			return a(c, {});
+		},
+		iconPosition: "right",
+		get component() {
+			return l.component ?? n;
+		},
+		get variant() {
+			return l.variant ?? "outline";
+		},
+		ref(e) {
+			var n = t(u.setReference, l.ref, f);
+			typeof n == "function" && n(e);
+		},
+		role: "combobox",
+		"aria-haspopup": "listbox",
+		get "aria-expanded"() {
+			return u.open();
+		},
+		get "aria-controls"() {
+			return o(() => !!u.open())() ? u.contentId : void 0;
+		},
+		get "data-state"() {
+			return u.open() ? "open" : "closed";
+		},
+		get "data-disabled"() {
+			return d() ? "" : void 0;
+		},
+		get class() {
+			return e("justify-between", l.class);
+		}
+	}));
+};
+//#endregion
+export { l as SelectTrigger };
+
+//# sourceMappingURL=SelectTrigger.js.map

package/dist/components/select/SelectTrigger/SelectTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectTrigger.js","names":["ValidComponent","Dynamic","useSelectTrigger","SelectTriggerProps","clsx","mergeRefs","Button","ChevronDown","SelectTrigger","props","T","ctx","isDisabled","attachListeners","_$createComponent","_$mergeProps","disabled","icon","iconPosition","component","variant","ref","r$","_ref$","setReference","role","aria-expanded","open","aria-controls","_$memo","contentId","undefined","data-state","data-disabled","class"],"sources":["../../../../src/components/select/SelectTrigger/SelectTrigger.tsx"],"sourcesContent":["import type { ValidComponent } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\nimport { useSelectTrigger } from \"./useSelectTrigger\";\nimport type { SelectTriggerProps } from \"./SelectTrigger.types\";\nimport { clsx, mergeRefs } from \"~/utils\";\nimport { Button } from \"~/components/button\";\nimport { ChevronDown } from \"lucide-solid\";\n\nexport const SelectTrigger = <\n  T extends ValidComponent = typeof Button<\"button\">,\n>(\n  props: SelectTriggerProps<T>,\n) => {\n  const { ctx, isDisabled, attachListeners } = useSelectTrigger(() => props);\n\n  return (\n    <Dynamic\n      {...props}\n      disabled={isDisabled()}\n      icon={<ChevronDown />}\n      iconPosition=\"right\"\n      component={(props.component as ValidComponent) ?? Button<\"button\">}\n      variant={props.variant ?? \"outline\"}\n      ref={mergeRefs(ctx.setReference, props.ref, attachListeners)}\n      role=\"combobox\"\n      aria-haspopup=\"listbox\"\n      aria-expanded={ctx.open()}\n      aria-controls={ctx.open() ? ctx.contentId : undefined}\n      data-state={ctx.open() ? \"open\" : \"closed\"}\n      data-disabled={isDisabled() ? \"\" : undefined}\n      class={clsx(\"justify-between\", props.class)}\n    />\n  );\n};\n"],"mappings":";;;;;;;AAQA,IAAaQ,KAGXC,MACG;CACH,IAAM,EAAEE,QAAKC,eAAYC,uBAAoBX,QAAuBO,CAAK;CAEzE,OAAAK,EACGb,GAAOc,EACFN,GAAK;EAAA,IACTO,WAAQ;GAAA,OAAEJ,EAAW;EAAC;EAAA,IACtBK,OAAI;GAAA,OAAAH,EAAGP,GAAW,CAAA,CAAA;EAAA;EAClBW,cAAY;EAAA,IACZC,YAAS;GAAA,OAAGV,EAAMU,aAAgCb;EAAgB;EAAA,IAClEc,UAAO;GAAA,OAAEX,EAAMW,WAAW;EAAS;EAAAC,IAAAC,GAAA;GAAA,IAAAC,IAC9BlB,EAAUM,EAAIa,cAAcf,EAAMY,KAAKR,CAAe;GAAC,OAAAU,KAAA,cAAAA,EAAAD,CAAA;EAAA;EAC5DG,MAAI;EAAA,iBAAA;EAAA,IAAA,kBAAA;GAAA,OAEWd,EAAIgB,KAAK;EAAC;EAAA,IAAA,kBAAA;GAAA,OACVE,QAAA,CAAA,CAAAlB,EAAIgB,KAAK,CAAC,CAAA,CAAA,IAAGhB,EAAImB,YAAYC,KAAAA;EAAS;EAAA,IAAA,eAAA;GAAA,OACzCpB,EAAIgB,KAAK,IAAI,SAAS;EAAQ;EAAA,IAAA,kBAAA;GAAA,OAC3Bf,EAAW,IAAI,KAAKmB,KAAAA;EAAS;EAAA,IAAA,QAAA;GAAA,OACrC3B,EAAK,mBAAmBK,EAAMyB,KAAK;EAAC;CAAA,CAAA,CAAA;AAGjD"}

package/dist/components/select/SelectTrigger/SelectTrigger.types.d.ts

@@ -0,0 +1,3 @@
+import { ValidComponent } from 'solid-js';
+import { PolymorphicProps } from '../../../types';
+export type SelectTriggerProps<T extends ValidComponent> = PolymorphicProps<T>;

package/dist/components/select/SelectTrigger/index.d.ts

@@ -0,0 +1,4 @@
+export { SelectTrigger } from './SelectTrigger';
+export type { SelectTriggerProps } from './SelectTrigger.types';
+export { useSelectTrigger } from './useSelectTrigger';
+export type { UseSelectTriggerResult } from './useSelectTrigger';

package/dist/components/select/SelectTrigger/useSelectTrigger.d.ts

@@ -0,0 +1,15 @@
+import { ValidComponent } from 'solid-js';
+import { useSelectContext } from '../Select/Select.context';
+import { SelectTriggerProps } from './SelectTrigger.types';
+export interface UseSelectTriggerResult {
+    ctx: ReturnType<typeof useSelectContext>;
+    isDisabled: () => boolean;
+    /**
+     * 把开关下拉相关的原生事件监听器绑定到真正的 DOM 元素上（通过 ref 调用）。
+     * 用 addEventListener 而不是 JSX 的 onXxx prop，是为了不占用这些 prop 名——
+     * 调用方可以在 <SelectTrigger onClick={...}> 上自由传自己的原生事件处理，
+     * 两者是完全独立的两套机制，互不覆盖。
+     */
+    attachListeners: (el: Element) => void;
+}
+export declare function useSelectTrigger<T extends ValidComponent>(props: () => SelectTriggerProps<T>): UseSelectTriggerResult;

package/dist/components/select/SelectTrigger/useSelectTrigger.js

@@ -0,0 +1,37 @@
+import { useSelectContext as e } from "../Select/Select.context.js";
+import { onCleanup as t } from "solid-js";
+//#region src/components/select/SelectTrigger/useSelectTrigger.ts
+function n(n) {
+	let r = e("SelectTrigger"), i = () => r.disabled() || !!n().disabled, a = () => {
+		i() || (r.setActiveValue(r.value() ?? r.items.find((e) => !e.disabled)?.value), r.setOpen(!0));
+	};
+	return {
+		ctx: r,
+		isDisabled: i,
+		attachListeners: (e) => {
+			let n = () => {
+				i() || (r.open() ? r.setOpen(!1) : a());
+			}, o = (e) => {
+				if (i()) return;
+				let t = e;
+				if (!r.open()) {
+					[
+						"ArrowDown",
+						"ArrowUp",
+						"Enter",
+						" "
+					].includes(t.key) && (t.preventDefault(), a());
+					return;
+				}
+				t.key === "Escape" && (t.stopPropagation(), r.close());
+			};
+			e.addEventListener("click", n), e.addEventListener("keydown", o), t(() => {
+				e.removeEventListener("click", n), e.removeEventListener("keydown", o);
+			});
+		}
+	};
+}
+//#endregion
+export { n as useSelectTrigger };
+
+//# sourceMappingURL=useSelectTrigger.js.map

package/dist/components/select/SelectTrigger/useSelectTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectTrigger.js","names":[],"sources":["../../../../src/components/select/SelectTrigger/useSelectTrigger.ts"],"sourcesContent":["import { onCleanup, type ValidComponent } from \"solid-js\";\nimport { useSelectContext } from \"../Select/Select.context\";\nimport type { SelectTriggerProps } from \"./SelectTrigger.types\";\n\nexport interface UseSelectTriggerResult {\n  ctx: ReturnType<typeof useSelectContext>;\n  isDisabled: () => boolean;\n  /**\n   * 把开关下拉相关的原生事件监听器绑定到真正的 DOM 元素上（通过 ref 调用）。\n   * 用 addEventListener 而不是 JSX 的 onXxx prop，是为了不占用这些 prop 名——\n   * 调用方可以在 <SelectTrigger onClick={...}> 上自由传自己的原生事件处理，\n   * 两者是完全独立的两套机制，互不覆盖。\n   */\n  attachListeners: (el: Element) => void;\n}\n\nexport function useSelectTrigger<T extends ValidComponent>(\n  props: () => SelectTriggerProps<T>,\n): UseSelectTriggerResult {\n  const ctx = useSelectContext(\"SelectTrigger\");\n\n  const isDisabled = () => ctx.disabled() || !!props().disabled;\n\n  const openAndHighlightSelected = () => {\n    if (isDisabled()) return;\n    ctx.setActiveValue(\n      ctx.value() ?? ctx.items.find((it) => !it.disabled)?.value,\n    );\n    ctx.setOpen(true);\n  };\n\n  const attachListeners = (el: Element) => {\n    const onClick = () => {\n      if (isDisabled()) return;\n      if (ctx.open()) ctx.setOpen(false);\n      else openAndHighlightSelected();\n    };\n\n    const onKeyDown = (e: Event) => {\n      if (isDisabled()) return;\n      const keyboardEvent = e as KeyboardEvent;\n\n      if (!ctx.open()) {\n        if (\n          [\"ArrowDown\", \"ArrowUp\", \"Enter\", \" \"].includes(keyboardEvent.key)\n        ) {\n          keyboardEvent.preventDefault();\n          openAndHighlightSelected();\n        }\n        return;\n      }\n\n      if (keyboardEvent.key === \"Escape\") {\n        keyboardEvent.stopPropagation();\n        ctx.close();\n      }\n    };\n\n    el.addEventListener(\"click\", onClick);\n    el.addEventListener(\"keydown\", onKeyDown);\n\n    onCleanup(() => {\n      el.removeEventListener(\"click\", onClick);\n      el.removeEventListener(\"keydown\", onKeyDown);\n    });\n  };\n\n  return { ctx, isDisabled, attachListeners };\n}\n"],"mappings":";;;AAgBA,SAAgB,EACd,GACwB;CACxB,IAAM,IAAM,EAAiB,eAAe,GAEtC,UAAmB,EAAI,SAAS,KAAK,CAAC,CAAC,EAAM,CAAC,CAAC,UAE/C,UAAiC;EACjC,EAAW,MACf,EAAI,eACF,EAAI,MAAM,KAAK,EAAI,MAAM,MAAM,MAAO,CAAC,EAAG,QAAQ,CAAC,EAAE,KACvD,GACA,EAAI,QAAQ,EAAI;CAClB;CAsCA,OAAO;EAAE;EAAK;EAAY,kBApCD,MAAgB;GACvC,IAAM,UAAgB;IAChB,EAAW,MACX,EAAI,KAAK,IAAG,EAAI,QAAQ,EAAK,IAC5B,EAAyB;GAChC,GAEM,KAAa,MAAa;IAC9B,IAAI,EAAW,GAAG;IAClB,IAAM,IAAgB;IAEtB,IAAI,CAAC,EAAI,KAAK,GAAG;KACf,AACE;MAAC;MAAa;MAAW;MAAS;KAAG,CAAC,CAAC,SAAS,EAAc,GAAG,MAEjE,EAAc,eAAe,GAC7B,EAAyB;KAE3B;IACF;IAEA,AAAI,EAAc,QAAQ,aACxB,EAAc,gBAAgB,GAC9B,EAAI,MAAM;GAEd;GAKA,AAHA,EAAG,iBAAiB,SAAS,CAAO,GACpC,EAAG,iBAAiB,WAAW,CAAS,GAExC,QAAgB;IAEd,AADA,EAAG,oBAAoB,SAAS,CAAO,GACvC,EAAG,oBAAoB,WAAW,CAAS;GAC7C,CAAC;EACH;CAE0C;AAC5C"}

package/dist/components/select/SelectValue/SelectValue.d.ts

@@ -0,0 +1,2 @@
+import { SelectValueProps } from './SelectValue.types';
+export declare function SelectValue(props: SelectValueProps): import("solid-js").JSX.Element;

package/dist/components/select/SelectValue/SelectValue.js

@@ -0,0 +1,20 @@
+import { clsx as e } from "../../../utils/clsx.js";
+import { useSelectContext as t } from "../Select/Select.context.js";
+import { className as n, effect as r, insert as i, template as a } from "solid-js/web";
+import { createMemo as o } from "solid-js";
+//#region src/components/select/SelectValue/SelectValue.tsx
+var s = /*#__PURE__*/ a("<span>");
+function c(a) {
+	let c = t("SelectValue"), l = o(() => {
+		let e = c.value();
+		if (e !== void 0) return c.items.find((t) => t.value === e)?.label ?? e;
+	});
+	return (() => {
+		var t = s();
+		return i(t, () => l() ?? a.placeholder ?? ""), r(() => n(t, e(!l() && "text-neutral-500", a.class))), t;
+	})();
+}
+//#endregion
+export { c as SelectValue };
+
+//# sourceMappingURL=SelectValue.js.map

package/dist/components/select/SelectValue/SelectValue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectValue.js","names":["createMemo","useSelectContext","SelectValueProps","clsx","SelectValue","props","ctx","label","v","value","undefined","items","find","it","_el$","_tmpl$","_$insert","placeholder","_$effect","_$className","class"],"sources":["../../../../src/components/select/SelectValue/SelectValue.tsx"],"sourcesContent":["import { createMemo } from \"solid-js\";\nimport { useSelectContext } from \"../Select/Select.context\";\nimport type { SelectValueProps } from \"./SelectValue.types\";\nimport { clsx } from \"~/utils\";\n\nexport function SelectValue(props: SelectValueProps) {\n  const ctx = useSelectContext(\"SelectValue\");\n\n  const label = createMemo(() => {\n    const v = ctx.value();\n    if (v === undefined) return undefined;\n    return ctx.items.find((it) => it.value === v)?.label ?? v;\n  });\n\n  return (\n    <span class={clsx(!label() && \"text-neutral-500\", props.class)}>\n      {label() ?? props.placeholder ?? \"\"}\n    </span>\n  );\n}\n"],"mappings":";;;;;;AAKA,SAAgBI,EAAYC,GAAyB;CACnD,IAAMC,IAAML,EAAiB,aAAa,GAEpCM,IAAQP,QAAiB;EAC7B,IAAMQ,IAAIF,EAAIG,MAAM;EAChBD,UAAME,KAAAA,GACV,OAAOJ,EAAIK,MAAMC,MAAMC,MAAOA,EAAGJ,UAAUD,CAAC,CAAC,EAAED,SAASC;CAC1D,CAAC;CAED,cAAA;EAAA,IAAAM,IAAAC,EAAA;EACgE,OADhEC,EAAAF,SAEKP,EAAM,KAAKF,EAAMY,eAAe,EAAE,GAAAC,QAAAC,EAAAL,GADxBX,EAAK,CAACI,EAAM,KAAK,oBAAoBF,EAAMe,KAAK,CAAC,CAAA,GAAAN;CAAA,EAAA,CAAA;AAIlE"}

package/dist/components/select/SelectValue/SelectValue.types.d.ts

@@ -0,0 +1,4 @@
+export interface SelectValueProps {
+    placeholder?: string;
+    class?: string;
+}

package/dist/components/select/SelectValue/index.d.ts

@@ -0,0 +1,2 @@
+export { SelectValue } from './SelectValue';
+export type { SelectValueProps } from './SelectValue.types';

package/dist/components/select/index.d.ts

@@ -0,0 +1,13 @@
+export { Select } from './Select';
+export type { SelectProps, SelectContextValue, SelectItemMeta } from './Select';
+export { SelectTrigger } from './SelectTrigger';
+export type { SelectTriggerProps } from './SelectTrigger';
+export { SelectValue } from './SelectValue';
+export type { SelectValueProps } from './SelectValue';
+export { SelectContent } from './SelectContent';
+export type { SelectContentProps } from './SelectContent';
+export { SelectItem } from './SelectItem';
+export type { SelectItemProps } from './SelectItem';
+export { SelectGroup } from './SelectGroup';
+export { SelectLabel } from './SelectLabel';
+export { SelectSeparator } from './SelectSeparator';

package/dist/components/select/index.js

@@ -0,0 +1,9 @@
+import { Select as e } from "./Select/Select.js";
+import { SelectTrigger as t } from "./SelectTrigger/SelectTrigger.js";
+import { SelectValue as n } from "./SelectValue/SelectValue.js";
+import { SelectContent as r } from "./SelectContent/SelectContent.js";
+import { SelectItem as i } from "./SelectItem/SelectItem.js";
+import { SelectGroup as a } from "./SelectGroup/SelectGroup.js";
+import { SelectLabel as o } from "./SelectLabel/SelectLabel.js";
+import { SelectSeparator as s } from "./SelectSeparator/SelectSeparator.js";
+export { e as Select, r as SelectContent, a as SelectGroup, i as SelectItem, o as SelectLabel, s as SelectSeparator, t as SelectTrigger, n as SelectValue };

package/dist/components/tooltip/TooltipContent/TooltipContent.js

@@ -1,16 +1,14 @@
-import { getAlignment as e, getSide as t } from "../../../lib/positioner/core/placement.js";
-import { getTransformOrigin as n } from "./TooltipContent.utils.js";
-import { useTooltipContent as r } from "./useTooltipContent.js";
-import { TooltipContentContext as i } from "./TooltipContent.context.js";
-import { Portal as a, createComponent as o, effect as s, insert as c, mergeProps as l, setAttribute as u, spread as d, style as f, template as p, use as m } from "solid-js/web";
-import { Show as h, onCleanup as g, splitProps as _ } from "solid-js";
+import { clsx as e } from "../../../utils/clsx.js";
+import { getAlignment as t, getSide as n } from "../../../lib/positioner/core/placement.js";
+import { getTransformOrigin as r } from "./TooltipContent.utils.js";
+import { useTooltipContent as i } from "./useTooltipContent.js";
+import { TooltipContentContext as a } from "./TooltipContent.context.js";
+import { Portal as o, createComponent as s, effect as c, insert as l, mergeProps as u, setAttribute as d, spread as f, style as p, template as m, use as h } from "solid-js/web";
+import { Show as g, onCleanup as _, splitProps as v } from "solid-js";
 //#region src/components/tooltip/TooltipContent/TooltipContent.tsx
-var v = /*#__PURE__*/ p("<div style=z-index:1000><div><div role=tooltip>");
-function y(...e) {
-	return e.filter(Boolean).join(" ");
-}
-function b(p) {
-	let { ctx: b, pos: x, mounted: S, animationState: C, setArrowElement: w, setContentElement: T, slideStyle: E } = r(() => p), [D, O] = _(p, [
+var y = /*#__PURE__*/ m("<div style=z-index:1000><div><div role=tooltip>");
+function b(m) {
+	let { ctx: b, pos: x, mounted: S, animationState: C, setArrowElement: w, setContentElement: T, slideStyle: E } = i(() => m), [D, O] = v(m, [
 		"side",
 		"align",
 		"sideOffset",
@@ -20,16 +18,16 @@ function b(p) {
 		"style",
 		"children"
 	]);
-	return o(h, {
+	return s(g, {
 		get when() {
 			return S();
 		},
 		get children() {
-			return o(a, { get children() {
-				var r = v(), a = r.firstChild, p = a.firstChild;
-				return m((e) => {
-					b.setFloating(e), g(() => b.setFloating(void 0));
-				}, r), m(T, p), d(p, l({
+			return s(o, { get children() {
+				var i = y(), o = i.firstChild, m = o.firstChild;
+				return h((e) => {
+					b.setFloating(e), _(() => b.setFloating(void 0));
+				}, i), h(T, m), f(m, u({
 					get id() {
 						return b.contentId;
 					},
@@ -37,10 +35,10 @@ function b(p) {
 						return C();
 					},
 					get "data-side"() {
-						return t(x.placement());
+						return n(x.placement());
 					},
 					get "data-align"() {
-						return e(x.placement()) ?? "center";
+						return t(x.placement()) ?? "center";
 					},
 					get onMouseEnter() {
 						return b.keepOpen;
@@ -50,14 +48,14 @@ function b(p) {
 					},
 					get style() {
 						return {
-							"transform-origin": n(x.placement()),
+							"transform-origin": r(x.placement()),
 							...typeof D.style == "object" ? D.style : void 0
 						};
 					},
 					get class() {
-						return y("max-w-xs rounded-md px-3 py-1.5 text-xs leading-relaxed shadow-md", "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", "data-[side=top]:slide-in-from-bottom-2", "data-[side=bottom]:slide-in-from-top-2", "data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2", "bg-foreground text-background", D.class);
+						return e("max-w-xs rounded-md px-3 py-1.5 text-xs leading-relaxed shadow-md", "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95", "data-[side=top]:slide-in-from-bottom-2", "data-[side=bottom]:slide-in-from-top-2", "data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2", "bg-foreground text-background", D.class);
 					}
-				}, O), !1, !0), c(p, o(i.Provider, {
+				}, O), !1, !0), l(m, s(a.Provider, {
 					get value() {
 						return {
 							middlewareData: x.middlewareData,
@@ -69,17 +67,17 @@ function b(p) {
 					get children() {
 						return D.children;
 					}
-				})), s((e) => {
+				})), c((e) => {
 					var t = x.placement(), n = {
 						...x.floatingStyles(),
 						opacity: +!!x.isPositioned()
-					}, i = E();
-					return t !== e.e && u(r, "data-placement", e.e = t), e.t = f(r, n, e.t), e.a = f(a, i, e.a), e;
+					}, r = E();
+					return t !== e.e && d(i, "data-placement", e.e = t), e.t = p(i, n, e.t), e.a = p(o, r, e.a), e;
 				}, {
 					e: void 0,
 					t: void 0,
 					a: void 0
-				}), r;
+				}), i;
 			} });
 		}
 	});

package/dist/components/tooltip/TooltipContent/TooltipContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipContent.js","names":["Show","onCleanup","splitProps","Portal","useTooltipContent","TooltipContentContext","getTransformOrigin","getSide","getAlignment","TooltipContentProps","cn","classes","Array","filter","Boolean","join","TooltipContent","props","ctx","pos","mounted","animationState","setArrowElement","setContentElement","slideStyle","local","rest","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","_$use","el","setFloating","undefined","_$spread","_$mergeProps","id","contentId","data-state","data-side","placement","data-align","onMouseEnter","keepOpen","onMouseLeave","requestClose","style","class","_$insert","Provider","value","middlewareData","_$effect","_p$","_v$","_v$2","floatingStyles","opacity","isPositioned","_v$3","e","_$setAttribute","t","_$style","a"],"sources":["../../../../src/components/tooltip/TooltipContent/TooltipContent.tsx"],"sourcesContent":["import { Show, onCleanup, splitProps } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport { useTooltipContent } from \"./useTooltipContent\";\nimport { TooltipContentContext } from \"./TooltipContent.context\";\nimport { getTransformOrigin } from \"./TooltipContent.utils\";\nimport { getSide, getAlignment } from \"~/lib\";\nimport type { TooltipContentProps } from \"./TooltipContent.types\";\n\nfunction cn(...classes: Array<string | false | undefined | null>): string {\n  return classes.filter(Boolean).join(\" \");\n}\n\n/**\n * Tooltip 的浮层内容。挂 Portal 到 body，用 position:fixed 定位。\n *\n * 内容本身默认是可以 hover 的（不是 pointer-events:none）：鼠标移进 content\n * 会取消待执行的关闭计时器（ctx.keepOpen），移出才真正走 closeDelay 关闭——\n * 这样用户可以把鼠标从 trigger 移动到 tooltip 上选中里面的文字，不会因为\n * \"离开 trigger 就关闭\" 而选不到。如果你的 tooltip 内容很简单、不需要这个特性，\n * 可以自己在外面包一层设置 pointer-events: none。\n */\nexport function TooltipContent(props: TooltipContentProps) {\n  const {\n    ctx,\n    pos,\n    mounted,\n    animationState,\n    setArrowElement,\n    setContentElement,\n    slideStyle,\n  } = useTooltipContent(() => props);\n\n  // 只摘出内部要单独处理的几个字段，剩下的（style、data-*、onXxx 等任意原生\n  // prop）原样透传给内层元素——和 TooltipTrigger 是同一套约定。\n  const [local, rest] = splitProps(props, [\n    \"side\",\n    \"align\",\n    \"sideOffset\",\n    \"alignOffset\",\n    \"collisionPadding\",\n    \"class\",\n    \"style\",\n    \"children\",\n  ]);\n\n  return (\n    <Show when={mounted()}>\n      <Portal>\n        {/*\n          外层：只负责定位（position:fixed 来自 floatingStyles），不设 overflow，\n          也不参与任何动画——它的 transform 已经被占用来做定位（translate(x,y)），\n          如果别的动画也要控制 transform 会互相冲突，所以动画都放在下面两层。\n        */}\n        <div\n          ref={(el) => {\n            ctx.setFloating(el);\n            // Solid 的 ref 回调只在元素创建时触发一次，元素被移除时不会自动\n            // 再调用一次传 undefined（这是 React 的约定，不是 Solid 的）。\n            // 不手动清空的话，ctx.floating() 会一直指向一个已经从 DOM 里\n            // 摘除的\"僵尸节点\"，直到下次重新打开——期间如果被别处读取\n            // （比如 TooltipGroup 抢占时读取矩形），getBoundingClientRect()\n            // 对一个 detached 元素规范规定就是返回全 0 的矩形，会造成\n            // \"滑动效果从左上角(0,0)滑入\"这种明显错误的观感。\n            onCleanup(() => ctx.setFloating(undefined));\n          }}\n          data-placement={pos.placement()}\n          style={{\n            ...pos.floatingStyles(),\n            \"z-index\": 1000,\n            opacity: pos.isPositioned() ? 1 : 0,\n          }}\n        >\n          {/*\n            滑动层：命中 <TooltipGroup> 抢占时，用来把整个 tooltip（内容+箭头）\n            从旧 tooltip 的位置平移过来（FLIP 技术，细节见 useTooltipContent 里\n            的 slideOffset 计算）。平时 slideStyle() 是空对象，这一层形同不存在。\n\n            这一层必须夹在\"定位层\"和\"样式/动画层\"之间、而不是随便找个地方加：\n            它自己也会用到 transform（滑动过程中），如果和定位层共用一个元素会\n            跟 translate(x,y) 冲突（原因同上）；但它又不能在样式层（overflow:auto\n            那层）的下面/内部，因为箭头的 position:absolute 是故意跳过样式层、\n            以\"最近的已定位祖先\"为基准的（这是修复箭头戳出来触发滚动条那次的\n            设计），如果滑动层的 transform 出现在样式层内部，箭头的定位基准就会\n            变成滑动层而不是外层——效果上依然正确（滑动层的盒子和外层几乎重合），\n            但为了让\"定位基准\"这件事始终清晰、不产生\"技术上是谁、视觉上又是谁\"\n            的心智负担，把滑动层放在外层和样式层之间、维持这条链路的清晰顺序。\n          */}\n          <div style={slideStyle()}>\n            {/*\n              内层：真正的视觉样式 + 进出场动画。\n              data-state 跟着 animationState 走（不是 isVisible/mounted）：\n              - isVisible 变 false 的瞬间，animationState 立刻跟着变 closed，\n                触发退场动画的 class；\n              - isVisible 变 true 时，animationState 会晚一帧才变 open，\n                留出时间让箭头（TooltipArrow）完成挂载、注册给 arrow middleware、\n                算出正确的位置偏移（细节见 useTooltipContent 里的注释）；\n              - mounted 会比 animationState 变 closed 更晚才变 false（见下面的\n                Presence 逻辑），留出时间让退场动画播完。\n\n              data-[state=open]/data-[state=closed] 这套 class 依赖 tailwindcss-animate\n              插件提供的 animate-in/animate-out/fade-in-0/zoom-in-95 等工具类——\n              如果你的项目还没装，`npm install tailwindcss-animate` 并在 tailwind\n              config 里加上这个 plugin 即可；不想装的话，把这几个 data-[state=...]\n              class 换成你自己写的 @keyframes + 对应 class 也一样能工作，\n              Presence 逻辑（mounted 延迟卸载）不依赖具体用了哪套动画实现。\n\n              箭头（TooltipArrow）不依赖\"作为这个元素的子节点、被动继承这里的\n              transform/opacity 动画\"这种隐式机制——它自己也从 context 里读到\n              同一个 animationState，独立播放一份自己的入场/退场动画，两者由\n              同一个信号同步触发。\n\n              data-side/data-align 是从最终生效的 placement 拆出来的，驱动上面\n              这几条方向感知的 slide-in class，也顺带给 transform-origin 提供了\n              依据——缩放动画的锚点会落在\"贴近 trigger 的那条边\"上（细节见\n              TooltipContent.utils.ts 里的 getTransformOrigin），而不是默认的\n              几何中心，这样整个入场效果才会像是\"从 trigger 那里长出来\"，\n              贴近 shadcn 的实际观感。\n\n              特意没有 overflow:auto / max-height，tooltip 不支持内容超长时滚动——\n              宽度上限靠下面静态的 max-w-xs class 兜底，让文字自然换行；高度完全\n              不做限制。这不只是为了贴近 shadcn/Radix 的行为（它们的 tooltip 也不\n              允许滚动），还避免了一个真实踩过的坑：overflow:auto 配合这里的\n              zoom-in-95 动画（会给这个元素加一个非 none 的 transform，CSS 规范\n              规定这会让它变成子元素新的包含块）曾经导致箭头戳出边缘的那部分被\n              误判成\"可滚动溢出\"，表现为打开瞬间闪一下滚动条、箭头跟着被遮住，\n              动画播完滚动条消失、箭头才重新出现。去掉滚动能力后这个耦合从根上\n              就不存在了。\n            */}\n            <div\n              ref={setContentElement}\n              id={ctx.contentId}\n              role=\"tooltip\"\n              data-state={animationState()}\n              data-side={getSide(pos.placement())}\n              data-align={getAlignment(pos.placement()) ?? \"center\"}\n              onMouseEnter={ctx.keepOpen}\n              onMouseLeave={ctx.requestClose}\n              style={{\n                \"transform-origin\": getTransformOrigin(pos.placement()),\n                ...(typeof local.style === \"object\" ? local.style : undefined),\n              }}\n              class={cn(\n                \"max-w-xs rounded-md px-3 py-1.5 text-xs leading-relaxed shadow-md\",\n                \"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\",\n                \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\",\n                // 方向感知的滑入：不只是原地淡入缩放，还从\"贴近 trigger 的反方向\"\n                // 轻微位移过来——比如 placement 是 top（content 在 trigger 上方），\n                // 就从下方 8px（slide-in-from-bottom-2）滑上来，视觉上更像是从\n                // trigger 那里\"冒出来\"，而不是凭空原地出现。只在打开时生效，\n                // 贴近 shadcn 的实际行为（它们的退场动画没有对应的滑出位移）。\n                \"data-[side=top]:slide-in-from-bottom-2\",\n                \"data-[side=bottom]:slide-in-from-top-2\",\n                \"data-[side=left]:slide-in-from-right-2\",\n                \"data-[side=right]:slide-in-from-left-2\",\n                \"bg-foreground text-background\",\n                local.class,\n              )}\n              {...rest}\n            >\n              <TooltipContentContext.Provider\n                value={{\n                  middlewareData: pos.middlewareData,\n                  placement: pos.placement,\n                  setArrowElement,\n                  animationState,\n                }}\n              >\n                {local.children}\n              </TooltipContentContext.Provider>\n            </div>\n          </div>\n        </div>\n      </Portal>\n    </Show>\n  );\n}\n"],"mappings":";;;;;;;;AAQA,SAASU,EAAG,GAAGC,GAA2D;CACxE,OAAOA,EAAQE,OAAOC,OAAO,CAAC,CAACC,KAAK,GAAG;AACzC;AAWA,SAAgBC,EAAeC,GAA4B;CACzD,IAAM,EACJC,QACAC,QACAC,YACAC,mBACAC,oBACAC,sBACAC,kBACEpB,QAAwBa,CAAK,GAI3B,CAACQ,GAAOC,KAAQxB,EAAWe,GAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAU,CACX;CAED,OAAAU,EACG3B,GAAI;EAAA,IAAC4B,OAAI;GAAA,OAAER,EAAQ;EAAC;EAAA,IAAAS,WAAA;GAAA,OAAAF,EAClBxB,GAAM,EAAA,IAAA0B,WAAA;IAAA,IAAAC,IAAAC,EAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC;IAwCqB,OAxCrBE,GAOGC,MAAO;KASXnC,AARAiB,EAAImB,YAAYD,CAAE,GAQlBnC,QAAgBiB,EAAImB,YAAYC,KAAAA,CAAS,CAAC;IAC5C,GAACR,CAAA,GAAAK,EAiEQZ,GAAiBW,CAAA,GAAAK,EAAAL,GAAAM,EAAA;KAAA,IACtBC,KAAE;MAAA,OAAEvB,EAAIwB;KAAS;KAAA,IAAA,eAAA;MAAA,OAELrB,EAAe;KAAC;KAAA,IAAA,cAAA;MAAA,OACjBd,EAAQY,EAAI0B,UAAU,CAAC;KAAC;KAAA,IAAA,eAAA;MAAA,OACvBrC,EAAaW,EAAI0B,UAAU,CAAC,KAAK;KAAQ;KAAA,IACrDE,eAAY;MAAA,OAAE7B,EAAI8B;KAAQ;KAAA,IAC1BC,eAAY;MAAA,OAAE/B,EAAIgC;KAAY;KAAA,IAC9BC,QAAK;MAAA,OAAE;OACL,oBAAoB7C,EAAmBa,EAAI0B,UAAU,CAAC;OACtD,GAAI,OAAOpB,EAAM0B,SAAU,WAAW1B,EAAM0B,QAAQb,KAAAA;MACtD;KAAC;KAAA,IAAA,QAAA;MAAA,OACM5B,EACL,qEACA,yFACA,kGAMA,0CACA,0CACA,0CACA,0CACA,iCACAe,EAAM2B,KACR;KAAC;IAAA,GACG1B,CAAI,GAAA,IAAA,EAAA,GAAA2B,EAAAnB,GAAAP,EAEPtB,EAAsBiD,UAAQ;KAAA,IAC7BC,QAAK;MAAA,OAAE;OACLC,gBAAgBrC,EAAIqC;OACpBX,WAAW1B,EAAI0B;OACfvB;OACAD;MACF;KAAC;KAAA,IAAAQ,WAAA;MAAA,OAEAJ,EAAMI;KAAQ;IAAA,CAAA,CAAA,GAAA4B,GAAAC,MAAA;KAAA,IAAAC,IAtGLxC,EAAI0B,UAAU,GAACe,IACxB;MACL,GAAGzC,EAAI0C,eAAe;MAEtBC,SAAS3C,KAAI4C,aAAa;KAC5B,GAACC,IAiBWxC,EAAW;KAAC,OAAAmC,MAAAD,EAAAO,KAAAC,EAAApC,GAAA,kBAAA4B,EAAAO,IAAAN,CAAA,GAAAD,EAAAS,IAAAC,EAAAtC,GAAA8B,GAAAF,EAAAS,CAAA,GAAAT,EAAAW,IAAAD,EAAApC,GAAAgC,GAAAN,EAAAW,CAAA,GAAAX;IAAA,GAAA;KAAAO,GAAA3B,KAAAA;KAAA6B,GAAA7B,KAAAA;KAAA+B,GAAA/B,KAAAA;IAAA,CAAA,GAAAR;GAAA,EAAA,CAAA;EAAA;CAAA,CAAA;AAwFlC"}
+{"version":3,"file":"TooltipContent.js","names":["Show","onCleanup","splitProps","Portal","useTooltipContent","TooltipContentContext","getTransformOrigin","getSide","getAlignment","TooltipContentProps","clsx","TooltipContent","props","ctx","pos","mounted","animationState","setArrowElement","setContentElement","slideStyle","local","rest","_$createComponent","when","children","_el$","_tmpl$","_el$2","firstChild","_el$3","_$use","el","setFloating","undefined","_$spread","_$mergeProps","id","contentId","data-state","data-side","placement","data-align","onMouseEnter","keepOpen","onMouseLeave","requestClose","style","class","_$insert","Provider","value","middlewareData","_$effect","_p$","_v$","_v$2","floatingStyles","opacity","isPositioned","_v$3","e","_$setAttribute","t","_$style","a"],"sources":["../../../../src/components/tooltip/TooltipContent/TooltipContent.tsx"],"sourcesContent":["import { Show, onCleanup, splitProps } from \"solid-js\";\nimport { Portal } from \"solid-js/web\";\nimport { useTooltipContent } from \"./useTooltipContent\";\nimport { TooltipContentContext } from \"./TooltipContent.context\";\nimport { getTransformOrigin } from \"./TooltipContent.utils\";\nimport { getSide, getAlignment } from \"~/lib\";\nimport type { TooltipContentProps } from \"./TooltipContent.types\";\nimport { clsx } from \"~/utils\";\n\n/**\n * Tooltip 的浮层内容。挂 Portal 到 body，用 position:fixed 定位。\n *\n * 内容本身默认是可以 hover 的（不是 pointer-events:none）：鼠标移进 content\n * 会取消待执行的关闭计时器（ctx.keepOpen），移出才真正走 closeDelay 关闭——\n * 这样用户可以把鼠标从 trigger 移动到 tooltip 上选中里面的文字，不会因为\n * \"离开 trigger 就关闭\" 而选不到。如果你的 tooltip 内容很简单、不需要这个特性，\n * 可以自己在外面包一层设置 pointer-events: none。\n */\nexport function TooltipContent(props: TooltipContentProps) {\n  const {\n    ctx,\n    pos,\n    mounted,\n    animationState,\n    setArrowElement,\n    setContentElement,\n    slideStyle,\n  } = useTooltipContent(() => props);\n\n  // 只摘出内部要单独处理的几个字段，剩下的（style、data-*、onXxx 等任意原生\n  // prop）原样透传给内层元素——和 TooltipTrigger 是同一套约定。\n  const [local, rest] = splitProps(props, [\n    \"side\",\n    \"align\",\n    \"sideOffset\",\n    \"alignOffset\",\n    \"collisionPadding\",\n    \"class\",\n    \"style\",\n    \"children\",\n  ]);\n\n  return (\n    <Show when={mounted()}>\n      <Portal>\n        {/*\n          外层：只负责定位（position:fixed 来自 floatingStyles），不设 overflow，\n          也不参与任何动画——它的 transform 已经被占用来做定位（translate(x,y)），\n          如果别的动画也要控制 transform 会互相冲突，所以动画都放在下面两层。\n        */}\n        <div\n          ref={(el) => {\n            ctx.setFloating(el);\n            // Solid 的 ref 回调只在元素创建时触发一次，元素被移除时不会自动\n            // 再调用一次传 undefined（这是 React 的约定，不是 Solid 的）。\n            // 不手动清空的话，ctx.floating() 会一直指向一个已经从 DOM 里\n            // 摘除的\"僵尸节点\"，直到下次重新打开——期间如果被别处读取\n            // （比如 TooltipGroup 抢占时读取矩形），getBoundingClientRect()\n            // 对一个 detached 元素规范规定就是返回全 0 的矩形，会造成\n            // \"滑动效果从左上角(0,0)滑入\"这种明显错误的观感。\n            onCleanup(() => ctx.setFloating(undefined));\n          }}\n          data-placement={pos.placement()}\n          style={{\n            ...pos.floatingStyles(),\n            \"z-index\": 1000,\n            opacity: pos.isPositioned() ? 1 : 0,\n          }}\n        >\n          {/*\n            滑动层：命中 <TooltipGroup> 抢占时，用来把整个 tooltip（内容+箭头）\n            从旧 tooltip 的位置平移过来（FLIP 技术，细节见 useTooltipContent 里\n            的 slideOffset 计算）。平时 slideStyle() 是空对象，这一层形同不存在。\n\n            这一层必须夹在\"定位层\"和\"样式/动画层\"之间、而不是随便找个地方加：\n            它自己也会用到 transform（滑动过程中），如果和定位层共用一个元素会\n            跟 translate(x,y) 冲突（原因同上）；但它又不能在样式层（overflow:auto\n            那层）的下面/内部，因为箭头的 position:absolute 是故意跳过样式层、\n            以\"最近的已定位祖先\"为基准的（这是修复箭头戳出来触发滚动条那次的\n            设计），如果滑动层的 transform 出现在样式层内部，箭头的定位基准就会\n            变成滑动层而不是外层——效果上依然正确（滑动层的盒子和外层几乎重合），\n            但为了让\"定位基准\"这件事始终清晰、不产生\"技术上是谁、视觉上又是谁\"\n            的心智负担，把滑动层放在外层和样式层之间、维持这条链路的清晰顺序。\n          */}\n          <div style={slideStyle()}>\n            {/*\n              内层：真正的视觉样式 + 进出场动画。\n              data-state 跟着 animationState 走（不是 isVisible/mounted）：\n              - isVisible 变 false 的瞬间，animationState 立刻跟着变 closed，\n                触发退场动画的 class；\n              - isVisible 变 true 时，animationState 会晚一帧才变 open，\n                留出时间让箭头（TooltipArrow）完成挂载、注册给 arrow middleware、\n                算出正确的位置偏移（细节见 useTooltipContent 里的注释）；\n              - mounted 会比 animationState 变 closed 更晚才变 false（见下面的\n                Presence 逻辑），留出时间让退场动画播完。\n\n              data-[state=open]/data-[state=closed] 这套 class 依赖 tailwindcss-animate\n              插件提供的 animate-in/animate-out/fade-in-0/zoom-in-95 等工具类——\n              如果你的项目还没装，`npm install tailwindcss-animate` 并在 tailwind\n              config 里加上这个 plugin 即可；不想装的话，把这几个 data-[state=...]\n              class 换成你自己写的 @keyframes + 对应 class 也一样能工作，\n              Presence 逻辑（mounted 延迟卸载）不依赖具体用了哪套动画实现。\n\n              箭头（TooltipArrow）不依赖\"作为这个元素的子节点、被动继承这里的\n              transform/opacity 动画\"这种隐式机制——它自己也从 context 里读到\n              同一个 animationState，独立播放一份自己的入场/退场动画，两者由\n              同一个信号同步触发。\n\n              data-side/data-align 是从最终生效的 placement 拆出来的，驱动上面\n              这几条方向感知的 slide-in class，也顺带给 transform-origin 提供了\n              依据——缩放动画的锚点会落在\"贴近 trigger 的那条边\"上（细节见\n              TooltipContent.utils.ts 里的 getTransformOrigin），而不是默认的\n              几何中心，这样整个入场效果才会像是\"从 trigger 那里长出来\"，\n              贴近 shadcn 的实际观感。\n\n              特意没有 overflow:auto / max-height，tooltip 不支持内容超长时滚动——\n              宽度上限靠下面静态的 max-w-xs class 兜底，让文字自然换行；高度完全\n              不做限制。这不只是为了贴近 shadcn/Radix 的行为（它们的 tooltip 也不\n              允许滚动），还避免了一个真实踩过的坑：overflow:auto 配合这里的\n              zoom-in-95 动画（会给这个元素加一个非 none 的 transform，CSS 规范\n              规定这会让它变成子元素新的包含块）曾经导致箭头戳出边缘的那部分被\n              误判成\"可滚动溢出\"，表现为打开瞬间闪一下滚动条、箭头跟着被遮住，\n              动画播完滚动条消失、箭头才重新出现。去掉滚动能力后这个耦合从根上\n              就不存在了。\n            */}\n            <div\n              ref={setContentElement}\n              id={ctx.contentId}\n              role=\"tooltip\"\n              data-state={animationState()}\n              data-side={getSide(pos.placement())}\n              data-align={getAlignment(pos.placement()) ?? \"center\"}\n              onMouseEnter={ctx.keepOpen}\n              onMouseLeave={ctx.requestClose}\n              style={{\n                \"transform-origin\": getTransformOrigin(pos.placement()),\n                ...(typeof local.style === \"object\" ? local.style : undefined),\n              }}\n              class={clsx(\n                \"max-w-xs rounded-md px-3 py-1.5 text-xs leading-relaxed shadow-md\",\n                \"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95\",\n                \"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95\",\n                // 方向感知的滑入：不只是原地淡入缩放，还从\"贴近 trigger 的反方向\"\n                // 轻微位移过来——比如 placement 是 top（content 在 trigger 上方），\n                // 就从下方 8px（slide-in-from-bottom-2）滑上来，视觉上更像是从\n                // trigger 那里\"冒出来\"，而不是凭空原地出现。只在打开时生效，\n                // 贴近 shadcn 的实际行为（它们的退场动画没有对应的滑出位移）。\n                \"data-[side=top]:slide-in-from-bottom-2\",\n                \"data-[side=bottom]:slide-in-from-top-2\",\n                \"data-[side=left]:slide-in-from-right-2\",\n                \"data-[side=right]:slide-in-from-left-2\",\n                \"bg-foreground text-background\",\n                local.class,\n              )}\n              {...rest}\n            >\n              <TooltipContentContext.Provider\n                value={{\n                  middlewareData: pos.middlewareData,\n                  placement: pos.placement,\n                  setArrowElement,\n                  animationState,\n                }}\n              >\n                {local.children}\n              </TooltipContentContext.Provider>\n            </div>\n          </div>\n        </div>\n      </Portal>\n    </Show>\n  );\n}\n"],"mappings":";;;;;;;;;AAkBA,SAAgBW,EAAeC,GAA4B;CACzD,IAAM,EACJC,QACAC,QACAC,YACAC,mBACAC,oBACAC,sBACAC,kBACEf,QAAwBQ,CAAK,GAI3B,CAACQ,GAAOC,KAAQnB,EAAWU,GAAO;EACtC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CAAU,CACX;CAED,OAAAU,EACGtB,GAAI;EAAA,IAACuB,OAAI;GAAA,OAAER,EAAQ;EAAC;EAAA,IAAAS,WAAA;GAAA,OAAAF,EAClBnB,GAAM,EAAA,IAAAqB,WAAA;IAAA,IAAAC,IAAAC,EAAA,GAAAC,IAAAF,EAAAG,YAAAC,IAAAF,EAAAC;IAwCqB,OAxCrBE,GAOGC,MAAO;KASX9B,AARAY,EAAImB,YAAYD,CAAE,GAQlB9B,QAAgBY,EAAImB,YAAYC,KAAAA,CAAS,CAAC;IAC5C,GAACR,CAAA,GAAAK,EAiEQZ,GAAiBW,CAAA,GAAAK,EAAAL,GAAAM,EAAA;KAAA,IACtBC,KAAE;MAAA,OAAEvB,EAAIwB;KAAS;KAAA,IAAA,eAAA;MAAA,OAELrB,EAAe;KAAC;KAAA,IAAA,cAAA;MAAA,OACjBT,EAAQO,EAAI0B,UAAU,CAAC;KAAC;KAAA,IAAA,eAAA;MAAA,OACvBhC,EAAaM,EAAI0B,UAAU,CAAC,KAAK;KAAQ;KAAA,IACrDE,eAAY;MAAA,OAAE7B,EAAI8B;KAAQ;KAAA,IAC1BC,eAAY;MAAA,OAAE/B,EAAIgC;KAAY;KAAA,IAC9BC,QAAK;MAAA,OAAE;OACL,oBAAoBxC,EAAmBQ,EAAI0B,UAAU,CAAC;OACtD,GAAI,OAAOpB,EAAM0B,SAAU,WAAW1B,EAAM0B,QAAQb,KAAAA;MACtD;KAAC;KAAA,IAAA,QAAA;MAAA,OACMvB,EACL,qEACA,yFACA,kGAMA,0CACA,0CACA,0CACA,0CACA,iCACAU,EAAM2B,KACR;KAAC;IAAA,GACG1B,CAAI,GAAA,IAAA,EAAA,GAAA2B,EAAAnB,GAAAP,EAEPjB,EAAsB4C,UAAQ;KAAA,IAC7BC,QAAK;MAAA,OAAE;OACLC,gBAAgBrC,EAAIqC;OACpBX,WAAW1B,EAAI0B;OACfvB;OACAD;MACF;KAAC;KAAA,IAAAQ,WAAA;MAAA,OAEAJ,EAAMI;KAAQ;IAAA,CAAA,CAAA,GAAA4B,GAAAC,MAAA;KAAA,IAAAC,IAtGLxC,EAAI0B,UAAU,GAACe,IACxB;MACL,GAAGzC,EAAI0C,eAAe;MAEtBC,SAAS3C,KAAI4C,aAAa;KAC5B,GAACC,IAiBWxC,EAAW;KAAC,OAAAmC,MAAAD,EAAAO,KAAAC,EAAApC,GAAA,kBAAA4B,EAAAO,IAAAN,CAAA,GAAAD,EAAAS,IAAAC,EAAAtC,GAAA8B,GAAAF,EAAAS,CAAA,GAAAT,EAAAW,IAAAD,EAAApC,GAAAgC,GAAAN,EAAAW,CAAA,GAAAX;IAAA,GAAA;KAAAO,GAAA3B,KAAAA;KAAA6B,GAAA7B,KAAAA;KAAA+B,GAAA/B,KAAAA;IAAA,CAAA,GAAAR;GAAA,EAAA,CAAA;EAAA;CAAA,CAAA;AAwFlC"}

package/dist/components/tooltip/TooltipContent/useTooltipContent.js

@@ -1,11 +1,11 @@
-import { useTooltipContext as e } from "../Tooltip/Tooltip.context.js";
-import { createPositioner as t } from "../../../lib/positioner/create-positioner.js";
+import { createPositioner as e } from "../../../lib/positioner/create-positioner.js";
+import { useTooltipContext as t } from "../Tooltip/Tooltip.context.js";
 import { createTooltipMiddleware as n, toPlacement as r } from "./TooltipContent.utils.js";
 import { createEffect as i, createMemo as a, createSignal as o, onCleanup as s } from "solid-js";
 //#region src/components/tooltip/TooltipContent/useTooltipContent.ts
 var c = 300;
 function l(l) {
-	let u = e("TooltipContent"), [d, f] = o(), [p, m] = o(), h = t(u.reference, u.floating, {
+	let u = t("TooltipContent"), [d, f] = o(), [p, m] = o(), h = e(u.reference, u.floating, {
 		placement: () => r(l().side ?? "top", l().align ?? "center"),
 		strategy: "fixed",
 		middleware: () => n({

package/dist/components/tooltip/TooltipTrigger/TooltipTrigger.js

@@ -1,24 +1,20 @@
-import { Button as e } from "../../button/Button.js";
-import { useTooltipTrigger as t } from "./useTooltipTrigger.js";
-import { Dynamic as n, createComponent as r, memo as i, mergeProps as a } from "solid-js/web";
+import { mergeRefs as e } from "../../../utils/ref.js";
+import { Button as t } from "../../button/Button.js";
+import { useTooltipTrigger as n } from "./useTooltipTrigger.js";
+import { Dynamic as r, createComponent as i, memo as a, mergeProps as o } from "solid-js/web";
 //#region src/components/tooltip/TooltipTrigger/TooltipTrigger.tsx
-function o(...e) {
-	return (t) => {
-		for (let n of e) typeof n == "function" && n(t);
-	};
-}
 var s = (s) => {
-	let { ctx: c, attachListeners: l } = t();
-	return r(n, a(s, {
+	let { ctx: c, attachListeners: l } = n();
+	return i(r, o(s, {
 		get component() {
-			return s.component ?? e;
+			return s.component ?? t;
 		},
-		ref(e) {
-			var t = o(c.setReference, s.ref, l);
-			typeof t == "function" && t(e);
+		ref(t) {
+			var n = e(c.setReference, s.ref, l);
+			typeof n == "function" && n(t);
 		},
 		get "aria-describedby"() {
-			return i(() => !!c.open())() ? c.contentId : void 0;
+			return a(() => !!c.open())() ? c.contentId : void 0;
 		},
 		get "data-state"() {
 			return c.open() ? "open" : "closed";

package/dist/components/tooltip/TooltipTrigger/TooltipTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipTrigger.js","names":["ValidComponent","Dynamic","useTooltipTrigger","TooltipTriggerProps","Button","mergeRefs","refs","Array","Element","el","ref","TooltipTrigger","props","T","ctx","attachListeners","_$createComponent","_$mergeProps","component","r$","_ref$","setReference","aria-describedby","_$memo","open","contentId","undefined","data-state"],"sources":["../../../../src/components/tooltip/TooltipTrigger/TooltipTrigger.tsx"],"sourcesContent":["import type { ValidComponent } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\n\nimport { useTooltipTrigger } from \"./useTooltipTrigger\";\nimport type { TooltipTriggerProps } from \"./TooltipTrigger.types\";\n\nimport { Button } from \"~/components/button\";\n\n/**\n * 合并多个 ref，依次调用，谁都不会覆盖谁。\n *\n * 类型上写成 `Element | ((el: Element) => void)`，是为了匹配 Solid 的 ref\n * 类型约定（调用方在 JSX 里可以写 `ref={myVar}` 也可以写 `ref={(el) => ...}`）。\n * 但组件内部实际拿到的 props.ref，无论调用方是哪种写法，Solid 编译器都会\n * 统一规整成回调函数再转发进来（这是官方文档明确说明的行为：\n * https://docs.solidjs.com/concepts/refs#forwarding-refs），所以这里直接\n * 当函数调用即可，不需要再判断类型。\n */\nfunction mergeRefs(\n  ...refs: Array<Element | ((el: Element) => void) | undefined>\n) {\n  return (el: Element) => {\n    for (const ref of refs) {\n      if (typeof ref === \"function\") ref(el);\n    }\n  };\n}\n\nexport const TooltipTrigger = <\n  T extends ValidComponent = typeof Button<\"button\">,\n>(\n  props: TooltipTriggerProps<T>,\n) => {\n  const { ctx, attachListeners } = useTooltipTrigger();\n\n  return (\n    <Dynamic\n      {...props}\n      component={(props.component as ValidComponent) ?? Button<\"button\">}\n      ref={mergeRefs(ctx.setReference, props.ref, attachListeners)}\n      aria-describedby={ctx.open() ? ctx.contentId : undefined}\n      data-state={ctx.open() ? \"open\" : \"closed\"}\n      // data-disabled={props.disabled ? \"\" : undefined}\n    />\n  );\n};\n"],"mappings":";;;;AAkBA,SAASK,EACP,GAAGC,GACH;CACA,QAAQG,MAAgB;EACtB,KAAK,IAAMC,KAAOJ,GAChB,AAAI,OAAOI,KAAQ,cAAYA,EAAID,CAAE;CAEzC;AACF;AAEA,IAAaE,KAGXC,MACG;CACH,IAAM,EAAEE,QAAKC,uBAAoBb,EAAkB;CAEnD,OAAAc,EACGf,GAAOgB,EACFL,GAAK;EAAA,IACTM,YAAS;GAAA,OAAGN,EAAMM,aAAgCd;EAAgB;EAAAM,IAAAS,GAAA;GAAA,IAAAC,IAC7Df,EAAUS,EAAIO,cAAcT,EAAMF,KAAKK,CAAe;GAAC,OAAAK,KAAA,cAAAA,EAAAD,CAAA;EAAA;EAAA,IAAA,qBAAA;GAAA,OAC1CI,QAAA,CAAA,CAAAT,EAAIU,KAAK,CAAC,CAAA,CAAA,IAAGV,EAAIW,YAAYC,KAAAA;EAAS;EAAA,IAAA,eAAA;GAAA,OAC5CZ,EAAIU,KAAK,IAAI,SAAS;EAAQ;CAAA,CAAA,CAAA;AAIhD"}
+{"version":3,"file":"TooltipTrigger.js","names":["ValidComponent","Dynamic","useTooltipTrigger","TooltipTriggerProps","Button","mergeRefs","TooltipTrigger","props","T","ctx","attachListeners","_$createComponent","_$mergeProps","component","ref","r$","_ref$","setReference","aria-describedby","_$memo","open","contentId","undefined","data-state"],"sources":["../../../../src/components/tooltip/TooltipTrigger/TooltipTrigger.tsx"],"sourcesContent":["import type { ValidComponent } from \"solid-js\";\nimport { Dynamic } from \"solid-js/web\";\n\nimport { useTooltipTrigger } from \"./useTooltipTrigger\";\nimport type { TooltipTriggerProps } from \"./TooltipTrigger.types\";\n\nimport { Button } from \"~/components/button\";\nimport { mergeRefs } from \"~/utils\";\n\nexport const TooltipTrigger = <\n  T extends ValidComponent = typeof Button<\"button\">,\n>(\n  props: TooltipTriggerProps<T>,\n) => {\n  const { ctx, attachListeners } = useTooltipTrigger();\n\n  return (\n    <Dynamic\n      {...props}\n      component={(props.component as ValidComponent) ?? Button<\"button\">}\n      ref={mergeRefs(ctx.setReference, props.ref, attachListeners)}\n      aria-describedby={ctx.open() ? ctx.contentId : undefined}\n      data-state={ctx.open() ? \"open\" : \"closed\"}\n      // data-disabled={props.disabled ? \"\" : undefined}\n    />\n  );\n};\n"],"mappings":";;;;;AASA,IAAaM,KAGXC,MACG;CACH,IAAM,EAAEE,QAAKC,uBAAoBR,EAAkB;CAEnD,OAAAS,EACGV,GAAOW,EACFL,GAAK;EAAA,IACTM,YAAS;GAAA,OAAGN,EAAMM,aAAgCT;EAAgB;EAAAU,IAAAC,GAAA;GAAA,IAAAC,IAC7DX,EAAUI,EAAIQ,cAAcV,EAAMO,KAAKJ,CAAe;GAAC,OAAAM,KAAA,cAAAA,EAAAD,CAAA;EAAA;EAAA,IAAA,qBAAA;GAAA,OAC1CI,QAAA,CAAA,CAAAV,EAAIW,KAAK,CAAC,CAAA,CAAA,IAAGX,EAAIY,YAAYC,KAAAA;EAAS;EAAA,IAAA,eAAA;GAAA,OAC5Cb,EAAIW,KAAK,IAAI,SAAS;EAAQ;CAAA,CAAA,CAAA;AAIhD"}

package/dist/index.d.ts

@@ -22,6 +22,7 @@ export * from './components/label';
 export * from './components/pagination';
 export * from './components/progress';
 export * from './components/scroll-area';
+export * from './components/select';
 export * from './components/separator';
 export * from './components/sidebar';
 export * from './components/skeleton';