@diwauhris/ui 1.0.0

package/lib/index22.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index22.cjs","names":[],"sources":["../src/ui-library/gallery/switch/Switch.tsx"],"sourcesContent":["/**\n * Switch — Design System Component\n *\n * Communicates an immediate on/off toggle — not a form checkbox.\n * Use Switch when the action takes effect immediately (e.g. toggling a setting).\n * Use Checkbox when the value is submitted as part of a form.\n *\n * Role: switch (ARIA) — announces as \"on\"/\"off\" to screen readers.\n */\n\nimport type { ReactNode } from 'react';\nimport { useId } from 'react';\n\nexport interface SwitchProps {\n  checked: boolean;\n  onChange: (checked: boolean) => void;\n  label?: ReactNode;\n  description?: string;\n  disabled?: boolean;\n  /** Show a loading spinner in place of the thumb */\n  loading?: boolean;\n  id?: string;\n}\n\nexport function Switch({\n  checked,\n  onChange,\n  label,\n  description,\n  disabled = false,\n  loading = false,\n  id: externalId,\n}: SwitchProps) {\n  const generatedId = useId();\n  const id = externalId ?? generatedId;\n  const labelId = label ? `${id}-label` : undefined;\n  const isInteractive = !disabled && !loading;\n\n  return (\n    <div className=\"flex items-start gap-3\">\n      {/* Track + thumb */}\n      <button\n        id={id}\n        type=\"button\"\n        role=\"switch\"\n        aria-checked={checked}\n        aria-labelledby={labelId}\n        aria-disabled={!isInteractive || undefined}\n        disabled={!isInteractive}\n        onClick={() => isInteractive && onChange(!checked)}\n        className={[\n          'relative inline-flex h-6 w-11 shrink-0 items-center rounded-full border-2 border-transparent transition-colors duration-200',\n          'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-blue/30 focus-visible:ring-offset-1',\n          checked ? 'bg-brand-blue' : 'bg-slate-200',\n          !isInteractive ? 'cursor-not-allowed opacity-60' : 'cursor-pointer',\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        {/* Thumb */}\n        <span\n          aria-hidden=\"true\"\n          className={[\n            'inline-block h-5 w-5 rounded-full bg-white shadow-sm ring-0 transition-transform duration-200',\n            checked ? 'translate-x-5' : 'translate-x-0',\n          ]\n            .filter(Boolean)\n            .join(' ')}\n        >\n          {/* Loading spinner inside thumb */}\n          {loading && (\n            <span className=\"flex h-full w-full items-center justify-center\">\n              <span className=\"h-2.5 w-2.5 animate-spin rounded-full border-2 border-slate-300 border-t-brand-blue\" />\n            </span>\n          )}\n        </span>\n      </button>\n\n      {/* Label + description */}\n      {(label || description) && (\n        <div className=\"min-w-0 pt-0.5\">\n          {label && (\n            <span\n              id={labelId}\n              className={`block text-sm font-semibold ${disabled ? 'text-slate-400' : 'text-slate-800'}`}\n            >\n              {label}\n            </span>\n          )}\n          {description && (\n            <span className=\"block text-xs font-medium leading-relaxed text-slate-400\">\n              {description}\n            </span>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;AAwBA,SAAgB,OAAO,EACrB,SACA,UACA,OACA,aACA,WAAW,OACX,UAAU,OACV,IAAI,cACU;CACd,MAAM,eAAA,GAAc,MAAA,MAAA,CAAM;CAC1B,MAAM,KAAK,cAAc;CACzB,MAAM,UAAU,QAAQ,GAAG,GAAG,UAAU,KAAA;CACxC,MAAM,gBAAgB,CAAC,YAAY,CAAC;CAEpC,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CAEE,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;GACM;GACJ,MAAK;GACL,MAAK;GACL,gBAAc;GACd,mBAAiB;GACjB,iBAAe,CAAC,iBAAiB,KAAA;GACjC,UAAU,CAAC;GACX,eAAe,iBAAiB,SAAS,CAAC,OAAO;GACjD,WAAW;IACT;IACA;IACA,UAAU,kBAAkB;IAC5B,CAAC,gBAAgB,kCAAkC;GACrD,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;GAGX,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IACE,eAAY;IACZ,WAAW,CACT,iGACA,UAAU,kBAAkB,eAC9B,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;IAGV,UAAA,WACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;KAAM,WAAU;KACd,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAM,WAAU,sFAAuF,CAAA;IACnG,CAAA;GAEJ,CAAA;EACA,CAAA,IAGN,SAAS,gBACT,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACG,SACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IACE,IAAI;IACJ,WAAW,+BAA+B,WAAW,mBAAmB;IAEvE,UAAA;GACG,CAAA,GAEP,eACC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;IAAM,WAAU;IACb,UAAA;GACG,CAAA,CAEL;EAEJ,CAAA,CAAA;;AAET"}

package/lib/index22.mjs

@@ -0,0 +1,50 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId } from "react";
+//#region src/ui-library/gallery/switch/Switch.tsx
+function Switch({ checked, onChange, label, description, disabled = false, loading = false, id: externalId }) {
+	const generatedId = useId();
+	const id = externalId ?? generatedId;
+	const labelId = label ? `${id}-label` : void 0;
+	const isInteractive = !disabled && !loading;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex items-start gap-3",
+		children: [/* @__PURE__ */ jsx("button", {
+			id,
+			type: "button",
+			role: "switch",
+			"aria-checked": checked,
+			"aria-labelledby": labelId,
+			"aria-disabled": !isInteractive || void 0,
+			disabled: !isInteractive,
+			onClick: () => isInteractive && onChange(!checked),
+			className: [
+				"relative inline-flex h-6 w-11 shrink-0 items-center rounded-full border-2 border-transparent transition-colors duration-200",
+				"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-blue/30 focus-visible:ring-offset-1",
+				checked ? "bg-brand-blue" : "bg-slate-200",
+				!isInteractive ? "cursor-not-allowed opacity-60" : "cursor-pointer"
+			].filter(Boolean).join(" "),
+			children: /* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				className: ["inline-block h-5 w-5 rounded-full bg-white shadow-sm ring-0 transition-transform duration-200", checked ? "translate-x-5" : "translate-x-0"].filter(Boolean).join(" "),
+				children: loading && /* @__PURE__ */ jsx("span", {
+					className: "flex h-full w-full items-center justify-center",
+					children: /* @__PURE__ */ jsx("span", { className: "h-2.5 w-2.5 animate-spin rounded-full border-2 border-slate-300 border-t-brand-blue" })
+				})
+			})
+		}), (label || description) && /* @__PURE__ */ jsxs("div", {
+			className: "min-w-0 pt-0.5",
+			children: [label && /* @__PURE__ */ jsx("span", {
+				id: labelId,
+				className: `block text-sm font-semibold ${disabled ? "text-slate-400" : "text-slate-800"}`,
+				children: label
+			}), description && /* @__PURE__ */ jsx("span", {
+				className: "block text-xs font-medium leading-relaxed text-slate-400",
+				children: description
+			})]
+		})]
+	});
+}
+//#endregion
+export { Switch };
+
+//# sourceMappingURL=index22.mjs.map

package/lib/index22.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index22.mjs","names":[],"sources":["../src/ui-library/gallery/switch/Switch.tsx"],"sourcesContent":["/**\n * Switch — Design System Component\n *\n * Communicates an immediate on/off toggle — not a form checkbox.\n * Use Switch when the action takes effect immediately (e.g. toggling a setting).\n * Use Checkbox when the value is submitted as part of a form.\n *\n * Role: switch (ARIA) — announces as \"on\"/\"off\" to screen readers.\n */\n\nimport type { ReactNode } from 'react';\nimport { useId } from 'react';\n\nexport interface SwitchProps {\n  checked: boolean;\n  onChange: (checked: boolean) => void;\n  label?: ReactNode;\n  description?: string;\n  disabled?: boolean;\n  /** Show a loading spinner in place of the thumb */\n  loading?: boolean;\n  id?: string;\n}\n\nexport function Switch({\n  checked,\n  onChange,\n  label,\n  description,\n  disabled = false,\n  loading = false,\n  id: externalId,\n}: SwitchProps) {\n  const generatedId = useId();\n  const id = externalId ?? generatedId;\n  const labelId = label ? `${id}-label` : undefined;\n  const isInteractive = !disabled && !loading;\n\n  return (\n    <div className=\"flex items-start gap-3\">\n      {/* Track + thumb */}\n      <button\n        id={id}\n        type=\"button\"\n        role=\"switch\"\n        aria-checked={checked}\n        aria-labelledby={labelId}\n        aria-disabled={!isInteractive || undefined}\n        disabled={!isInteractive}\n        onClick={() => isInteractive && onChange(!checked)}\n        className={[\n          'relative inline-flex h-6 w-11 shrink-0 items-center rounded-full border-2 border-transparent transition-colors duration-200',\n          'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-brand-blue/30 focus-visible:ring-offset-1',\n          checked ? 'bg-brand-blue' : 'bg-slate-200',\n          !isInteractive ? 'cursor-not-allowed opacity-60' : 'cursor-pointer',\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        {/* Thumb */}\n        <span\n          aria-hidden=\"true\"\n          className={[\n            'inline-block h-5 w-5 rounded-full bg-white shadow-sm ring-0 transition-transform duration-200',\n            checked ? 'translate-x-5' : 'translate-x-0',\n          ]\n            .filter(Boolean)\n            .join(' ')}\n        >\n          {/* Loading spinner inside thumb */}\n          {loading && (\n            <span className=\"flex h-full w-full items-center justify-center\">\n              <span className=\"h-2.5 w-2.5 animate-spin rounded-full border-2 border-slate-300 border-t-brand-blue\" />\n            </span>\n          )}\n        </span>\n      </button>\n\n      {/* Label + description */}\n      {(label || description) && (\n        <div className=\"min-w-0 pt-0.5\">\n          {label && (\n            <span\n              id={labelId}\n              className={`block text-sm font-semibold ${disabled ? 'text-slate-400' : 'text-slate-800'}`}\n            >\n              {label}\n            </span>\n          )}\n          {description && (\n            <span className=\"block text-xs font-medium leading-relaxed text-slate-400\">\n              {description}\n            </span>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":";;;AAwBA,SAAgB,OAAO,EACrB,SACA,UACA,OACA,aACA,WAAW,OACX,UAAU,OACV,IAAI,cACU;CACd,MAAM,cAAc,MAAM;CAC1B,MAAM,KAAK,cAAc;CACzB,MAAM,UAAU,QAAQ,GAAG,GAAG,UAAU,KAAA;CACxC,MAAM,gBAAgB,CAAC,YAAY,CAAC;CAEpC,OACE,qBAAC,OAAD;EAAK,WAAU;EAAf,UAAA,CAEE,oBAAC,UAAD;GACM;GACJ,MAAK;GACL,MAAK;GACL,gBAAc;GACd,mBAAiB;GACjB,iBAAe,CAAC,iBAAiB,KAAA;GACjC,UAAU,CAAC;GACX,eAAe,iBAAiB,SAAS,CAAC,OAAO;GACjD,WAAW;IACT;IACA;IACA,UAAU,kBAAkB;IAC5B,CAAC,gBAAgB,kCAAkC;GACrD,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;GAGX,UAAA,oBAAC,QAAD;IACE,eAAY;IACZ,WAAW,CACT,iGACA,UAAU,kBAAkB,eAC9B,CAAC,CACE,OAAO,OAAO,CAAC,CACf,KAAK,GAAG;IAGV,UAAA,WACC,oBAAC,QAAD;KAAM,WAAU;KACd,UAAA,oBAAC,QAAD,EAAM,WAAU,sFAAuF,CAAA;IACnG,CAAA;GAEJ,CAAA;EACA,CAAA,IAGN,SAAS,gBACT,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA,CACG,SACC,oBAAC,QAAD;IACE,IAAI;IACJ,WAAW,+BAA+B,WAAW,mBAAmB;IAEvE,UAAA;GACG,CAAA,GAEP,eACC,oBAAC,QAAD;IAAM,WAAU;IACb,UAAA;GACG,CAAA,CAEL;EAEJ,CAAA,CAAA;;AAET"}

package/lib/index23.cjs

@@ -0,0 +1,143 @@
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+let lucide_react = require("lucide-react");
+//#region src/ui-library/gallery/combobox/Combobox.tsx
+/**
+* Combobox — Gallery-native searchable dropdown.
+* Copied from shared/components/PisCombobox.tsx and isolated.
+* No production imports.
+*/
+var fieldInputClass = "w-full rounded-xl border border-slate-200 bg-slate-50 px-4 py-2.5 text-sm font-medium text-slate-900 outline-none transition placeholder:text-slate-400 focus:border-brand-blue/40 focus:ring-2 focus:ring-brand-blue/15 disabled:cursor-not-allowed disabled:opacity-60";
+var fieldInputErrorClass = "border-rose-300 focus:border-rose-400 focus:ring-rose-100";
+function Combobox({ value, onChange, options, placeholder, className, disabled, loading, error }) {
+	const [isOpen, setIsOpen] = (0, react.useState)(false);
+	const [search, setSearch] = (0, react.useState)(value);
+	const [highlightIndex, setHighlightIndex] = (0, react.useState)(-1);
+	const inputRef = (0, react.useRef)(null);
+	const listRef = (0, react.useRef)(null);
+	const wrapperRef = (0, react.useRef)(null);
+	const uid = (0, react.useId)();
+	const listboxId = `${uid}-listbox`;
+	const optionId = (index) => `${uid}-option-${index}`;
+	const q = search.toLowerCase().trim();
+	const filtered = q.length < 2 ? [] : options.filter((opt) => opt.label.toLowerCase().includes(q)).sort((a, b) => {
+		const al = a.label.toLowerCase();
+		const bl = b.label.toLowerCase();
+		return (al === q ? 0 : al.startsWith(q) ? 1 : al.indexOf(q) + 2) - (bl === q ? 0 : bl.startsWith(q) ? 1 : bl.indexOf(q) + 2);
+	});
+	const DISPLAY_LIMIT = 100;
+	const displayed = filtered.length > DISPLAY_LIMIT ? filtered.slice(0, DISPLAY_LIMIT) : filtered;
+	(0, react.useEffect)(() => {
+		setSearch(value);
+	}, [value]);
+	(0, react.useEffect)(() => {
+		function handleClickOutside(e) {
+			if (wrapperRef.current && !wrapperRef.current.contains(e.target)) setIsOpen(false);
+		}
+		document.addEventListener("mousedown", handleClickOutside);
+		return () => document.removeEventListener("mousedown", handleClickOutside);
+	}, []);
+	(0, react.useEffect)(() => {
+		if (!isOpen) setHighlightIndex(-1);
+	}, [isOpen]);
+	(0, react.useEffect)(() => {
+		if (highlightIndex >= 0 && listRef.current) listRef.current.children[highlightIndex]?.scrollIntoView({ block: "nearest" });
+	}, [highlightIndex]);
+	const selectOption = (opt) => {
+		onChange(opt.value);
+		setSearch(opt.label);
+		setIsOpen(false);
+		inputRef.current?.focus();
+	};
+	const handleInputChange = (e) => {
+		const val = e.target.value;
+		setSearch(val);
+		onChange(val);
+		setIsOpen(true);
+		setHighlightIndex(-1);
+	};
+	const handleKeyDown = (e) => {
+		if (e.key === "ArrowDown") {
+			e.preventDefault();
+			if (!isOpen) {
+				setIsOpen(true);
+				return;
+			}
+			setHighlightIndex((prev) => Math.min(prev + 1, displayed.length - 1));
+		} else if (e.key === "ArrowUp") {
+			e.preventDefault();
+			setHighlightIndex((prev) => Math.max(prev - 1, -1));
+		} else if (e.key === "Enter") {
+			e.preventDefault();
+			if (highlightIndex >= 0 && displayed[highlightIndex]) selectOption(displayed[highlightIndex]);
+			else if (isOpen) setIsOpen(false);
+		} else if (e.key === "Escape") {
+			e.preventDefault();
+			setIsOpen(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: wrapperRef,
+		className: "relative",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				ref: inputRef,
+				type: "text",
+				role: "combobox",
+				"aria-expanded": isOpen,
+				"aria-controls": listboxId,
+				"aria-activedescendant": highlightIndex >= 0 ? optionId(highlightIndex) : void 0,
+				"aria-autocomplete": "list",
+				"aria-invalid": error ? "true" : void 0,
+				value: search,
+				onChange: handleInputChange,
+				onFocus: () => setIsOpen(true),
+				onKeyDown: handleKeyDown,
+				placeholder,
+				disabled,
+				className: `${fieldInputClass} pr-8${error ? ` ${fieldInputErrorClass}` : ""}${className ? ` ${className}` : ""}`
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDown, {
+				size: 16,
+				"aria-hidden": "true",
+				className: `absolute right-3 top-1/2 -translate-y-1/2 text-slate-300 pointer-events-none transition-transform ${isOpen ? "rotate-180" : ""}`
+			})]
+		}), isOpen && !disabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			ref: listRef,
+			id: listboxId,
+			role: "listbox",
+			className: "absolute z-50 mt-1 w-full bg-white border border-slate-200 rounded-xl shadow-lg max-h-60 overflow-y-auto",
+			children: error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "px-3 py-2 text-sm text-rose-500 font-semibold",
+				children: error
+			}) : loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "px-3 py-2 text-sm text-slate-400 font-semibold",
+				children: "Loading..."
+			}) : filtered.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "px-3 py-2 text-sm text-slate-400 font-semibold",
+				children: q.length < 2 ? "Type at least 2 characters to search..." : "No matches — press Enter to use this value"
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [displayed.map((opt, i) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				id: optionId(i),
+				role: "option",
+				"aria-selected": opt.value === value,
+				onMouseDown: (e) => {
+					e.preventDefault();
+					selectOption(opt);
+				},
+				className: `px-3 py-2 text-sm cursor-pointer transition-colors ${i === highlightIndex ? "bg-blue-50 text-brand-blue font-semibold" : "text-slate-700 hover:bg-slate-50"} ${opt.value === value ? "font-medium" : ""}`,
+				children: opt.label
+			}, opt.value)), filtered.length > DISPLAY_LIMIT && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "px-3 py-2 text-xs text-slate-400 font-semibold text-center border-t border-slate-100",
+				children: [
+					"+",
+					filtered.length - DISPLAY_LIMIT,
+					" more results — refine your search"
+				]
+			})] })
+		})]
+	});
+}
+//#endregion
+exports.Combobox = Combobox;
+
+//# sourceMappingURL=index23.cjs.map

package/lib/index23.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index23.cjs","names":[],"sources":["../src/ui-library/gallery/combobox/Combobox.tsx"],"sourcesContent":["/**\n * Combobox — Gallery-native searchable dropdown.\n * Copied from shared/components/PisCombobox.tsx and isolated.\n * No production imports.\n */\nimport { useState, useRef, useEffect, useId } from 'react';\nimport { ChevronDown } from 'lucide-react';\n\nexport interface ComboboxProps {\n  value: string;\n  onChange: (value: string) => void;\n  options: { value: string; label: string }[];\n  placeholder?: string;\n  className?: string;\n  disabled?: boolean;\n  loading?: boolean;\n  error?: string;\n}\n\nconst fieldInputClass =\n  'w-full rounded-xl border border-slate-200 bg-slate-50 px-4 py-2.5 text-sm font-medium text-slate-900 outline-none transition placeholder:text-slate-400 focus:border-brand-blue/40 focus:ring-2 focus:ring-brand-blue/15 disabled:cursor-not-allowed disabled:opacity-60';\nconst fieldInputErrorClass = 'border-rose-300 focus:border-rose-400 focus:ring-rose-100';\n\nexport function Combobox({ value, onChange, options, placeholder, className, disabled, loading, error }: ComboboxProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const [search, setSearch] = useState(value);\n  const [highlightIndex, setHighlightIndex] = useState(-1);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  const uid = useId();\n  const listboxId = `${uid}-listbox`;\n  const optionId = (index: number) => `${uid}-option-${index}`;\n\n  const q = search.toLowerCase().trim();\n  const filtered = q.length < 2 ? [] : options.filter(opt =>\n    opt.label.toLowerCase().includes(q)\n  ).sort((a, b) => {\n    const al = a.label.toLowerCase();\n    const bl = b.label.toLowerCase();\n    const aScore = al === q ? 0 : al.startsWith(q) ? 1 : al.indexOf(q) + 2;\n    const bScore = bl === q ? 0 : bl.startsWith(q) ? 1 : bl.indexOf(q) + 2;\n    return aScore - bScore;\n  });\n  const DISPLAY_LIMIT = 100;\n  const displayed = filtered.length > DISPLAY_LIMIT ? filtered.slice(0, DISPLAY_LIMIT) : filtered;\n\n  // eslint-disable-next-line react-hooks/set-state-in-effect\n  useEffect(() => { setSearch(value); }, [value]);\n\n  useEffect(() => {\n    function handleClickOutside(e: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(e.target as Node)) setIsOpen(false);\n    }\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  // eslint-disable-next-line react-hooks/set-state-in-effect\n  useEffect(() => { if (!isOpen) setHighlightIndex(-1); }, [isOpen]);\n\n  useEffect(() => {\n    if (highlightIndex >= 0 && listRef.current) {\n      const item = listRef.current.children[highlightIndex] as HTMLElement;\n      item?.scrollIntoView({ block: 'nearest' });\n    }\n  }, [highlightIndex]);\n\n  const selectOption = (opt: { value: string; label: string }) => {\n    onChange(opt.value);\n    setSearch(opt.label);\n    setIsOpen(false);\n    inputRef.current?.focus();\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const val = e.target.value;\n    setSearch(val);\n    onChange(val);\n    setIsOpen(true);\n    setHighlightIndex(-1);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      if (!isOpen) { setIsOpen(true); return; }\n      setHighlightIndex(prev => Math.min(prev + 1, displayed.length - 1));\n    } else if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      setHighlightIndex(prev => Math.max(prev - 1, -1));\n    } else if (e.key === 'Enter') {\n      e.preventDefault();\n      if (highlightIndex >= 0 && displayed[highlightIndex]) selectOption(displayed[highlightIndex]);\n      else if (isOpen) setIsOpen(false);\n    } else if (e.key === 'Escape') {\n      e.preventDefault();\n      setIsOpen(false);\n    }\n  };\n\n  return (\n    <div ref={wrapperRef} className=\"relative\">\n      <div className=\"relative\">\n        <input\n          ref={inputRef}\n          type=\"text\"\n          role=\"combobox\"\n          aria-expanded={isOpen}\n          aria-controls={listboxId}\n          aria-activedescendant={highlightIndex >= 0 ? optionId(highlightIndex) : undefined}\n          aria-autocomplete=\"list\"\n          aria-invalid={error ? 'true' : undefined}\n          value={search}\n          onChange={handleInputChange}\n          onFocus={() => setIsOpen(true)}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled}\n          className={`${fieldInputClass} pr-8${error ? ` ${fieldInputErrorClass}` : ''}${className ? ` ${className}` : ''}`}\n        />\n        <ChevronDown\n          size={16}\n          aria-hidden=\"true\"\n          className={`absolute right-3 top-1/2 -translate-y-1/2 text-slate-300 pointer-events-none transition-transform ${isOpen ? 'rotate-180' : ''}`}\n        />\n      </div>\n\n      {isOpen && !disabled && (\n        <div ref={listRef} id={listboxId} role=\"listbox\"\n          className=\"absolute z-50 mt-1 w-full bg-white border border-slate-200 rounded-xl shadow-lg max-h-60 overflow-y-auto\"\n        >\n          {error ? (\n            <div className=\"px-3 py-2 text-sm text-rose-500 font-semibold\">{error}</div>\n          ) : loading ? (\n            <div className=\"px-3 py-2 text-sm text-slate-400 font-semibold\">Loading...</div>\n          ) : filtered.length === 0 ? (\n            <div className=\"px-3 py-2 text-sm text-slate-400 font-semibold\">\n              {q.length < 2 ? 'Type at least 2 characters to search...' : 'No matches — press Enter to use this value'}\n            </div>\n          ) : (\n            <>\n              {displayed.map((opt, i) => (\n                <div key={opt.value} id={optionId(i)} role=\"option\" aria-selected={opt.value === value}\n                  onMouseDown={(e) => { e.preventDefault(); selectOption(opt); }}\n                  className={`px-3 py-2 text-sm cursor-pointer transition-colors ${i === highlightIndex ? 'bg-blue-50 text-brand-blue font-semibold' : 'text-slate-700 hover:bg-slate-50'} ${opt.value === value ? 'font-medium' : ''}`}\n                >\n                  {opt.label}\n                </div>\n              ))}\n              {filtered.length > DISPLAY_LIMIT && (\n                <div className=\"px-3 py-2 text-xs text-slate-400 font-semibold text-center border-t border-slate-100\">\n                  +{filtered.length - DISPLAY_LIMIT} more results — refine your search\n                </div>\n              )}\n            </>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/lib/index23.mjs

@@ -0,0 +1,143 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from "react";
+import { ChevronDown } from "lucide-react";
+//#region src/ui-library/gallery/combobox/Combobox.tsx
+/**
+* Combobox — Gallery-native searchable dropdown.
+* Copied from shared/components/PisCombobox.tsx and isolated.
+* No production imports.
+*/
+var fieldInputClass = "w-full rounded-xl border border-slate-200 bg-slate-50 px-4 py-2.5 text-sm font-medium text-slate-900 outline-none transition placeholder:text-slate-400 focus:border-brand-blue/40 focus:ring-2 focus:ring-brand-blue/15 disabled:cursor-not-allowed disabled:opacity-60";
+var fieldInputErrorClass = "border-rose-300 focus:border-rose-400 focus:ring-rose-100";
+function Combobox({ value, onChange, options, placeholder, className, disabled, loading, error }) {
+	const [isOpen, setIsOpen] = useState(false);
+	const [search, setSearch] = useState(value);
+	const [highlightIndex, setHighlightIndex] = useState(-1);
+	const inputRef = useRef(null);
+	const listRef = useRef(null);
+	const wrapperRef = useRef(null);
+	const uid = useId();
+	const listboxId = `${uid}-listbox`;
+	const optionId = (index) => `${uid}-option-${index}`;
+	const q = search.toLowerCase().trim();
+	const filtered = q.length < 2 ? [] : options.filter((opt) => opt.label.toLowerCase().includes(q)).sort((a, b) => {
+		const al = a.label.toLowerCase();
+		const bl = b.label.toLowerCase();
+		return (al === q ? 0 : al.startsWith(q) ? 1 : al.indexOf(q) + 2) - (bl === q ? 0 : bl.startsWith(q) ? 1 : bl.indexOf(q) + 2);
+	});
+	const DISPLAY_LIMIT = 100;
+	const displayed = filtered.length > DISPLAY_LIMIT ? filtered.slice(0, DISPLAY_LIMIT) : filtered;
+	useEffect(() => {
+		setSearch(value);
+	}, [value]);
+	useEffect(() => {
+		function handleClickOutside(e) {
+			if (wrapperRef.current && !wrapperRef.current.contains(e.target)) setIsOpen(false);
+		}
+		document.addEventListener("mousedown", handleClickOutside);
+		return () => document.removeEventListener("mousedown", handleClickOutside);
+	}, []);
+	useEffect(() => {
+		if (!isOpen) setHighlightIndex(-1);
+	}, [isOpen]);
+	useEffect(() => {
+		if (highlightIndex >= 0 && listRef.current) listRef.current.children[highlightIndex]?.scrollIntoView({ block: "nearest" });
+	}, [highlightIndex]);
+	const selectOption = (opt) => {
+		onChange(opt.value);
+		setSearch(opt.label);
+		setIsOpen(false);
+		inputRef.current?.focus();
+	};
+	const handleInputChange = (e) => {
+		const val = e.target.value;
+		setSearch(val);
+		onChange(val);
+		setIsOpen(true);
+		setHighlightIndex(-1);
+	};
+	const handleKeyDown = (e) => {
+		if (e.key === "ArrowDown") {
+			e.preventDefault();
+			if (!isOpen) {
+				setIsOpen(true);
+				return;
+			}
+			setHighlightIndex((prev) => Math.min(prev + 1, displayed.length - 1));
+		} else if (e.key === "ArrowUp") {
+			e.preventDefault();
+			setHighlightIndex((prev) => Math.max(prev - 1, -1));
+		} else if (e.key === "Enter") {
+			e.preventDefault();
+			if (highlightIndex >= 0 && displayed[highlightIndex]) selectOption(displayed[highlightIndex]);
+			else if (isOpen) setIsOpen(false);
+		} else if (e.key === "Escape") {
+			e.preventDefault();
+			setIsOpen(false);
+		}
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		ref: wrapperRef,
+		className: "relative",
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ jsx("input", {
+				ref: inputRef,
+				type: "text",
+				role: "combobox",
+				"aria-expanded": isOpen,
+				"aria-controls": listboxId,
+				"aria-activedescendant": highlightIndex >= 0 ? optionId(highlightIndex) : void 0,
+				"aria-autocomplete": "list",
+				"aria-invalid": error ? "true" : void 0,
+				value: search,
+				onChange: handleInputChange,
+				onFocus: () => setIsOpen(true),
+				onKeyDown: handleKeyDown,
+				placeholder,
+				disabled,
+				className: `${fieldInputClass} pr-8${error ? ` ${fieldInputErrorClass}` : ""}${className ? ` ${className}` : ""}`
+			}), /* @__PURE__ */ jsx(ChevronDown, {
+				size: 16,
+				"aria-hidden": "true",
+				className: `absolute right-3 top-1/2 -translate-y-1/2 text-slate-300 pointer-events-none transition-transform ${isOpen ? "rotate-180" : ""}`
+			})]
+		}), isOpen && !disabled && /* @__PURE__ */ jsx("div", {
+			ref: listRef,
+			id: listboxId,
+			role: "listbox",
+			className: "absolute z-50 mt-1 w-full bg-white border border-slate-200 rounded-xl shadow-lg max-h-60 overflow-y-auto",
+			children: error ? /* @__PURE__ */ jsx("div", {
+				className: "px-3 py-2 text-sm text-rose-500 font-semibold",
+				children: error
+			}) : loading ? /* @__PURE__ */ jsx("div", {
+				className: "px-3 py-2 text-sm text-slate-400 font-semibold",
+				children: "Loading..."
+			}) : filtered.length === 0 ? /* @__PURE__ */ jsx("div", {
+				className: "px-3 py-2 text-sm text-slate-400 font-semibold",
+				children: q.length < 2 ? "Type at least 2 characters to search..." : "No matches — press Enter to use this value"
+			}) : /* @__PURE__ */ jsxs(Fragment, { children: [displayed.map((opt, i) => /* @__PURE__ */ jsx("div", {
+				id: optionId(i),
+				role: "option",
+				"aria-selected": opt.value === value,
+				onMouseDown: (e) => {
+					e.preventDefault();
+					selectOption(opt);
+				},
+				className: `px-3 py-2 text-sm cursor-pointer transition-colors ${i === highlightIndex ? "bg-blue-50 text-brand-blue font-semibold" : "text-slate-700 hover:bg-slate-50"} ${opt.value === value ? "font-medium" : ""}`,
+				children: opt.label
+			}, opt.value)), filtered.length > DISPLAY_LIMIT && /* @__PURE__ */ jsxs("div", {
+				className: "px-3 py-2 text-xs text-slate-400 font-semibold text-center border-t border-slate-100",
+				children: [
+					"+",
+					filtered.length - DISPLAY_LIMIT,
+					" more results — refine your search"
+				]
+			})] })
+		})]
+	});
+}
+//#endregion
+export { Combobox };
+
+//# sourceMappingURL=index23.mjs.map

package/lib/index23.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index23.mjs","names":[],"sources":["../src/ui-library/gallery/combobox/Combobox.tsx"],"sourcesContent":["/**\n * Combobox — Gallery-native searchable dropdown.\n * Copied from shared/components/PisCombobox.tsx and isolated.\n * No production imports.\n */\nimport { useState, useRef, useEffect, useId } from 'react';\nimport { ChevronDown } from 'lucide-react';\n\nexport interface ComboboxProps {\n  value: string;\n  onChange: (value: string) => void;\n  options: { value: string; label: string }[];\n  placeholder?: string;\n  className?: string;\n  disabled?: boolean;\n  loading?: boolean;\n  error?: string;\n}\n\nconst fieldInputClass =\n  'w-full rounded-xl border border-slate-200 bg-slate-50 px-4 py-2.5 text-sm font-medium text-slate-900 outline-none transition placeholder:text-slate-400 focus:border-brand-blue/40 focus:ring-2 focus:ring-brand-blue/15 disabled:cursor-not-allowed disabled:opacity-60';\nconst fieldInputErrorClass = 'border-rose-300 focus:border-rose-400 focus:ring-rose-100';\n\nexport function Combobox({ value, onChange, options, placeholder, className, disabled, loading, error }: ComboboxProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const [search, setSearch] = useState(value);\n  const [highlightIndex, setHighlightIndex] = useState(-1);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLDivElement>(null);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  const uid = useId();\n  const listboxId = `${uid}-listbox`;\n  const optionId = (index: number) => `${uid}-option-${index}`;\n\n  const q = search.toLowerCase().trim();\n  const filtered = q.length < 2 ? [] : options.filter(opt =>\n    opt.label.toLowerCase().includes(q)\n  ).sort((a, b) => {\n    const al = a.label.toLowerCase();\n    const bl = b.label.toLowerCase();\n    const aScore = al === q ? 0 : al.startsWith(q) ? 1 : al.indexOf(q) + 2;\n    const bScore = bl === q ? 0 : bl.startsWith(q) ? 1 : bl.indexOf(q) + 2;\n    return aScore - bScore;\n  });\n  const DISPLAY_LIMIT = 100;\n  const displayed = filtered.length > DISPLAY_LIMIT ? filtered.slice(0, DISPLAY_LIMIT) : filtered;\n\n  // eslint-disable-next-line react-hooks/set-state-in-effect\n  useEffect(() => { setSearch(value); }, [value]);\n\n  useEffect(() => {\n    function handleClickOutside(e: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(e.target as Node)) setIsOpen(false);\n    }\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  // eslint-disable-next-line react-hooks/set-state-in-effect\n  useEffect(() => { if (!isOpen) setHighlightIndex(-1); }, [isOpen]);\n\n  useEffect(() => {\n    if (highlightIndex >= 0 && listRef.current) {\n      const item = listRef.current.children[highlightIndex] as HTMLElement;\n      item?.scrollIntoView({ block: 'nearest' });\n    }\n  }, [highlightIndex]);\n\n  const selectOption = (opt: { value: string; label: string }) => {\n    onChange(opt.value);\n    setSearch(opt.label);\n    setIsOpen(false);\n    inputRef.current?.focus();\n  };\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const val = e.target.value;\n    setSearch(val);\n    onChange(val);\n    setIsOpen(true);\n    setHighlightIndex(-1);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      if (!isOpen) { setIsOpen(true); return; }\n      setHighlightIndex(prev => Math.min(prev + 1, displayed.length - 1));\n    } else if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      setHighlightIndex(prev => Math.max(prev - 1, -1));\n    } else if (e.key === 'Enter') {\n      e.preventDefault();\n      if (highlightIndex >= 0 && displayed[highlightIndex]) selectOption(displayed[highlightIndex]);\n      else if (isOpen) setIsOpen(false);\n    } else if (e.key === 'Escape') {\n      e.preventDefault();\n      setIsOpen(false);\n    }\n  };\n\n  return (\n    <div ref={wrapperRef} className=\"relative\">\n      <div className=\"relative\">\n        <input\n          ref={inputRef}\n          type=\"text\"\n          role=\"combobox\"\n          aria-expanded={isOpen}\n          aria-controls={listboxId}\n          aria-activedescendant={highlightIndex >= 0 ? optionId(highlightIndex) : undefined}\n          aria-autocomplete=\"list\"\n          aria-invalid={error ? 'true' : undefined}\n          value={search}\n          onChange={handleInputChange}\n          onFocus={() => setIsOpen(true)}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled}\n          className={`${fieldInputClass} pr-8${error ? ` ${fieldInputErrorClass}` : ''}${className ? ` ${className}` : ''}`}\n        />\n        <ChevronDown\n          size={16}\n          aria-hidden=\"true\"\n          className={`absolute right-3 top-1/2 -translate-y-1/2 text-slate-300 pointer-events-none transition-transform ${isOpen ? 'rotate-180' : ''}`}\n        />\n      </div>\n\n      {isOpen && !disabled && (\n        <div ref={listRef} id={listboxId} role=\"listbox\"\n          className=\"absolute z-50 mt-1 w-full bg-white border border-slate-200 rounded-xl shadow-lg max-h-60 overflow-y-auto\"\n        >\n          {error ? (\n            <div className=\"px-3 py-2 text-sm text-rose-500 font-semibold\">{error}</div>\n          ) : loading ? (\n            <div className=\"px-3 py-2 text-sm text-slate-400 font-semibold\">Loading...</div>\n          ) : filtered.length === 0 ? (\n            <div className=\"px-3 py-2 text-sm text-slate-400 font-semibold\">\n              {q.length < 2 ? 'Type at least 2 characters to search...' : 'No matches — press Enter to use this value'}\n            </div>\n          ) : (\n            <>\n              {displayed.map((opt, i) => (\n                <div key={opt.value} id={optionId(i)} role=\"option\" aria-selected={opt.value === value}\n                  onMouseDown={(e) => { e.preventDefault(); selectOption(opt); }}\n                  className={`px-3 py-2 text-sm cursor-pointer transition-colors ${i === highlightIndex ? 'bg-blue-50 text-brand-blue font-semibold' : 'text-slate-700 hover:bg-slate-50'} ${opt.value === value ? 'font-medium' : ''}`}\n                >\n                  {opt.label}\n                </div>\n              ))}\n              {filtered.length > DISPLAY_LIMIT && (\n                <div className=\"px-3 py-2 text-xs text-slate-400 font-semibold text-center border-t border-slate-100\">\n                  +{filtered.length - DISPLAY_LIMIT} more results — refine your search\n                </div>\n              )}\n            </>\n          )}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/lib/index25.cjs

@@ -0,0 +1,177 @@
+const require_runtime = require("./index2.cjs");
+const require_FieldContext = require("./index12.cjs");
+;/* empty css          */
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+let lucide_react = require("lucide-react");
+let react_calendar = require("react-calendar");
+react_calendar = require_runtime.__toESM(react_calendar, 1);
+let date_fns = require("date-fns");
+//#region src/ui-library/gallery/date-picker/DatePicker.tsx
+/**
+* DatePicker — Gallery-native date picker.
+* Copied from shared/components/PisDatePicker.tsx.
+* Updated to import FieldContext from gallery-local field directory.
+* Uses react-calendar and date-fns.
+* Note: CSS for .pis-datepicker-popover and .pis-rc-calendar is in index.css.
+*/
+var MAX_DATE = new Date(2026, 11, 31);
+var POPOVER_WIDTH = 352;
+var CALENDAR_HEIGHT = 360;
+function DatePicker({ value, onChange, placeholder, className, disabled, error, minDate, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, required }) {
+	const [isOpen, setIsOpen] = (0, react.useState)(false);
+	const [popupStyle, setPopupStyle] = (0, react.useState)({});
+	const wrapperRef = (0, react.useRef)(null);
+	const inputRef = (0, react.useRef)(null);
+	const internalId = (0, react.useId)();
+	const ctx = require_FieldContext.useFieldContext();
+	const inputId = id ?? ctx?.inputId ?? internalId;
+	const resolvedRequired = required ?? ctx?.required ?? false;
+	const resolvedInvalid = error ? true : ctx?.invalid ?? false;
+	const describedBy = ctx?.invalid && ctx?.errorId ? ctx.errorId : void 0;
+	const selectedDate = value ? (() => {
+		const d = (0, date_fns.parse)(value, "yyyy-MM-dd", /* @__PURE__ */ new Date());
+		if ((0, date_fns.isValid)(d)) return d;
+		const d2 = new Date(value);
+		return isNaN(d2.getTime()) ? void 0 : d2;
+	})() : void 0;
+	const displayValue = selectedDate ? (0, date_fns.format)(selectedDate, "MMM d, yyyy") : "";
+	const skipNextOpen = (0, react.useRef)(false);
+	const openPopup = (0, react.useCallback)(() => {
+		if (disabled || !wrapperRef.current) return;
+		if (skipNextOpen.current) {
+			skipNextOpen.current = false;
+			return;
+		}
+		const rect = wrapperRef.current.getBoundingClientRect();
+		const spaceBelow = window.innerHeight - rect.bottom;
+		const spaceAbove = rect.top;
+		const isNarrow = window.innerWidth < 368;
+		const style = {
+			position: "fixed",
+			left: isNarrow ? 8 : Math.max(8, Math.min(rect.left, window.innerWidth - POPOVER_WIDTH - 8)),
+			width: isNarrow ? `calc(100vw - 16px)` : void 0
+		};
+		if (spaceBelow >= CALENDAR_HEIGHT || spaceBelow >= spaceAbove) style.top = rect.bottom + 6;
+		else style.top = rect.top - CALENDAR_HEIGHT - 6;
+		setPopupStyle(style);
+		setIsOpen(true);
+	}, [disabled]);
+	(0, react.useEffect)(() => {
+		function handleClickOutside(e) {
+			if (wrapperRef.current && !wrapperRef.current.contains(e.target)) setIsOpen(false);
+		}
+		document.addEventListener("mousedown", handleClickOutside);
+		return () => document.removeEventListener("mousedown", handleClickOutside);
+	}, []);
+	(0, react.useEffect)(() => {
+		if (!isOpen) return;
+		function handleScroll() {
+			setIsOpen(false);
+		}
+		window.addEventListener("scroll", handleScroll, { capture: true });
+		window.addEventListener("resize", handleScroll);
+		return () => {
+			window.removeEventListener("scroll", handleScroll, { capture: true });
+			window.removeEventListener("resize", handleScroll);
+		};
+	}, [isOpen]);
+	(0, react.useEffect)(() => {
+		if (!isOpen) return;
+		function handleFocusOut(e) {
+			if (!e.relatedTarget) return;
+			if (wrapperRef.current && !wrapperRef.current.contains(e.relatedTarget)) setIsOpen(false);
+		}
+		const wrapper = wrapperRef.current;
+		wrapper?.addEventListener("focusout", handleFocusOut);
+		return () => wrapper?.removeEventListener("focusout", handleFocusOut);
+	}, [isOpen]);
+	function handleKeyDown(e) {
+		if (e.key === "Escape") {
+			e.preventDefault();
+			setIsOpen(false);
+			inputRef.current?.focus();
+			return;
+		}
+		if (e.key === " " || e.key === "Enter") {
+			e.preventDefault();
+			if (isOpen) setIsOpen(false);
+			else openPopup();
+		}
+	}
+	const inputClasses = [
+		"w-full rounded-xl border bg-slate-50 px-4 py-2.5 text-sm font-medium text-slate-900 outline-none transition placeholder:text-slate-400 pr-8 cursor-pointer select-none",
+		error ? "border-rose-300 focus:border-rose-400 focus:ring-2 focus:ring-rose-100" : "border-slate-200 focus:border-brand-blue/40 focus:ring-2 focus:ring-brand-blue/15",
+		disabled ? "cursor-not-allowed opacity-60" : "",
+		className ?? ""
+	].filter(Boolean).join(" ");
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		ref: wrapperRef,
+		className: "relative",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+				ref: inputRef,
+				id: inputId,
+				type: "text",
+				readOnly: true,
+				value: displayValue,
+				onFocus: openPopup,
+				onClick: openPopup,
+				onKeyDown: handleKeyDown,
+				placeholder,
+				disabled,
+				"aria-label": ariaLabel,
+				"aria-labelledby": ariaLabelledBy,
+				"aria-required": resolvedRequired ? "true" : void 0,
+				"aria-invalid": resolvedInvalid ? "true" : void 0,
+				"aria-describedby": describedBy,
+				"aria-haspopup": "dialog",
+				"aria-expanded": isOpen,
+				role: "combobox",
+				className: inputClasses
+			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CalendarDays, {
+				size: 16,
+				className: `absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none ${isOpen ? "text-brand-blue" : "text-slate-300"}`,
+				"aria-hidden": "true"
+			})]
+		}), isOpen && !disabled && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "pis-datepicker-popover",
+			style: popupStyle,
+			role: "dialog",
+			"aria-label": ariaLabel ? `${ariaLabel} calendar` : "Date picker",
+			"aria-modal": "false",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_calendar.default, {
+				value: selectedDate ?? null,
+				onChange: (val) => {
+					if (val instanceof Date) {
+						onChange((0, date_fns.format)(val, "yyyy-MM-dd"));
+						setIsOpen(false);
+						skipNextOpen.current = true;
+						requestAnimationFrame(() => inputRef.current?.focus());
+					}
+				},
+				defaultActiveStartDate: selectedDate ?? minDate,
+				minDate,
+				maxDate: MAX_DATE,
+				defaultView: "month",
+				showNeighboringDecade: true,
+				showNeighboringCentury: true,
+				prevLabel: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronLeft, { size: 14 }),
+				nextLabel: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronRight, { size: 14 }),
+				prev2Label: null,
+				next2Label: null,
+				navigationLabel: ({ date, view }) => {
+					if (view === "month") return (0, date_fns.format)(date, "MMMM yyyy");
+					if (view === "year") return (0, date_fns.format)(date, "yyyy");
+					return `${Math.floor(date.getFullYear() / 10) * 10} – ${Math.floor(date.getFullYear() / 10) * 10 + 9}`;
+				},
+				className: "pis-rc-calendar"
+			}, isOpen ? "open" : "closed")
+		})]
+	});
+}
+//#endregion
+exports.DatePicker = DatePicker;
+
+//# sourceMappingURL=index25.cjs.map

package/lib/index25.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index25.cjs","names":[],"sources":["../src/ui-library/gallery/date-picker/DatePicker.tsx"],"sourcesContent":["/**\n * DatePicker — Gallery-native date picker.\n * Copied from shared/components/PisDatePicker.tsx.\n * Updated to import FieldContext from gallery-local field directory.\n * Uses react-calendar and date-fns.\n * Note: CSS for .pis-datepicker-popover and .pis-rc-calendar is in index.css.\n */\nimport { useState, useRef, useEffect, useCallback, useId } from 'react';\nimport Calendar from 'react-calendar';\nimport { format, parse, isValid } from 'date-fns';\nimport { CalendarDays, ChevronLeft, ChevronRight } from 'lucide-react';\nimport 'react-calendar/dist/Calendar.css';\nimport { useFieldContext } from '../field/FieldContext';\n\ninterface DatePickerProps {\n  value: string;\n  onChange: (value: string) => void;\n  placeholder?: string;\n  className?: string;\n  disabled?: boolean;\n  error?: string;\n  minDate?: Date;\n  id?: string;\n  'aria-label'?: string;\n  'aria-labelledby'?: string;\n  required?: boolean;\n}\n\nconst MAX_DATE = new Date(2026, 11, 31);\nconst CALENDAR_WIDTH = 320;\nconst POPOVER_WIDTH = CALENDAR_WIDTH + 32;\nconst CALENDAR_HEIGHT = 360;\n\nexport function DatePicker({\n  value,\n  onChange,\n  placeholder,\n  className,\n  disabled,\n  error,\n  minDate,\n  id,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  required,\n}: DatePickerProps) {\n  const [isOpen, setIsOpen] = useState(false);\n  const [popupStyle, setPopupStyle] = useState<React.CSSProperties>({});\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const internalId = useId();\n\n  const ctx = useFieldContext();\n  const inputId          = id       ?? ctx?.inputId  ?? internalId;\n  const resolvedRequired = required ?? ctx?.required ?? false;\n  const resolvedInvalid  = error    ? true           : (ctx?.invalid ?? false);\n  const describedBy      = ctx?.invalid && ctx?.errorId ? ctx.errorId : undefined;\n\n  const selectedDate = value\n    ? (() => {\n        const d = parse(value, 'yyyy-MM-dd', new Date());\n        if (isValid(d)) return d;\n        const d2 = new Date(value);\n        return isNaN(d2.getTime()) ? undefined : d2;\n      })()\n    : undefined;\n\n  const displayValue = selectedDate ? format(selectedDate, 'MMM d, yyyy') : '';\n\n  const skipNextOpen = useRef(false);\n\n  const openPopup = useCallback(() => {\n    if (disabled || !wrapperRef.current) return;\n    if (skipNextOpen.current) {\n      skipNextOpen.current = false;\n      return;\n    }\n    const rect = wrapperRef.current.getBoundingClientRect();\n    const spaceBelow = window.innerHeight - rect.bottom;\n    const spaceAbove = rect.top;\n\n    const isNarrow = window.innerWidth < POPOVER_WIDTH + 16;\n    const style: React.CSSProperties = {\n      position: 'fixed',\n      left: isNarrow ? 8 : Math.max(8, Math.min(rect.left, window.innerWidth - POPOVER_WIDTH - 8)),\n      width: isNarrow ? `calc(100vw - 16px)` : undefined,\n    };\n\n    if (spaceBelow >= CALENDAR_HEIGHT || spaceBelow >= spaceAbove) {\n      style.top = rect.bottom + 6;\n    } else {\n      style.top = rect.top - CALENDAR_HEIGHT - 6;\n    }\n\n    setPopupStyle(style);\n    setIsOpen(true);\n  }, [disabled]);\n\n  useEffect(() => {\n    function handleClickOutside(e: MouseEvent) {\n      if (wrapperRef.current && !wrapperRef.current.contains(e.target as Node)) {\n        setIsOpen(false);\n      }\n    }\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  useEffect(() => {\n    if (!isOpen) return;\n    function handleScroll() { setIsOpen(false); }\n    window.addEventListener('scroll', handleScroll, { capture: true });\n    window.addEventListener('resize', handleScroll);\n    return () => {\n      window.removeEventListener('scroll', handleScroll, { capture: true });\n      window.removeEventListener('resize', handleScroll);\n    };\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n    function handleFocusOut(e: FocusEvent) {\n      if (!e.relatedTarget) return;\n      if (wrapperRef.current && !wrapperRef.current.contains(e.relatedTarget as Node)) {\n        setIsOpen(false);\n      }\n    }\n    const wrapper = wrapperRef.current;\n    wrapper?.addEventListener('focusout', handleFocusOut);\n    return () => wrapper?.removeEventListener('focusout', handleFocusOut);\n  }, [isOpen]);\n\n  function handleKeyDown(e: React.KeyboardEvent<HTMLInputElement>) {\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      setIsOpen(false);\n      inputRef.current?.focus();\n      return;\n    }\n    if (e.key === ' ' || e.key === 'Enter') {\n      e.preventDefault();\n      if (isOpen) setIsOpen(false);\n      else openPopup();\n    }\n  }\n\n  const inputClasses = [\n    'w-full rounded-xl border bg-slate-50 px-4 py-2.5 text-sm font-medium text-slate-900 outline-none transition placeholder:text-slate-400 pr-8 cursor-pointer select-none',\n    error ? 'border-rose-300 focus:border-rose-400 focus:ring-2 focus:ring-rose-100' : 'border-slate-200 focus:border-brand-blue/40 focus:ring-2 focus:ring-brand-blue/15',\n    disabled ? 'cursor-not-allowed opacity-60' : '',\n    className ?? '',\n  ].filter(Boolean).join(' ');\n\n  return (\n    <div ref={wrapperRef} className=\"relative\">\n      <div className=\"relative\">\n        <input\n          ref={inputRef}\n          id={inputId}\n          type=\"text\"\n          readOnly\n          value={displayValue}\n          onFocus={openPopup}\n          onClick={openPopup}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          disabled={disabled}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledBy}\n          aria-required={resolvedRequired ? 'true' : undefined}\n          aria-invalid={resolvedInvalid ? 'true' : undefined}\n          aria-describedby={describedBy}\n          aria-haspopup=\"dialog\"\n          aria-expanded={isOpen}\n          role=\"combobox\"\n          className={inputClasses}\n        />\n        <CalendarDays\n          size={16}\n          className={`absolute right-3 top-1/2 -translate-y-1/2 pointer-events-none ${isOpen ? 'text-brand-blue' : 'text-slate-300'}`}\n          aria-hidden=\"true\"\n        />\n      </div>\n\n      {isOpen && !disabled && (\n        <div\n          className=\"pis-datepicker-popover\"\n          style={popupStyle}\n          role=\"dialog\"\n          aria-label={ariaLabel ? `${ariaLabel} calendar` : 'Date picker'}\n          aria-modal=\"false\"\n        >\n          <Calendar\n            key={isOpen ? 'open' : 'closed'}\n            value={selectedDate ?? null}\n            onChange={(val) => {\n              if (val instanceof Date) {\n                onChange(format(val, 'yyyy-MM-dd'));\n                setIsOpen(false);\n                skipNextOpen.current = true;\n                requestAnimationFrame(() => inputRef.current?.focus());\n              }\n            }}\n            defaultActiveStartDate={selectedDate ?? minDate}\n            minDate={minDate}\n            maxDate={MAX_DATE}\n            defaultView=\"month\"\n            showNeighboringDecade={true}\n            showNeighboringCentury={true}\n            prevLabel={<ChevronLeft size={14} />}\n            nextLabel={<ChevronRight size={14} />}\n            prev2Label={null}\n            next2Label={null}\n            navigationLabel={({ date, view }) => {\n              if (view === 'month') return format(date, 'MMMM yyyy');\n              if (view === 'year') return format(date, 'yyyy');\n              return `${Math.floor(date.getFullYear() / 10) * 10} – ${Math.floor(date.getFullYear() / 10) * 10 + 9}`;\n            }}\n            className=\"pis-rc-calendar\"\n          />\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}