impact-nova 2.2.6 → 2.2.7

package/dist/components/flows/filter-strip/filter-tag-list.js

@@ -4,7 +4,7 @@ import { cn as O } from "../../../lib/utils.js";
 import { HorizontalScroller as $ } from "../../layout/horizontal-scroller/horizontal-scroller.js";
 import { TagGroup as A } from "../../primitives/tag-group/tag-group.js";
 import { Tag as C } from "../../primitives/tag/tag.js";
-import { Tooltip as k, TooltipTrigger as T, TooltipContent as z } from "../../feedback/tooltip/tooltip.js";
+import { Tooltip as T, TooltipTrigger as k, TooltipContent as z } from "../../feedback/tooltip/tooltip.js";
 import { OverflowTooltip as P } from "../../feedback/tooltip/overflow-tooltip.js";
 import { PopoverContent as j, Popover as R, PopoverTrigger as B } from "../../feedback/popover/popover.js";
 import { Button as F } from "../../primitives/button/button.js";
@@ -12,7 +12,7 @@ import { Checkmark as I, Copy as L, Cross as V } from "impact-nova-icons";
 const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px-2 text-xs font-medium font-['Manrope'] cursor-pointer focus:!ring-inset focus:!ring-offset-0 focus:!ring-brand data-[state=open]:!ring-inset data-[state=open]:!ring-offset-0 data-[state=open]:!ring-brand", E = ({
   remainingValues: a,
   viewAllTrigger: c = "expand",
-  onViewAll: h,
+  onViewAll: u,
   onItemRemove: v,
   isRemovable: f,
   isCopyable: e = !1,
@@ -20,8 +20,8 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
 }) => {
   const [s, g] = N.useState(!1), [n, d] = N.useState(null), x = (t, l, i) => {
     navigator.clipboard.writeText(String(l)), d(i), t.currentTarget.blur(), setTimeout(() => d(null), 1500);
-  }, b = s ? a : a.slice(0, 3), w = a.length > 3, u = () => {
-    c === "custom" ? h?.() : g(!0);
+  }, w = s ? a : a.slice(0, 3), b = a.length > 3, h = () => {
+    c === "custom" ? u?.() : g(!0);
   };
   return /* @__PURE__ */ o(
     j,
@@ -35,18 +35,18 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
           "div",
           {
             className: `flex flex-col gap-1 mb-2 ${s ? "max-h-[180px] overflow-y-auto" : ""}`,
-            children: b.map((t, l) => {
+            children: w.map((t, l) => {
               const i = String(t), y = !!(e || f);
               return /* @__PURE__ */ r(
                 "div",
                 {
-                  className: "group relative shrink-0 overflow-hidden rounded px-3 py-2 text-[14px] font-medium leading-[20px] text-foreground hover:bg-secondary",
+                  className: "group relative flex min-w-0 items-stretch overflow-hidden rounded px-3 py-2 text-[14px] font-medium leading-[20px] text-foreground hover:bg-secondary",
                   children: [
                     /* @__PURE__ */ o(
                       P,
                       {
                         triggerClassName: O(
-                          "block min-w-0 w-full truncate",
+                          "block min-w-0 flex-1 self-stretch truncate overflow-hidden",
                           y && "pe-0 group-hover:pe-10"
                         ),
                         content: i,
@@ -88,7 +88,7 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
             })
           }
         ),
-        !s && w && /* @__PURE__ */ r("div", { className: "flex flex-col gap-2", children: [
+        !s && b && /* @__PURE__ */ r("div", { className: "flex flex-col gap-2", children: [
           /* @__PURE__ */ o("div", { className: "h-px bg-stroke-hairline w-full" }),
           /* @__PURE__ */ o(
             F,
@@ -96,7 +96,7 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
               variant: "secondary",
               size: "md",
               className: "w-full justify-center",
-              onClick: u,
+              onClick: h,
               children: c === "custom" ? "View all" : `View all (${a.length})`
             }
           )
@@ -107,14 +107,14 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
 }, X = ({
   filters: a,
   onFilterRemove: c,
-  onOverflowClick: h,
+  onOverflowClick: u,
   onViewAll: v
 }) => /* @__PURE__ */ o("div", { className: "flex flex-1 items-center min-w-0", children: /* @__PURE__ */ o(
   $,
   {
     items: a,
     renderItem: (e, m) => {
-      const s = Array.isArray(e.value) ? e.value : [e.value], g = s.slice(0, 2), n = s.slice(2), d = !!e.overflow, x = e.overflow?.label ? e.overflow.label : e.overflow?.count ? `+${e.overflow.count}` : null, b = n.length > 0, w = d || b, u = `+${n.length}`;
+      const s = Array.isArray(e.value) ? e.value : [e.value], g = s.slice(0, 2), n = s.slice(2), d = !!e.overflow, x = e.overflow?.label ? e.overflow.label : e.overflow?.count ? `+${e.overflow.count}` : null, w = n.length > 0, b = d || w, h = `+${n.length}`;
       return /* @__PURE__ */ r("div", { className: "flex items-center px-1", children: [
         m > 0 && /* @__PURE__ */ o("div", { className: "mx-3 h-4 w-px bg-stroke-hairline shrink-0" }),
         /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
@@ -137,8 +137,8 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
                 }))
               }
             ),
-            w && (d ? /* @__PURE__ */ r(k, { children: [
-              /* @__PURE__ */ o(T, { asChild: !0, children: /* @__PURE__ */ o(
+            b && (d ? /* @__PURE__ */ r(T, { children: [
+              /* @__PURE__ */ o(k, { asChild: !0, children: /* @__PURE__ */ o(
                 C,
                 {
                   asButton: !0,
@@ -147,8 +147,8 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
                   shape: "rounded",
                   className: S,
                   "aria-label": `${e.overflow?.count || n.length} more filters for ${e.label}`,
-                  onClick: () => h?.(e.id),
-                  children: x || u
+                  onClick: () => u?.(e.id),
+                  children: x || h
                 }
               ) }),
               /* @__PURE__ */ r(z, { variant: "tertiary", side: "top", children: [
@@ -156,8 +156,8 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
                 " more filters"
               ] })
             ] }) : /* @__PURE__ */ r(R, { children: [
-              /* @__PURE__ */ r(k, { children: [
-                /* @__PURE__ */ o(T, { asChild: !0, children: /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ o(
+              /* @__PURE__ */ r(T, { children: [
+                /* @__PURE__ */ o(k, { asChild: !0, children: /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ o(
                   C,
                   {
                     asButton: !0,
@@ -165,7 +165,7 @@ const S = "whitespace-nowrap bg-accent text-brand hover:bg-accent/80 border-0 px
                     size: "md",
                     shape: "rounded",
                     className: S,
-                    children: u
+                    children: h
                   }
                 ) }) }),
                 /* @__PURE__ */ r(z, { variant: "tertiary", side: "top", children: [

package/dist/components/forms/prompt/prompt.variants.d.ts

@@ -1,3 +1,3 @@
 export declare const promptVariants: (props?: ({
-    variant?: "default" | "destructive" | "info" | "warning" | "success" | null | undefined;
+    variant?: "default" | "success" | "warning" | "destructive" | "info" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;

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

@@ -1,58 +1,62 @@
 import { jsx as o } from "react/jsx-runtime";
-import * as a from "@radix-ui/react-popover";
-import { cn as i } from "../../../../lib/utils.js";
-import { useOverlayPortalContainer as m } from "../../../../lib/overlay/overlay-portal-context.js";
-import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as v } from "../../../../lib/overlay/overlay-host.constants.js";
-function g({
-  menuRef: n,
-  menuMinHeight: t,
-  menuWidth: l,
+import * as n from "@radix-ui/react-popover";
+import { cn as a } from "../../../../lib/utils.js";
+import { preventDismissOnTooltipOutside as t } from "../../../../lib/overlay/prevent-dismiss-on-tooltip-outside.js";
+import { useOverlayPortalContainer as v } from "../../../../lib/overlay/overlay-portal-context.js";
+import { OVERLAY_NESTED_FLOATING_INSTANT_HIDE_CLASS as f } from "../../../../lib/overlay/overlay-host.constants.js";
+function O({
+  menuRef: l,
+  menuMinHeight: i,
+  menuWidth: s,
   isReadOnly: r,
   id: d,
-  menuLabel: s,
-  children: p
+  menuLabel: p,
+  children: m
 }) {
-  const c = m();
-  return /* @__PURE__ */ o(a.Portal, { container: c, children: /* @__PURE__ */ o(
-    a.Content,
+  const c = v();
+  return /* @__PURE__ */ o(n.Portal, { container: c, children: /* @__PURE__ */ o(
+    n.Content,
     {
-      ref: n,
+      ref: l,
       side: "bottom",
       sideOffset: 4,
       align: "start",
       avoidCollisions: !0,
       collisionPadding: 8,
-      "aria-label": s,
+      "aria-label": p,
       onOpenAutoFocus: (e) => e.preventDefault(),
+      onPointerDownOutside: t,
+      onInteractOutside: t,
+      onFocusOutside: t,
       onWheel: (e) => e.stopPropagation(),
       style: {
-        width: l ?? "var(--radix-popover-trigger-width)",
+        width: s ?? "var(--radix-popover-trigger-width)",
         minWidth: "var(--radix-popover-trigger-width)",
         maxHeight: "min(320px, var(--radix-popover-content-available-height, 320px))"
       },
-      className: i(
+      className: a(
         "z-50 flex flex-col overflow-hidden rounded-[12px] p-0 text-base shadow-elevation-select focus:outline-none sm:text-sm border-none pointer-events-auto",
         r ? "bg-disabled-surface" : "bg-canvas-elevated",
-        v
+        f
       ),
       "data-testid": `select-menu-${d || "default"}`,
       "data-component": "select-menu",
       children: /* @__PURE__ */ o(
         "div",
         {
-          className: i(
+          className: a(
             "flex min-h-0 flex-1 flex-col overflow-hidden rounded-[12px]",
             r ? "bg-disabled-surface" : "bg-canvas-elevated"
           ),
           style: {
-            minHeight: t ? `${t}px` : void 0
+            minHeight: i ? `${i}px` : void 0
           },
-          children: p
+          children: m
         }
       )
     }
   ) });
 }
 export {
-  g as SelectMenuPanel
+  O as SelectMenuPanel
 };

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

@@ -1,17 +1,18 @@
 import { jsxs as w, jsx as t } from "react/jsx-runtime";
-import { memo as T } from "react";
-import { Checkmark as Y, ChevronRight as F } from "impact-nova-icons";
-import { Badge as H } from "../../../data-display/badge/badge.js";
-import { OverflowTooltip as J } from "../../../feedback/tooltip/overflow-tooltip.js";
+import { memo as Y } from "react";
+import { useSuppressOptionClickForTextSelection as J } from "../hooks/useSuppressOptionClickForTextSelection.js";
+import { Checkmark as K, ChevronRight as L } from "impact-nova-icons";
+import { Badge as Q } from "../../../data-display/badge/badge.js";
+import { OverflowTooltip as U } from "../../../feedback/tooltip/overflow-tooltip.js";
 import { cn as m } from "../../../../lib/utils.js";
-import { selectOptionVariants as K } from "../select.variants.js";
-import { isSelected as L } from "../utils/select.js";
-import { Submenu as Q } from "./Submenu.js";
-function U({
+import { selectOptionVariants as W } from "../select.variants.js";
+import { isSelected as X } from "../utils/select.js";
+import { Submenu as Z } from "./Submenu.js";
+function _({
   option: e,
-  virtualRow: s,
-  measureElement: j,
-  selectFieldId: C,
+  virtualRow: o,
+  measureElement: P,
+  selectFieldId: j,
   id: v,
   isMulti: f,
   isReadOnly: u,
@@ -20,62 +21,64 @@ function U({
   showSequence: I,
   selected: r,
   isOptDisabled: n,
-  indeterminate: h,
-  selectedCount: N,
-  isParentSelectable: y,
-  highlighted: z,
-  activeSubmenu: B,
-  setActiveSubmenu: $,
-  optionLabel: V,
-  optionLabelString: E,
-  sequence: d,
-  internalValue: G,
-  renderOption: S,
+  indeterminate: p,
+  selectedCount: S,
+  isParentSelectable: N,
+  highlighted: O,
+  activeSubmenu: z,
+  setActiveSubmenu: y,
+  optionLabel: B,
+  optionLabelString: T,
+  sequence: s,
+  internalValue: V,
+  renderOption: $,
   onSelect: b,
-  getGroupStats: P
+  getGroupStats: C
 }) {
-  const x = v || "default", p = String(e.value || ""), l = c && e.isGroup, g = a && e.isSubmenuParent, k = I && !l && !g;
+  const h = v || "default", x = String(e.value || ""), l = c && e.isGroup, k = a && e.isSubmenuParent, g = I && !l && !k, { onOptionPointerDown: E, onOptionDoubleClick: F, createOptionClickHandler: G } = J(), H = () => {
+    n || (c && e.isGroup || a && e.isSubmenuParent) && !N || b(e);
+  };
   return /* @__PURE__ */ w(
     "div",
     {
-      "data-index": s.index,
-      ref: j,
+      "data-index": o.index,
+      ref: P,
       className: "absolute start-0 w-full pb-[2px]",
       style: {
-        transform: `translateY(${s.start}px)`,
+        transform: `translateY(${o.start}px)`,
         width: "100%"
       },
-      "data-testid": `select-option-wrapper-${x}-${p}`,
+      "data-testid": `select-option-wrapper-${h}-${x}`,
       children: [
         /* @__PURE__ */ t(
           "div",
           {
-            id: `${C}-option-${s.index}`,
+            id: `${j}-option-${o.index}`,
             className: m(
-              K({
+              W({
                 disabled: n,
                 readOnly: u,
                 selected: r && !n && !(c && e.isGroup) && !(a && e.isSubmenuParent),
-                highlighted: z && !n
+                highlighted: O && !n
               })
             ),
             style: {
               paddingInlineStart: `${e.depth * 16 + 12}px`
             },
-            onClick: () => {
-              n || (c && e.isGroup || a && e.isSubmenuParent) && !y || b(e);
-            },
+            onPointerDown: E,
+            onDoubleClick: F,
+            onClick: G(H),
             onMouseEnter: () => {
-              a && e.isSubmenuParent ? $(e.value) : $(null);
+              a && e.isSubmenuParent ? y(e.value) : y(null);
             },
-            "data-testid": `select-option-${x}-${p}`,
+            "data-testid": `select-option-${h}-${x}`,
             "data-state": r ? "checked" : "unchecked",
             "data-disabled": n || void 0,
             "data-component": "select-option",
             role: "option",
             "aria-selected": r,
             "aria-disabled": n || void 0,
-            children: S ? S(
+            children: $ ? $(
               {
                 onClick: () => {
                 },
@@ -85,16 +88,16 @@ function U({
               },
               e
             ) : /* @__PURE__ */ w("div", { className: "flex items-center flex-1 overflow-hidden", children: [
-              f && (c && e.isGroup || a && e.isSubmenuParent ? y : !0) && /* @__PURE__ */ t(
+              f && (c && e.isGroup || a && e.isSubmenuParent ? N : !0) && /* @__PURE__ */ t(
                 "span",
                 {
                   "aria-hidden": "true",
                   className: m(
                     "mr-[7px] flex h-4 w-4 shrink-0 items-center justify-center rounded-[4px] border border-stroke-field bg-canvas-elevated",
-                    (r || h) && "border-brand bg-accent text-brand",
+                    (r || p) && "border-brand bg-accent text-brand",
                     (n || u) && "opacity-50"
                   ),
-                  children: r && !h ? /* @__PURE__ */ t(Y, { className: "h-3.5 w-3.5" }) : h ? /* @__PURE__ */ t("span", { className: "block h-0.5 w-2.5 bg-current" }) : null
+                  children: r && !p ? /* @__PURE__ */ t(K, { className: "h-3.5 w-3.5" }) : p ? /* @__PURE__ */ t("span", { className: "block h-0.5 w-2.5 bg-current" }) : null
                 }
               ),
               /* @__PURE__ */ w(
@@ -102,72 +105,72 @@ function U({
                 {
                   className: m(
                     "flex min-w-0 flex-1 items-center overflow-hidden",
-                    k ? "justify-between gap-2" : "gap-2"
+                    g ? "justify-between gap-2" : "gap-2"
                   ),
                   children: [
                     /* @__PURE__ */ t(
-                      J,
+                      U,
                       {
                         triggerClassName: m(
-                          "block min-w-0 truncate",
-                          k && "flex-1",
-                          l ? "text-xs font-semibold text-content-icon uppercase tracking-wider" : r && !g ? "font-medium" : "font-normal",
+                          "block min-w-0 truncate select-text",
+                          g && "flex-1",
+                          l ? "text-xs font-semibold text-content-icon uppercase tracking-wider" : r && !k ? "font-medium" : "font-normal",
                           !l && "text-[14px]"
                         ),
-                        content: E,
+                        content: T,
                         side: "top",
                         variant: "tertiary",
                         children: /* @__PURE__ */ t(
                           "span",
                           {
-                            "data-testid": `select-option-label-${x}-${p}`,
+                            "data-testid": `select-option-label-${h}-${x}`,
                             "data-state": r ? "checked" : "unchecked",
-                            children: V
+                            children: B
                           }
                         )
                       }
                     ),
-                    (l || g) && N > 0 && /* @__PURE__ */ t("span", { className: "inline-flex shrink-0 items-center justify-center rounded-full bg-brand-tint px-1.5 py-0.5 text-xs font-medium text-brand-on-subtle", children: N }),
-                    k && /* @__PURE__ */ t("span", { className: "flex h-5 w-6 shrink-0 items-center justify-center", children: d !== void 0 && d > 0 ? /* @__PURE__ */ t(
-                      H,
+                    (l || k) && S > 0 && /* @__PURE__ */ t("span", { className: "inline-flex shrink-0 items-center justify-center rounded-full bg-brand-tint px-1.5 py-0.5 text-xs font-medium text-brand-on-subtle", children: S }),
+                    g && /* @__PURE__ */ t("span", { className: "flex h-5 w-6 shrink-0 items-center justify-center", children: s !== void 0 && s > 0 ? /* @__PURE__ */ t(
+                      Q,
                       {
                         variant: "outline",
                         color: "primary",
                         size: "sm",
-                        "data-testid": `select-option-sequence-${d}`,
-                        children: d.toString()
+                        "data-testid": `select-option-sequence-${s}`,
+                        children: s.toString()
                       }
                     ) : null })
                   ]
                 }
               ),
-              a && e.isSubmenuParent && /* @__PURE__ */ t(F, { size: "12px", className: "text-content-icon" })
+              a && e.isSubmenuParent && /* @__PURE__ */ t(L, { size: "12px", className: "text-content-icon" })
             ] })
           }
         ),
-        a && B === e.value && e.isSubmenuParent && /* @__PURE__ */ t(
-          Q,
+        a && z === e.value && e.isSubmenuParent && /* @__PURE__ */ t(
+          Z,
           {
             parentOption: e,
             isMulti: !!f,
             isReadOnly: !!u,
-            isSelected: (i) => L(i, G, !!f),
+            isSelected: (i) => X(i, V, !!f),
             getIndeterminateState: (i) => {
-              const o = P(i);
-              return o ? o.selected > 0 && o.selected < o.total : !1;
+              const d = C(i);
+              return d ? d.selected > 0 && d.selected < d.total : !1;
             },
-            getSelectedCount: (i) => P(i)?.selected || 0,
+            getSelectedCount: (i) => C(i)?.selected || 0,
             handleSelect: b,
             id: v
           }
         )
       ]
     },
-    s.key
+    o.key
   );
 }
-const D = T(U);
+const ie = Y(_);
 export {
-  D as SelectOptionRow,
-  U as SelectOptionRowInner
+  ie as SelectOptionRow,
+  _ as SelectOptionRowInner
 };

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

@@ -1,27 +1,28 @@
 import { jsxs as s, jsx as t } from "react/jsx-runtime";
 import * as i from "@radix-ui/react-popover";
-import { Checkbox as k } from "../../checkbox/checkbox.js";
+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 w } 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 D } from "../../../../lib/overlay/overlay-host.constants.js";
-const L = ({
+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: d,
+  isMulti: u,
   isReadOnly: l,
-  isSelected: v,
-  getIndeterminateState: x,
-  getSelectedCount: g,
-  handleSelect: h
+  isSelected: x,
+  getIndeterminateState: g,
+  getSelectedCount: h,
+  handleSelect: C
 }) => {
-  const C = P(), u = "children" in n && Array.isArray(n.children) ? n.children : null;
-  if (!u) return 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(i.Root, { open: !0, children: [
     /* @__PURE__ */ t(i.Anchor, { className: "absolute inset-0 pointer-events-none" }),
-    /* @__PURE__ */ t(i.Portal, { container: C, children: /* @__PURE__ */ t(
+    /* @__PURE__ */ t(i.Portal, { container: k, children: /* @__PURE__ */ t(
       i.Content,
       {
         side: "right",
@@ -33,35 +34,39 @@ const L = ({
         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",
-          D
+          _
         ),
         "data-component": "select-menu",
-        children: u.map((e) => {
-          const a = v(e), N = x(e), o = e.isDisabled, m = g(e), r = "children" in e && Array.isArray(e.children) && e.children.length > 0, p = e.isParentSelectable !== !1, b = String(e.value || "");
+        children: d.map((e) => {
+          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" : l ? "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: (S) => {
-                S.stopPropagation(), !o && !l && p && h(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: [
-                  d && p && /* @__PURE__ */ t(
-                    k,
+                  u && p && /* @__PURE__ */ t(
+                    P,
                     {
-                      checked: N ? "indeterminate" : a,
-                      disabled: o || l,
+                      checked: D ? "indeterminate" : o,
+                      disabled: r || l,
                       onChange: () => {
                       }
                     }
@@ -69,7 +74,7 @@ const L = ({
                   /* @__PURE__ */ t(
                     y,
                     {
-                      triggerClassName: "block truncate text-[14px] font-medium leading-5 min-w-0",
+                      triggerClassName: "block truncate select-text text-[14px] font-medium leading-5 min-w-0",
                       content: String(e.label || ""),
                       side: "top",
                       variant: "tertiary",
@@ -77,20 +82,20 @@ const L = ({
                         "span",
                         {
                           "data-testid": `select-submenu-option-label-${c}-${b}`,
-                          "data-state": a ? "checked" : "unchecked",
+                          "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" }),
-                !d && a && !r && /* @__PURE__ */ t(w, { 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
@@ -101,5 +106,5 @@ const L = ({
   ] });
 };
 export {
-  L 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
+};