wimui 0.1.0

package/dist/components/form/Cascader/Cascader.js

@@ -0,0 +1,234 @@
+"use client";
+import { Transition as e } from "../../layout/Transition/Transition.js";
+import t from "../../../icon/chevron-right.js";
+import { Icon as n } from "../../media/Icon/Icon.js";
+import { BaseListItem as r } from "../../_internal/BaseListItem/BaseListItem.js";
+import { InputBase as i } from "../InputBase/InputBase.js";
+import a from "./cascader.module.js";
+import { FieldTemplate as o } from "../FieldTemplate/FieldTemplate.js";
+import s, { useEffect as c, useId as l, useRef as u, useState as d } from "react";
+import f from "classnames";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/form/Cascader/Cascader.tsx
+function h(e) {
+	return typeof e == "string" ? e : typeof e == "number" ? String(e) : "";
+}
+var g = ({ options: g = [], value: _, onChange: v, placeholder: y, label: b, error: x, required: S, layout: ee, className: te, disabled: C = !1, defaultValue: w, id: T, expandTrigger: ne = "click", separator: E = " / ", allowClear: re = !1, "aria-label": ie, width: ae, fullWidth: oe = !1, ...D }) => {
+	let O = l(), k = T || `wim-cascader-${O}`, A = b ? `${k}-label` : void 0, j = x ? `${k}-error` : void 0, se = `${k}-trigger`, M = `${k}-popup`, [N, P] = d(!1), [ce, F] = d(w || []), [I, L] = d([]), [R, z] = d(-1), [B, V] = d([]), [H, U] = d(!1), W = u(null), G = u(null), K = _ !== void 0, q = K ? _ : ce;
+	c(() => {
+		let e = (e) => {
+			W.current && !W.current.contains(e.target) && P(!1);
+		};
+		return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, []), c(() => {
+		if (N && R >= 0) {
+			let e = B[R], t = `${k}-menu-${R}-option-${e}`, n = W.current?.querySelector(`#${t}`);
+			n && n.scrollIntoView({
+				block: "nearest",
+				behavior: "smooth"
+			});
+		}
+	}, [
+		R,
+		B,
+		N,
+		k
+	]);
+	let J = () => {
+		if (!C) {
+			let e = !N;
+			P(e), e ? (L(q || []), z(0), V([0])) : z(-1);
+		}
+	}, le = () => {
+		if (!q || q.length === 0) return null;
+		let e = [], t = g;
+		for (let n of q) {
+			let r = t.find((e) => e.value === n);
+			if (r) e.push(r.label), t = r.children || [];
+			else break;
+		}
+		return e.length === 0 ? null : e.map((t, n) => /* @__PURE__ */ m(s.Fragment, { children: [t, n < e.length - 1 && /* @__PURE__ */ p("span", { children: E })] }, n));
+	}, Y = (e, t) => {
+		if (e.disabled) return;
+		let n = [...I.slice(0, t), e.value];
+		if (L(n), !e.children || e.children.length === 0) {
+			if (K || F(n), v) {
+				let e = [], t = g;
+				for (let r of n) {
+					let n = t.find((e) => e.value === r);
+					n && (e.push(n), t = n.children || []);
+				}
+				v(n, e);
+			}
+			P(!1), G.current?.focus();
+		}
+	}, ue = (e) => {
+		e?.stopPropagation(), !C && (K || F([]), v && v([], []));
+	}, X = (e, t) => {
+		ne === "hover" && !e.disabled && L([...I.slice(0, t), e.value]);
+	}, de = (e) => {
+		if (U(!0), C) return;
+		if (!N) {
+			(e.key === "Enter" || e.key === " " || e.key === "ArrowDown" || e.key === "ArrowDown" && e.altKey) && (e.preventDefault(), J());
+			return;
+		}
+		let t = [g], n = g;
+		for (let e = 0; e < I.length; e++) {
+			let r = I[e], i = n.find((e) => e.value === r);
+			if (i && i.children && i.children.length > 0) t.push(i.children), n = i.children;
+			else break;
+		}
+		let r = t[R] || [], i = B[R] || 0;
+		switch (e.key) {
+			case "ArrowDown":
+				e.preventDefault(), V((e) => {
+					let t = [...e];
+					return t[R] = Math.min(i + 1, r.length - 1), t;
+				});
+				break;
+			case "ArrowUp":
+				e.preventDefault(), V((e) => {
+					let t = [...e];
+					return t[R] = Math.max(i - 1, 0), t;
+				});
+				break;
+			case "ArrowRight": {
+				e.preventDefault();
+				let t = r[i];
+				t && t.children && t.children.length > 0 && (L([...I.slice(0, R), t.value]), z(R + 1), V((e) => [...e.slice(0, R + 1), 0]));
+				break;
+			}
+			case "ArrowLeft":
+				e.preventDefault(), R > 0 && (z(R - 1), V((e) => e.slice(0, R)));
+				break;
+			case "Enter":
+			case " ": {
+				e.preventDefault();
+				let t = r[i];
+				t && Y(t, R);
+				break;
+			}
+			case "Escape":
+				e.preventDefault(), P(!1), z(-1), G.current?.focus();
+				break;
+			case "Home":
+				e.preventDefault(), V((e) => {
+					let t = [...e];
+					return t[R] = 0, t;
+				});
+				break;
+			case "End":
+				e.preventDefault(), V((e) => {
+					let t = [...e];
+					return t[R] = r.length - 1, t;
+				});
+				break;
+			case "Tab":
+				N && (P(!1), z(-1));
+				break;
+		}
+	}, Z = [g], Q = g;
+	for (let e = 0; e < I.length; e++) {
+		let t = I[e], n = Q.find((e) => e.value === t);
+		if (n && n.children && n.children.length > 0) Z.push(n.children), Q = n.children;
+		else break;
+	}
+	let $ = le(), fe = () => {
+		if (!q || q.length === 0) return "";
+		let e = [], t = g;
+		for (let n of q) {
+			let r = t.find((e) => e.value === n);
+			if (r) e.push(h(r.label)), t = r.children || [];
+			else break;
+		}
+		return e.join(E);
+	};
+	return /* @__PURE__ */ p(o, {
+		label: b,
+		error: x,
+		required: S,
+		layout: ee,
+		labelId: A,
+		errorId: j,
+		className: f("wim-cascader", te),
+		children: /* @__PURE__ */ m("div", {
+			className: a.root,
+			ref: W,
+			onMouseMove: () => U(!1),
+			"data-keyboard-nav": H,
+			...D,
+			children: [/* @__PURE__ */ p(i, {
+				disabled: C,
+				allowClear: re,
+				hasValue: !!$,
+				onClear: ue,
+				intent: x ? "danger" : "default",
+				width: ae,
+				fullWidth: oe,
+				rightIcons: [{
+					name: "ChevronDownIcon",
+					rotated: N
+				}],
+				className: f(N && a.open),
+				children: /* @__PURE__ */ p("div", {
+					id: se,
+					ref: G,
+					className: f(a.trigger, C && a.disabled),
+					onClick: J,
+					onKeyDown: de,
+					tabIndex: C ? -1 : 0,
+					role: "combobox",
+					"aria-expanded": N,
+					"aria-controls": M,
+					"aria-haspopup": "listbox",
+					"aria-disabled": C,
+					"aria-labelledby": A,
+					"aria-label": A ? void 0 : ie || fe() || h(y),
+					"aria-describedby": j,
+					"aria-required": S,
+					"aria-invalid": !!x,
+					"aria-activedescendant": N && R >= 0 ? `${k}-menu-${R}-option-${B[R]}` : void 0,
+					children: /* @__PURE__ */ p("div", {
+						className: f(a.value, !$ && a.placeholder),
+						children: $ || y
+					})
+				})
+			}), /* @__PURE__ */ p(e, {
+				show: N && !C,
+				preset: "fade",
+				id: M,
+				className: a.dropdown,
+				children: Z.map((e, i) => /* @__PURE__ */ p("div", {
+					className: a.menu,
+					role: "listbox",
+					children: e.map((e, o) => {
+						let s = I[i] === e.value, c = R === i && B[i] === o, l = q[i] === e.value, u = e.children && e.children.length > 0;
+						return /* @__PURE__ */ p(r, {
+							className: f(a.menuItem, l && a.selected),
+							active: c || s,
+							disabled: e.disabled,
+							onClick: (t) => {
+								t.stopPropagation(), Y(e, i);
+							},
+							onMouseEnter: () => {
+								X(e, i), z(i), V((e) => [...e.slice(0, i), o]);
+							},
+							rightSection: u ? /* @__PURE__ */ p(n, {
+								component: t,
+								size: "sm"
+							}) : void 0,
+							role: "option",
+							id: `${k}-menu-${i}-option-${o}`,
+							"aria-selected": l,
+							tabIndex: -1,
+							children: e.label
+						}, e.value);
+					})
+				}, i))
+			})]
+		})
+	});
+};
+g.displayName = "Cascader";
+//#endregion
+export { g as Cascader };

package/dist/components/form/Cascader/cascader.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_1zc4t_212`,t=`_label_1zc4t_217`,n=`_trigger_1zc4t_224`,r=`_disabled_1zc4t_237`,i=`_open_1zc4t_243`,a=`_value_1zc4t_251`,o=`_placeholder_1zc4t_252`,s=`_icon_1zc4t_255`,c=`_clear_1zc4t_275`,l=`_dropdown_1zc4t_287`,u=`_menu_1zc4t_306`,d=`_menuItem_1zc4t_335`,f=`_active_1zc4t_335`,p=`_selected_1zc4t_343`,m={"wim-docs-container":`_wim-docs-container_1zc4t_103`,"wim-t":`_wim-t_1zc4t_184`,"react-flow":`_react-flow_1zc4t_202`,"react-flow__edges":`_react-flow__edges_1zc4t_203`,"react-flow__connectionline":`_react-flow__connectionline_1zc4t_204`,root:e,label:t,trigger:n,disabled:r,open:i,value:a,placeholder:o,icon:s,clear:c,dropdown:l,menu:u,menuItem:d,active:f,selected:p};exports.active=f,exports.clear=c,exports.default=m,exports.disabled=r,exports.dropdown=l,exports.icon=s,exports.label=t,exports.menu=u,exports.menuItem=d,exports.open=i,exports.placeholder=o,exports.root=e,exports.selected=p,exports.trigger=n,exports.value=a;

package/dist/components/form/Cascader/cascader.module.js

@@ -0,0 +1,25 @@
+"use client";
+//#region src/components/form/Cascader/cascader.module.scss
+var e = "_root_1zc4t_212", t = "_label_1zc4t_217", n = "_trigger_1zc4t_224", r = "_disabled_1zc4t_237", i = "_open_1zc4t_243", a = "_value_1zc4t_251", o = "_placeholder_1zc4t_252", s = "_icon_1zc4t_255", c = "_clear_1zc4t_275", l = "_dropdown_1zc4t_287", u = "_menu_1zc4t_306", d = "_menuItem_1zc4t_335", f = "_active_1zc4t_335", p = "_selected_1zc4t_343", m = {
+	"wim-docs-container": "_wim-docs-container_1zc4t_103",
+	"wim-t": "_wim-t_1zc4t_184",
+	"react-flow": "_react-flow_1zc4t_202",
+	"react-flow__edges": "_react-flow__edges_1zc4t_203",
+	"react-flow__connectionline": "_react-flow__connectionline_1zc4t_204",
+	root: e,
+	label: t,
+	trigger: n,
+	disabled: r,
+	open: i,
+	value: a,
+	placeholder: o,
+	icon: s,
+	clear: c,
+	dropdown: l,
+	menu: u,
+	menuItem: d,
+	active: f,
+	selected: p
+};
+//#endregion
+export { f as active, c as clear, m as default, r as disabled, l as dropdown, s as icon, t as label, u as menu, d as menuItem, i as open, o as placeholder, e as root, p as selected, n as trigger, a as value };

package/dist/components/form/Checkbox/Checkbox.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../hooks/useMergedRef.cjs"),r=require("./checkbox.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=i.default.forwardRef(({asChild:e=!1,children:s,indeterminate:c=!1,error:l=!1,className:u,disabled:d,...f},p)=>{let m=(0,i.useRef)(null),h=n.useMergedRef(m,p);return(0,i.useEffect)(()=>{m.current&&(m.current.indeterminate=c)},[c]),(0,o.jsxs)(e?t.Root:`label`,{className:(0,a.default)(`wim-checkbox`,r.default.root,d&&r.default.disabled,u),children:[(0,o.jsx)(`input`,{type:`checkbox`,className:(0,a.default)(r.default.input,l&&r.default.danger),disabled:d,"aria-invalid":l||void 0,ref:h,...f}),(0,o.jsx)(t.Slottable,{children:s})]})});s.displayName=`Checkbox`,exports.Checkbox=s;

package/dist/components/form/Checkbox/Checkbox.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+export interface CheckboxProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    /** Whether to render as a child element. */
+    asChild?: boolean;
+    /** Label content rendered next to the checkbox */
+    children?: React.ReactNode;
+    /** Whether to show the indeterminate (mixed) state */
+    indeterminate?: boolean;
+    /** Whether to display as an error state (aria-invalid is applied) */
+    error?: boolean;
+}
+/**
+ * Checkbox component for boolean user input.
+ */
+export declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components/form/Checkbox/Checkbox.js

@@ -0,0 +1,27 @@
+"use client";
+import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import { useMergedRef as n } from "../../../hooks/useMergedRef.js";
+import r from "./checkbox.module.js";
+import i, { useEffect as a, useRef as o } from "react";
+import s from "classnames";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/components/form/Checkbox/Checkbox.tsx
+var u = i.forwardRef(({ asChild: i = !1, children: u, indeterminate: d = !1, error: f = !1, className: p, disabled: m, ...h }, g) => {
+	let _ = o(null), v = n(_, g);
+	return a(() => {
+		_.current && (_.current.indeterminate = d);
+	}, [d]), /* @__PURE__ */ l(i ? e : "label", {
+		className: s("wim-checkbox", r.root, m && r.disabled, p),
+		children: [/* @__PURE__ */ c("input", {
+			type: "checkbox",
+			className: s(r.input, f && r.danger),
+			disabled: m,
+			"aria-invalid": f || void 0,
+			ref: v,
+			...h
+		}), /* @__PURE__ */ c(t, { children: u })]
+	});
+});
+u.displayName = "Checkbox";
+//#endregion
+export { u as Checkbox };

package/dist/components/form/Checkbox/checkbox.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_bdu3m_15`,t=`_disabled_bdu3m_26`,n=`_input_bdu3m_30`,r=`_danger_bdu3m_6`,i={root:e,disabled:t,input:n,danger:r};exports.danger=r,exports.default=i,exports.disabled=t,exports.input=n,exports.root=e;

package/dist/components/form/Checkbox/checkbox.module.js

@@ -0,0 +1,10 @@
+"use client";
+//#region src/components/form/Checkbox/checkbox.module.scss
+var e = "_root_bdu3m_15", t = "_disabled_bdu3m_26", n = "_input_bdu3m_30", r = "_danger_bdu3m_6", i = {
+	root: e,
+	disabled: t,
+	input: n,
+	danger: r
+};
+//#endregion
+export { r as danger, i as default, t as disabled, n as input, e as root };

package/dist/components/form/CheckboxGroup/CheckboxGroup.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../FieldTemplate/FieldTemplate.cjs"),r=require("../Checkbox/Checkbox.cjs"),i=require("./checkbox-group.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=(0,a.forwardRef)(({options:e,value:c,defaultValue:l=[],onChange:u,direction:d=`vertical`,name:f,className:p,label:m,error:h,required:g,disabled:_,asChild:v=!1,children:y,...b},x)=>{let S=c!==void 0,[C,w]=(0,a.useState)(l),T=`wim-checkbox-group-${(0,a.useId)()}`,E=`${T}-label`,D=h?`${T}-error`:void 0,O=S?c:C,k=(e,t)=>{let n;n=t?[...O,e]:O.filter(t=>t!==e),S||w(n),u&&u(n)};return(0,s.jsx)(n.FieldTemplate,{label:m,error:h,required:g,labelId:E,errorId:D,className:p,children:(0,s.jsxs)(v?t.Root:`div`,{...b,ref:x,className:(0,o.default)(`wim-checkbox-group`,i.default.root,d===`horizontal`&&i.default.horizontal),role:`group`,"aria-labelledby":m?E:void 0,"aria-describedby":D,children:[(0,s.jsx)(t.Slottable,{children:e.map(e=>(0,s.jsx)(r.Checkbox,{value:e.value,checked:O.includes(e.value),disabled:_||e.disabled,error:!!h,name:f,onChange:t=>k(e.value,t.target.checked),children:e.label},e.value))}),y]})})});c.displayName=`CheckboxGroup`,exports.CheckboxGroup=c,exports.default=c;

package/dist/components/form/CheckboxGroup/CheckboxGroup.d.ts

@@ -0,0 +1,35 @@
+import { default as React } from 'react';
+type Option = {
+    label: string;
+    value: string;
+    disabled?: boolean;
+};
+export interface CheckboxGroupProps extends Omit<React.ComponentPropsWithoutRef<"div">, "onChange" | "defaultValue"> {
+    /** List of checkbox options */
+    options: Option[];
+    /** Selected values (controlled) */
+    value?: string[];
+    /** Initially selected values (uncontrolled) */
+    defaultValue?: string[];
+    /** Callback when the selected values change */
+    onChange?: (value: string[]) => void;
+    /** Layout direction of the checkboxes */
+    direction?: "vertical" | "horizontal";
+    /** Name attribute shared by the checkbox inputs */
+    name?: string;
+    /** Whether to render as a child element. */
+    asChild?: boolean;
+    /** Group label */
+    label?: string;
+    /** Error message */
+    error?: string;
+    /** Whether to show the required indicator */
+    required?: boolean;
+    /** Whether the whole group is disabled */
+    disabled?: boolean;
+}
+/**
+ * CheckboxGroup component to manage multiple checkboxes.
+ */
+export declare const CheckboxGroup: React.ForwardRefExoticComponent<CheckboxGroupProps & React.RefAttributes<HTMLDivElement>>;
+export default CheckboxGroup;

package/dist/components/form/CheckboxGroup/CheckboxGroup.js

@@ -0,0 +1,43 @@
+"use client";
+import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import { FieldTemplate as n } from "../FieldTemplate/FieldTemplate.js";
+import { Checkbox as r } from "../Checkbox/Checkbox.js";
+import i from "./checkbox-group.module.js";
+import { forwardRef as a, useId as o, useState as s } from "react";
+import c from "classnames";
+import { jsx as l, jsxs as u } from "react/jsx-runtime";
+//#region src/components/form/CheckboxGroup/CheckboxGroup.tsx
+var d = a(({ options: a, value: d, defaultValue: f = [], onChange: p, direction: m = "vertical", name: h, className: g, label: _, error: v, required: y, disabled: b, asChild: x = !1, children: S, ...C }, w) => {
+	let T = d !== void 0, [E, D] = s(f), O = `wim-checkbox-group-${o()}`, k = `${O}-label`, A = v ? `${O}-error` : void 0, j = T ? d : E, M = (e, t) => {
+		let n;
+		n = t ? [...j, e] : j.filter((t) => t !== e), T || D(n), p && p(n);
+	};
+	return /* @__PURE__ */ l(n, {
+		label: _,
+		error: v,
+		required: y,
+		labelId: k,
+		errorId: A,
+		className: g,
+		children: /* @__PURE__ */ u(x ? e : "div", {
+			...C,
+			ref: w,
+			className: c("wim-checkbox-group", i.root, m === "horizontal" && i.horizontal),
+			role: "group",
+			"aria-labelledby": _ ? k : void 0,
+			"aria-describedby": A,
+			children: [/* @__PURE__ */ l(t, { children: a.map((e) => /* @__PURE__ */ l(r, {
+				value: e.value,
+				checked: j.includes(e.value),
+				disabled: b || e.disabled,
+				error: !!v,
+				name: h,
+				onChange: (t) => M(e.value, t.target.checked),
+				children: e.label
+			}, e.value)) }), S]
+		})
+	});
+});
+d.displayName = "CheckboxGroup";
+//#endregion
+export { d as CheckboxGroup, d as default };

package/dist/components/form/CheckboxGroup/checkbox-group.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_hvp3f_2`,t=`_horizontal_hvp3f_7`,n={root:e,horizontal:t};exports.default=n,exports.horizontal=t,exports.root=e;

package/dist/components/form/CheckboxGroup/checkbox-group.module.js

@@ -0,0 +1,8 @@
+"use client";
+//#region src/components/form/CheckboxGroup/checkbox-group.module.scss
+var e = "_root_hvp3f_2", t = "_horizontal_hvp3f_7", n = {
+	root: e,
+	horizontal: t
+};
+//#endregion
+export { n as default, t as horizontal, e as root };

package/dist/components/form/ColorInput/ColorInput.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../Input/Input.cjs"),n=require("./color-input.module.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("classnames");i=e.__toESM(i,1);let a=require("react/jsx-runtime");function o(e){let t=e.replace(`#`,``);if(t.length!==6&&t.length!==3)return null;let n=t.length===3?t.split(``).map(e=>e+e).join(``):t,r=parseInt(n,16);return isNaN(r)?null:{r:r>>16&255,g:r>>8&255,b:r&255}}function s(e,t,n){let[r,i,a]=[e,t,n].map(e=>{let t=e/255;return t<=.03928?t/12.92:((t+.055)/1.055)**2.4});return .2126*r+.7152*i+.0722*a}function c(e){let t=o(e);return t?s(t.r,t.g,t.b)<.4:!1}var l=({className:e,value:o,defaultValue:s,onChange:l,style:u,...d})=>{let[f,p]=(0,r.useState)(()=>s??`#000000`),m=o!==void 0,h=m?o:f,g=(0,r.useCallback)(e=>{m||p(e.target.value),l?.(e)},[m,l]),_=(0,r.useMemo)(()=>c(h),[h]);return(0,a.jsx)(t.Input,{type:`color`,className:(0,i.default)(`wim-color-input`,n.default.root,_&&n.default.dark,e),value:h,onChange:g,style:u,styles:{root:n.default.inputBase,icon:n.default.inputIcon,icons:n.default.inputIcons},inputClassName:n.default.input,...d})};exports.ColorInput=l;

package/dist/components/form/ColorInput/ColorInput.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { Input } from '../../form/Input/Input';
+/**
+ * カラー選択に特化した入力コンポーネント。
+ */
+export declare const ColorInput: ({ className, value, defaultValue, onChange, style, ...props }: React.ComponentProps<typeof Input>) => React.JSX.Element;

package/dist/components/form/ColorInput/ColorInput.js

@@ -0,0 +1,53 @@
+"use client";
+import { Input as e } from "../Input/Input.js";
+import t from "./color-input.module.js";
+import { useCallback as n, useMemo as r, useState as i } from "react";
+import a from "classnames";
+import { jsx as o } from "react/jsx-runtime";
+//#region src/components/form/ColorInput/ColorInput.tsx
+function s(e) {
+	let t = e.replace("#", "");
+	if (t.length !== 6 && t.length !== 3) return null;
+	let n = t.length === 3 ? t.split("").map((e) => e + e).join("") : t, r = parseInt(n, 16);
+	return isNaN(r) ? null : {
+		r: r >> 16 & 255,
+		g: r >> 8 & 255,
+		b: r & 255
+	};
+}
+function c(e, t, n) {
+	let [r, i, a] = [
+		e,
+		t,
+		n
+	].map((e) => {
+		let t = e / 255;
+		return t <= .03928 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
+	});
+	return .2126 * r + .7152 * i + .0722 * a;
+}
+function l(e) {
+	let t = s(e);
+	return t ? c(t.r, t.g, t.b) < .4 : !1;
+}
+var u = ({ className: s, value: c, defaultValue: u, onChange: d, style: f, ...p }) => {
+	let [m, h] = i(() => u ?? "#000000"), g = c !== void 0, _ = g ? c : m, v = n((e) => {
+		g || h(e.target.value), d?.(e);
+	}, [g, d]), y = r(() => l(_), [_]);
+	return /* @__PURE__ */ o(e, {
+		type: "color",
+		className: a("wim-color-input", t.root, y && t.dark, s),
+		value: _,
+		onChange: v,
+		style: f,
+		styles: {
+			root: t.inputBase,
+			icon: t.inputIcon,
+			icons: t.inputIcons
+		},
+		inputClassName: t.input,
+		...p
+	});
+};
+//#endregion
+export { u as ColorInput };

package/dist/components/form/ColorInput/color-input.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_fut7b_2`,t=`_dark_fut7b_2`,n=`_inputBase_fut7b_2`,r=`_inputIcon_fut7b_2`,i=`_inputIcons_fut7b_3`,a=`_input_fut7b_2`,o={root:e,dark:t,inputBase:n,inputIcon:r,inputIcons:i,input:a};exports.dark=t,exports.default=o,exports.input=a,exports.inputBase=n,exports.inputIcon=r,exports.inputIcons=i,exports.root=e;

package/dist/components/form/ColorInput/color-input.module.js

@@ -0,0 +1,12 @@
+"use client";
+//#region src/components/form/ColorInput/color-input.module.scss
+var e = "_root_fut7b_2", t = "_dark_fut7b_2", n = "_inputBase_fut7b_2", r = "_inputIcon_fut7b_2", i = "_inputIcons_fut7b_3", a = "_input_fut7b_2", o = {
+	root: e,
+	dark: t,
+	inputBase: n,
+	inputIcon: r,
+	inputIcons: i,
+	input: a
+};
+//#endregion
+export { t as dark, o as default, a as input, n as inputBase, r as inputIcon, i as inputIcons, e as root };

package/dist/components/form/ColorPicker/ColorPicker.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../Input/Input.cjs"),n=require("./color-picker.module.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("classnames");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=({intent:e=`default`,variant:r=`outline`,fullWidth:o=!1,className:s,disabled:c,...l})=>(0,a.jsx)(t.Input,{type:`color`,intent:e,variant:r,fullWidth:o,className:(0,i.default)(`wim-color-picker`,s),inputClassName:n.default.input,disabled:c,...l});exports.ColorPicker=o;

package/dist/components/form/ColorPicker/ColorPicker.d.ts

@@ -0,0 +1,15 @@
+import { default as React } from 'react';
+import { InputProps } from '../../form/Input/Input';
+import { FieldIntent, FieldVariant } from '../../../types/tokens';
+export type ColorPickerProps = Omit<InputProps, "type"> & {
+    /** Semantic intent of the field (e.g. error state) */
+    intent?: FieldIntent;
+    /** Visual style variant of the field */
+    variant?: FieldVariant;
+    /** Whether to take full width of parent */
+    fullWidth?: boolean;
+};
+/**
+ * Component for selecting a color.
+ */
+export declare const ColorPicker: ({ intent, variant, fullWidth, className, disabled, ...props }: ColorPickerProps) => React.JSX.Element;

package/dist/components/form/ColorPicker/ColorPicker.js

@@ -0,0 +1,19 @@
+"use client";
+import { Input as e } from "../Input/Input.js";
+import t from "./color-picker.module.js";
+import "react";
+import n from "classnames";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/form/ColorPicker/ColorPicker.tsx
+var i = ({ intent: i = "default", variant: a = "outline", fullWidth: o = !1, className: s, disabled: c, ...l }) => /* @__PURE__ */ r(e, {
+	type: "color",
+	intent: i,
+	variant: a,
+	fullWidth: o,
+	className: n("wim-color-picker", s),
+	inputClassName: t.input,
+	disabled: c,
+	...l
+});
+//#endregion
+export { i as ColorPicker };

package/dist/components/form/ColorPicker/color-picker.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_input_141wr_2`,t={input:e};exports.default=t,exports.input=e;

package/dist/components/form/ColorPicker/color-picker.module.js

@@ -0,0 +1,5 @@
+"use client";
+//#region src/components/form/ColorPicker/color-picker.module.scss
+var e = "_input_141wr_2", t = { input: e };
+//#endregion
+export { t as default, e as input };

package/dist/components/form/Combobox/Combobox.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../_internal/BaseListItem/BaseListItem.cjs"),n=require("../InputBase/InputBase.cjs"),r=require("../FieldTemplate/FieldTemplate.cjs"),i=require("./combobox.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=({options:e=[],onChange:c,placeholder:l,showSearchIcon:u=!0,allowClear:d=!0,defaultValue:f=``,className:p,disabled:m=!1,label:h,error:g,required:_,layout:v,fullWidth:y=!1,id:b,labels:x={},...S})=>{let{noResults:C=`No results found`}=x,[w,T]=(0,a.useState)(!1),[E,D]=(0,a.useState)(f),[O,k]=(0,a.useState)(-1),[A,j]=(0,a.useState)(!1),M=(0,a.useRef)(null),N=(0,a.useId)(),P=b||`wim-combobox-${N}`,F=`${P}-list`,I=h?`${P}-label`:void 0,L=g?`${P}-error`:void 0,R=(0,a.useMemo)(()=>{let t=(E||``).toLowerCase();return e.filter(e=>e.label.toLowerCase().includes(t))},[e,E]);(0,a.useEffect)(()=>{let e=e=>{M.current&&!M.current.contains(e.target)&&T(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]);let z=e=>{let t=e.target.value;D(t),T(!0),k(-1)},B=e=>{D(e.label),T(!1),c&&c(e)};return(0,s.jsx)(r.FieldTemplate,{label:h,error:g,required:_,layout:v,labelId:I,htmlFor:P,errorId:L,className:p,children:(0,s.jsxs)(`div`,{className:(0,o.default)(`wim-combobox`,i.default.root,y&&i.default.fullWidth),ref:M,onMouseMove:()=>j(!1),"data-keyboard-nav":A,children:[(0,s.jsx)(n.InputBase,{disabled:m,allowClear:d,hasValue:!!E,onClear:()=>D(``),intent:g?`danger`:`default`,leftIcon:u?`SearchIcon`:void 0,fullWidth:y,rightIcons:[{name:`ChevronDownIcon`,rotated:w,onClick:()=>T(!w)}],children:(0,s.jsx)(`input`,{id:P,className:(0,o.default)(i.default.input,m&&i.default.disabled),placeholder:l,value:E,onChange:z,onKeyDown:e=>{if(j(!0),!w&&e.key===`ArrowDown`){T(!0);return}switch(e.key){case`ArrowDown`:k(e=>e<R.length-1?e+1:0);break;case`ArrowUp`:k(e=>e<=0?R.length-1:e-1);break;case`Enter`:O>=0&&O<R.length&&B(R[O]);break;case`Escape`:T(!1);break;case`Tab`:T(!1);break}},onFocus:()=>T(!0),disabled:m,autoComplete:`off`,role:`combobox`,"aria-autocomplete":`list`,"aria-expanded":w,"aria-controls":w?F:void 0,"aria-labelledby":I,"aria-describedby":L,required:_,"aria-invalid":!!g,"aria-activedescendant":w&&O>=0?`${F}-option-${O}`:void 0,...S})}),w&&R.length>0&&(0,s.jsx)(`div`,{className:i.default.dropdown,children:(0,s.jsx)(`ul`,{id:F,className:i.default.list,role:`listbox`,"aria-labelledby":I,children:R.map((e,n)=>(0,s.jsx)(t.BaseListItem,{asChild:!0,id:`${F}-option-${n}`,className:(0,o.default)(i.default.option,n===O&&i.default.selected),active:n===O,onClick:()=>B(e),onMouseEnter:()=>k(n),role:`option`,"aria-selected":n===O,children:(0,s.jsx)(`li`,{children:e.label})},e.value))})}),w&&R.length===0&&(0,s.jsx)(`div`,{className:i.default.dropdown,children:(0,s.jsx)(`div`,{className:i.default.empty,role:`region`,"aria-live":`polite`,children:C})})]})})};c.displayName=`Combobox`,exports.Combobox=c;

package/dist/components/form/Combobox/Combobox.d.ts

@@ -0,0 +1,47 @@
+import { default as React } from 'react';
+export type ComboboxOption = {
+    label: string;
+    value: string;
+};
+export type ComboboxLabels = {
+    noResults?: React.ReactNode;
+};
+export type ComboboxProps = {
+    /** List of suggestion options */
+    options: ComboboxOption[];
+    /** Callback when an option is selected */
+    onChange?: (option: ComboboxOption) => void;
+    /** Placeholder for the input */
+    placeholder?: string;
+    /** Field label */
+    label?: React.ReactNode;
+    /** Error message */
+    error?: string;
+    /** Whether to show the required indicator */
+    required?: boolean;
+    /** Layout direction of label and field */
+    layout?: "vertical" | "horizontal";
+    /** Whether to show the search icon */
+    showSearchIcon?: boolean;
+    /** Whether to show a clear button when value is present */
+    allowClear?: boolean;
+    /** Initial input value (uncontrolled) */
+    defaultValue?: string;
+    /** Additional class names */
+    className?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Whether to take full width of parent */
+    fullWidth?: boolean;
+    /** Unique ID for the component */
+    id?: string;
+    /** Labels for internationalization */
+    labels?: ComboboxLabels;
+};
+/**
+ * Combobox component combining an input with a suggestion list.
+ */
+export declare const Combobox: {
+    ({ options, onChange, placeholder, showSearchIcon, allowClear, defaultValue, className, disabled, label, error, required, layout, fullWidth, id: customId, labels, ...props }: ComboboxProps): React.JSX.Element;
+    displayName: string;
+};