asheeui 0.6.15 → 0.7.0

package/dist/components/keyboard/OnScreenKeyboard.js

@@ -1,172 +1,165 @@
 "use client";
-import { jsx as p } from "react/jsx-runtime";
-import { FloatingPortal as V } from "@floating-ui/react";
-import { useState as R, useEffect as k, useMemo as W, useCallback as v } from "react";
-import { Button as X } from "../button/Button.js";
-import { KEYBOARD_KEY_SIZE_CLASS as D, KEYBOARD_SIZE_CLASS as N } from "./keyboard-styles.js";
-import { cn as B } from "../../utils/cn.js";
-function z(r) {
-  return r === "{space}" ? "flex-[4]" : ["{bksp}", "{enter}", "{shift}", "{symbols}", "{abc}", "{clear}"].includes(
-    r
-  ) ? "flex-[1.6]" : "flex-1";
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { ASHEE_GLOBAL_LAYER as t } from "../../utils/stacking.js";
+import { Button as n } from "../button/Button.js";
+import { KEYBOARD_KEY_SIZE_CLASS as r, KEYBOARD_SIZE_CLASS as i } from "./keyboard-styles.js";
+import { useCallback as a, useEffect as o, useMemo as s, useState as c } from "react";
+import { jsx as l } from "react/jsx-runtime";
+import { FloatingPortal as u } from "@floating-ui/react";
+//#region src/components/keyboard/OnScreenKeyboard.tsx
+function d(e) {
+	return e === "{space}" ? "flex-[4]" : [
+		"{bksp}",
+		"{enter}",
+		"{shift}",
+		"{symbols}",
+		"{abc}",
+		"{clear}"
+	].includes(e) ? "flex-[1.6]" : "flex-1";
 }
-function P(r, e, i) {
-  var h;
-  const t = Object.getPrototypeOf(r), c = (h = Object.getOwnPropertyDescriptor(t, "value")) == null ? void 0 : h.set;
-  c ? c.call(r, e) : r.value = e, r.dispatchEvent(new Event("input", { bubbles: !0 })), requestAnimationFrame(() => {
-    r.focus(), r.setSelectionRange(i, i);
-  });
+function f(e, t, n) {
+	let r = Object.getPrototypeOf(e), i = Object.getOwnPropertyDescriptor(r, "value")?.set;
+	i ? i.call(e, t) : e.value = t, e.dispatchEvent(new Event("input", { bubbles: !0 })), requestAnimationFrame(() => {
+		e.focus(), e.setSelectionRange(n, n);
+	});
 }
-function G(r, e, i) {
-  return e !== i ? { value: r.slice(0, e) + r.slice(i), cursor: e } : e === 0 ? { value: r, cursor: 0 } : {
-    value: r.slice(0, e - 1) + r.slice(i),
-    cursor: e - 1
-  };
+function p(e, t, n) {
+	return t === n ? t === 0 ? {
+		value: e,
+		cursor: 0
+	} : {
+		value: e.slice(0, t - 1) + e.slice(n),
+		cursor: t - 1
+	} : {
+		value: e.slice(0, t) + e.slice(n),
+		cursor: t
+	};
 }
-function T(r) {
-  return (e, i, t) => ({
-    value: e.slice(0, i) + r + e.slice(t),
-    cursor: i + r.length
-  });
+function m(e) {
+	return (t, n, r) => ({
+		value: t.slice(0, n) + e + t.slice(r),
+		cursor: n + e.length
+	});
 }
-function ne({
-  isOpen: r,
-  activeElement: e,
-  config: i,
-  currentLayout: t,
-  setLayout: c,
-  forceClose: h,
-  size: S,
-  variant: $,
-  color: j,
-  radius: _,
-  portal: H,
-  className: M,
-  keyClassName: O,
-  disabled: w = !1
-}) {
-  const b = i.layouts ?? {}, Y = i.display ?? {}, f = i.defaultLayout ?? "default", x = i.autoShiftBack ?? !0, [F, K] = R(/* @__PURE__ */ new Set()), [I, g] = R(null);
-  k(() => {
-    r && c(f);
-  }, [r, f, c]);
-  const Z = W(() => (b[t] || b[f] || []).map((l, n) => ({
-    id: `${t}-row-${n}`,
-    keys: l.split(" ").map((u, a) => ({
-      id: `${t}-r${n}-k${a}-${u}`,
-      token: u
-    }))
-  })), [b, t, f]);
-  k(() => {
-    if (!r || w) return;
-    const l = (b[t] || []).join(" ").split(" "), n = (o) => o === "Backspace" ? "{bksp}" : o === "Enter" ? "{enter}" : o === " " ? "{space}" : o === "Shift" ? "{shift}" : o.length === 1 && l.includes(o) ? o : null, u = (o) => {
-      if (o.key === "Escape") {
-        h();
-        return;
-      }
-      const d = n(o.key);
-      d && K((m) => new Set(m).add(d));
-    }, a = (o) => {
-      const d = n(o.key);
-      d && K((m) => {
-        const A = new Set(m);
-        return A.delete(d), A;
-      });
-    };
-    return window.addEventListener("keydown", u), window.addEventListener("keyup", a), () => {
-      window.removeEventListener("keydown", u), window.removeEventListener("keyup", a);
-    };
-  }, [r, t, b, h, w]);
-  const y = v(
-    (s) => {
-      if (!e) return;
-      const l = e.value, n = e.selectionStart ?? l.length, u = e.selectionEnd ?? l.length, { value: a, cursor: o } = s(l, n, u);
-      P(e, a, o);
-    },
-    [e]
-  ), q = v(
-    (s) => {
-      if (w) return;
-      if (s === "{shift}") {
-        c(t === "shift" ? f : t === f ? "shift" : t);
-        return;
-      }
-      if (s === "{symbols}") {
-        c("symbols");
-        return;
-      }
-      if (s === "{abc}") {
-        c(f);
-        return;
-      }
-      if (s === "{clear}") {
-        e && P(e, "", 0);
-        return;
-      }
-      if (s === "{enter}") {
-        (e == null ? void 0 : e.tagName) === "TEXTAREA" ? y(T(`
-`)) : e == null || e.blur();
-        return;
-      }
-      if (s === "{bksp}") {
-        y(G);
-        return;
-      }
-      y(T(s === "{space}" ? " " : s)), t === "shift" && x && c(f);
-    },
-    [
-      e,
-      y,
-      t,
-      x,
-      f,
-      w,
-      c
-    ]
-  );
-  if (!r || w) return null;
-  const E = N[S] || N.md, U = D[S] || D.md, C = /* @__PURE__ */ p(
-    "section",
-    {
-      "aria-label": "Virtual Keyboard",
-      className: "fixed inset-x-0 bottom-0 z-9999 pointer-events-auto",
-      onMouseDown: (s) => s.preventDefault(),
-      children: /* @__PURE__ */ p(
-        "div",
-        {
-          className: B(
-            "w-full bg-background border-t border-border shadow-2xl flex flex-col select-none",
-            E,
-            M
-          ),
-          children: /* @__PURE__ */ p("div", { className: "flex flex-col gap-1.5 p-2 flex-1 min-h-0", children: Z.map((s) => /* @__PURE__ */ p("div", { className: "flex gap-1.5 flex-1", children: s.keys.map(({ id: l, token: n }) => {
-            const o = F.has(n) || I === n, d = Y[n] ?? n;
-            return /* @__PURE__ */ p(
-              X,
-              {
-                variant: $,
-                color: o ? j : "secondary",
-                radius: _,
-                size: S,
-                onClick: () => q(n),
-                onMouseEnter: () => g(n),
-                onMouseLeave: () => g(null),
-                className: B(
-                  "font-medium p-0 flex items-center justify-center",
-                  U,
-                  z(n),
-                  O
-                ),
-                children: d
-              },
-              l
-            );
-          }) }, s.id)) })
-        }
-      )
-    }
-  );
-  return H ? /* @__PURE__ */ p(V, { children: C }) : C;
+function h({ isOpen: h, activeElement: g, config: _, currentLayout: v, setLayout: y, forceClose: b, size: x, variant: S, color: C, radius: w, portal: T, className: E, keyClassName: D, disabled: O = !1 }) {
+	let k = _.layouts ?? {}, A = _.display ?? {}, j = _.defaultLayout ?? "default", M = _.autoShiftBack ?? !0, [N, P] = c(/* @__PURE__ */ new Set()), [F, I] = c(null);
+	o(() => {
+		h && y(j);
+	}, [
+		h,
+		j,
+		y
+	]);
+	let L = s(() => (k[v] || k[j] || []).map((e, t) => ({
+		id: `${v}-row-${t}`,
+		keys: e.split(" ").map((e, n) => ({
+			id: `${v}-r${t}-k${n}-${e}`,
+			token: e
+		}))
+	})), [
+		k,
+		v,
+		j
+	]);
+	o(() => {
+		if (!h || O) return;
+		let e = (k[v] || []).join(" ").split(" "), t = (t) => t === "Backspace" ? "{bksp}" : t === "Enter" ? "{enter}" : t === " " ? "{space}" : t === "Shift" ? "{shift}" : t.length === 1 && e.includes(t) ? t : null, n = (e) => {
+			if (e.key === "Escape") {
+				b();
+				return;
+			}
+			let n = t(e.key);
+			n && P((e) => new Set(e).add(n));
+		}, r = (e) => {
+			let n = t(e.key);
+			n && P((e) => {
+				let t = new Set(e);
+				return t.delete(n), t;
+			});
+		};
+		return window.addEventListener("keydown", n), window.addEventListener("keyup", r), () => {
+			window.removeEventListener("keydown", n), window.removeEventListener("keyup", r);
+		};
+	}, [
+		h,
+		v,
+		k,
+		b,
+		O
+	]);
+	let R = a((e) => {
+		if (!g) return;
+		let t = g.value, { value: n, cursor: r } = e(t, g.selectionStart ?? t.length, g.selectionEnd ?? t.length);
+		f(g, n, r);
+	}, [g]), z = a((e) => {
+		if (!O) {
+			if (e === "{shift}") {
+				y(v === "shift" ? j : v === j ? "shift" : v);
+				return;
+			}
+			if (e === "{symbols}") {
+				y("symbols");
+				return;
+			}
+			if (e === "{abc}") {
+				y(j);
+				return;
+			}
+			if (e === "{clear}") {
+				g && f(g, "", 0);
+				return;
+			}
+			if (e === "{enter}") {
+				g?.tagName === "TEXTAREA" ? R(m("\n")) : g?.blur();
+				return;
+			}
+			if (e === "{bksp}") {
+				R(p);
+				return;
+			}
+			R(m(e === "{space}" ? " " : e)), v === "shift" && M && y(j);
+		}
+	}, [
+		g,
+		R,
+		v,
+		M,
+		j,
+		O,
+		y
+	]);
+	if (!h || O) return null;
+	let B = i[x] || i.md, V = r[x] || r.md, H = /* @__PURE__ */ l("section", {
+		"aria-label": "Virtual Keyboard",
+		className: "fixed inset-x-0 bottom-0 pointer-events-auto",
+		style: { zIndex: t.docked },
+		onMouseDown: (e) => e.preventDefault(),
+		children: /* @__PURE__ */ l("div", {
+			className: e("w-full bg-background border-t border-border shadow-2xl flex flex-col select-none", B, E),
+			children: /* @__PURE__ */ l("div", {
+				className: "flex flex-col gap-1.5 p-2 flex-1 min-h-0",
+				children: L.map((t) => /* @__PURE__ */ l("div", {
+					className: "flex gap-1.5 flex-1",
+					children: t.keys.map(({ id: t, token: r }) => {
+						let i = N.has(r) || F === r, a = A[r] ?? r;
+						return /* @__PURE__ */ l(n, {
+							variant: S,
+							color: i ? C : "secondary",
+							radius: w,
+							size: x,
+							onClick: () => z(r),
+							onMouseEnter: () => I(r),
+							onMouseLeave: () => I(null),
+							className: e("font-medium p-0 flex items-center justify-center", V, d(r), D),
+							children: a
+						}, t);
+					})
+				}, t.id))
+			})
+		})
+	});
+	return T ? /* @__PURE__ */ l(u, { children: H }) : H;
 }
-export {
-  ne as OnScreenKeyboard
-};
+//#endregion
+export { h as OnScreenKeyboard };

package/dist/components/keyboard/keyboard-config.js

@@ -1,61 +1,63 @@
 "use client";
 import { registerComponentDefaults as e } from "../../libs/registry.js";
-const a = {
-  default: [
-    "1 2 3 4 5 6 7 8 9 0 {bksp}",
-    "q w e r t y u i o p",
-    "a s d f g h j k l",
-    "{shift} z x c v b n m {shift}",
-    "{symbols} , {space} . {enter}"
-  ],
-  shift: [
-    "1 2 3 4 5 6 7 8 9 0 {bksp}",
-    "Q W E R T Y U I O P",
-    "A S D F G H J K L",
-    "{shift} Z X C V B N M {shift}",
-    "{symbols} , {space} . {enter}"
-  ],
-  symbols: [
-    "1 2 3 4 5 6 7 8 9 0 {bksp}",
-    "@ # $ _ & - + ( )",
-    `* " ' : ; ! ? %`,
-    "{abc} / \\ ~ ` = {abc}",
-    "{abc} , {space} . {enter}"
-  ],
-  numeric: ["1 2 3 {bksp}", "4 5 6 {clear}", "7 8 9 {enter}", "0 . {space}"]
-}, s = {
-  "{bksp}": "⌫",
-  "{enter}": "↵",
-  "{shift}": "⇧",
-  "{symbols}": "?123",
-  "{abc}": "ABC",
-  "{space}": "space",
-  "{clear}": "C"
-}, t = {
-  layouts: a,
-  display: s,
-  defaultLayout: "default",
-  closeDelay: 500,
-  autoShiftBack: !0,
-  size: "md",
-  portal: !0,
-  disabled: !1
+//#region src/components/keyboard/keyboard-config.ts
+var t = {
+	default: [
+		"1 2 3 4 5 6 7 8 9 0 {bksp}",
+		"q w e r t y u i o p",
+		"a s d f g h j k l",
+		"{shift} z x c v b n m {shift}",
+		"{symbols} , {space} . {enter}"
+	],
+	shift: [
+		"1 2 3 4 5 6 7 8 9 0 {bksp}",
+		"Q W E R T Y U I O P",
+		"A S D F G H J K L",
+		"{shift} Z X C V B N M {shift}",
+		"{symbols} , {space} . {enter}"
+	],
+	symbols: [
+		"1 2 3 4 5 6 7 8 9 0 {bksp}",
+		"@ # $ _ & - + ( )",
+		"* \" ' : ; ! ? %",
+		"{abc} / \\ ~ ` = {abc}",
+		"{abc} , {space} . {enter}"
+	],
+	numeric: [
+		"1 2 3 {bksp}",
+		"4 5 6 {clear}",
+		"7 8 9 {enter}",
+		"0 . {space}"
+	]
+}, n = {
+	"{bksp}": "⌫",
+	"{enter}": "↵",
+	"{shift}": "⇧",
+	"{symbols}": "?123",
+	"{abc}": "ABC",
+	"{space}": "space",
+	"{clear}": "C"
+}, r = {
+	layouts: t,
+	display: n,
+	defaultLayout: "default",
+	closeDelay: 500,
+	autoShiftBack: !0,
+	size: "md",
+	portal: !0,
+	disabled: !1
 };
-e("keyboard", t);
-const o = {
-  defaultLayout: "default",
-  size: "md",
-  variant: "solid",
-  color: "primary",
-  radius: "md",
-  portal: !0,
-  disabled: !1,
-  closeDelay: 500,
-  autoShiftBack: !0
-};
-export {
-  o as FALLBACK_KEYBOARD_CONFIG,
-  s as defaultKeyDisplay,
-  t as defaultKeyboardConfig,
-  a as defaultKeyboardLayouts
+e("keyboard", r);
+var i = {
+	defaultLayout: "default",
+	size: "md",
+	variant: "solid",
+	color: "primary",
+	radius: "md",
+	portal: !0,
+	disabled: !1,
+	closeDelay: 500,
+	autoShiftBack: !0
 };
+//#endregion
+export { i as FALLBACK_KEYBOARD_CONFIG, n as defaultKeyDisplay, r as defaultKeyboardConfig, t as defaultKeyboardLayouts };

package/dist/components/keyboard/keyboard-styles.js

@@ -1,14 +1,13 @@
 "use client";
-const s = {
-  sm: "h-48 sm:h-56",
-  md: "h-56 sm:h-64",
-  lg: "h-64 sm:h-72"
+//#region src/components/keyboard/keyboard-styles.ts
+var e = {
+	sm: "h-48 sm:h-56",
+	md: "h-56 sm:h-64",
+	lg: "h-64 sm:h-72"
 }, t = {
-  sm: "text-xs gap-1",
-  md: "text-sm sm:text-base gap-1.5",
-  lg: "text-base sm:text-lg gap-2"
-};
-export {
-  t as KEYBOARD_KEY_SIZE_CLASS,
-  s as KEYBOARD_SIZE_CLASS
+	sm: "text-xs gap-1",
+	md: "text-sm sm:text-base gap-1.5",
+	lg: "text-base sm:text-lg gap-2"
 };
+//#endregion
+export { t as KEYBOARD_KEY_SIZE_CLASS, e as KEYBOARD_SIZE_CLASS };

package/dist/components/keyboard/use-keyboard-field.js

@@ -1,23 +1,31 @@
 "use client";
-import { useContext as i, useCallback as a } from "react";
-import { KeyboardContext as m } from "./KeyboardContext.js";
-function y(t, r, e = !1, n) {
-  const o = i(m), c = a(
-    (s) => {
-      if (!e || !o || o.isDisabled) return;
-      const u = (s == null ? void 0 : s.currentTarget) ?? (r == null ? void 0 : r.current);
-      u && o.openKeyboard(t, u, n);
-    },
-    [t, r, e, o, n]
-  ), l = a(() => {
-    !e || !o || o.isDisabled || o.requestClose(t);
-  }, [t, e, o]);
-  return {
-    handleFocus: c,
-    handleBlur: l,
-    hasProvider: !!o
-  };
+"use client";
+import { KeyboardContext as e } from "./KeyboardContext.js";
+import { useCallback as t, useContext as n } from "react";
+//#region src/components/keyboard/use-keyboard-field.ts
+function r(r, i, a = !1, o) {
+	let s = n(e);
+	return {
+		handleFocus: t((e) => {
+			if (!a || !s || s.isDisabled) return;
+			let t = e?.currentTarget ?? i?.current;
+			t && s.openKeyboard(r, t, o);
+		}, [
+			r,
+			i,
+			a,
+			s,
+			o
+		]),
+		handleBlur: t(() => {
+			a && s && !s.isDisabled && s.requestClose(r);
+		}, [
+			r,
+			a,
+			s
+		]),
+		hasProvider: !!s
+	};
 }
-export {
-  y as useKeyboardField
-};
+//#endregion
+export { r as useKeyboardField };