@versini/ui-dropdown 1.1.0 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.0
2
+ @versini/ui-dropdown v1.1.2
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.0",
9
- buildTime: "12/15/2025 01:21 PM EST",
8
+ version: "1.1.2",
9
+ buildTime: "12/15/2025 07:44 PM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
@@ -19,7 +19,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
19
19
  import { Content, Label, Portal, Root, Separator, Sub, SubContent, SubTrigger, Trigger } from "@radix-ui/react-dropdown-menu";
20
20
  import { IconNext } from "@versini/ui-icons";
21
21
  import clsx from "clsx";
22
- import { cloneElement, useState } from "react";
22
+ import { cloneElement, useRef, useState } from "react";
23
23
  import { getDisplayName } from "./utilities.js";
24
24
 
25
25
  ;// CONCATENATED MODULE: external "react/jsx-runtime"
@@ -41,8 +41,9 @@ import { getDisplayName } from "./utilities.js";
41
41
 
42
42
 
43
43
 
44
- const CONTENT_CLASS = "rounded-md bg-surface-light shadow-sm shadow-border-dark outline-hidden p-3 sm:p-2";
45
- const SUB_TRIGGER_CLASS = clsx("flex items-center flex-row justify-between", "w-full", "m-0 first:mt-0 mt-2 sm:mt-1 px-2 py-1", "rounded-md border border-transparent", "text-left text-base", "outline-hidden focus:border focus:border-border-medium focus:bg-surface-lighter focus:underline", "disabled:cursor-not-allowed disabled:text-copy-medium", "data-[highlighted]:bg-surface-lighter data-[highlighted]:border-border-medium data-[highlighted]:underline", "data-[state=open]:bg-surface-lighter");
44
+ const CONTENT_CLASS = "z-[60] rounded-md bg-surface-light shadow-sm shadow-border-dark outline-hidden p-3 sm:p-2";
45
+ const SUB_CONTENT_CLASS = "z-[60] rounded-md bg-surface-light shadow-sm shadow-border-dark outline-hidden p-3 sm:p-2 mx-3";
46
+ const SUB_TRIGGER_CLASS = clsx("flex items-center flex-row justify-between", "w-full", "m-0 first:mt-0 mt-2 sm:mt-1 px-2 py-1", "rounded-md border border-transparent", "text-left text-base select-none cursor-pointer", "outline-hidden focus:border focus:border-border-medium focus:bg-surface-lighter focus:underline", "disabled:cursor-not-allowed disabled:text-copy-medium", "data-[highlighted]:bg-surface-lighter data-[highlighted]:border-border-medium data-[highlighted]:underline", "data-[state=open]:bg-surface-lighter");
46
47
  /**
47
48
  * Convert Radix placement format to our simplified format.
48
49
  */ const getRadixSide = (placement)=>{
@@ -80,30 +81,27 @@ const DropdownMenu = ({ trigger, children, label = "Open menu", defaultPlacement
80
81
  focusMode,
81
82
  mode
82
83
  } : {};
83
- /* v8 ignore next 6 - trigger is required in practice */ const triggerElement = trigger ? /*#__PURE__*/ cloneElement(trigger, {
84
+ const triggerRef = useRef(null);
85
+ /* v8 ignore next 7 - trigger is required in practice */ const triggerElement = trigger ? /*#__PURE__*/ cloneElement(trigger, {
84
86
  ...uiButtonsExtraProps,
85
- "aria-label": label
87
+ "aria-label": label,
88
+ ref: triggerRef
86
89
  }) : null;
87
90
  const handleOpenChange = (open)=>{
88
91
  setIsOpen(open);
89
92
  onOpenChange?.(open);
90
- };
91
- /**
92
- * Handle pointer down to ensure the event propagates to parent elements.
93
- * This is crucial for compatibility with Tooltip components that need
94
- * to detect clicks on their trigger to disable tooltip display.
95
- * We use onPointerDown because it fires before Radix's internal handlers
96
- * and allows proper event bubbling.
97
- */ const handlePointerDown = (e)=>{
98
93
  /**
99
- * Dispatch a click event to ensure parent components (like Tooltip)
100
- * can detect the interaction and respond appropriately.
101
- */ const clickEvent = new MouseEvent("click", {
102
- bubbles: true,
103
- cancelable: true,
104
- view: window
105
- });
106
- e.currentTarget.dispatchEvent(clickEvent);
94
+ * When the menu opens, dispatch a click event to parent elements.
95
+ * This ensures that parent components like Tooltip can detect the
96
+ * interaction and respond appropriately (e.g., disable tooltip display).
97
+ */ if (open && triggerRef.current) {
98
+ const clickEvent = new MouseEvent("click", {
99
+ bubbles: true,
100
+ cancelable: true,
101
+ view: window
102
+ });
103
+ triggerRef.current.dispatchEvent(clickEvent);
104
+ }
107
105
  };
108
106
  return /*#__PURE__*/ jsxs(Root, {
109
107
  onOpenChange: handleOpenChange,
@@ -112,7 +110,6 @@ const DropdownMenu = ({ trigger, children, label = "Open menu", defaultPlacement
112
110
  /*#__PURE__*/ jsx(Trigger, {
113
111
  asChild: true,
114
112
  "data-state": isOpen ? "open" : "closed",
115
- onPointerDown: handlePointerDown,
116
113
  children: triggerElement
117
114
  }),
118
115
  /*#__PURE__*/ jsx(Portal, {
@@ -121,12 +118,6 @@ const DropdownMenu = ({ trigger, children, label = "Open menu", defaultPlacement
121
118
  sideOffset: sideOffset,
122
119
  side: getRadixSide(defaultPlacement),
123
120
  align: getRadixAlign(defaultPlacement),
124
- onCloseAutoFocus: (e)=>{
125
- /**
126
- * Prevent focus from returning to the trigger when menu closes.
127
- * This helps avoid tooltip re-triggering immediately after menu closes.
128
- */ e.preventDefault();
129
- },
130
121
  children: children
131
122
  })
132
123
  })
@@ -153,7 +144,7 @@ const DropdownMenuSub = ({ label, children, disabled = false, sideOffset = 2, al
153
144
  }),
154
145
  /*#__PURE__*/ jsx(Portal, {
155
146
  children: /*#__PURE__*/ jsx(SubContent, {
156
- className: CONTENT_CLASS,
147
+ className: SUB_CONTENT_CLASS,
157
148
  sideOffset: sideOffset,
158
149
  alignOffset: alignOffset,
159
150
  children: children
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.0
2
+ @versini/ui-dropdown v1.1.2
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.0",
9
- buildTime: "12/15/2025 01:21 PM EST",
8
+ version: "1.1.2",
9
+ buildTime: "12/15/2025 07:44 PM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
@@ -33,7 +33,7 @@ import clsx from "clsx";
33
33
 
34
34
 
35
35
 
36
- const ITEM_CLASS = clsx("flex flex-row items-center", "w-full", "m-0 first:mt-0 mt-2 sm:mt-1 px-2 py-1", "rounded-md border border-transparent", "text-left text-base", "outline-hidden focus:border focus:border-border-medium focus:bg-surface-lighter focus:underline", "disabled:cursor-not-allowed disabled:text-copy-medium", "data-[highlighted]:bg-surface-lighter data-[highlighted]:border-border-medium data-[highlighted]:underline", "data-[disabled]:cursor-not-allowed data-[disabled]:text-copy-medium");
36
+ const ITEM_CLASS = clsx("flex flex-row items-center", "w-full", "m-0 first:mt-0 mt-2 sm:mt-1 px-2 py-1", "rounded-md border border-transparent", "text-left text-base select-none cursor-pointer", "outline-hidden focus:border focus:border-border-medium focus:bg-surface-lighter focus:underline", "disabled:cursor-not-allowed disabled:text-copy-medium", "data-[highlighted]:bg-surface-lighter data-[highlighted]:border-border-medium data-[highlighted]:underline", "data-[disabled]:cursor-not-allowed data-[disabled]:text-copy-medium");
37
37
  const DropdownMenuItem = ({ label, disabled, icon, raw = false, children, ignoreClick = false, selected, onSelect, onClick, onFocus, ...props })=>{
38
38
  let buttonSpanClass = "";
39
39
  if (raw && children) {
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.0
2
+ @versini/ui-dropdown v1.1.2
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.0",
9
- buildTime: "12/15/2025 01:21 PM EST",
8
+ version: "1.1.2",
9
+ buildTime: "12/15/2025 07:44 PM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.0
2
+ @versini/ui-dropdown v1.1.2
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.0",
9
- buildTime: "12/15/2025 01:21 PM EST",
8
+ version: "1.1.2",
9
+ buildTime: "12/15/2025 07:44 PM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
package/dist/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-dropdown v1.1.0
2
+ @versini/ui-dropdown v1.1.2
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_DROPDOWN__) {
7
7
  window.__VERSINI_UI_DROPDOWN__ = {
8
- version: "1.1.0",
9
- buildTime: "12/15/2025 01:21 PM EST",
8
+ version: "1.1.2",
9
+ buildTime: "12/15/2025 07:44 PM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-dropdown",
11
11
  license: "MIT",
12
12
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-dropdown",
3
- "version": "1.1.0",
3
+ "version": "1.1.2",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -50,5 +50,5 @@
50
50
  "sideEffects": [
51
51
  "**/*.css"
52
52
  ],
53
- "gitHead": "28e13adabce18578034a9ca5553d7cfb9853c214"
53
+ "gitHead": "699b13029f1d14089c1875bc50f049c1c7b9859a"
54
54
  }