haze-ui 1.24.1 → 1.26.0

package/dist/components/Datepicker/Datepicker.js

@@ -1,18 +1,21 @@
+"use client";
 import e from "./DatepickerCore.js";
 import { jsx as t } from "react/jsx-runtime";
 import { useControl as n } from "react-use-control";
 //#region src/lib/components/Datepicker/Datepicker.tsx
-function r({ value: r, open: i, min: a, max: o, placeholder: s, className: c }) {
-	let [l, u] = n(r, ""), [d, f] = n(i, !1);
+function r({ value: r, open: i, min: a, max: o, locale: s, weekStartsOn: c, placeholder: l, className: u }) {
+	let [d, f] = n(r, ""), [p, m] = n(i, !1);
 	return /* @__PURE__ */ t(e, {
-		value: l,
-		onChange: u,
-		open: d,
-		onOpenChange: f,
+		value: d,
+		onChange: f,
+		open: p,
+		onOpenChange: m,
 		min: a,
 		max: o,
-		placeholder: s,
-		className: c
+		locale: s,
+		weekStartsOn: c,
+		placeholder: l,
+		className: u
 	});
 }
 //#endregion

package/dist/components/Datepicker/DatepickerCore.js

@@ -1,45 +1,48 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { FloatingPanel as t, useFloating as n } from "../../utils/floating.js";
-import r from "./Calendar.js";
+import r from "../Calendar/Calendar.js";
 /* empty css                         */
 import { jsx as i, jsxs as a } from "react/jsx-runtime";
 import { useCallback as o, useId as s, useRef as c } from "react";
 //#region src/lib/components/Datepicker/DatepickerCore.tsx
 var l = "haze-DatepickerCore__wrapper", u = "haze-DatepickerCore__input", d = "haze-DatepickerCore__dropdown";
-function f({ value: f, onChange: p, open: m, onOpenChange: h, min: g, max: _, placeholder: v = "Select date", className: y }) {
-	let b = c(null), x = c(null), S = s(), C = o((e) => h(typeof e == "function" ? e(m) : e), [h, m]), w = n({
+function f({ value: f, onChange: p, open: m, onOpenChange: h, min: g, max: _, locale: v, weekStartsOn: y, placeholder: b = "Select date", className: x }) {
+	let S = c(null), C = c(null), w = s(), T = o((e) => h(typeof e == "function" ? e(m) : e), [h, m]), E = n({
 		open: m,
-		setOpen: C,
-		triggerRef: b,
-		panelRef: x,
+		setOpen: T,
+		triggerRef: S,
+		panelRef: C,
 		animated: !0
 	});
 	return /* @__PURE__ */ a("div", {
-		className: e([l, y]),
+		className: e([l, x]),
 		children: [/* @__PURE__ */ i("input", {
-			ref: b,
+			ref: S,
 			readOnly: !0,
-			style: w.triggerStyle,
+			style: E.triggerStyle,
 			className: u,
 			value: f,
-			placeholder: v,
+			placeholder: b,
 			role: "combobox",
 			"aria-haspopup": "dialog",
 			"aria-expanded": m,
-			"aria-controls": S,
-			onPointerDown: w.onTriggerPointerDown,
-			onClick: w.onTriggerClick
+			"aria-controls": w,
+			onPointerDown: E.onTriggerPointerDown,
+			onClick: E.onTriggerClick
 		}), /* @__PURE__ */ i(t, {
-			ref: x,
-			behavior: w,
+			ref: C,
+			behavior: E,
 			placement: "bottom",
 			visualClass: d,
-			id: S,
+			id: w,
 			children: /* @__PURE__ */ i(r, {
 				value: f,
 				min: g,
 				max: _,
+				locale: v,
+				weekStartsOn: y,
 				onSelect: (e) => {
 					p(e), h(!1);
 				}

package/dist/components/Datepicker/index.js

@@ -1,3 +1,4 @@
+"use client";
 import e from "./DatepickerCore.js";
 import t from "./Datepicker.js";
 export { t as Datepicker, e as DatepickerCore };

package/dist/components/Dialog/Dialog.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useFocusScope as t } from "../../utils/focus-scope.js";
 import { whenExitSettles as n } from "../../utils/presence.js";

package/dist/components/Dialog/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Dialog.js";
 export { e as Dialog };

package/dist/components/DiffViewer/DiffViewer.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                     */
 import { jsx as t, jsxs as n } from "react/jsx-runtime";

package/dist/components/DiffViewer/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./DiffViewer.js";
 export { e as DiffViewer };

package/dist/components/Disclosure/Disclosure.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                     */
 import { jsx as t, jsxs as n } from "react/jsx-runtime";

package/dist/components/Disclosure/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Disclosure.js";
 export { e as Disclosure };

package/dist/components/Divider/Divider.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                  */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/Divider/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Divider.js";
 export { e as Divider };

package/dist/components/Drawer/Drawer.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useFocusScope as t } from "../../utils/focus-scope.js";
 import { whenExitSettles as n } from "../../utils/presence.js";

package/dist/components/Drawer/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Drawer.js";
 export { e as Drawer };

package/dist/components/DropdownMenu/DropdownMenu.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useFloating as t } from "../../utils/floating.js";
 import { DropdownMenuProvider as n } from "./DropdownMenuContext.js";

package/dist/components/DropdownMenu/DropdownMenuContent.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { FloatingPanel as e } from "../../utils/floating.js";
 import { getEnabledMenuItems as t, useMenuKeyboard as n, useRovingTabindex as r } from "../../utils/menuKeyboard.js";
 import { useDropdownMenuContext as i } from "./DropdownMenuContext.js";

package/dist/components/DropdownMenu/DropdownMenuContext.js

@@ -1,3 +1,4 @@
+"use client";
 import { createContext as e, useContext as t } from "react";
 //#region src/lib/components/DropdownMenu/DropdownMenuContext.ts
 var n = e(void 0), r = n.Provider;

package/dist/components/DropdownMenu/DropdownMenuItem.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { useDropdownMenuContext as t } from "./DropdownMenuContext.js";
 /* empty css                           */

package/dist/components/DropdownMenu/DropdownMenuSeparator.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                                */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/DropdownMenu/DropdownMenuTrigger.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 import { getEnabledMenuItems as t } from "../../utils/menuKeyboard.js";
 import { useDropdownMenuContext as n } from "./DropdownMenuContext.js";

package/dist/components/DropdownMenu/index.js

@@ -1,3 +1,4 @@
+"use client";
 import e from "./DropdownMenu.js";
 import t from "./DropdownMenuTrigger.js";
 import n from "./DropdownMenuContent.js";

package/dist/components/Empty/Empty.js

@@ -1,16 +1,18 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
+import { useStrings as t } from "../LocaleProvider/useStrings.js";
 /* empty css                */
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
 //#region src/lib/components/Empty/Empty.tsx
-var r = "haze-Empty__base", i = "haze-Empty__imageStyle", a = "haze-Empty__descStyle", o = "haze-Empty__actionStyle", s = /* @__PURE__ */ n("svg", {
+var i = "haze-Empty__base", a = "haze-Empty__imageStyle", o = "haze-Empty__descStyle", s = "haze-Empty__actionStyle", c = /* @__PURE__ */ r("svg", {
 	width: "64",
 	height: "64",
 	viewBox: "0 0 64 64",
 	fill: "none",
 	xmlns: "http://www.w3.org/2000/svg",
 	children: [
-		/* @__PURE__ */ t("rect", {
+		/* @__PURE__ */ n("rect", {
 			x: "8",
 			y: "16",
 			width: "48",
@@ -19,24 +21,24 @@ var r = "haze-Empty__base", i = "haze-Empty__imageStyle", a = "haze-Empty__descS
 			stroke: "var(--haze-color-border)",
 			strokeWidth: "2"
 		}),
-		/* @__PURE__ */ t("path", {
+		/* @__PURE__ */ n("path", {
 			d: "M8 28h48",
 			stroke: "var(--haze-color-border)",
 			strokeWidth: "2"
 		}),
-		/* @__PURE__ */ t("circle", {
+		/* @__PURE__ */ n("circle", {
 			cx: "20",
 			cy: "22",
 			r: "2",
 			fill: "var(--haze-color-border)"
 		}),
-		/* @__PURE__ */ t("circle", {
+		/* @__PURE__ */ n("circle", {
 			cx: "28",
 			cy: "22",
 			r: "2",
 			fill: "var(--haze-color-border)"
 		}),
-		/* @__PURE__ */ t("path", {
+		/* @__PURE__ */ n("path", {
 			d: "M24 38l6-6 4 4 8-8",
 			stroke: "var(--haze-color-border)",
 			strokeWidth: "2",
@@ -45,24 +47,25 @@ var r = "haze-Empty__base", i = "haze-Empty__imageStyle", a = "haze-Empty__descS
 		})
 	]
 });
-function c({ description: c = "No data", image: l, className: u, children: d }) {
-	return /* @__PURE__ */ n("div", {
-		className: e([r, u]),
+function l({ description: l, image: u, className: d, children: f }) {
+	let p = t("empty"), m = l ?? p.description;
+	return /* @__PURE__ */ r("div", {
+		className: e([i, d]),
 		children: [
-			/* @__PURE__ */ t("div", {
-				className: e([i]),
-				children: l ?? s
-			}),
-			/* @__PURE__ */ t("div", {
+			/* @__PURE__ */ n("div", {
 				className: e([a]),
-				children: c
+				children: u ?? c
 			}),
-			d && /* @__PURE__ */ t("div", {
+			/* @__PURE__ */ n("div", {
 				className: e([o]),
-				children: d
+				children: m
+			}),
+			f && /* @__PURE__ */ n("div", {
+				className: e([s]),
+				children: f
 			})
 		]
 	});
 }
 //#endregion
-export { c as default };
+export { l as default };

package/dist/components/Empty/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Empty.js";
 export { e as Empty };

package/dist/components/FileInput/FileInput.js

@@ -1,21 +1,23 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
+import { useStrings as t } from "../LocaleProvider/useStrings.js";
 /* empty css                    */
-import { jsx as t, jsxs as n } from "react/jsx-runtime";
-import { useRef as r } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useRef as i } from "react";
 //#region src/lib/components/FileInput/FileInput.tsx
-var i = "haze-FileInput__hiddenInput", a = "haze-FileInput__trigger";
-function o({ children: o, className: s, ...c }) {
-	let l = r(null);
-	return /* @__PURE__ */ n("label", {
-		className: e([a, s]),
-		children: [/* @__PURE__ */ t("input", {
-			ref: l,
+var a = "haze-FileInput__hiddenInput", o = "haze-FileInput__trigger";
+function s({ children: s, className: c, ...l }) {
+	let u = i(null), d = t("fileInput");
+	return /* @__PURE__ */ r("label", {
+		className: e([o, c]),
+		children: [/* @__PURE__ */ n("input", {
+			ref: u,
 			type: "file",
-			className: i,
-			...c
-		}), o ?? "Choose file"]
+			className: a,
+			...l
+		}), s ?? d.label]
 	});
 }
 //#endregion
-export { o as default };
+export { s as default };

package/dist/components/FileInput/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./FileInput.js";
 export { e as FileInput };

package/dist/components/Flex/Flex.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css               */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/Flex/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Flex.js";
 export { e as Flex };

package/dist/components/Grid/Grid.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css               */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/Grid/GridItem.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as e } from "react/jsx-runtime";
 //#region src/lib/components/Grid/GridItem.tsx
 function t({ span: t = 1, start: n, className: r, children: i }) {

package/dist/components/Grid/index.js

@@ -1,3 +1,4 @@
+"use client";
 import e from "./Grid.js";
 import t from "./GridItem.js";
 export { e as Grid, t as GridItem };

package/dist/components/HoverCard/HoverCard.js

@@ -0,0 +1,54 @@
+
+"use client";
+import { FloatingPanel as e, useFloating as t } from "../../utils/floating.js";
+/* empty css                    */
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { useEffect as i, useId as a, useMemo as o, useRef as s } from "react";
+import { useControl as c } from "react-use-control";
+//#region src/lib/components/HoverCard/HoverCard.tsx
+var l = "haze-HoverCard__container", u = "haze-HoverCard__panelVisuals";
+function d({ content: d, openDelay: f = 200, closeDelay: p = 120, placement: m = "bottom-span", open: h, collisionPadding: g, className: _, children: v }) {
+	let [y, b] = c(h, !1), x = a(), S = s(null), C = s(null), w = o(() => g === void 0 ? void 0 : { collisionPadding: g }, [g]), T = t({
+		open: y,
+		setOpen: b,
+		triggerRef: S,
+		panelRef: C,
+		animated: !0,
+		collision: w
+	}), E = s(0), D = s(0);
+	i(() => () => {
+		window.clearTimeout(E.current), window.clearTimeout(D.current);
+	}, []);
+	let O = () => {
+		window.clearTimeout(E.current), window.clearTimeout(D.current);
+	}, k = () => {
+		O(), !y && (E.current = window.setTimeout(() => b(!0), f));
+	}, A = () => {
+		O(), y && (D.current = window.setTimeout(() => b(!1), p));
+	};
+	return /* @__PURE__ */ r("span", {
+		className: l,
+		children: [/* @__PURE__ */ n("span", {
+			ref: S,
+			style: T.triggerStyle,
+			"aria-describedby": x,
+			onMouseEnter: k,
+			onMouseLeave: A,
+			onFocus: k,
+			onBlur: A,
+			children: v
+		}), /* @__PURE__ */ n(e, {
+			ref: C,
+			behavior: T,
+			placement: m,
+			id: x,
+			visualClass: u,
+			className: _,
+			onMouseEnter: O,
+			onMouseLeave: A,
+			children: d
+		})]
+	});
+}
+//#endregion
+export { d as default };

package/dist/components/HoverCard/index.js

@@ -0,0 +1,3 @@
+"use client";
+import e from "./HoverCard.js";
+export { e as HoverCard };

package/dist/components/Icon/Icon.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css               */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/Icon/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Icon.js";
 export { e as Icon };

package/dist/components/Image/Image.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/Image/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./Image.js";
 export { e as Image };

package/dist/components/InlineEdit/InlineEdit.js

@@ -1,47 +1,49 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
+import { useStrings as t } from "../LocaleProvider/useStrings.js";
 /* empty css                     */
-import { jsx as t } from "react/jsx-runtime";
-import { useEffect as n, useRef as r, useState as i } from "react";
-import { useControl as a } from "react-use-control";
+import { jsx as n } from "react/jsx-runtime";
+import { useEffect as r, useRef as i, useState as a } from "react";
+import { useControl as o } from "react-use-control";
 //#region src/lib/components/InlineEdit/InlineEdit.tsx
-var o = "haze-InlineEdit__display", s = "haze-InlineEdit__editing", c = "haze-InlineEdit__placeholderStyle";
-function l({ value: l, onChange: u, placeholder: d = "Click to edit", disabled: f, className: p }) {
-	let [m, h] = a(l, ""), [g, _] = i(!1), [v, y] = i(m), b = r(null);
-	n(() => {
-		g && (b.current?.focus(), b.current?.select());
-	}, [g]);
-	let x = () => {
-		f || (y(m), _(!0));
-	}, S = () => {
-		_(!1), v !== m && (h(v), u?.(v));
-	}, C = () => {
-		_(!1), y(m);
+var s = "haze-InlineEdit__display", c = "haze-InlineEdit__editing", l = "haze-InlineEdit__placeholderStyle";
+function u({ value: u, onChange: d, placeholder: f, disabled: p, className: m }) {
+	let [h, g] = o(u, ""), [_, v] = a(!1), [y, b] = a(h), x = i(null), S = t("inlineEdit"), C = f ?? S.placeholder;
+	r(() => {
+		_ && (x.current?.focus(), x.current?.select());
+	}, [_]);
+	let w = () => {
+		p || (b(h), v(!0));
+	}, T = () => {
+		v(!1), y !== h && (g(y), d?.(y));
+	}, E = () => {
+		v(!1), b(h);
 	};
-	return g ? /* @__PURE__ */ t("input", {
-		ref: b,
-		"aria-label": d,
-		value: v,
-		onChange: (e) => y(e.target.value),
-		onBlur: S,
+	return _ ? /* @__PURE__ */ n("input", {
+		ref: x,
+		"aria-label": C,
+		value: y,
+		onChange: (e) => b(e.target.value),
+		onBlur: T,
 		onKeyDown: (e) => {
-			e.key === "Enter" && S(), e.key === "Escape" && C();
+			e.key === "Enter" && T(), e.key === "Escape" && E();
 		},
-		className: e([s, p])
-	}) : /* @__PURE__ */ t("span", {
-		onClick: x,
+		className: e([c, m])
+	}) : /* @__PURE__ */ n("span", {
+		onClick: w,
 		role: "button",
 		tabIndex: 0,
 		onKeyDown: (e) => {
-			e.key === "Enter" && x();
+			e.key === "Enter" && w();
 		},
 		className: e([
-			o,
-			!m && c,
-			p
+			s,
+			!h && l,
+			m
 		]),
-		children: m || d
+		children: h || C
 	});
 }
 //#endregion
-export { l as default };
+export { u as default };

package/dist/components/InlineEdit/index.js

@@ -1,2 +1,3 @@
+"use client";
 import e from "./InlineEdit.js";
 export { e as InlineEdit };

package/dist/components/Input/Input.js

@@ -1,3 +1,4 @@
+"use client";
 import e from "./InputCore.js";
 import { jsx as t } from "react/jsx-runtime";
 import { useControl as n } from "react-use-control";

package/dist/components/Input/InputCore.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                    */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/Input/index.js

@@ -1,3 +1,4 @@
+"use client";
 import e from "./InputCore.js";
 import t from "./Input.js";
 export { t as Input, e as InputCore };

package/dist/components/Kbd/Kbd.js

@@ -0,0 +1,22 @@
+
+"use client";
+import { classnames as e } from "../../utils/classnames.js";
+/* empty css              */
+import { jsx as t } from "react/jsx-runtime";
+//#region src/lib/components/Kbd/Kbd.tsx
+var n = "haze-Kbd__base", r = {
+	sm: "haze-Kbd__sm",
+	md: "haze-Kbd__md"
+};
+function i({ size: i = "md", className: a, ...o }) {
+	return /* @__PURE__ */ t("kbd", {
+		...o,
+		className: e([
+			n,
+			r[i],
+			a
+		])
+	});
+}
+//#endregion
+export { i as default };

package/dist/components/Kbd/index.js

@@ -0,0 +1,3 @@
+"use client";
+import e from "./Kbd.js";
+export { e as Kbd };

package/dist/components/List/List.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css               */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/List/ListItem.js

@@ -1,4 +1,5 @@
 
+"use client";
 import { classnames as e } from "../../utils/classnames.js";
 /* empty css                   */
 import { jsx as t } from "react/jsx-runtime";

package/dist/components/List/index.js

@@ -1,3 +1,4 @@
+"use client";
 import e from "./List.js";
 import t from "./ListItem.js";
 export { e as List, t as ListItem };

package/dist/components/LocaleProvider/LocaleContext.js

@@ -0,0 +1,6 @@
+"use client";
+import { createContext as e } from "react";
+//#region src/lib/components/LocaleProvider/LocaleContext.ts
+var t = e(void 0);
+//#endregion
+export { t as LocaleContext };