wimui 0.1.0

package/dist/components/feedback/Toast/toast.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_container_1cnk0_3`,t=`_root_1cnk0_38`,n=`_icon_1cnk0_54`,r=`_content_1cnk0_61`,i=`_title_1cnk0_67`,a=`_description_1cnk0_73`,o=`_closeButton_1cnk0_81`,s=`_info_1cnk0_111`,c=`_success_1cnk0_118`,l=`_warning_1cnk0_125`,u=`_danger_1cnk0_132`,d=`_enter_1cnk0_139`,f=`_enterFrom_1cnk0_142`,p=`_enterTo_1cnk0_146`,m=`_leave_1cnk0_150`,h=`_leaveFrom_1cnk0_153`,g=`_leaveTo_1cnk0_157`,_={container:e,"top-right":`_top-right_1cnk0_12`,"top-left":`_top-left_1cnk0_16`,"top-center":`_top-center_1cnk0_20`,"bottom-right":`_bottom-right_1cnk0_25`,"bottom-left":`_bottom-left_1cnk0_29`,"bottom-center":`_bottom-center_1cnk0_33`,root:t,icon:n,content:r,title:i,description:a,closeButton:o,info:s,success:c,warning:l,danger:u,enter:d,enterFrom:f,enterTo:p,leave:m,leaveFrom:h,leaveTo:g};exports.closeButton=o,exports.container=e,exports.content=r,exports.danger=u,exports.default=_,exports.description=a,exports.enter=d,exports.enterFrom=f,exports.enterTo=p,exports.icon=n,exports.info=s,exports.leave=m,exports.leaveFrom=h,exports.leaveTo=g,exports.root=t,exports.success=c,exports.title=i,exports.warning=l;

package/dist/components/feedback/Toast/toast.module.js

@@ -0,0 +1,29 @@
+"use client";
+//#region src/components/feedback/Toast/toast.module.scss
+var e = "_container_1cnk0_3", t = "_root_1cnk0_38", n = "_icon_1cnk0_54", r = "_content_1cnk0_61", i = "_title_1cnk0_67", a = "_description_1cnk0_73", o = "_closeButton_1cnk0_81", s = "_info_1cnk0_111", c = "_success_1cnk0_118", l = "_warning_1cnk0_125", u = "_danger_1cnk0_132", d = "_enter_1cnk0_139", f = "_enterFrom_1cnk0_142", p = "_enterTo_1cnk0_146", m = "_leave_1cnk0_150", h = "_leaveFrom_1cnk0_153", g = "_leaveTo_1cnk0_157", _ = {
+	container: e,
+	"top-right": "_top-right_1cnk0_12",
+	"top-left": "_top-left_1cnk0_16",
+	"top-center": "_top-center_1cnk0_20",
+	"bottom-right": "_bottom-right_1cnk0_25",
+	"bottom-left": "_bottom-left_1cnk0_29",
+	"bottom-center": "_bottom-center_1cnk0_33",
+	root: t,
+	icon: n,
+	content: r,
+	title: i,
+	description: a,
+	closeButton: o,
+	info: s,
+	success: c,
+	warning: l,
+	danger: u,
+	enter: d,
+	enterFrom: f,
+	enterTo: p,
+	leave: m,
+	leaveFrom: h,
+	leaveTo: g
+};
+//#endregion
+export { o as closeButton, e as container, r as content, u as danger, _ as default, a as description, d as enter, f as enterFrom, p as enterTo, n as icon, s as info, m as leave, h as leaveFrom, g as leaveTo, t as root, c as success, i as title, l as warning };

package/dist/components/feedback/Tour/Tour.cjs

@@ -0,0 +1,2 @@
+"use client";
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../overlay/Portal/Portal.cjs"),n=require("../../form/Button/Button.cjs"),r=require("./tour.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=({steps:e,open:s,onClose:c,onFinish:l})=>{let[u,d]=(0,i.useState)(0),[f,p]=(0,i.useState)(null),m=e[u];if((0,i.useEffect)(()=>{if(s&&m){let e=()=>{let e=document.querySelector(m.target);e?(p(e.getBoundingClientRect()),e.scrollIntoView({behavior:`smooth`,block:`center`})):p(null)};e();let t=setTimeout(e,100);return()=>clearTimeout(t)}else p(null)},[s,u,m]),(0,i.useEffect)(()=>{let e=()=>{if(s&&m){let e=document.querySelector(m.target);e&&p(e.getBoundingClientRect())}};return window.addEventListener(`resize`,e),window.addEventListener(`scroll`,e),()=>{window.removeEventListener(`resize`,e),window.removeEventListener(`scroll`,e)}},[s,m]),!s||!m)return null;let h=()=>{u<e.length-1?d(u+1):(l?l():c(),d(0))},g=()=>{u>0&&d(u-1)},_={};if(f){let e=window.innerWidth,t=Math.min(300,e-32),n=m.placement||`bottom`;if(e<640&&(n===`left`||n===`right`)&&(n=`bottom`),n===`top`||n===`bottom`){let r=f.left+f.width/2,i=t/2+16,a=e-t/2-16;r=i>a?e/2:Math.max(i,Math.min(a,r)),_.left=r,n===`top`?(_.top=f.top-12,_.transform=`translate(-50%, -100%)`):(_.top=f.bottom+12,_.transform=`translateX(-50%)`)}else n===`left`?(_.left=f.left-12,_.top=f.top+f.height/2,_.transform=`translate(-100%, -50%)`):n===`right`&&(_.left=f.right+12,_.top=f.top+f.height/2,_.transform=`translateY(-50%)`)}return(0,o.jsxs)(t.Portal,{children:[(0,o.jsx)(`div`,{className:r.default.mask,onClick:c,role:`button`,tabIndex:0,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&c()}}),f&&(0,o.jsx)(`div`,{className:r.default.highlight,style:{top:f.top-4,left:f.left-4,width:f.width+8,height:f.height+8}}),(0,o.jsx)(`div`,{className:(0,a.default)(`wim-tour`,r.default.bubble,m.placement&&r.default[m.placement]),style:_,children:(0,o.jsxs)(`div`,{className:r.default.inner,children:[(0,o.jsx)(`h3`,{className:r.default.title,children:m.title}),(0,o.jsx)(`p`,{className:r.default.description,children:m.description}),(0,o.jsxs)(`div`,{className:r.default.footer,children:[(0,o.jsxs)(`span`,{className:r.default.progress,children:[u+1,` / `,e.length]}),(0,o.jsxs)(`div`,{className:r.default.buttons,children:[u>0&&(0,o.jsx)(n.Button,{size:`sm`,variant:`outline`,onClick:g,children:`Back`}),(0,o.jsx)(n.Button,{size:`sm`,variant:`solid`,onClick:h,children:u===e.length-1?`Finish`:`Next`})]})]})]})})]})};exports.Tour=s;

package/dist/components/feedback/Tour/Tour.d.ts

@@ -0,0 +1,27 @@
+import { default as React } from 'react';
+type TourStep = {
+    target: string;
+    title: string;
+    description: string;
+    placement?: "top" | "bottom" | "left" | "right";
+};
+type TourProps = {
+    /**
+     * Steps of the tour. Each step targets an element via a CSS selector.
+     */
+    steps: TourStep[];
+    /**
+     * Whether the tour is shown.
+     */
+    open: boolean;
+    /**
+     * Called when the tour is dismissed before completion.
+     */
+    onClose: () => void;
+    /**
+     * Called when the last step is completed.
+     */
+    onFinish?: () => void;
+};
+export declare const Tour: ({ steps, open, onClose, onFinish }: TourProps) => React.JSX.Element | null;
+export {};

package/dist/components/feedback/Tour/Tour.js

@@ -0,0 +1,114 @@
+"use client";
+import { Portal as e } from "../../overlay/Portal/Portal.js";
+import { Button as t } from "../../form/Button/Button.js";
+import n from "./tour.module.js";
+import { useEffect as r, useState as i } from "react";
+import a from "classnames";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/feedback/Tour/Tour.tsx
+var c = ({ steps: c, open: l, onClose: u, onFinish: d }) => {
+	let [f, p] = i(0), [m, h] = i(null), g = c[f];
+	if (r(() => {
+		if (l && g) {
+			let e = () => {
+				let e = document.querySelector(g.target);
+				e ? (h(e.getBoundingClientRect()), e.scrollIntoView({
+					behavior: "smooth",
+					block: "center"
+				})) : h(null);
+			};
+			e();
+			let t = setTimeout(e, 100);
+			return () => clearTimeout(t);
+		} else h(null);
+	}, [
+		l,
+		f,
+		g
+	]), r(() => {
+		let e = () => {
+			if (l && g) {
+				let e = document.querySelector(g.target);
+				e && h(e.getBoundingClientRect());
+			}
+		};
+		return window.addEventListener("resize", e), window.addEventListener("scroll", e), () => {
+			window.removeEventListener("resize", e), window.removeEventListener("scroll", e);
+		};
+	}, [l, g]), !l || !g) return null;
+	let _ = () => {
+		f < c.length - 1 ? p(f + 1) : (d ? d() : u(), p(0));
+	}, v = () => {
+		f > 0 && p(f - 1);
+	}, y = {};
+	if (m) {
+		let e = window.innerWidth, t = Math.min(300, e - 32), n = g.placement || "bottom";
+		if (e < 640 && (n === "left" || n === "right") && (n = "bottom"), n === "top" || n === "bottom") {
+			let r = m.left + m.width / 2, i = t / 2 + 16, a = e - t / 2 - 16;
+			r = i > a ? e / 2 : Math.max(i, Math.min(a, r)), y.left = r, n === "top" ? (y.top = m.top - 12, y.transform = "translate(-50%, -100%)") : (y.top = m.bottom + 12, y.transform = "translateX(-50%)");
+		} else n === "left" ? (y.left = m.left - 12, y.top = m.top + m.height / 2, y.transform = "translate(-100%, -50%)") : n === "right" && (y.left = m.right + 12, y.top = m.top + m.height / 2, y.transform = "translateY(-50%)");
+	}
+	return /* @__PURE__ */ s(e, { children: [
+		/* @__PURE__ */ o("div", {
+			className: n.mask,
+			onClick: u,
+			role: "button",
+			tabIndex: 0,
+			onKeyDown: (e) => {
+				(e.key === "Enter" || e.key === " ") && u();
+			}
+		}),
+		m && /* @__PURE__ */ o("div", {
+			className: n.highlight,
+			style: {
+				top: m.top - 4,
+				left: m.left - 4,
+				width: m.width + 8,
+				height: m.height + 8
+			}
+		}),
+		/* @__PURE__ */ o("div", {
+			className: a("wim-tour", n.bubble, g.placement && n[g.placement]),
+			style: y,
+			children: /* @__PURE__ */ s("div", {
+				className: n.inner,
+				children: [
+					/* @__PURE__ */ o("h3", {
+						className: n.title,
+						children: g.title
+					}),
+					/* @__PURE__ */ o("p", {
+						className: n.description,
+						children: g.description
+					}),
+					/* @__PURE__ */ s("div", {
+						className: n.footer,
+						children: [/* @__PURE__ */ s("span", {
+							className: n.progress,
+							children: [
+								f + 1,
+								" / ",
+								c.length
+							]
+						}), /* @__PURE__ */ s("div", {
+							className: n.buttons,
+							children: [f > 0 && /* @__PURE__ */ o(t, {
+								size: "sm",
+								variant: "outline",
+								onClick: v,
+								children: "Back"
+							}), /* @__PURE__ */ o(t, {
+								size: "sm",
+								variant: "solid",
+								onClick: _,
+								children: f === c.length - 1 ? "Finish" : "Next"
+							})]
+						})]
+					})
+				]
+			})
+		})
+	] });
+};
+//#endregion
+export { c as Tour };

package/dist/components/feedback/Tour/tour.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_mask_16kde_3`,t=`_highlight_16kde_12`,n=`_bubble_16kde_20`,r=`_inner_16kde_31`,i=`_title_16kde_34`,a=`_description_16kde_39`,o=`_footer_16kde_44`,s=`_progress_16kde_49`,c=`_buttons_16kde_53`,l={mask:e,highlight:t,bubble:n,inner:r,title:i,description:a,footer:o,progress:s,buttons:c};exports.bubble=n,exports.buttons=c,exports.default=l,exports.description=a,exports.footer=o,exports.highlight=t,exports.inner=r,exports.mask=e,exports.progress=s,exports.title=i;

package/dist/components/feedback/Tour/tour.module.js

@@ -0,0 +1,15 @@
+"use client";
+//#region src/components/feedback/Tour/tour.module.scss
+var e = "_mask_16kde_3", t = "_highlight_16kde_12", n = "_bubble_16kde_20", r = "_inner_16kde_31", i = "_title_16kde_34", a = "_description_16kde_39", o = "_footer_16kde_44", s = "_progress_16kde_49", c = "_buttons_16kde_53", l = {
+	mask: e,
+	highlight: t,
+	bubble: n,
+	inner: r,
+	title: i,
+	description: a,
+	footer: o,
+	progress: s,
+	buttons: c
+};
+//#endregion
+export { n as bubble, c as buttons, l as default, a as description, o as footer, t as highlight, r as inner, e as mask, s as progress, i as title };

package/dist/components/form/Button/Button.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("../../../utilities/style-utils.cjs"),r=require("../../../i18n/useWimTranslation.cjs"),i=require("../../../icon/loading.cjs"),a=require("../../media/Icon/Icon.cjs"),o=require("./button.module.cjs"),s=require("../../../hooks/useMergedRef.cjs");let c=require("react");c=e.__toESM(c,1);let l=require("classnames");l=e.__toESM(l,1);let u=require("react/jsx-runtime");var d=c.default.forwardRef(({asChild:e=!1,size:d=`md`,variant:f=`outline`,intent:p=`default`,icon:m,iconPosition:h=`left`,loading:g=!1,backgroundColor:_,justify:v=`center`,animateWidth:y=!1,fullWidth:b=!1,styles:x,"aria-label":S,className:C,disabled:w,children:T,...E},D)=>{let O=c.default.useRef(null),k=s.useMergedRef(O,D),[A,j]=c.default.useState(`auto`),M=c.default.useRef(!0);c.default.useLayoutEffect(()=>{if(!y||!O.current)return;if(M.current){M.current=!1;return}let e=O.current,t=e.getBoundingClientRect().width;j(t);let n=e.style.width,r=e.style.minWidth;e.style.width=`auto`,e.style.minWidth=`0`;let i=Math.ceil(e.getBoundingClientRect().width)+2;e.style.width=n,e.style.minWidth=r;let a=requestAnimationFrame(()=>{j(i)});return()=>cancelAnimationFrame(a)},[T,y]);let{t:N}=r.useWimTranslation(`common`),P=w,F;typeof S==`string`?F=S:S!==!1&&(!T&&typeof m==`string`?F=m:g&&(F=N(`a11y.loading`)));let I=v===`start`?`flex-start`:v===`end`?`flex-end`:v===`between`?`space-between`:v,L=g?(0,u.jsx)(`span`,{className:(0,l.default)(o.default.loader,x?.loader),children:(0,u.jsx)(a.Icon,{component:i.default,spin:!0,size:d})}):m?typeof m==`string`?(0,u.jsx)(a.Icon,{name:m,size:d,className:x?.icon}):m:null;return(0,u.jsxs)(e?t.Root:`button`,{ref:k,type:e?void 0:`button`,style:{...E.style,justifyContent:I,..._?{backgroundColor:n.getColorValue(_)}:{},...y&&A!==`auto`?{width:`${A}px`,transitionProperty:E.style?.transitionProperty||`width, background-color, border-color, box-shadow, transform`,transitionDuration:E.style?.transitionDuration||`var(--wim-duration-base)`,transitionTimingFunction:E.style?.transitionTimingFunction||`var(--wim-easing-standard)`,overflow:`hidden`,whiteSpace:`nowrap`,textOverflow:`clip`}:{}},className:(0,l.default)(`wim-button`,o.default.root,o.default[d],o.default[f],o.default[p],g&&o.default.loading,y&&o.default.animatedWidth,b&&o.default.fullWidth,!T&&!!m&&o.default.iconOnly,C,x?.root),disabled:(P||g)&&!e?!0:void 0,"aria-label":F,"aria-busy":g||void 0,...e?E:{...E},children:[e&&L&&h===`left`?L:null,e?(0,u.jsx)(t.Slottable,{children:T}):(0,u.jsxs)(`span`,{className:o.default.content,children:[L&&h===`left`&&L,T,L&&h===`right`&&L]}),e&&L&&h===`right`?L:null]})});d.displayName=`Button`,exports.Button=d;

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

@@ -0,0 +1,72 @@
+import { default as React } from 'react';
+import { Icon } from '../../media/Icon/Icon';
+import { WimColor, ComponentSizeBasic, ButtonVariant, ButtonIntent } from '../../../types/tokens';
+export type ButtonProps = React.ComponentPropsWithoutRef<"button"> & {
+    /**
+     * If true, the button will be rendered as its child, merging its props onto that child.
+     * Useful for using the button styles with Link components (e.g. from React Router or Next.js).
+     */
+    asChild?: boolean;
+    /** Overrides the button background color with a design token. Usually the `variant` prop is enough; use this prop only as a last resort. */
+    backgroundColor?: WimColor;
+    /** Size of the button */
+    size?: ComponentSizeBasic;
+    /** Visual style variant of the button */
+    variant?: ButtonVariant;
+    /** Design intent of the button (visual / semantic state). Unrelated to the ARIA role attribute. */
+    intent?: ButtonIntent;
+    /** Icon name or custom icon element */
+    icon?: React.ComponentProps<typeof Icon>["name"] | React.ReactNode;
+    /** Position of the icon relative to the label */
+    iconPosition?: "left" | "right";
+    /** Whether to show a loading indicator and disable interaction */
+    loading?: boolean;
+    /** Horizontal alignment of the button content */
+    justify?: "start" | "center" | "end" | "between";
+    /** Whether to animate the width change when label changes */
+    animateWidth?: boolean;
+    /** Whether the button should take up the full width of its container */
+    fullWidth?: boolean;
+    /** Custom styles for internal parts */
+    styles?: {
+        root?: string;
+        loader?: string;
+        icon?: string;
+    };
+};
+export declare const Button: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    /**
+     * If true, the button will be rendered as its child, merging its props onto that child.
+     * Useful for using the button styles with Link components (e.g. from React Router or Next.js).
+     */
+    asChild?: boolean;
+    /** Overrides the button background color with a design token. Usually the `variant` prop is enough; use this prop only as a last resort. */
+    backgroundColor?: WimColor;
+    /** Size of the button */
+    size?: ComponentSizeBasic;
+    /** Visual style variant of the button */
+    variant?: ButtonVariant;
+    /** Design intent of the button (visual / semantic state). Unrelated to the ARIA role attribute. */
+    intent?: ButtonIntent;
+    /** Icon name or custom icon element */
+    icon?: React.ComponentProps<typeof Icon>["name"] | React.ReactNode;
+    /** Position of the icon relative to the label */
+    iconPosition?: "left" | "right";
+    /** Whether to show a loading indicator and disable interaction */
+    loading?: boolean;
+    /** Horizontal alignment of the button content */
+    justify?: "start" | "center" | "end" | "between";
+    /** Whether to animate the width change when label changes */
+    animateWidth?: boolean;
+    /** Whether the button should take up the full width of its container */
+    fullWidth?: boolean;
+    /** Custom styles for internal parts */
+    styles?: {
+        root?: string;
+        loader?: string;
+        icon?: string;
+    };
+} & {
+    /** Additional class names */
+    className?: string;
+} & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/form/Button/Button.js

@@ -0,0 +1,84 @@
+"use client";
+import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import { getColorValue as n } from "../../../utilities/style-utils.js";
+import { useWimTranslation as r } from "../../../i18n/useWimTranslation.js";
+import i from "../../../icon/loading.js";
+import { Icon as a } from "../../media/Icon/Icon.js";
+import o from "./button.module.js";
+import { useMergedRef as s } from "../../../hooks/useMergedRef.js";
+import c from "react";
+import l from "classnames";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/form/Button/Button.tsx
+var f = c.forwardRef(({ asChild: f = !1, size: p = "md", variant: m = "outline", intent: h = "default", icon: g, iconPosition: _ = "left", loading: v = !1, backgroundColor: y, justify: b = "center", animateWidth: x = !1, fullWidth: S = !1, styles: C, "aria-label": w, className: T, disabled: E, children: D, ...O }, k) => {
+	let A = c.useRef(null), j = s(A, k), [M, N] = c.useState("auto"), P = c.useRef(!0);
+	c.useLayoutEffect(() => {
+		if (!x || !A.current) return;
+		if (P.current) {
+			P.current = !1;
+			return;
+		}
+		let e = A.current, t = e.getBoundingClientRect().width;
+		N(t);
+		let n = e.style.width, r = e.style.minWidth;
+		e.style.width = "auto", e.style.minWidth = "0";
+		let i = Math.ceil(e.getBoundingClientRect().width) + 2;
+		e.style.width = n, e.style.minWidth = r;
+		let a = requestAnimationFrame(() => {
+			N(i);
+		});
+		return () => cancelAnimationFrame(a);
+	}, [D, x]);
+	let { t: F } = r("common"), I = E, L;
+	typeof w == "string" ? L = w : w !== !1 && (!D && typeof g == "string" ? L = g : v && (L = F("a11y.loading")));
+	let R = b === "start" ? "flex-start" : b === "end" ? "flex-end" : b === "between" ? "space-between" : b, z = v ? /* @__PURE__ */ u("span", {
+		className: l(o.loader, C?.loader),
+		children: /* @__PURE__ */ u(a, {
+			component: i,
+			spin: !0,
+			size: p
+		})
+	}) : g ? typeof g == "string" ? /* @__PURE__ */ u(a, {
+		name: g,
+		size: p,
+		className: C?.icon
+	}) : g : null;
+	return /* @__PURE__ */ d(f ? e : "button", {
+		ref: j,
+		type: f ? void 0 : "button",
+		style: {
+			...O.style,
+			justifyContent: R,
+			...y ? { backgroundColor: n(y) } : {},
+			...x && M !== "auto" ? {
+				width: `${M}px`,
+				transitionProperty: O.style?.transitionProperty || "width, background-color, border-color, box-shadow, transform",
+				transitionDuration: O.style?.transitionDuration || "var(--wim-duration-base)",
+				transitionTimingFunction: O.style?.transitionTimingFunction || "var(--wim-easing-standard)",
+				overflow: "hidden",
+				whiteSpace: "nowrap",
+				textOverflow: "clip"
+			} : {}
+		},
+		className: l("wim-button", o.root, o[p], o[m], o[h], v && o.loading, x && o.animatedWidth, S && o.fullWidth, !D && !!g && o.iconOnly, T, C?.root),
+		disabled: (I || v) && !f ? !0 : void 0,
+		"aria-label": L,
+		"aria-busy": v || void 0,
+		...f ? O : { ...O },
+		children: [
+			f && z && _ === "left" ? z : null,
+			f ? /* @__PURE__ */ u(t, { children: D }) : /* @__PURE__ */ d("span", {
+				className: o.content,
+				children: [
+					z && _ === "left" && z,
+					D,
+					z && _ === "right" && z
+				]
+			}),
+			f && z && _ === "right" ? z : null
+		]
+	});
+});
+f.displayName = "Button";
+//#endregion
+export { f as Button };

package/dist/components/form/Button/button.module.cjs

@@ -0,0 +1,2 @@
+"use client";
+var e=`_root_1lz2p_2`,t=`_fullWidth_1lz2p_29`,n=`_inner_1lz2p_37`,r=`_loader_1lz2p_40`,i=`_label_1lz2p_47`,a=`_lg_1lz2p_57`,o=`_md_1lz2p_66`,s=`_sm_1lz2p_75`,c=`_solid_1lz2p_85`,l=`_danger_1lz2p_95`,u=`_success_1lz2p_100`,d=`_outline_1lz2p_124`,f=`_ghost_1lz2p_157`,p=`_iconOnly_1lz2p_190`,m=`_content_1lz2p_200`,h=`_loading_1lz2p_210`,g=`_animatedWidth_1lz2p_219`,_={root:e,fullWidth:t,inner:n,loader:r,label:i,lg:a,md:o,sm:s,solid:c,default:`_default_1lz2p_90`,danger:l,success:u,outline:d,ghost:f,iconOnly:p,content:m,loading:h,animatedWidth:g};exports.animatedWidth=g,exports.content=m,exports.danger=l,exports.default=_,exports.fullWidth=t,exports.ghost=f,exports.iconOnly=p,exports.inner=n,exports.label=i,exports.lg=a,exports.loader=r,exports.loading=h,exports.md=o,exports.outline=d,exports.root=e,exports.sm=s,exports.solid=c,exports.success=u;

package/dist/components/form/Button/button.module.js

@@ -0,0 +1,24 @@
+"use client";
+//#region src/components/form/Button/button.module.scss
+var e = "_root_1lz2p_2", t = "_fullWidth_1lz2p_29", n = "_inner_1lz2p_37", r = "_loader_1lz2p_40", i = "_label_1lz2p_47", a = "_lg_1lz2p_57", o = "_md_1lz2p_66", s = "_sm_1lz2p_75", c = "_solid_1lz2p_85", l = "_danger_1lz2p_95", u = "_success_1lz2p_100", d = "_outline_1lz2p_124", f = "_ghost_1lz2p_157", p = "_iconOnly_1lz2p_190", m = "_content_1lz2p_200", h = "_loading_1lz2p_210", g = "_animatedWidth_1lz2p_219", _ = {
+	root: e,
+	fullWidth: t,
+	inner: n,
+	loader: r,
+	label: i,
+	lg: a,
+	md: o,
+	sm: s,
+	solid: c,
+	default: "_default_1lz2p_90",
+	danger: l,
+	success: u,
+	outline: d,
+	ghost: f,
+	iconOnly: p,
+	content: m,
+	loading: h,
+	animatedWidth: g
+};
+//#endregion
+export { g as animatedWidth, m as content, l as danger, _ as default, t as fullWidth, f as ghost, p as iconOnly, n as inner, i as label, a as lg, r as loader, h as loading, o as md, d as outline, e as root, s as sm, c as solid, u as success };

package/dist/components/form/ButtonGroup/ButtonGroup.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("./button-group.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=({children:e,gap:o=`8px`,className:s,joined:c=!1,variant:l,asChild:u=!1})=>{let d=c?{}:{gap:o},f=!u&&l?r.default.Children.map(e,e=>r.default.isValidElement(e)?r.default.cloneElement(e,{variant:l}):e):e;return(0,a.jsx)(u?t.Root:`div`,{className:(0,i.default)(`wim-button-group`,n.default.root,c&&n.default.joined,s),style:d,children:f})};exports.ButtonGroup=o;

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

@@ -0,0 +1,18 @@
+import { default as React } from 'react';
+import { ButtonVariant } from '../../../types/tokens';
+type ButtonGroupProps = {
+    /** Buttons to group */
+    children: React.ReactNode;
+    /** Gap between buttons (ignored when joined) */
+    gap?: string;
+    /** Additional class names */
+    className?: string;
+    /** Whether to join the buttons into a single connected unit */
+    joined?: boolean;
+    /** Variant applied to all child buttons */
+    variant?: ButtonVariant;
+    /** Whether to render as a child element. */
+    asChild?: boolean;
+};
+export declare const ButtonGroup: ({ children, gap, className, joined, variant, asChild, }: ButtonGroupProps) => React.JSX.Element;
+export {};

package/dist/components/form/ButtonGroup/ButtonGroup.js

@@ -0,0 +1,17 @@
+"use client";
+import { Root as e } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
+import t from "./button-group.module.js";
+import n from "react";
+import r from "classnames";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/components/form/ButtonGroup/ButtonGroup.tsx
+var a = ({ children: a, gap: o = "8px", className: s, joined: c = !1, variant: l, asChild: u = !1 }) => {
+	let d = c ? {} : { gap: o }, f = !u && l ? n.Children.map(a, (e) => n.isValidElement(e) ? n.cloneElement(e, { variant: l }) : e) : a;
+	return /* @__PURE__ */ i(u ? e : "div", {
+		className: r("wim-button-group", t.root, c && t.joined, s),
+		style: d,
+		children: f
+	});
+};
+//#endregion
+export { a as ButtonGroup };

package/dist/components/form/ButtonGroup/button-group.module.cjs

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

package/dist/components/form/ButtonGroup/button-group.module.js

@@ -0,0 +1,8 @@
+"use client";
+//#region src/components/form/ButtonGroup/button-group.module.scss
+var e = "_root_fqwhx_3", t = "_joined_fqwhx_11", n = {
+	root: e,
+	joined: t
+};
+//#endregion
+export { n as default, t as joined, e as root };

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

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

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

@@ -0,0 +1,53 @@
+import { default as React } from 'react';
+import { FieldWidth } from '../../../types/tokens';
+export type CascaderOption = {
+    label: React.ReactNode;
+    value: string;
+    children?: CascaderOption[];
+    disabled?: boolean;
+};
+export type CascaderProps = Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> & {
+    /** Hierarchical options to select from */
+    options: CascaderOption[];
+    /** Selected value path (controlled) */
+    value?: string[];
+    /** Callback when the selection changes */
+    onChange?: (value: string[], selectedOptions: CascaderOption[]) => void;
+    /** Placeholder shown when nothing is selected */
+    placeholder?: React.ReactNode;
+    /** 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";
+    /** Additional class names */
+    className?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Initially selected value path (uncontrolled) */
+    defaultValue?: string[];
+    /** Unique ID for the component */
+    id?: string;
+    /** Expand trigger mode */
+    expandTrigger?: "click" | "hover";
+    /** Custom separator for the display value */
+    separator?: string;
+    /** Whether to show a clear button when a value is selected */
+    allowClear?: boolean;
+    /** Accessible label for the trigger when no visible label is provided */
+    "aria-label"?: string;
+    /** Fixed width of the field (width token, CSS value, or number in px) */
+    width?: FieldWidth | string | number;
+    /** Whether to take full width of parent */
+    fullWidth?: boolean;
+};
+/**
+ * Component for selecting a single option by walking through hierarchical data.
+ */
+export declare const Cascader: {
+    ({ options, value, onChange, placeholder, label, error, required, layout, className, disabled, defaultValue, id: customId, expandTrigger, separator, allowClear, "aria-label": ariaLabel, width, fullWidth, ...props }: CascaderProps): React.JSX.Element;
+    displayName: string;
+};