@combinedk/ui 3.0.0-beta.11

package/dist/index16.js

@@ -0,0 +1,330 @@
+import { useEffect as e, useRef as t, useState as n } from "react";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+import { createPortal as o } from "react-dom";
+//#region src/components/Select.tsx
+function s({ triggerContent: s, open: c, onOpen: l, triggerRef: u, children: d, minWidth: f = 200 }) {
+	let p = t(null), [m, h] = n({
+		top: 0,
+		left: 0,
+		width: 0
+	});
+	return e(() => {
+		if (!c) return;
+		let e = (e) => {
+			!p.current?.contains(e.target) && !u.current?.contains(e.target) && l();
+		}, t = (e) => {
+			e.key === "Escape" && l();
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [c]), /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("div", {
+		ref: u,
+		onClick: () => {
+			let e = u.current?.getBoundingClientRect();
+			e && (h({
+				top: e.bottom + window.scrollY + 4,
+				left: e.left + window.scrollX,
+				width: e.width
+			}), l());
+		},
+		style: { cursor: "pointer" },
+		children: s
+	}), c && o(/* @__PURE__ */ i("div", {
+		ref: p,
+		style: {
+			position: "absolute",
+			top: m.top,
+			left: m.left,
+			minWidth: Math.max(m.width, f),
+			background: "var(--c-surface)",
+			border: "1px solid var(--c-border)",
+			borderRadius: 8,
+			boxShadow: "0 4px 12px rgba(47,56,67,0.10)",
+			padding: 4,
+			zIndex: 1100,
+			maxHeight: 240,
+			overflowY: "auto"
+		},
+		children: d
+	}), document.body)] });
+}
+function c({ label: e, selected: t, onClick: n, checkbox: r }) {
+	return /* @__PURE__ */ a("div", {
+		onClick: n,
+		style: {
+			padding: "6px 10px",
+			borderRadius: 4,
+			cursor: "pointer",
+			fontFamily: "var(--font-sans)",
+			fontSize: 13,
+			color: "var(--c-text)",
+			display: "flex",
+			alignItems: "center",
+			gap: 8,
+			background: !r && t ? "#fff4d6" : "transparent"
+		},
+		onMouseEnter: (e) => {
+			e.currentTarget.style.background = !r && t ? "#fff4d6" : "var(--c-elevated)";
+		},
+		onMouseLeave: (e) => {
+			e.currentTarget.style.background = !r && t ? "#fff4d6" : "transparent";
+		},
+		children: [r ? /* @__PURE__ */ i("span", {
+			style: {
+				width: 14,
+				height: 14,
+				borderRadius: 3,
+				flexShrink: 0,
+				border: `1.5px solid ${t ? "var(--c-text)" : "var(--c-border-strong)"}`,
+				background: t ? "var(--c-text)" : "var(--c-surface)",
+				color: "#fff",
+				fontSize: 10,
+				display: "inline-flex",
+				alignItems: "center",
+				justifyContent: "center"
+			},
+			children: t ? "✓" : ""
+		}) : /* @__PURE__ */ i("span", {
+			style: {
+				width: 14,
+				color: "var(--c-amber)",
+				fontWeight: 700
+			},
+			children: t ? "✓" : ""
+		}), /* @__PURE__ */ i("span", { children: e })]
+	});
+}
+function l({ value: e, onChange: r, options: o, placeholder: l = "Select…", disabled: u }) {
+	let [d, f] = n(!1), p = t(null), m = o.map((e) => typeof e == "string" ? {
+		value: e,
+		label: e
+	} : e), h = m.find((t) => t.value === e);
+	return /* @__PURE__ */ i(s, {
+		triggerRef: p,
+		open: d,
+		onOpen: () => !u && f((e) => !e),
+		triggerContent: /* @__PURE__ */ a("div", {
+			style: {
+				display: "flex",
+				alignItems: "center",
+				gap: 8,
+				padding: "8px 12px",
+				background: "var(--c-surface)",
+				border: `1px solid ${d ? "var(--c-text)" : "var(--c-border)"}`,
+				borderRadius: 6,
+				fontSize: 13,
+				fontFamily: "var(--font-sans)",
+				color: h ? "var(--c-text)" : "var(--c-text-muted)",
+				boxShadow: d ? "0 0 0 3px rgba(47,56,67,0.08)" : "none",
+				opacity: u ? .5 : 1
+			},
+			children: [/* @__PURE__ */ i("span", {
+				style: { flex: 1 },
+				children: h?.label ?? l
+			}), /* @__PURE__ */ i("span", {
+				style: {
+					fontSize: 10,
+					color: "var(--c-text-subtle)",
+					transform: d ? "rotate(180deg)" : "none",
+					transition: "transform 160ms"
+				},
+				children: "▾"
+			})]
+		}),
+		children: m.map((t) => /* @__PURE__ */ i(c, {
+			label: t.label,
+			selected: t.value === e,
+			onClick: () => {
+				r(t.value), f(!1);
+			}
+		}, t.value))
+	});
+}
+function u({ values: e, onChange: r, options: o, placeholder: l = "Select…" }) {
+	let [u, d] = n(!1), f = t(null), p = o.map((e) => typeof e == "string" ? {
+		value: e,
+		label: e
+	} : e), m = (t) => r(e.includes(t) ? e.filter((e) => e !== t) : [...e, t]);
+	return /* @__PURE__ */ i(s, {
+		triggerRef: f,
+		open: u,
+		onOpen: () => d((e) => !e),
+		triggerContent: /* @__PURE__ */ a("div", {
+			style: {
+				display: "flex",
+				alignItems: "center",
+				gap: 6,
+				flexWrap: "wrap",
+				padding: "6px 10px",
+				background: "var(--c-surface)",
+				border: `1px solid ${u ? "var(--c-text)" : "var(--c-border)"}`,
+				borderRadius: 6,
+				minHeight: 36,
+				cursor: "pointer",
+				boxShadow: u ? "0 0 0 3px rgba(47,56,67,0.08)" : "none"
+			},
+			children: [e.length === 0 ? /* @__PURE__ */ i("span", {
+				style: {
+					fontFamily: "var(--font-sans)",
+					fontSize: 13,
+					color: "var(--c-text-muted)"
+				},
+				children: l
+			}) : e.map((e) => /* @__PURE__ */ a("span", {
+				style: {
+					display: "inline-flex",
+					alignItems: "center",
+					gap: 4,
+					padding: "2px 8px",
+					background: "var(--color-neutral-100)",
+					borderRadius: 999,
+					fontFamily: "var(--font-sans)",
+					fontSize: 11.5,
+					color: "var(--c-text)"
+				},
+				children: [p.find((t) => t.value === e)?.label ?? e, /* @__PURE__ */ i("span", {
+					onClick: (t) => {
+						t.stopPropagation(), m(e);
+					},
+					style: {
+						cursor: "pointer",
+						color: "var(--c-text-subtle)",
+						lineHeight: 1
+					},
+					children: "×"
+				})]
+			}, e)), /* @__PURE__ */ i("span", {
+				style: {
+					marginLeft: "auto",
+					fontSize: 10,
+					color: "var(--c-text-subtle)",
+					flexShrink: 0
+				},
+				children: "▾"
+			})]
+		}),
+		children: p.map((t) => /* @__PURE__ */ i(c, {
+			label: t.label,
+			selected: e.includes(t.value),
+			onClick: () => m(t.value),
+			checkbox: !0
+		}, t.value))
+	});
+}
+function d(e, t) {
+	if (!t) return e;
+	let n = e.toLowerCase().indexOf(t.toLowerCase());
+	return n < 0 ? e : /* @__PURE__ */ a(r, { children: [
+		e.slice(0, n),
+		/* @__PURE__ */ i("b", {
+			style: {
+				background: "#fff4d6",
+				color: "var(--c-text)",
+				fontWeight: 700
+			},
+			children: e.slice(n, n + t.length)
+		}),
+		e.slice(n + t.length)
+	] });
+}
+function f({ value: r, onChange: s, options: c, placeholder: l = "Search…" }) {
+	let [u, f] = n(r), [p, m] = n(!1), h = t(null), g = t(null), _ = t(null), [v, y] = n({
+		top: 0,
+		left: 0,
+		width: 0
+	}), b = c.map((e) => typeof e == "string" ? {
+		value: e,
+		label: e
+	} : e).filter((e) => e.label.toLowerCase().includes(u.toLowerCase())), x = () => {
+		let e = h.current?.getBoundingClientRect();
+		e && y({
+			top: e.bottom + window.scrollY + 4,
+			left: e.left + window.scrollX,
+			width: e.width
+		}), m(!0);
+	};
+	return e(() => {
+		if (!p) return;
+		let e = (e) => {
+			!_.current?.contains(e.target) && !h.current?.contains(e.target) && m(!1);
+		}, t = (e) => {
+			e.key === "Escape" && m(!1);
+		};
+		return document.addEventListener("mousedown", e), document.addEventListener("keydown", t), () => {
+			document.removeEventListener("mousedown", e), document.removeEventListener("keydown", t);
+		};
+	}, [p]), /* @__PURE__ */ a("div", {
+		ref: h,
+		children: [/* @__PURE__ */ i("input", {
+			ref: g,
+			value: u,
+			onChange: (e) => {
+				f(e.target.value), x();
+			},
+			onFocus: x,
+			placeholder: l,
+			style: {
+				width: "100%",
+				padding: "8px 12px",
+				border: `1px solid ${p ? "var(--c-text)" : "var(--c-border)"}`,
+				borderRadius: 6,
+				fontFamily: "var(--font-sans)",
+				fontSize: 13,
+				color: "var(--c-text)",
+				outline: "none",
+				boxSizing: "border-box",
+				boxShadow: p ? "0 0 0 3px rgba(47,56,67,0.08)" : "none",
+				background: "var(--c-surface)"
+			}
+		}), p && o(/* @__PURE__ */ i("div", {
+			ref: _,
+			style: {
+				position: "absolute",
+				top: v.top,
+				left: v.left,
+				width: v.width,
+				background: "var(--c-surface)",
+				border: "1px solid var(--c-border)",
+				borderRadius: 8,
+				boxShadow: "0 4px 12px rgba(47,56,67,0.10)",
+				padding: 4,
+				zIndex: 1100,
+				maxHeight: 200,
+				overflowY: "auto"
+			},
+			children: b.length === 0 ? /* @__PURE__ */ i("div", {
+				style: {
+					padding: "8px 10px",
+					fontSize: 12,
+					color: "var(--c-text-subtle)",
+					fontFamily: "var(--font-sans)"
+				},
+				children: "No matches"
+			}) : b.map((e) => /* @__PURE__ */ i("div", {
+				onClick: () => {
+					s(e.value), f(e.label), m(!1);
+				},
+				style: {
+					padding: "6px 10px",
+					borderRadius: 4,
+					cursor: "pointer",
+					fontFamily: "var(--font-mono)",
+					fontSize: 12,
+					color: "var(--c-text)"
+				},
+				onMouseEnter: (e) => {
+					e.currentTarget.style.background = "var(--c-elevated)";
+				},
+				onMouseLeave: (e) => {
+					e.currentTarget.style.background = "transparent";
+				},
+				children: d(e.label, u)
+			}, e.value))
+		}), document.body)]
+	});
+}
+//#endregion
+export { f as Combobox, u as MultiSelect, l as Select };
+
+//# sourceMappingURL=index16.js.map

package/dist/index16.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index16.js","names":[],"sources":["../src/components/Select.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\n\n// ── Shared dropdown shell ──────────────────────────────────────────────────\n\ninterface DropdownShellProps {\n  triggerContent: ReactNode\n  open:           boolean\n  onOpen:         () => void\n  triggerRef:     React.RefObject<HTMLDivElement | null>\n  children:       ReactNode\n  minWidth?:      number\n}\n\nfunction DropdownShell({ triggerContent, open, onOpen, triggerRef, children, minWidth = 200 }: DropdownShellProps) {\n  const menuRef = useRef<HTMLDivElement>(null)\n  const [pos, setPos] = useState({ top: 0, left: 0, width: 0 })\n\n  const handleOpen = () => {\n    const rect = triggerRef.current?.getBoundingClientRect()\n    if (!rect) return\n    setPos({ top: rect.bottom + window.scrollY + 4, left: rect.left + window.scrollX, width: rect.width })\n    onOpen()\n  }\n\n  useEffect(() => {\n    if (!open) return\n    const handler = (e: MouseEvent) => {\n      if (!menuRef.current?.contains(e.target as Node) && !triggerRef.current?.contains(e.target as Node)) {\n        onOpen()  // caller's toggle closes\n      }\n    }\n    const onEsc = (e: KeyboardEvent) => { if (e.key === 'Escape') onOpen() }\n    document.addEventListener('mousedown', handler)\n    document.addEventListener('keydown', onEsc)\n    return () => { document.removeEventListener('mousedown', handler); document.removeEventListener('keydown', onEsc) }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open])\n\n  return (\n    <>\n      <div ref={triggerRef} onClick={handleOpen} style={{ cursor: 'pointer' }}>\n        {triggerContent}\n      </div>\n      {open && createPortal(\n        <div ref={menuRef} style={{\n          position:     'absolute',\n          top:          pos.top,\n          left:         pos.left,\n          minWidth:     Math.max(pos.width, minWidth),\n          background:   'var(--c-surface)',\n          border:       '1px solid var(--c-border)',\n          borderRadius: 8,\n          boxShadow:    '0 4px 12px rgba(47,56,67,0.10)',\n          padding:      4,\n          zIndex:       1100,\n          maxHeight:    240,\n          overflowY:    'auto',\n        }}>\n          {children}\n        </div>,\n        document.body\n      )}\n    </>\n  )\n}\n\nfunction OptionItem({ label, selected, onClick, checkbox }: { label: string; selected: boolean; onClick: () => void; checkbox?: boolean }) {\n  return (\n    <div\n      onClick={onClick}\n      style={{\n        padding:      '6px 10px',\n        borderRadius: 4,\n        cursor:       'pointer',\n        fontFamily:   'var(--font-sans)',\n        fontSize:     13,\n        color:        'var(--c-text)',\n        display:      'flex',\n        alignItems:   'center',\n        gap:          8,\n        background:   !checkbox && selected ? '#fff4d6' : 'transparent',\n      }}\n      onMouseEnter={e => { e.currentTarget.style.background = !checkbox && selected ? '#fff4d6' : 'var(--c-elevated)' }}\n      onMouseLeave={e => { e.currentTarget.style.background = !checkbox && selected ? '#fff4d6' : 'transparent' }}\n    >\n      {checkbox ? (\n        <span style={{\n          width: 14, height: 14, borderRadius: 3, flexShrink: 0,\n          border: `1.5px solid ${selected ? 'var(--c-text)' : 'var(--c-border-strong)'}`,\n          background: selected ? 'var(--c-text)' : 'var(--c-surface)',\n          color: '#fff', fontSize: 10, display: 'inline-flex', alignItems: 'center', justifyContent: 'center',\n        }}>\n          {selected ? '✓' : ''}\n        </span>\n      ) : (\n        <span style={{ width: 14, color: 'var(--c-amber)', fontWeight: 700 }}>{selected ? '✓' : ''}</span>\n      )}\n      <span>{label}</span>\n    </div>\n  )\n}\n\n// ── Select ─────────────────────────────────────────────────────────────────\n\ninterface SelectProps {\n  value:       string\n  onChange:    (v: string) => void\n  options:     string[] | Array<{ value: string; label: string }>\n  placeholder?: string\n  disabled?:   boolean\n}\n\nexport function Select({ value, onChange, options, placeholder = 'Select…', disabled }: SelectProps) {\n  const [open, setOpen] = useState(false)\n  const ref = useRef<HTMLDivElement>(null!)\n  const opts = options.map(o => typeof o === 'string' ? { value: o, label: o } : o)\n  const selected = opts.find(o => o.value === value)\n\n  return (\n    <DropdownShell\n      triggerRef={ref}\n      open={open}\n      onOpen={() => !disabled && setOpen(o => !o)}\n      triggerContent={\n        <div style={{\n          display:      'flex',\n          alignItems:   'center',\n          gap:          8,\n          padding:      '8px 12px',\n          background:   'var(--c-surface)',\n          border:       `1px solid ${open ? 'var(--c-text)' : 'var(--c-border)'}`,\n          borderRadius: 6,\n          fontSize:     13,\n          fontFamily:   'var(--font-sans)',\n          color:        selected ? 'var(--c-text)' : 'var(--c-text-muted)',\n          boxShadow:    open ? '0 0 0 3px rgba(47,56,67,0.08)' : 'none',\n          opacity:      disabled ? 0.5 : 1,\n        }}>\n          <span style={{ flex: 1 }}>{selected?.label ?? placeholder}</span>\n          <span style={{ fontSize: 10, color: 'var(--c-text-subtle)', transform: open ? 'rotate(180deg)' : 'none', transition: 'transform 160ms' }}>▾</span>\n        </div>\n      }\n    >\n      {opts.map(o => (\n        <OptionItem\n          key={o.value}\n          label={o.label}\n          selected={o.value === value}\n          onClick={() => { onChange(o.value); setOpen(false) }}\n        />\n      ))}\n    </DropdownShell>\n  )\n}\n\n// ── MultiSelect ────────────────────────────────────────────────────────────\n\ninterface MultiSelectProps {\n  values:       string[]\n  onChange:     (v: string[]) => void\n  options:      string[] | Array<{ value: string; label: string }>\n  placeholder?: string\n}\n\nexport function MultiSelect({ values, onChange, options, placeholder = 'Select…' }: MultiSelectProps) {\n  const [open, setOpen] = useState(false)\n  const ref = useRef<HTMLDivElement>(null!)\n  const opts = options.map(o => typeof o === 'string' ? { value: o, label: o } : o)\n\n  const toggle = (v: string) =>\n    onChange(values.includes(v) ? values.filter(x => x !== v) : [...values, v])\n\n  return (\n    <DropdownShell\n      triggerRef={ref}\n      open={open}\n      onOpen={() => setOpen(o => !o)}\n      triggerContent={\n        <div style={{\n          display:      'flex',\n          alignItems:   'center',\n          gap:          6,\n          flexWrap:     'wrap',\n          padding:      '6px 10px',\n          background:   'var(--c-surface)',\n          border:       `1px solid ${open ? 'var(--c-text)' : 'var(--c-border)'}`,\n          borderRadius: 6,\n          minHeight:    36,\n          cursor:       'pointer',\n          boxShadow:    open ? '0 0 0 3px rgba(47,56,67,0.08)' : 'none',\n        }}>\n          {values.length === 0\n            ? <span style={{ fontFamily: 'var(--font-sans)', fontSize: 13, color: 'var(--c-text-muted)' }}>{placeholder}</span>\n            : values.map(v => {\n              const label = opts.find(o => o.value === v)?.label ?? v\n              return (\n                <span key={v} style={{\n                  display: 'inline-flex', alignItems: 'center', gap: 4,\n                  padding: '2px 8px', background: 'var(--color-neutral-100)',\n                  borderRadius: 999, fontFamily: 'var(--font-sans)', fontSize: 11.5, color: 'var(--c-text)',\n                }}>\n                  {label}\n                  <span onClick={e => { e.stopPropagation(); toggle(v) }} style={{ cursor: 'pointer', color: 'var(--c-text-subtle)', lineHeight: 1 }}>×</span>\n                </span>\n              )\n            })}\n          <span style={{ marginLeft: 'auto', fontSize: 10, color: 'var(--c-text-subtle)', flexShrink: 0 }}>▾</span>\n        </div>\n      }\n    >\n      {opts.map(o => (\n        <OptionItem\n          key={o.value}\n          label={o.label}\n          selected={values.includes(o.value)}\n          onClick={() => toggle(o.value)}\n          checkbox\n        />\n      ))}\n    </DropdownShell>\n  )\n}\n\n// ── Combobox ───────────────────────────────────────────────────────────────\n\ninterface ComboboxProps {\n  value:        string\n  onChange:     (v: string) => void\n  options:      string[] | Array<{ value: string; label: string }>\n  placeholder?: string\n}\n\nfunction highlight(text: string, query: string): ReactNode {\n  if (!query) return text\n  const idx = text.toLowerCase().indexOf(query.toLowerCase())\n  if (idx < 0) return text\n  return (\n    <>\n      {text.slice(0, idx)}\n      <b style={{ background: '#fff4d6', color: 'var(--c-text)', fontWeight: 700 }}>\n        {text.slice(idx, idx + query.length)}\n      </b>\n      {text.slice(idx + query.length)}\n    </>\n  )\n}\n\nexport function Combobox({ value, onChange, options, placeholder = 'Search…' }: ComboboxProps) {\n  const [q, setQ] = useState(value)\n  const [open, setOpen] = useState(false)\n  const ref = useRef<HTMLDivElement>(null!)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const menuRef = useRef<HTMLDivElement>(null)\n  const [pos, setPos] = useState({ top: 0, left: 0, width: 0 })\n\n  const opts = options.map(o => typeof o === 'string' ? { value: o, label: o } : o)\n  const results = opts.filter(o => o.label.toLowerCase().includes(q.toLowerCase()))\n\n  const openDropdown = () => {\n    const rect = ref.current?.getBoundingClientRect()\n    if (rect) setPos({ top: rect.bottom + window.scrollY + 4, left: rect.left + window.scrollX, width: rect.width })\n    setOpen(true)\n  }\n\n  useEffect(() => {\n    if (!open) return\n    const handler = (e: MouseEvent) => {\n      if (!menuRef.current?.contains(e.target as Node) && !ref.current?.contains(e.target as Node)) setOpen(false)\n    }\n    const onEsc = (e: KeyboardEvent) => { if (e.key === 'Escape') setOpen(false) }\n    document.addEventListener('mousedown', handler)\n    document.addEventListener('keydown', onEsc)\n    return () => { document.removeEventListener('mousedown', handler); document.removeEventListener('keydown', onEsc) }\n  }, [open])\n\n  return (\n    <div ref={ref}>\n      <input\n        ref={inputRef}\n        value={q}\n        onChange={e => { setQ(e.target.value); openDropdown() }}\n        onFocus={openDropdown}\n        placeholder={placeholder}\n        style={{\n          width:        '100%',\n          padding:      '8px 12px',\n          border:       `1px solid ${open ? 'var(--c-text)' : 'var(--c-border)'}`,\n          borderRadius: 6,\n          fontFamily:   'var(--font-sans)',\n          fontSize:     13,\n          color:        'var(--c-text)',\n          outline:      'none',\n          boxSizing:    'border-box',\n          boxShadow:    open ? '0 0 0 3px rgba(47,56,67,0.08)' : 'none',\n          background:   'var(--c-surface)',\n        }}\n      />\n      {open && createPortal(\n        <div ref={menuRef} style={{\n          position: 'absolute', top: pos.top, left: pos.left, width: pos.width,\n          background: 'var(--c-surface)', border: '1px solid var(--c-border)',\n          borderRadius: 8, boxShadow: '0 4px 12px rgba(47,56,67,0.10)',\n          padding: 4, zIndex: 1100, maxHeight: 200, overflowY: 'auto',\n        }}>\n          {results.length === 0\n            ? <div style={{ padding: '8px 10px', fontSize: 12, color: 'var(--c-text-subtle)', fontFamily: 'var(--font-sans)' }}>No matches</div>\n            : results.map(r => (\n              <div\n                key={r.value}\n                onClick={() => { onChange(r.value); setQ(r.label); setOpen(false) }}\n                style={{ padding: '6px 10px', borderRadius: 4, cursor: 'pointer', fontFamily: 'var(--font-mono)', fontSize: 12, color: 'var(--c-text)' }}\n                onMouseEnter={e => { e.currentTarget.style.background = 'var(--c-elevated)' }}\n                onMouseLeave={e => { e.currentTarget.style.background = 'transparent' }}\n              >\n                {highlight(r.label, q)}\n              </div>\n            ))}\n        </div>,\n        document.body\n      )}\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/index17.cjs

@@ -0,0 +1,2 @@
+let e=require(`react/jsx-runtime`);function t({checked:t,onChange:n,label:r,disabled:i}){return(0,e.jsxs)(`label`,{style:{display:`inline-flex`,alignItems:`center`,gap:8,cursor:i?`default`:`pointer`,fontFamily:`var(--font-sans)`,fontSize:13,color:i?`var(--c-text-muted)`:`var(--c-text)`,opacity:i?.6:1,userSelect:`none`},children:[(0,e.jsx)(`span`,{onClick:()=>!i&&n(!t),style:{width:16,height:16,borderRadius:4,border:`1.5px solid ${t?`var(--c-text)`:`var(--c-border-strong)`}`,background:t?`var(--c-text)`:`var(--c-surface)`,color:`#fff`,display:`inline-flex`,alignItems:`center`,justifyContent:`center`,fontSize:11,fontWeight:700,flexShrink:0,transition:`all 160ms`},children:t?`✓`:``}),r&&(0,e.jsx)(`span`,{children:r})]})}function n({checked:t,onChange:n,label:r,disabled:i}){return(0,e.jsxs)(`label`,{style:{display:`inline-flex`,alignItems:`center`,gap:8,cursor:i?`default`:`pointer`,fontFamily:`var(--font-sans)`,fontSize:13,color:i?`var(--c-text-muted)`:`var(--c-text)`,opacity:i?.6:1,userSelect:`none`},children:[(0,e.jsx)(`span`,{onClick:()=>!i&&n(),style:{width:16,height:16,borderRadius:`50%`,border:`1.5px solid ${t?`var(--c-text)`:`var(--c-border-strong)`}`,background:`var(--c-surface)`,display:`inline-flex`,alignItems:`center`,justifyContent:`center`,flexShrink:0,transition:`all 160ms`},children:t&&(0,e.jsx)(`span`,{style:{width:8,height:8,borderRadius:`50%`,background:`var(--c-text)`}})}),r&&(0,e.jsx)(`span`,{children:r})]})}function r({checked:t,onChange:n,label:r,disabled:i}){return(0,e.jsxs)(`label`,{style:{display:`inline-flex`,alignItems:`center`,gap:10,cursor:i?`default`:`pointer`,fontFamily:`var(--font-sans)`,fontSize:13,color:i?`var(--c-text-muted)`:`var(--c-text)`,opacity:i?.6:1,userSelect:`none`},children:[(0,e.jsx)(`span`,{onClick:()=>!i&&n(!t),style:{position:`relative`,width:36,height:20,borderRadius:999,background:t?`var(--c-text)`:`var(--c-border-strong)`,flexShrink:0,transition:`background 160ms`},children:(0,e.jsx)(`span`,{style:{position:`absolute`,top:2,left:t?18:2,width:16,height:16,borderRadius:`50%`,background:`#fff`,boxShadow:`0 1px 3px rgba(0,0,0,0.15)`,transition:`left 160ms cubic-bezier(0.2,0,0,1)`}})}),r&&(0,e.jsx)(`span`,{children:r})]})}exports.Checkbox=t,exports.Radio=n,exports.Switch=r;
+//# sourceMappingURL=index17.cjs.map

package/dist/index17.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index17.cjs","names":[],"sources":["../src/components/Checkbox.tsx"],"sourcesContent":["// Checkbox, Radio, Switch — all boolean form controls\n\ninterface CheckboxProps {\n  checked:   boolean\n  onChange:  (v: boolean) => void\n  label?:    string\n  disabled?: boolean\n}\n\nexport function Checkbox({ checked, onChange, label, disabled }: CheckboxProps) {\n  return (\n    <label style={{\n      display:    'inline-flex',\n      alignItems: 'center',\n      gap:        8,\n      cursor:     disabled ? 'default' : 'pointer',\n      fontFamily: 'var(--font-sans)',\n      fontSize:   13,\n      color:      disabled ? 'var(--c-text-muted)' : 'var(--c-text)',\n      opacity:    disabled ? 0.6 : 1,\n      userSelect: 'none',\n    }}>\n      <span\n        onClick={() => !disabled && onChange(!checked)}\n        style={{\n          width:          16,\n          height:         16,\n          borderRadius:   4,\n          border:         `1.5px solid ${checked ? 'var(--c-text)' : 'var(--c-border-strong)'}`,\n          background:     checked ? 'var(--c-text)' : 'var(--c-surface)',\n          color:          '#fff',\n          display:        'inline-flex',\n          alignItems:     'center',\n          justifyContent: 'center',\n          fontSize:       11,\n          fontWeight:     700,\n          flexShrink:     0,\n          transition:     'all 160ms',\n        }}\n      >\n        {checked ? '✓' : ''}\n      </span>\n      {label && <span>{label}</span>}\n    </label>\n  )\n}\n\n// ── Radio ──────────────────────────────────────────────────────────────────\n\ninterface RadioProps {\n  checked:   boolean\n  onChange:  () => void\n  label?:    string\n  disabled?: boolean\n}\n\nexport function Radio({ checked, onChange, label, disabled }: RadioProps) {\n  return (\n    <label style={{\n      display:    'inline-flex',\n      alignItems: 'center',\n      gap:        8,\n      cursor:     disabled ? 'default' : 'pointer',\n      fontFamily: 'var(--font-sans)',\n      fontSize:   13,\n      color:      disabled ? 'var(--c-text-muted)' : 'var(--c-text)',\n      opacity:    disabled ? 0.6 : 1,\n      userSelect: 'none',\n    }}>\n      <span\n        onClick={() => !disabled && onChange()}\n        style={{\n          width:          16,\n          height:         16,\n          borderRadius:   '50%',\n          border:         `1.5px solid ${checked ? 'var(--c-text)' : 'var(--c-border-strong)'}`,\n          background:     'var(--c-surface)',\n          display:        'inline-flex',\n          alignItems:     'center',\n          justifyContent: 'center',\n          flexShrink:     0,\n          transition:     'all 160ms',\n        }}\n      >\n        {checked && (\n          <span style={{ width: 8, height: 8, borderRadius: '50%', background: 'var(--c-text)' }} />\n        )}\n      </span>\n      {label && <span>{label}</span>}\n    </label>\n  )\n}\n\n// ── Switch ─────────────────────────────────────────────────────────────────\n\ninterface SwitchProps {\n  checked:   boolean\n  onChange:  (v: boolean) => void\n  label?:    string\n  disabled?: boolean\n}\n\nexport function Switch({ checked, onChange, label, disabled }: SwitchProps) {\n  return (\n    <label style={{\n      display:    'inline-flex',\n      alignItems: 'center',\n      gap:        10,\n      cursor:     disabled ? 'default' : 'pointer',\n      fontFamily: 'var(--font-sans)',\n      fontSize:   13,\n      color:      disabled ? 'var(--c-text-muted)' : 'var(--c-text)',\n      opacity:    disabled ? 0.6 : 1,\n      userSelect: 'none',\n    }}>\n      <span\n        onClick={() => !disabled && onChange(!checked)}\n        style={{\n          position:     'relative',\n          width:        36,\n          height:       20,\n          borderRadius: 999,\n          background:   checked ? 'var(--c-text)' : 'var(--c-border-strong)',\n          flexShrink:   0,\n          transition:   'background 160ms',\n        }}\n      >\n        <span style={{\n          position:     'absolute',\n          top:          2,\n          left:         checked ? 18 : 2,\n          width:        16,\n          height:       16,\n          borderRadius: '50%',\n          background:   '#fff',\n          boxShadow:    '0 1px 3px rgba(0,0,0,0.15)',\n          transition:   'left 160ms cubic-bezier(0.2,0,0,1)',\n        }} />\n      </span>\n      {label && <span>{label}</span>}\n    </label>\n  )\n}\n"],"mappings":"mCASA,SAAgB,EAAS,CAAE,UAAS,WAAU,QAAO,YAA2B,CAC9E,OACE,EAAA,EAAA,MAAC,QAAD,CAAO,MAAO,CACZ,QAAY,cACZ,WAAY,SACZ,IAAY,EACZ,OAAY,EAAW,UAAY,UACnC,WAAY,mBACZ,SAAY,GACZ,MAAY,EAAW,sBAAwB,gBAC/C,QAAY,EAAW,GAAM,EAC7B,WAAY,OACb,UAVD,EAWE,EAAA,EAAA,KAAC,OAAD,CACE,YAAe,CAAC,GAAY,EAAS,CAAC,EAAQ,CAC9C,MAAO,CACL,MAAgB,GAChB,OAAgB,GAChB,aAAgB,EAChB,OAAgB,eAAe,EAAU,gBAAkB,2BAC3D,WAAgB,EAAU,gBAAkB,mBAC5C,MAAgB,OAChB,QAAgB,cAChB,WAAgB,SAChB,eAAgB,SAChB,SAAgB,GAChB,WAAgB,IAChB,WAAgB,EAChB,WAAgB,YACjB,UAEA,EAAU,IAAM,GACZ,CAAA,CACN,IAAS,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAa,CAAA,CACxB,GAaZ,SAAgB,EAAM,CAAE,UAAS,WAAU,QAAO,YAAwB,CACxE,OACE,EAAA,EAAA,MAAC,QAAD,CAAO,MAAO,CACZ,QAAY,cACZ,WAAY,SACZ,IAAY,EACZ,OAAY,EAAW,UAAY,UACnC,WAAY,mBACZ,SAAY,GACZ,MAAY,EAAW,sBAAwB,gBAC/C,QAAY,EAAW,GAAM,EAC7B,WAAY,OACb,UAVD,EAWE,EAAA,EAAA,KAAC,OAAD,CACE,YAAe,CAAC,GAAY,GAAU,CACtC,MAAO,CACL,MAAgB,GAChB,OAAgB,GAChB,aAAgB,MAChB,OAAgB,eAAe,EAAU,gBAAkB,2BAC3D,WAAgB,mBAChB,QAAgB,cAChB,WAAgB,SAChB,eAAgB,SAChB,WAAgB,EAChB,WAAgB,YACjB,UAEA,IACC,EAAA,EAAA,KAAC,OAAD,CAAM,MAAO,CAAE,MAAO,EAAG,OAAQ,EAAG,aAAc,MAAO,WAAY,gBAAiB,CAAI,CAAA,CAEvF,CAAA,CACN,IAAS,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAa,CAAA,CACxB,GAaZ,SAAgB,EAAO,CAAE,UAAS,WAAU,QAAO,YAAyB,CAC1E,OACE,EAAA,EAAA,MAAC,QAAD,CAAO,MAAO,CACZ,QAAY,cACZ,WAAY,SACZ,IAAY,GACZ,OAAY,EAAW,UAAY,UACnC,WAAY,mBACZ,SAAY,GACZ,MAAY,EAAW,sBAAwB,gBAC/C,QAAY,EAAW,GAAM,EAC7B,WAAY,OACb,UAVD,EAWE,EAAA,EAAA,KAAC,OAAD,CACE,YAAe,CAAC,GAAY,EAAS,CAAC,EAAQ,CAC9C,MAAO,CACL,SAAc,WACd,MAAc,GACd,OAAc,GACd,aAAc,IACd,WAAc,EAAU,gBAAkB,yBAC1C,WAAc,EACd,WAAc,mBACf,WAED,EAAA,EAAA,KAAC,OAAD,CAAM,MAAO,CACX,SAAc,WACd,IAAc,EACd,KAAc,EAAU,GAAK,EAC7B,MAAc,GACd,OAAc,GACd,aAAc,MACd,WAAc,OACd,UAAc,6BACd,WAAc,qCACf,CAAI,CAAA,CACA,CAAA,CACN,IAAS,EAAA,EAAA,KAAC,OAAD,CAAA,SAAO,EAAa,CAAA,CACxB"}

package/dist/index17.js

@@ -0,0 +1,114 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region src/components/Checkbox.tsx
+function n({ checked: n, onChange: r, label: i, disabled: a }) {
+	return /* @__PURE__ */ t("label", {
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: 8,
+			cursor: a ? "default" : "pointer",
+			fontFamily: "var(--font-sans)",
+			fontSize: 13,
+			color: a ? "var(--c-text-muted)" : "var(--c-text)",
+			opacity: a ? .6 : 1,
+			userSelect: "none"
+		},
+		children: [/* @__PURE__ */ e("span", {
+			onClick: () => !a && r(!n),
+			style: {
+				width: 16,
+				height: 16,
+				borderRadius: 4,
+				border: `1.5px solid ${n ? "var(--c-text)" : "var(--c-border-strong)"}`,
+				background: n ? "var(--c-text)" : "var(--c-surface)",
+				color: "#fff",
+				display: "inline-flex",
+				alignItems: "center",
+				justifyContent: "center",
+				fontSize: 11,
+				fontWeight: 700,
+				flexShrink: 0,
+				transition: "all 160ms"
+			},
+			children: n ? "✓" : ""
+		}), i && /* @__PURE__ */ e("span", { children: i })]
+	});
+}
+function r({ checked: n, onChange: r, label: i, disabled: a }) {
+	return /* @__PURE__ */ t("label", {
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: 8,
+			cursor: a ? "default" : "pointer",
+			fontFamily: "var(--font-sans)",
+			fontSize: 13,
+			color: a ? "var(--c-text-muted)" : "var(--c-text)",
+			opacity: a ? .6 : 1,
+			userSelect: "none"
+		},
+		children: [/* @__PURE__ */ e("span", {
+			onClick: () => !a && r(),
+			style: {
+				width: 16,
+				height: 16,
+				borderRadius: "50%",
+				border: `1.5px solid ${n ? "var(--c-text)" : "var(--c-border-strong)"}`,
+				background: "var(--c-surface)",
+				display: "inline-flex",
+				alignItems: "center",
+				justifyContent: "center",
+				flexShrink: 0,
+				transition: "all 160ms"
+			},
+			children: n && /* @__PURE__ */ e("span", { style: {
+				width: 8,
+				height: 8,
+				borderRadius: "50%",
+				background: "var(--c-text)"
+			} })
+		}), i && /* @__PURE__ */ e("span", { children: i })]
+	});
+}
+function i({ checked: n, onChange: r, label: i, disabled: a }) {
+	return /* @__PURE__ */ t("label", {
+		style: {
+			display: "inline-flex",
+			alignItems: "center",
+			gap: 10,
+			cursor: a ? "default" : "pointer",
+			fontFamily: "var(--font-sans)",
+			fontSize: 13,
+			color: a ? "var(--c-text-muted)" : "var(--c-text)",
+			opacity: a ? .6 : 1,
+			userSelect: "none"
+		},
+		children: [/* @__PURE__ */ e("span", {
+			onClick: () => !a && r(!n),
+			style: {
+				position: "relative",
+				width: 36,
+				height: 20,
+				borderRadius: 999,
+				background: n ? "var(--c-text)" : "var(--c-border-strong)",
+				flexShrink: 0,
+				transition: "background 160ms"
+			},
+			children: /* @__PURE__ */ e("span", { style: {
+				position: "absolute",
+				top: 2,
+				left: n ? 18 : 2,
+				width: 16,
+				height: 16,
+				borderRadius: "50%",
+				background: "#fff",
+				boxShadow: "0 1px 3px rgba(0,0,0,0.15)",
+				transition: "left 160ms cubic-bezier(0.2,0,0,1)"
+			} })
+		}), i && /* @__PURE__ */ e("span", { children: i })]
+	});
+}
+//#endregion
+export { n as Checkbox, r as Radio, i as Switch };
+
+//# sourceMappingURL=index17.js.map

package/dist/index17.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index17.js","names":[],"sources":["../src/components/Checkbox.tsx"],"sourcesContent":["// Checkbox, Radio, Switch — all boolean form controls\n\ninterface CheckboxProps {\n  checked:   boolean\n  onChange:  (v: boolean) => void\n  label?:    string\n  disabled?: boolean\n}\n\nexport function Checkbox({ checked, onChange, label, disabled }: CheckboxProps) {\n  return (\n    <label style={{\n      display:    'inline-flex',\n      alignItems: 'center',\n      gap:        8,\n      cursor:     disabled ? 'default' : 'pointer',\n      fontFamily: 'var(--font-sans)',\n      fontSize:   13,\n      color:      disabled ? 'var(--c-text-muted)' : 'var(--c-text)',\n      opacity:    disabled ? 0.6 : 1,\n      userSelect: 'none',\n    }}>\n      <span\n        onClick={() => !disabled && onChange(!checked)}\n        style={{\n          width:          16,\n          height:         16,\n          borderRadius:   4,\n          border:         `1.5px solid ${checked ? 'var(--c-text)' : 'var(--c-border-strong)'}`,\n          background:     checked ? 'var(--c-text)' : 'var(--c-surface)',\n          color:          '#fff',\n          display:        'inline-flex',\n          alignItems:     'center',\n          justifyContent: 'center',\n          fontSize:       11,\n          fontWeight:     700,\n          flexShrink:     0,\n          transition:     'all 160ms',\n        }}\n      >\n        {checked ? '✓' : ''}\n      </span>\n      {label && <span>{label}</span>}\n    </label>\n  )\n}\n\n// ── Radio ──────────────────────────────────────────────────────────────────\n\ninterface RadioProps {\n  checked:   boolean\n  onChange:  () => void\n  label?:    string\n  disabled?: boolean\n}\n\nexport function Radio({ checked, onChange, label, disabled }: RadioProps) {\n  return (\n    <label style={{\n      display:    'inline-flex',\n      alignItems: 'center',\n      gap:        8,\n      cursor:     disabled ? 'default' : 'pointer',\n      fontFamily: 'var(--font-sans)',\n      fontSize:   13,\n      color:      disabled ? 'var(--c-text-muted)' : 'var(--c-text)',\n      opacity:    disabled ? 0.6 : 1,\n      userSelect: 'none',\n    }}>\n      <span\n        onClick={() => !disabled && onChange()}\n        style={{\n          width:          16,\n          height:         16,\n          borderRadius:   '50%',\n          border:         `1.5px solid ${checked ? 'var(--c-text)' : 'var(--c-border-strong)'}`,\n          background:     'var(--c-surface)',\n          display:        'inline-flex',\n          alignItems:     'center',\n          justifyContent: 'center',\n          flexShrink:     0,\n          transition:     'all 160ms',\n        }}\n      >\n        {checked && (\n          <span style={{ width: 8, height: 8, borderRadius: '50%', background: 'var(--c-text)' }} />\n        )}\n      </span>\n      {label && <span>{label}</span>}\n    </label>\n  )\n}\n\n// ── Switch ─────────────────────────────────────────────────────────────────\n\ninterface SwitchProps {\n  checked:   boolean\n  onChange:  (v: boolean) => void\n  label?:    string\n  disabled?: boolean\n}\n\nexport function Switch({ checked, onChange, label, disabled }: SwitchProps) {\n  return (\n    <label style={{\n      display:    'inline-flex',\n      alignItems: 'center',\n      gap:        10,\n      cursor:     disabled ? 'default' : 'pointer',\n      fontFamily: 'var(--font-sans)',\n      fontSize:   13,\n      color:      disabled ? 'var(--c-text-muted)' : 'var(--c-text)',\n      opacity:    disabled ? 0.6 : 1,\n      userSelect: 'none',\n    }}>\n      <span\n        onClick={() => !disabled && onChange(!checked)}\n        style={{\n          position:     'relative',\n          width:        36,\n          height:       20,\n          borderRadius: 999,\n          background:   checked ? 'var(--c-text)' : 'var(--c-border-strong)',\n          flexShrink:   0,\n          transition:   'background 160ms',\n        }}\n      >\n        <span style={{\n          position:     'absolute',\n          top:          2,\n          left:         checked ? 18 : 2,\n          width:        16,\n          height:       16,\n          borderRadius: '50%',\n          background:   '#fff',\n          boxShadow:    '0 1px 3px rgba(0,0,0,0.15)',\n          transition:   'left 160ms cubic-bezier(0.2,0,0,1)',\n        }} />\n      </span>\n      {label && <span>{label}</span>}\n    </label>\n  )\n}\n"],"mappings":";;AASA,SAAgB,EAAS,EAAE,YAAS,aAAU,UAAO,eAA2B;AAC9E,QACE,kBAAC,SAAD;EAAO,OAAO;GACZ,SAAY;GACZ,YAAY;GACZ,KAAY;GACZ,QAAY,IAAW,YAAY;GACnC,YAAY;GACZ,UAAY;GACZ,OAAY,IAAW,wBAAwB;GAC/C,SAAY,IAAW,KAAM;GAC7B,YAAY;GACb;YAVD,CAWE,kBAAC,QAAD;GACE,eAAe,CAAC,KAAY,EAAS,CAAC,EAAQ;GAC9C,OAAO;IACL,OAAgB;IAChB,QAAgB;IAChB,cAAgB;IAChB,QAAgB,eAAe,IAAU,kBAAkB;IAC3D,YAAgB,IAAU,kBAAkB;IAC5C,OAAgB;IAChB,SAAgB;IAChB,YAAgB;IAChB,gBAAgB;IAChB,UAAgB;IAChB,YAAgB;IAChB,YAAgB;IAChB,YAAgB;IACjB;aAEA,IAAU,MAAM;GACZ,CAAA,EACN,KAAS,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA,CACxB;;;AAaZ,SAAgB,EAAM,EAAE,YAAS,aAAU,UAAO,eAAwB;AACxE,QACE,kBAAC,SAAD;EAAO,OAAO;GACZ,SAAY;GACZ,YAAY;GACZ,KAAY;GACZ,QAAY,IAAW,YAAY;GACnC,YAAY;GACZ,UAAY;GACZ,OAAY,IAAW,wBAAwB;GAC/C,SAAY,IAAW,KAAM;GAC7B,YAAY;GACb;YAVD,CAWE,kBAAC,QAAD;GACE,eAAe,CAAC,KAAY,GAAU;GACtC,OAAO;IACL,OAAgB;IAChB,QAAgB;IAChB,cAAgB;IAChB,QAAgB,eAAe,IAAU,kBAAkB;IAC3D,YAAgB;IAChB,SAAgB;IAChB,YAAgB;IAChB,gBAAgB;IAChB,YAAgB;IAChB,YAAgB;IACjB;aAEA,KACC,kBAAC,QAAD,EAAM,OAAO;IAAE,OAAO;IAAG,QAAQ;IAAG,cAAc;IAAO,YAAY;IAAiB,EAAI,CAAA;GAEvF,CAAA,EACN,KAAS,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA,CACxB;;;AAaZ,SAAgB,EAAO,EAAE,YAAS,aAAU,UAAO,eAAyB;AAC1E,QACE,kBAAC,SAAD;EAAO,OAAO;GACZ,SAAY;GACZ,YAAY;GACZ,KAAY;GACZ,QAAY,IAAW,YAAY;GACnC,YAAY;GACZ,UAAY;GACZ,OAAY,IAAW,wBAAwB;GAC/C,SAAY,IAAW,KAAM;GAC7B,YAAY;GACb;YAVD,CAWE,kBAAC,QAAD;GACE,eAAe,CAAC,KAAY,EAAS,CAAC,EAAQ;GAC9C,OAAO;IACL,UAAc;IACd,OAAc;IACd,QAAc;IACd,cAAc;IACd,YAAc,IAAU,kBAAkB;IAC1C,YAAc;IACd,YAAc;IACf;aAED,kBAAC,QAAD,EAAM,OAAO;IACX,UAAc;IACd,KAAc;IACd,MAAc,IAAU,KAAK;IAC7B,OAAc;IACd,QAAc;IACd,cAAc;IACd,YAAc;IACd,WAAc;IACd,YAAc;IACf,EAAI,CAAA;GACA,CAAA,EACN,KAAS,kBAAC,QAAD,EAAA,UAAO,GAAa,CAAA,CACxB"}

package/dist/index18.cjs

@@ -0,0 +1,2 @@
+let e=require(`react/jsx-runtime`);function t({label:t,required:n,error:r,help:i,children:a}){return(0,e.jsxs)(`div`,{style:{display:`flex`,flexDirection:`column`,gap:4},children:[(0,e.jsxs)(`label`,{style:{fontSize:12,fontWeight:600,color:`var(--c-text)`,fontFamily:`var(--font-sans)`,display:`flex`,alignItems:`center`,gap:4},children:[t,n&&(0,e.jsx)(`span`,{style:{color:`var(--c-error)`},children:`*`})]}),a,r?(0,e.jsx)(`p`,{style:{margin:0,fontSize:11.5,color:`var(--c-error)`,fontFamily:`var(--font-sans)`},children:r}):i&&(0,e.jsx)(`p`,{style:{margin:0,fontSize:11.5,color:`var(--c-text-secondary)`,fontFamily:`var(--font-sans)`},children:i})]})}function n({error:t,mono:n,style:r,...i}){return(0,e.jsx)(`textarea`,{style:{width:`100%`,padding:`8px 12px`,border:`1px solid ${t?`var(--c-error)`:`var(--c-border)`}`,borderRadius:6,fontFamily:n?`var(--font-mono)`:`var(--font-sans)`,fontSize:13,color:`var(--c-text)`,background:`var(--c-surface)`,resize:`vertical`,minHeight:80,outline:`none`,lineHeight:1.6,boxSizing:`border-box`,boxShadow:t?`0 0 0 3px oklch(95% 0.04 25)`:`none`,transition:`border-color 150ms, box-shadow 150ms`,...r},onFocus:e=>{e.currentTarget.style.borderColor=t?`var(--c-error)`:`var(--c-text)`,e.currentTarget.style.boxShadow=t?`0 0 0 3px oklch(95% 0.04 25)`:`0 0 0 3px rgba(47,56,67,0.08)`},onBlur:e=>{e.currentTarget.style.borderColor=t?`var(--c-error)`:`var(--c-border)`,e.currentTarget.style.boxShadow=t?`0 0 0 3px oklch(95% 0.04 25)`:`none`},...i})}function r({options:t,value:n,onChange:r}){return(0,e.jsx)(`div`,{style:{display:`inline-flex`,background:`var(--color-neutral-100)`,borderRadius:999,padding:3,gap:2},children:t.map(e=>typeof e==`string`?{value:e,label:e}:e).map(t=>(0,e.jsx)(`button`,{onClick:()=>r(t.value),style:{border:`none`,background:t.value===n?`var(--c-surface)`:`transparent`,color:t.value===n?`var(--c-text)`:`var(--c-text-subtle)`,padding:`4px 14px`,borderRadius:999,cursor:`pointer`,fontFamily:`var(--font-sans)`,fontSize:11.5,fontWeight:600,boxShadow:t.value===n?`0 1px 2px rgba(0,0,0,0.08)`:`none`,transition:`all 160ms`},children:t.label},t.value))})}exports.Field=t,exports.SegmentedControl=r,exports.Textarea=n;
+//# sourceMappingURL=index18.cjs.map

package/dist/index18.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index18.cjs","names":[],"sources":["../src/components/Field.tsx"],"sourcesContent":["import type { ReactNode, TextareaHTMLAttributes } from 'react'\n\n// ── Field wrapper ──────────────────────────────────────────────────────────\n\ninterface FieldProps {\n  label:     string\n  required?: boolean\n  error?:    string\n  help?:     string\n  children:  ReactNode\n}\n\nexport function Field({ label, required, error, help, children }: FieldProps) {\n  return (\n    <div style={{ display: 'flex', flexDirection: 'column', gap: 4 }}>\n      <label style={{\n        fontSize:   12,\n        fontWeight: 600,\n        color:      'var(--c-text)',\n        fontFamily: 'var(--font-sans)',\n        display:    'flex',\n        alignItems: 'center',\n        gap:        4,\n      }}>\n        {label}\n        {required && <span style={{ color: 'var(--c-error)' }}>*</span>}\n      </label>\n      {children}\n      {error\n        ? <p style={{ margin: 0, fontSize: 11.5, color: 'var(--c-error)', fontFamily: 'var(--font-sans)' }}>{error}</p>\n        : help && <p style={{ margin: 0, fontSize: 11.5, color: 'var(--c-text-secondary)', fontFamily: 'var(--font-sans)' }}>{help}</p>\n      }\n    </div>\n  )\n}\n\n// ── Textarea ───────────────────────────────────────────────────────────────\n\ninterface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {\n  error?: boolean\n  mono?:  boolean\n}\n\nexport function Textarea({ error, mono, style, ...rest }: TextareaProps) {\n  return (\n    <textarea\n      style={{\n        width:        '100%',\n        padding:      '8px 12px',\n        border:       `1px solid ${error ? 'var(--c-error)' : 'var(--c-border)'}`,\n        borderRadius: 6,\n        fontFamily:   mono ? 'var(--font-mono)' : 'var(--font-sans)',\n        fontSize:     13,\n        color:        'var(--c-text)',\n        background:   'var(--c-surface)',\n        resize:       'vertical',\n        minHeight:    80,\n        outline:      'none',\n        lineHeight:   1.6,\n        boxSizing:    'border-box',\n        boxShadow:    error ? '0 0 0 3px oklch(95% 0.04 25)' : 'none',\n        transition:   'border-color 150ms, box-shadow 150ms',\n        ...style,\n      }}\n      onFocus={e => {\n        e.currentTarget.style.borderColor = error ? 'var(--c-error)' : 'var(--c-text)'\n        e.currentTarget.style.boxShadow   = error ? '0 0 0 3px oklch(95% 0.04 25)' : '0 0 0 3px rgba(47,56,67,0.08)'\n      }}\n      onBlur={e => {\n        e.currentTarget.style.borderColor = error ? 'var(--c-error)' : 'var(--c-border)'\n        e.currentTarget.style.boxShadow   = error ? '0 0 0 3px oklch(95% 0.04 25)' : 'none'\n      }}\n      {...rest}\n    />\n  )\n}\n\n// ── SegmentedControl ───────────────────────────────────────────────────────\n\ninterface SegmentedControlProps {\n  options:   string[] | Array<{ value: string; label: string }>\n  value:     string\n  onChange:  (v: string) => void\n}\n\nexport function SegmentedControl({ options, value, onChange }: SegmentedControlProps) {\n  const opts = options.map(o => typeof o === 'string' ? { value: o, label: o } : o)\n  return (\n    <div style={{\n      display:      'inline-flex',\n      background:   'var(--color-neutral-100)',\n      borderRadius: 999,\n      padding:      3,\n      gap:          2,\n    }}>\n      {opts.map(o => (\n        <button\n          key={o.value}\n          onClick={() => onChange(o.value)}\n          style={{\n            border:       'none',\n            background:   o.value === value ? 'var(--c-surface)' : 'transparent',\n            color:        o.value === value ? 'var(--c-text)' : 'var(--c-text-subtle)',\n            padding:      '4px 14px',\n            borderRadius: 999,\n            cursor:       'pointer',\n            fontFamily:   'var(--font-sans)',\n            fontSize:     11.5,\n            fontWeight:   600,\n            boxShadow:    o.value === value ? '0 1px 2px rgba(0,0,0,0.08)' : 'none',\n            transition:   'all 160ms',\n          }}\n        >\n          {o.label}\n        </button>\n      ))}\n    </div>\n  )\n}\n"],"mappings":"mCAYA,SAAgB,EAAM,CAAE,QAAO,WAAU,QAAO,OAAM,YAAwB,CAC5E,OACE,EAAA,EAAA,MAAC,MAAD,CAAK,MAAO,CAAE,QAAS,OAAQ,cAAe,SAAU,IAAK,EAAG,UAAhE,EACE,EAAA,EAAA,MAAC,QAAD,CAAO,MAAO,CACZ,SAAY,GACZ,WAAY,IACZ,MAAY,gBACZ,WAAY,mBACZ,QAAY,OACZ,WAAY,SACZ,IAAY,EACb,UARD,CASG,EACA,IAAY,EAAA,EAAA,KAAC,OAAD,CAAM,MAAO,CAAE,MAAO,iBAAkB,UAAE,IAAQ,CAAA,CACzD,GACP,EACA,GACG,EAAA,EAAA,KAAC,IAAD,CAAG,MAAO,CAAE,OAAQ,EAAG,SAAU,KAAM,MAAO,iBAAkB,WAAY,mBAAoB,UAAG,EAAU,CAAA,CAC7G,IAAQ,EAAA,EAAA,KAAC,IAAD,CAAG,MAAO,CAAE,OAAQ,EAAG,SAAU,KAAM,MAAO,0BAA2B,WAAY,mBAAoB,UAAG,EAAS,CAAA,CAE7H,GAWV,SAAgB,EAAS,CAAE,QAAO,OAAM,QAAO,GAAG,GAAuB,CACvE,OACE,EAAA,EAAA,KAAC,WAAD,CACE,MAAO,CACL,MAAc,OACd,QAAc,WACd,OAAc,aAAa,EAAQ,iBAAmB,oBACtD,aAAc,EACd,WAAc,EAAO,mBAAqB,mBAC1C,SAAc,GACd,MAAc,gBACd,WAAc,mBACd,OAAc,WACd,UAAc,GACd,QAAc,OACd,WAAc,IACd,UAAc,aACd,UAAc,EAAQ,+BAAiC,OACvD,WAAc,uCACd,GAAG,EACJ,CACD,QAAS,GAAK,CACZ,EAAE,cAAc,MAAM,YAAc,EAAQ,iBAAmB,gBAC/D,EAAE,cAAc,MAAM,UAAc,EAAQ,+BAAiC,iCAE/E,OAAQ,GAAK,CACX,EAAE,cAAc,MAAM,YAAc,EAAQ,iBAAmB,kBAC/D,EAAE,cAAc,MAAM,UAAc,EAAQ,+BAAiC,QAE/E,GAAI,EACJ,CAAA,CAYN,SAAgB,EAAiB,CAAE,UAAS,QAAO,YAAmC,CAEpF,OACE,EAAA,EAAA,KAAC,MAAD,CAAK,MAAO,CACV,QAAc,cACd,WAAc,2BACd,aAAc,IACd,QAAc,EACd,IAAc,EACf,UARU,EAAQ,IAAI,GAAK,OAAO,GAAM,SAAW,CAAE,MAAO,EAAG,MAAO,EAAG,CAAG,EAS1E,CAAK,IAAI,IACR,EAAA,EAAA,KAAC,SAAD,CAEE,YAAe,EAAS,EAAE,MAAM,CAChC,MAAO,CACL,OAAc,OACd,WAAc,EAAE,QAAU,EAAQ,mBAAqB,cACvD,MAAc,EAAE,QAAU,EAAQ,gBAAkB,uBACpD,QAAc,WACd,aAAc,IACd,OAAc,UACd,WAAc,mBACd,SAAc,KACd,WAAc,IACd,UAAc,EAAE,QAAU,EAAQ,6BAA+B,OACjE,WAAc,YACf,UAEA,EAAE,MACI,CAjBF,EAAE,MAiBA,CACT,CACE,CAAA"}

package/dist/index18.js

@@ -0,0 +1,110 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region src/components/Field.tsx
+function n({ label: n, required: r, error: i, help: a, children: o }) {
+	return /* @__PURE__ */ t("div", {
+		style: {
+			display: "flex",
+			flexDirection: "column",
+			gap: 4
+		},
+		children: [
+			/* @__PURE__ */ t("label", {
+				style: {
+					fontSize: 12,
+					fontWeight: 600,
+					color: "var(--c-text)",
+					fontFamily: "var(--font-sans)",
+					display: "flex",
+					alignItems: "center",
+					gap: 4
+				},
+				children: [n, r && /* @__PURE__ */ e("span", {
+					style: { color: "var(--c-error)" },
+					children: "*"
+				})]
+			}),
+			o,
+			i ? /* @__PURE__ */ e("p", {
+				style: {
+					margin: 0,
+					fontSize: 11.5,
+					color: "var(--c-error)",
+					fontFamily: "var(--font-sans)"
+				},
+				children: i
+			}) : a && /* @__PURE__ */ e("p", {
+				style: {
+					margin: 0,
+					fontSize: 11.5,
+					color: "var(--c-text-secondary)",
+					fontFamily: "var(--font-sans)"
+				},
+				children: a
+			})
+		]
+	});
+}
+function r({ error: t, mono: n, style: r, ...i }) {
+	return /* @__PURE__ */ e("textarea", {
+		style: {
+			width: "100%",
+			padding: "8px 12px",
+			border: `1px solid ${t ? "var(--c-error)" : "var(--c-border)"}`,
+			borderRadius: 6,
+			fontFamily: n ? "var(--font-mono)" : "var(--font-sans)",
+			fontSize: 13,
+			color: "var(--c-text)",
+			background: "var(--c-surface)",
+			resize: "vertical",
+			minHeight: 80,
+			outline: "none",
+			lineHeight: 1.6,
+			boxSizing: "border-box",
+			boxShadow: t ? "0 0 0 3px oklch(95% 0.04 25)" : "none",
+			transition: "border-color 150ms, box-shadow 150ms",
+			...r
+		},
+		onFocus: (e) => {
+			e.currentTarget.style.borderColor = t ? "var(--c-error)" : "var(--c-text)", e.currentTarget.style.boxShadow = t ? "0 0 0 3px oklch(95% 0.04 25)" : "0 0 0 3px rgba(47,56,67,0.08)";
+		},
+		onBlur: (e) => {
+			e.currentTarget.style.borderColor = t ? "var(--c-error)" : "var(--c-border)", e.currentTarget.style.boxShadow = t ? "0 0 0 3px oklch(95% 0.04 25)" : "none";
+		},
+		...i
+	});
+}
+function i({ options: t, value: n, onChange: r }) {
+	return /* @__PURE__ */ e("div", {
+		style: {
+			display: "inline-flex",
+			background: "var(--color-neutral-100)",
+			borderRadius: 999,
+			padding: 3,
+			gap: 2
+		},
+		children: t.map((e) => typeof e == "string" ? {
+			value: e,
+			label: e
+		} : e).map((t) => /* @__PURE__ */ e("button", {
+			onClick: () => r(t.value),
+			style: {
+				border: "none",
+				background: t.value === n ? "var(--c-surface)" : "transparent",
+				color: t.value === n ? "var(--c-text)" : "var(--c-text-subtle)",
+				padding: "4px 14px",
+				borderRadius: 999,
+				cursor: "pointer",
+				fontFamily: "var(--font-sans)",
+				fontSize: 11.5,
+				fontWeight: 600,
+				boxShadow: t.value === n ? "0 1px 2px rgba(0,0,0,0.08)" : "none",
+				transition: "all 160ms"
+			},
+			children: t.label
+		}, t.value))
+	});
+}
+//#endregion
+export { n as Field, i as SegmentedControl, r as Textarea };
+
+//# sourceMappingURL=index18.js.map