impact-nova 2.2.5 → 2.2.7

package/dist/components/forms/select/components/SelectTriggerValue.js

@@ -1,28 +1,57 @@
-import { jsx as n } from "react/jsx-runtime";
-import { cn as p } from "../../../../lib/utils.js";
-import { isInvertedSelection as x, isOptionArray as f } from "../utils/select.js";
-function T({
-  isMulti: l,
-  isDisabled: m,
-  internalValue: s,
-  totalCount: i,
-  totalOptionsCount: u,
-  formatSelectedCount: d,
-  resolveOptionLabel: c,
-  placeholder: o
+import { jsx as r } from "react/jsx-runtime";
+import { cn as x } from "../../../../lib/utils.js";
+import "react";
+import { OverflowTooltip as m } from "../../../feedback/tooltip/overflow-tooltip.js";
+import { isInvertedSelection as h, isOptionArray as d } from "../utils/select.js";
+function C({
+  isMulti: u,
+  isDisabled: p,
+  internalValue: o,
+  totalCount: s,
+  totalOptionsCount: g,
+  formatSelectedCount: v,
+  resolveOptionLabel: a,
+  placeholder: c
 }) {
-  const r = p(
+  const n = x(
     "text-[14px] font-medium truncate min-w-0 block",
-    m ? "text-disabled-foreground" : "text-foreground"
+    p ? "text-disabled-foreground" : "text-foreground"
   );
-  if (l) {
-    const e = s || [];
+  if (u) {
+    const e = o || [];
     let t = 0;
-    return x(e) ? t = Math.max(0, (typeof i == "number" ? i : u) - e.excludedValues.length) : f(e) && (t = e.length), t === 0 ? o : t === 1 && f(e) ? /* @__PURE__ */ n("span", { className: r, children: c(e[0]) }) : /* @__PURE__ */ n("span", { className: r, children: d(t) });
+    if (h(e) ? t = Math.max(0, (typeof s == "number" ? s : g) - e.excludedValues.length) : d(e) && (t = e.length), t === 0)
+      return c;
+    if (t === 1 && d(e)) {
+      const i = a(e[0]);
+      return /* @__PURE__ */ r(
+        m,
+        {
+          triggerClassName: n,
+          content: i,
+          side: "top",
+          variant: "tertiary",
+          children: /* @__PURE__ */ r("span", { children: i })
+        }
+      );
+    }
+    return /* @__PURE__ */ r("span", { className: n, children: v(t) });
   }
-  const a = s;
-  return a ? /* @__PURE__ */ n("span", { className: r, children: c(a) }) : o;
+  const l = o;
+  if (!l)
+    return c;
+  const f = a(l);
+  return /* @__PURE__ */ r(
+    m,
+    {
+      triggerClassName: n,
+      content: f,
+      side: "top",
+      variant: "tertiary",
+      children: /* @__PURE__ */ r("span", { children: f })
+    }
+  );
 }
 export {
-  T as SelectTriggerValue
+  C as SelectTriggerValue
 };

package/dist/components/forms/select/components/Submenu.js

@@ -1,26 +1,29 @@
 import { jsxs as s, jsx as t } from "react/jsx-runtime";
-import * as l from "@radix-ui/react-popover";
-import { Checkbox as k } from "../../checkbox/checkbox.js";
-import { ChevronRight as A, Checkmark as y } from "impact-nova-icons";
-import { cn as f } from "../../../../lib/utils.js";
-import { useOverlayPortalContainer as P } from "../../../../lib/overlay/overlay-portal-context.js";
-import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as w } from "../../../../lib/overlay/overlay-host.constants.js";
-const $ = ({
+import * as i from "@radix-ui/react-popover";
+import { Checkbox as P } from "../../checkbox/checkbox.js";
+import "react";
+import { OverflowTooltip as y } from "../../../feedback/tooltip/overflow-tooltip.js";
+import { ChevronRight as A, Checkmark as O } from "impact-nova-icons";
+import { cn as v } from "../../../../lib/utils.js";
+import { useOverlayPortalContainer as T } from "../../../../lib/overlay/overlay-portal-context.js";
+import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as _ } from "../../../../lib/overlay/overlay-host.constants.js";
+import { useSuppressOptionClickForTextSelection as E } from "../hooks/useSuppressOptionClickForTextSelection.js";
+const R = ({
   parentOption: n,
   isMulti: u,
-  isReadOnly: i,
-  isSelected: v,
-  getIndeterminateState: x,
+  isReadOnly: l,
+  isSelected: x,
+  getIndeterminateState: g,
   getSelectedCount: h,
-  handleSelect: g
+  handleSelect: C
 }) => {
-  const N = P(), d = "children" in n && Array.isArray(n.children) ? n.children : null;
+  const k = T(), { onOptionPointerDown: S, onOptionDoubleClick: N, createOptionClickHandler: w } = E(), d = "children" in n && Array.isArray(n.children) ? n.children : null;
   if (!d) return null;
   const c = String(n.value || "");
-  return /* @__PURE__ */ s(l.Root, { open: !0, children: [
-    /* @__PURE__ */ t(l.Anchor, { className: "absolute inset-0 pointer-events-none" }),
-    /* @__PURE__ */ t(l.Portal, { container: N, children: /* @__PURE__ */ t(
-      l.Content,
+  return /* @__PURE__ */ s(i.Root, { open: !0, children: [
+    /* @__PURE__ */ t(i.Anchor, { className: "absolute inset-0 pointer-events-none" }),
+    /* @__PURE__ */ t(i.Portal, { container: k, children: /* @__PURE__ */ t(
+      i.Content,
       {
         side: "right",
         sideOffset: 8,
@@ -31,57 +34,68 @@ const $ = ({
         onOpenAutoFocus: (e) => e.preventDefault(),
         onInteractOutside: (e) => e.preventDefault(),
         onFocusOutside: (e) => e.preventDefault(),
-        className: f(
+        className: v(
           "select-submenu-container z-50 min-w-[180px] max-h-[300px] overflow-auto rounded-xl bg-canvas-elevated py-1 shadow-elevation-floating",
-          w
+          _
         ),
         "data-component": "select-menu",
         children: d.map((e) => {
-          const a = v(e), S = x(e), o = e.isDisabled, m = h(e), r = "children" in e && Array.isArray(e.children) && e.children.length > 0, p = e.isParentSelectable !== !1, b = String(e.value || "");
+          const o = x(e), D = g(e), r = e.isDisabled, m = h(e), a = "children" in e && Array.isArray(e.children) && e.children.length > 0, p = e.isParentSelectable !== !1, b = String(e.value || "");
           return /* @__PURE__ */ s(
             "div",
             {
-              className: f(
+              className: v(
                 "relative flex h-[35px] cursor-default select-none items-center justify-between gap-1.5 rounded-[8px] px-3",
-                o ? "cursor-not-allowed bg-canvas-readonly opacity-50" : i ? "cursor-default" : "cursor-pointer hover:bg-canvas-muted",
-                a && !o && !r ? "bg-brand-subtle text-content" : "text-content"
+                r ? "cursor-not-allowed bg-canvas-readonly opacity-50" : l ? "cursor-default" : "cursor-pointer hover:bg-canvas-muted",
+                o && !r && !a ? "bg-brand-subtle text-content" : "text-content"
               ),
-              onClick: (C) => {
-                C.stopPropagation(), !o && !i && p && g(e);
+              onPointerDown: S,
+              onDoubleClick: N,
+              onClick: (f) => {
+                f.stopPropagation(), w(() => {
+                  !r && !l && p && C(e);
+                })(f);
               },
               "data-testid": `select-submenu-option-${c}-${b}`,
-              "data-state": a ? "checked" : "unchecked",
-              "data-disabled": o || void 0,
+              "data-state": o ? "checked" : "unchecked",
+              "data-disabled": r || void 0,
               "data-component": "select-option",
               children: [
                 /* @__PURE__ */ s("div", { className: "flex min-w-0 flex-1 items-center gap-1.5", children: [
                   u && p && /* @__PURE__ */ t(
-                    k,
+                    P,
                     {
-                      checked: S ? "indeterminate" : a,
-                      disabled: o || i,
+                      checked: D ? "indeterminate" : o,
+                      disabled: r || l,
                       onChange: () => {
                       }
                     }
                   ),
                   /* @__PURE__ */ t(
-                    "span",
+                    y,
                     {
-                      className: "block truncate text-[14px] font-medium leading-5",
-                      "data-testid": `select-submenu-option-label-${c}-${b}`,
-                      "data-state": a ? "checked" : "unchecked",
-                      title: String(e.label || ""),
-                      children: e.label
+                      triggerClassName: "block truncate select-text text-[14px] font-medium leading-5 min-w-0",
+                      content: String(e.label || ""),
+                      side: "top",
+                      variant: "tertiary",
+                      children: /* @__PURE__ */ t(
+                        "span",
+                        {
+                          "data-testid": `select-submenu-option-label-${c}-${b}`,
+                          "data-state": o ? "checked" : "unchecked",
+                          children: e.label
+                        }
+                      )
                     }
                   ),
-                  r && m > 0 && /* @__PURE__ */ s("span", { className: "text-xs text-secondary-foreground font-medium", children: [
+                  a && m > 0 && /* @__PURE__ */ s("span", { className: "text-xs text-secondary-foreground font-medium", children: [
                     "(",
                     m,
                     ")"
                   ] })
                 ] }),
-                r && /* @__PURE__ */ t(A, { size: "sm", className: "text-content-icon" }),
-                !u && a && !r && /* @__PURE__ */ t(y, { className: "h-4 w-4 text-brand" })
+                a && /* @__PURE__ */ t(A, { size: "sm", className: "text-content-icon" }),
+                !u && o && !a && /* @__PURE__ */ t(O, { className: "h-4 w-4 text-brand" })
               ]
             },
             e.value
@@ -92,5 +106,5 @@ const $ = ({
   ] });
 };
 export {
-  $ as Submenu
+  R as Submenu
 };

package/dist/components/forms/select/hooks/useSuppressOptionClickForTextSelection.d.ts

@@ -0,0 +1,5 @@
+export declare function useSuppressOptionClickForTextSelection(): {
+    onOptionPointerDown: (event: React.PointerEvent<HTMLElement>) => void;
+    onOptionDoubleClick: (event: React.MouseEvent<HTMLElement>) => void;
+    createOptionClickHandler: (onOptionClick: () => void) => (event: React.MouseEvent<HTMLElement>) => void;
+};

package/dist/components/forms/select/hooks/useSuppressOptionClickForTextSelection.js

@@ -0,0 +1,28 @@
+import { useRef as u, useCallback as t } from "react";
+import { shouldSuppressOptionClickForTextSelection as p } from "../utils/shouldSuppressOptionClickForTextSelection.js";
+function a() {
+  const n = u(null), i = t(
+    (o) => {
+      o.button === 0 && (n.current = {
+        clientX: o.clientX,
+        clientY: o.clientY
+      });
+    },
+    []
+  ), e = t(
+    (o) => {
+      o.stopPropagation();
+    },
+    []
+  ), r = t(
+    (o) => (c) => {
+      const l = n.current;
+      n.current = null, !p(l, c) && o();
+    },
+    []
+  );
+  return { onOptionPointerDown: i, onOptionDoubleClick: e, createOptionClickHandler: r };
+}
+export {
+  a as useSuppressOptionClickForTextSelection
+};