@gridui/dropdown-menu 1.0.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.
package/README.md CHANGED
@@ -1,19 +1,19 @@
1
1
  # @gridui/dropdown-menu
2
2
 
3
- Core family. Public API: `ContextMenu`, `ContextMenuProps`, `DropdownMenu`, `DropdownMenuContent`, `DropdownMenuContentProps`, `DropdownMenuItem`, `DropdownMenuItemProps`, `DropdownMenuLabel`, `DropdownMenuLabelProps`, `DropdownMenuProps`, `DropdownMenuRadioGroup`, `DropdownMenuRadioItem`, `DropdownMenuRadioItemProps`, `DropdownMenuTrigger`, `dropdownContentStyles`, `dropdownIndicatorStyles`, `dropdownItemStyles`, `dropdownLabelStyles`.
3
+ Core family. Public API: `ContextMenu`, `ContextMenuProps`, `DropdownMenu`, `DropdownMenuContent`, `DropdownMenuContentProps`, `DropdownMenuItem`, `DropdownMenuItemProps`, `DropdownMenuLabel`, `DropdownMenuLabelProps`, `DropdownMenuProps`, `DropdownMenuRadioGroup`, `DropdownMenuRadioGroupProps`, `DropdownMenuRadioItem`, `DropdownMenuRadioItemProps`, `DropdownMenuTrigger`, `DropdownMenuTriggerProps`, `dropdownContentStyles`, `dropdownIndicatorStyles`, `dropdownItemStyles`, `dropdownLabelStyles`.
4
4
 
5
5
  Import components from `@gridui/dropdown-menu` and load `@gridui/dropdown-menu/styles.css` after Theme.
6
6
  Load styles for any composed dependency used by this family. Applications own routes, labels, state persistence, and branding.
7
7
 
8
- See [component ownership](../../docs/component-ownership.md) and [release history](.changeset/history/).
8
+ See [component ownership](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/docs/component-ownership.md) and [release history](https://github.com/sudo-ui/GridUI-React-Monorepo/tree/main/packages-core/dropdown-menu/.changeset/history).
9
9
 
10
10
  ## Buttons and dropdown menus
11
11
 
12
12
  Import `Button`, `ButtonLink`, `buttonClass`, `useAsyncAction`, and `downloadBlob`
13
- from [`@gridui/button`](../button/README.md). Load that package's `styles.css`
14
- for standalone buttons and actions composed by Controls. The Button package owns
13
+ from [`@gridui/button`](https://github.com/sudo-ui/GridUI-React-Monorepo/blob/main/packages-core/button/README.md). Load that package's `styles.css`
14
+ for standalone buttons and composed actions. The Button package owns
15
15
  native semantics, variants, sizes, icons, loading, and action lifecycle behavior.
16
- Controls no longer contains or forwards those implementations.
16
+ DropdownMenu uses Button through its public API.
17
17
 
18
18
  `@gridui/dropdown-menu` wraps Radix Dropdown Menu.
19
19
  It exports the root, trigger, portalled content, items, label, radio
@@ -22,3 +22,5 @@ its separate `styles.css` export. Radix owns keyboard navigation, focus return,
22
22
  Escape dismissal, and viewport collisions. The portal avoids clipped grid
23
23
  boundaries.
24
24
 
25
+
26
+ Surface motion uses `@gridui/overlay`; load `@gridui/overlay/styles.css` after Theme and before this family.
@@ -5,4 +5,6 @@
5
5
  * @description Dropdown Menu Radio Group
6
6
  */
7
7
  import * as Primitive from "@radix-ui/react-dropdown-menu";
8
- export declare const DropdownMenuRadioGroup: import("react").ForwardRefExoticComponent<Primitive.DropdownMenuRadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
8
+ import type { ComponentPropsWithRef, FC } from "react";
9
+ export type DropdownMenuRadioGroupProps = ComponentPropsWithRef<typeof Primitive.RadioGroup>;
10
+ export declare const DropdownMenuRadioGroup: FC<DropdownMenuRadioGroupProps>;
@@ -5,4 +5,6 @@
5
5
  * @description Dropdown Menu Trigger
6
6
  */
7
7
  import * as Primitive from "@radix-ui/react-dropdown-menu";
8
- export declare const DropdownMenuTrigger: import("react").ForwardRefExoticComponent<Primitive.DropdownMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
8
+ import type { ComponentPropsWithRef, FC } from "react";
9
+ export type DropdownMenuTriggerProps = ComponentPropsWithRef<typeof Primitive.Trigger>;
10
+ export declare const DropdownMenuTrigger: FC<DropdownMenuTriggerProps>;
package/dist/index.d.ts CHANGED
@@ -16,9 +16,11 @@ export { DropdownMenuItem } from "./dropdown-menu-item/dropdown-menu-item";
16
16
  export type { DropdownMenuLabelProps } from "./dropdown-menu-label/dropdown-menu-label";
17
17
  export { DropdownMenuLabel } from "./dropdown-menu-label/dropdown-menu-label";
18
18
  export { dropdownLabelStyles } from "./dropdown-menu-label/style";
19
+ export type { DropdownMenuRadioGroupProps } from "./dropdown-menu-radio-group/dropdown-menu-radio-group";
19
20
  export { DropdownMenuRadioGroup } from "./dropdown-menu-radio-group/dropdown-menu-radio-group";
20
21
  export type { DropdownMenuRadioItemProps } from "./dropdown-menu-radio-item/dropdown-menu-radio-item";
21
22
  export { DropdownMenuRadioItem } from "./dropdown-menu-radio-item/dropdown-menu-radio-item";
22
23
  export { dropdownIndicatorStyles } from "./dropdown-menu-radio-item/style";
24
+ export type { DropdownMenuTriggerProps } from "./dropdown-menu-trigger/dropdown-menu-trigger";
23
25
  export { DropdownMenuTrigger } from "./dropdown-menu-trigger/dropdown-menu-trigger";
24
26
  export { dropdownItemStyles } from "./shared/style";
package/dist/index.js CHANGED
@@ -20,12 +20,13 @@ var DropdownMenu = (props) => {
20
20
  };
21
21
 
22
22
  // src/dropdown-menu-content/style.ts
23
+ import { overlaySurfaceStyles } from "@gridui/overlay";
23
24
  import { cn } from "@gridui/style-utils";
24
25
  import { cva } from "class-variance-authority";
25
26
  var dropdownContentStyles = cva(cn(
27
+ overlaySurfaceStyles(),
26
28
  "gridui-dropdown-content",
27
- "z-(--gridui-z-popover) min-w-44 max-w-[calc(100vw-2*var(--gridui-page-gutter))] max-h-(--radix-dropdown-menu-content-available-height) overflow-y-auto p-gridui-4 border border-solid border-border rounded-control text-foreground bg-background type-data",
28
- "data-[state='closed']:pointer-events-none"
29
+ "gridui-u-z-(--gridui-z-popover) gridui-u-min-w-44 gridui-u-max-w-[calc(100vw-2*var(--gridui-page-gutter))] gridui-u-max-h-(--radix-dropdown-menu-content-available-height) gridui-u-overflow-y-auto gridui-u-p-gridui-4 gridui-u-type-data"
29
30
  ));
30
31
 
31
32
  // src/dropdown-menu-content/dropdown-menu-content.tsx
@@ -62,12 +63,20 @@ var DropdownMenuContent = (props) => {
62
63
 
63
64
  // src/dropdown-menu-trigger/dropdown-menu-trigger.tsx
64
65
  import * as Primitive3 from "@radix-ui/react-dropdown-menu";
65
- var DropdownMenuTrigger = Primitive3.Trigger;
66
+ import { jsx as jsx3 } from "react/jsx-runtime";
67
+ var DropdownMenuTrigger = (props) => {
68
+ return /* @__PURE__ */ jsx3(
69
+ Primitive3.Trigger,
70
+ {
71
+ ...props
72
+ }
73
+ );
74
+ };
66
75
 
67
76
  // src/context-menu/context-menu.tsx
68
77
  import { useEffect, useState } from "react";
69
78
  import { createPortal } from "react-dom";
70
- import { jsx as jsx3, jsxs } from "react/jsx-runtime";
79
+ import { jsx as jsx4, jsxs } from "react/jsx-runtime";
71
80
  var ContextMenu = (props) => {
72
81
  const { x, y, label, children, onClose, onCloseAutoFocus, onKeyDown, ...contentProps } = props;
73
82
  const [returnFocus] = useState(() => {
@@ -98,11 +107,11 @@ var ContextMenu = (props) => {
98
107
  }
99
108
  },
100
109
  children: [
101
- /* @__PURE__ */ jsx3(
110
+ /* @__PURE__ */ jsx4(
102
111
  DropdownMenuTrigger,
103
112
  {
104
113
  asChild: true,
105
- children: /* @__PURE__ */ jsx3(
114
+ children: /* @__PURE__ */ jsx4(
106
115
  "button",
107
116
  {
108
117
  type: "button",
@@ -123,7 +132,7 @@ var ContextMenu = (props) => {
123
132
  )
124
133
  }
125
134
  ),
126
- /* @__PURE__ */ jsx3(
135
+ /* @__PURE__ */ jsx4(
127
136
  DropdownMenuContent,
128
137
  {
129
138
  "aria-label": label,
@@ -163,21 +172,21 @@ import { cn as cn3 } from "@gridui/style-utils";
163
172
  import { cva as cva2 } from "class-variance-authority";
164
173
  var dropdownItemStyles = cva2(cn3(
165
174
  "gridui-dropdown-item",
166
- "flex min-h-10 items-center gap-gridui-8 px-gridui-8 py-gridui-8 rounded-xs text-inherit no-underline outline-none cursor-pointer",
167
- "data-highlighted:bg-surface data-highlighted:[box-shadow:inset_0_0_0_1px_var(--gridui-border)]",
168
- "data-disabled:opacity-50 data-disabled:pointer-events-none"
175
+ "gridui-u-flex gridui-u-min-h-10 gridui-u-items-center gridui-u-gap-gridui-8 gridui-u-px-gridui-8 gridui-u-py-gridui-8 gridui-u-rounded-xs gridui-u-text-inherit gridui-u-no-underline gridui-u-outline-none gridui-u-cursor-pointer",
176
+ "gridui-u-data-highlighted:bg-surface gridui-u-data-highlighted:[box-shadow:inset_0_0_0_1px_var(--gridui-border)]",
177
+ "gridui-u-data-disabled:opacity-50 gridui-u-data-disabled:pointer-events-none"
169
178
  ));
170
179
 
171
180
  // src/dropdown-menu-item/dropdown-menu-item.tsx
172
181
  import { cn as cn4 } from "@gridui/style-utils";
173
182
  import * as Primitive4 from "@radix-ui/react-dropdown-menu";
174
- import { jsx as jsx4 } from "react/jsx-runtime";
183
+ import { jsx as jsx5 } from "react/jsx-runtime";
175
184
  var DropdownMenuItem = (props) => {
176
185
  const {
177
186
  className,
178
187
  ...restProps
179
188
  } = props;
180
- return /* @__PURE__ */ jsx4(
189
+ return /* @__PURE__ */ jsx5(
181
190
  Primitive4.Item,
182
191
  {
183
192
  ...restProps,
@@ -191,19 +200,19 @@ import { cn as cn5 } from "@gridui/style-utils";
191
200
  import { cva as cva3 } from "class-variance-authority";
192
201
  var dropdownLabelStyles = cva3(cn5(
193
202
  "gridui-dropdown-label",
194
- "p-gridui-8 text-muted type-caption"
203
+ "gridui-u-p-gridui-8 gridui-u-text-muted gridui-u-type-caption"
195
204
  ));
196
205
 
197
206
  // src/dropdown-menu-label/dropdown-menu-label.tsx
198
207
  import { cn as cn6 } from "@gridui/style-utils";
199
208
  import * as Primitive5 from "@radix-ui/react-dropdown-menu";
200
- import { jsx as jsx5 } from "react/jsx-runtime";
209
+ import { jsx as jsx6 } from "react/jsx-runtime";
201
210
  var DropdownMenuLabel = (props) => {
202
211
  const {
203
212
  className,
204
213
  ...restProps
205
214
  } = props;
206
- return /* @__PURE__ */ jsx5(
215
+ return /* @__PURE__ */ jsx6(
207
216
  Primitive5.Label,
208
217
  {
209
218
  ...restProps,
@@ -214,21 +223,29 @@ var DropdownMenuLabel = (props) => {
214
223
 
215
224
  // src/dropdown-menu-radio-group/dropdown-menu-radio-group.tsx
216
225
  import * as Primitive6 from "@radix-ui/react-dropdown-menu";
217
- var DropdownMenuRadioGroup = Primitive6.RadioGroup;
226
+ import { jsx as jsx7 } from "react/jsx-runtime";
227
+ var DropdownMenuRadioGroup = (props) => {
228
+ return /* @__PURE__ */ jsx7(
229
+ Primitive6.RadioGroup,
230
+ {
231
+ ...props
232
+ }
233
+ );
234
+ };
218
235
 
219
236
  // src/dropdown-menu-radio-item/style.ts
220
237
  import { cn as cn7 } from "@gridui/style-utils";
221
238
  import { cva as cva4 } from "class-variance-authority";
222
239
  var dropdownIndicatorStyles = cva4(cn7(
223
240
  "gridui-dropdown-indicator",
224
- "w-gridui-16 shrink-0 text-foreground"
241
+ "gridui-u-w-gridui-16 gridui-u-shrink-0 gridui-u-text-foreground"
225
242
  ));
226
243
 
227
244
  // src/dropdown-menu-radio-item/dropdown-menu-radio-item.tsx
228
245
  import { cn as cn8 } from "@gridui/style-utils";
229
246
  import * as Primitive7 from "@radix-ui/react-dropdown-menu";
230
247
  import { Check } from "lucide-react";
231
- import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
248
+ import { jsx as jsx8, jsxs as jsxs2 } from "react/jsx-runtime";
232
249
  var DropdownMenuRadioItem = (props) => {
233
250
  const {
234
251
  className,
@@ -241,12 +258,12 @@ var DropdownMenuRadioItem = (props) => {
241
258
  ...restProps,
242
259
  className: cn8(dropdownItemStyles(), className),
243
260
  children: [
244
- /* @__PURE__ */ jsx6(
261
+ /* @__PURE__ */ jsx8(
245
262
  "span",
246
263
  {
247
264
  className: cn8(dropdownIndicatorStyles()),
248
265
  "aria-hidden": "true",
249
- children: /* @__PURE__ */ jsx6(Primitive7.ItemIndicator, { children: /* @__PURE__ */ jsx6(
266
+ children: /* @__PURE__ */ jsx8(Primitive7.ItemIndicator, { children: /* @__PURE__ */ jsx8(
250
267
  Check,
251
268
  {
252
269
  size: 16,
package/dist/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../src/dropdown-menu/dropdown-menu.tsx", "../src/dropdown-menu-content/style.ts", "../src/dropdown-menu-content/dropdown-menu-content.tsx", "../src/dropdown-menu-trigger/dropdown-menu-trigger.tsx", "../src/context-menu/context-menu.tsx", "../src/shared/style.ts", "../src/dropdown-menu-item/dropdown-menu-item.tsx", "../src/dropdown-menu-label/style.ts", "../src/dropdown-menu-label/dropdown-menu-label.tsx", "../src/dropdown-menu-radio-group/dropdown-menu-radio-group.tsx", "../src/dropdown-menu-radio-item/style.ts", "../src/dropdown-menu-radio-item/dropdown-menu-radio-item.tsx"],
4
- "sourcesContent": ["/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenu\n * @description Dropdown Menu\n */\n\nimport { OverlayOpen, useOverlayState } from \"@gridui/overlay\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuProps = ComponentPropsWithRef<typeof Primitive.Root>;\n\nexport const DropdownMenu: FC<DropdownMenuProps> = (props: DropdownMenuProps) => {\n const state = useOverlayState(props);\n return (<OverlayOpen.Provider\n value={state.open}\n >\n <Primitive.Root\n {...props}\n {...state}\n />\n </OverlayOpen.Provider>);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuContent\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownContentStyles = cva(cn(\n \"gridui-dropdown-content\",\n \"z-(--gridui-z-popover) min-w-44 max-w-[calc(100vw-2*var(--gridui-page-gutter))] max-h-(--radix-dropdown-menu-content-available-height) overflow-y-auto p-gridui-4 border border-solid border-border rounded-control text-foreground bg-background type-data\",\n \"data-[state='closed']:pointer-events-none\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuContent\n * @description Dropdown Menu Content\n */\n\nimport { dropdownContentStyles } from \"./style\";\nimport { RetainedLayer } from \"@gridui/overlay\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuContentProps = ComponentPropsWithRef<typeof Primitive.Content>;\n\nexport const DropdownMenuContent: FC<DropdownMenuContentProps> = (props: DropdownMenuContentProps) => {\n const {\n className,\n forceMount,\n sideOffset = 8,\n align = \"end\",\n ...restProps\n } = props;\n const content = (<Primitive.Content\n {...restProps}\n forceMount={forceMount}\n align={align}\n sideOffset={sideOffset}\n className={cn(dropdownContentStyles(), className)}\n />);\n return (<Primitive.Portal\n forceMount={forceMount}\n >\n {forceMount ? (<RetainedLayer>\n {content}\n </RetainedLayer>) : content}\n </Primitive.Portal>);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuTrigger\n * @description Dropdown Menu Trigger\n */\n\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\n\nexport const DropdownMenuTrigger = Primitive.Trigger;\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace ContextMenu\n * @description Context Menu\n */\n\nimport { DropdownMenu } from \"../dropdown-menu/dropdown-menu\";\nimport { DropdownMenuContent, type DropdownMenuContentProps } from \"../dropdown-menu-content/dropdown-menu-content\";\nimport { DropdownMenuTrigger } from \"../dropdown-menu-trigger/dropdown-menu-trigger\";\nimport { type FC, type ReactNode, useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nexport type ContextMenuProps = Omit<DropdownMenuContentProps, \"children\"> & {\n readonly x: number;\n readonly y: number;\n readonly label: string;\n readonly children: ReactNode;\n readonly onClose: () => void;\n};\n\n/** Uses the same menu semantics and presentation as trigger-based dropdowns. */\nexport const ContextMenu: FC<ContextMenuProps> = (props: ContextMenuProps) => {\n const { x, y, label, children, onClose, onCloseAutoFocus, onKeyDown, ...contentProps } = props;\n\n const [returnFocus] = useState(() => {\n return typeof document === \"undefined\" ? null : document.activeElement;\n });\n useEffect(() => {\n\n const dismissWhenInactive = () => {\n\n if (!document.hasFocus()) {\n onClose();\n }\n };\n window.addEventListener(\"blur\", dismissWhenInactive);\n\n return () => {\n\n window.removeEventListener(\"blur\", dismissWhenInactive);\n };\n }, [onClose]);\n\n if (typeof document === \"undefined\") {\n return null;\n }\n return createPortal((<DropdownMenu\n key={`${x}:${y}`}\n open\n modal={false}\n onOpenChange={open => {\n\n if (!open) {\n onClose();\n }\n }}\n >\n <DropdownMenuTrigger\n asChild\n >\n <button\n type=\"button\"\n tabIndex={-1}\n aria-hidden=\"true\"\n style={{\n position: \"fixed\",\n left: x,\n top: y,\n width: 0,\n height: 0,\n padding: 0,\n border: 0,\n opacity: 0,\n pointerEvents: \"none\",\n }}\n />\n </DropdownMenuTrigger>\n <DropdownMenuContent\n aria-label={label}\n side=\"bottom\"\n align=\"start\"\n sideOffset={0}\n collisionPadding={8}\n {...contentProps}\n onCloseAutoFocus={event => {\n onCloseAutoFocus?.(event);\n if (event.defaultPrevented) {\n return;\n }\n event.preventDefault();\n if (document.activeElement === document.body\n && returnFocus instanceof HTMLElement\n && returnFocus.isConnected) {\n returnFocus.focus();\n }\n }}\n onKeyDown={event => {\n\n onKeyDown?.(event);\n if (!event.defaultPrevented && event.key === \"Tab\") {\n event.preventDefault();\n onClose();\n }\n }}\n >\n {children}\n </DropdownMenuContent>\n </DropdownMenu>), document.body);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownItemStyles = cva(cn(\n \"gridui-dropdown-item\",\n \"flex min-h-10 items-center gap-gridui-8 px-gridui-8 py-gridui-8 rounded-xs text-inherit no-underline outline-none cursor-pointer\",\n \"data-highlighted:bg-surface data-highlighted:[box-shadow:inset_0_0_0_1px_var(--gridui-border)]\",\n \"data-disabled:opacity-50 data-disabled:pointer-events-none\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuItem\n * @description Dropdown Menu Item\n */\n\nimport { dropdownItemStyles } from \"../shared/style\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuItemProps = ComponentPropsWithRef<typeof Primitive.Item>;\n\nexport const DropdownMenuItem: FC<DropdownMenuItemProps> = (props: DropdownMenuItemProps) => {\n const {\n className,\n ...restProps\n } = props;\n return (<Primitive.Item\n {...restProps}\n className={cn(dropdownItemStyles(), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuLabel\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownLabelStyles = cva(cn(\n \"gridui-dropdown-label\",\n \"p-gridui-8 text-muted type-caption\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuLabel\n * @description Dropdown Menu Label\n */\n\nimport { dropdownLabelStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuLabelProps = ComponentPropsWithRef<typeof Primitive.Label>;\n\nexport const DropdownMenuLabel: FC<DropdownMenuLabelProps> = (props: DropdownMenuLabelProps) => {\n const {\n className,\n ...restProps\n } = props;\n return (<Primitive.Label\n {...restProps}\n className={cn(dropdownLabelStyles(), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuRadioGroup\n * @description Dropdown Menu Radio Group\n */\n\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\n\nexport const DropdownMenuRadioGroup = Primitive.RadioGroup;\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuRadioItem\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownIndicatorStyles = cva(cn(\n \"gridui-dropdown-indicator\",\n \"w-gridui-16 shrink-0 text-foreground\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuRadioItem\n * @description Dropdown Menu Radio Item\n */\n\nimport { dropdownItemStyles } from \"../shared/style\";\nimport { dropdownIndicatorStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport { Check } from \"lucide-react\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuRadioItemProps = ComponentPropsWithRef<typeof Primitive.RadioItem>;\n\nexport const DropdownMenuRadioItem: FC<DropdownMenuRadioItemProps> = (props: DropdownMenuRadioItemProps) => {\n const {\n className,\n children,\n ...restProps\n } = props;\n return (<Primitive.RadioItem\n {...restProps}\n className={cn(dropdownItemStyles(), className)}\n >\n <span\n className={cn(dropdownIndicatorStyles())}\n aria-hidden=\"true\"\n >\n <Primitive.ItemIndicator>\n <Check\n size={16}\n aria-hidden=\"true\"\n />\n </Primitive.ItemIndicator>\n </span>\n {children}\n </Primitive.RadioItem>);\n};\n"],
5
- "mappings": "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",
6
- "names": ["cn", "Primitive", "jsx", "Primitive", "jsx", "cn", "cva", "cn", "Primitive", "jsx", "cn", "cva", "cn", "Primitive", "jsx", "Primitive", "cn", "cva", "cn", "Primitive", "jsx", "jsxs"]
4
+ "sourcesContent": ["/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenu\n * @description Dropdown Menu\n */\n\nimport { OverlayOpen, useOverlayState } from \"@gridui/overlay\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuProps = ComponentPropsWithRef<typeof Primitive.Root>;\n\nexport const DropdownMenu: FC<DropdownMenuProps> = (props: DropdownMenuProps) => {\n const state = useOverlayState(props);\n return (<OverlayOpen.Provider\n value={state.open}\n >\n <Primitive.Root\n {...props}\n {...state}\n />\n </OverlayOpen.Provider>);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuContent\n * @description Style\n */\n\nimport { overlaySurfaceStyles } from \"@gridui/overlay\";\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownContentStyles = cva(cn(\n overlaySurfaceStyles(),\n \"gridui-dropdown-content\",\n \"gridui-u-z-(--gridui-z-popover) gridui-u-min-w-44 gridui-u-max-w-[calc(100vw-2*var(--gridui-page-gutter))] gridui-u-max-h-(--radix-dropdown-menu-content-available-height) gridui-u-overflow-y-auto gridui-u-p-gridui-4 gridui-u-type-data\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuContent\n * @description Dropdown Menu Content\n */\n\nimport { dropdownContentStyles } from \"./style\";\nimport { RetainedLayer } from \"@gridui/overlay\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuContentProps = ComponentPropsWithRef<typeof Primitive.Content>;\n\nexport const DropdownMenuContent: FC<DropdownMenuContentProps> = (props: DropdownMenuContentProps) => {\n const {\n className,\n forceMount,\n sideOffset = 8,\n align = \"end\",\n ...restProps\n } = props;\n const content = (<Primitive.Content\n {...restProps}\n forceMount={forceMount}\n align={align}\n sideOffset={sideOffset}\n className={cn(dropdownContentStyles(), className)}\n />);\n return (<Primitive.Portal\n forceMount={forceMount}\n >\n {forceMount ? (<RetainedLayer>\n {content}\n </RetainedLayer>) : content}\n </Primitive.Portal>);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuTrigger\n * @description Dropdown Menu Trigger\n */\n\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuTriggerProps = ComponentPropsWithRef<typeof Primitive.Trigger>;\n\nexport const DropdownMenuTrigger: FC<DropdownMenuTriggerProps> = (props: DropdownMenuTriggerProps) => {\n return (<Primitive.Trigger\n {...props}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace ContextMenu\n * @description Context Menu\n */\n\nimport { DropdownMenu } from \"../dropdown-menu/dropdown-menu\";\nimport { DropdownMenuContent, type DropdownMenuContentProps } from \"../dropdown-menu-content/dropdown-menu-content\";\nimport { DropdownMenuTrigger } from \"../dropdown-menu-trigger/dropdown-menu-trigger\";\nimport { type FC, type ReactNode, useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\nexport type ContextMenuProps = Omit<DropdownMenuContentProps, \"children\"> & {\n readonly x: number;\n readonly y: number;\n readonly label: string;\n readonly children: ReactNode;\n readonly onClose: () => void;\n};\n\n/** Uses the same menu semantics and presentation as trigger-based dropdowns. */\nexport const ContextMenu: FC<ContextMenuProps> = (props: ContextMenuProps) => {\n const { x, y, label, children, onClose, onCloseAutoFocus, onKeyDown, ...contentProps } = props;\n\n const [returnFocus] = useState(() => {\n return typeof document === \"undefined\" ? null : document.activeElement;\n });\n useEffect(() => {\n\n const dismissWhenInactive = () => {\n\n if (!document.hasFocus()) {\n onClose();\n }\n };\n window.addEventListener(\"blur\", dismissWhenInactive);\n\n return () => {\n\n window.removeEventListener(\"blur\", dismissWhenInactive);\n };\n }, [onClose]);\n\n if (typeof document === \"undefined\") {\n return null;\n }\n return createPortal((<DropdownMenu\n key={`${x}:${y}`}\n open\n modal={false}\n onOpenChange={open => {\n\n if (!open) {\n onClose();\n }\n }}\n >\n <DropdownMenuTrigger\n asChild\n >\n <button\n type=\"button\"\n tabIndex={-1}\n aria-hidden=\"true\"\n style={{\n position: \"fixed\",\n left: x,\n top: y,\n width: 0,\n height: 0,\n padding: 0,\n border: 0,\n opacity: 0,\n pointerEvents: \"none\",\n }}\n />\n </DropdownMenuTrigger>\n <DropdownMenuContent\n aria-label={label}\n side=\"bottom\"\n align=\"start\"\n sideOffset={0}\n collisionPadding={8}\n {...contentProps}\n onCloseAutoFocus={event => {\n onCloseAutoFocus?.(event);\n if (event.defaultPrevented) {\n return;\n }\n event.preventDefault();\n if (document.activeElement === document.body\n && returnFocus instanceof HTMLElement\n && returnFocus.isConnected) {\n returnFocus.focus();\n }\n }}\n onKeyDown={event => {\n\n onKeyDown?.(event);\n if (!event.defaultPrevented && event.key === \"Tab\") {\n event.preventDefault();\n onClose();\n }\n }}\n >\n {children}\n </DropdownMenuContent>\n </DropdownMenu>), document.body);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace Shared\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownItemStyles = cva(cn(\n \"gridui-dropdown-item\",\n \"gridui-u-flex gridui-u-min-h-10 gridui-u-items-center gridui-u-gap-gridui-8 gridui-u-px-gridui-8 gridui-u-py-gridui-8 gridui-u-rounded-xs gridui-u-text-inherit gridui-u-no-underline gridui-u-outline-none gridui-u-cursor-pointer\",\n \"gridui-u-data-highlighted:bg-surface gridui-u-data-highlighted:[box-shadow:inset_0_0_0_1px_var(--gridui-border)]\",\n \"gridui-u-data-disabled:opacity-50 gridui-u-data-disabled:pointer-events-none\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuItem\n * @description Dropdown Menu Item\n */\n\nimport { dropdownItemStyles } from \"../shared/style\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuItemProps = ComponentPropsWithRef<typeof Primitive.Item>;\n\nexport const DropdownMenuItem: FC<DropdownMenuItemProps> = (props: DropdownMenuItemProps) => {\n const {\n className,\n ...restProps\n } = props;\n return (<Primitive.Item\n {...restProps}\n className={cn(dropdownItemStyles(), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuLabel\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownLabelStyles = cva(cn(\n \"gridui-dropdown-label\",\n \"gridui-u-p-gridui-8 gridui-u-text-muted gridui-u-type-caption\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuLabel\n * @description Dropdown Menu Label\n */\n\nimport { dropdownLabelStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuLabelProps = ComponentPropsWithRef<typeof Primitive.Label>;\n\nexport const DropdownMenuLabel: FC<DropdownMenuLabelProps> = (props: DropdownMenuLabelProps) => {\n const {\n className,\n ...restProps\n } = props;\n return (<Primitive.Label\n {...restProps}\n className={cn(dropdownLabelStyles(), className)}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuRadioGroup\n * @description Dropdown Menu Radio Group\n */\n\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuRadioGroupProps = ComponentPropsWithRef<typeof Primitive.RadioGroup>;\n\nexport const DropdownMenuRadioGroup: FC<DropdownMenuRadioGroupProps> = (props: DropdownMenuRadioGroupProps) => {\n return (<Primitive.RadioGroup\n {...props}\n />);\n};\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuRadioItem\n * @description Style\n */\n\nimport { cn } from \"@gridui/style-utils\";\nimport { cva } from \"class-variance-authority\";\n\nexport const dropdownIndicatorStyles = cva(cn(\n \"gridui-dropdown-indicator\",\n \"gridui-u-w-gridui-16 gridui-u-shrink-0 gridui-u-text-foreground\",\n));\n", "/**\n * @author WMXPY\n * @package Dropdown Menu\n * @namespace DropdownMenuRadioItem\n * @description Dropdown Menu Radio Item\n */\n\nimport { dropdownItemStyles } from \"../shared/style\";\nimport { dropdownIndicatorStyles } from \"./style\";\nimport { cn } from \"@gridui/style-utils\";\nimport * as Primitive from \"@radix-ui/react-dropdown-menu\";\nimport { Check } from \"lucide-react\";\nimport type { ComponentPropsWithRef, FC } from \"react\";\n\nexport type DropdownMenuRadioItemProps = ComponentPropsWithRef<typeof Primitive.RadioItem>;\n\nexport const DropdownMenuRadioItem: FC<DropdownMenuRadioItemProps> = (props: DropdownMenuRadioItemProps) => {\n const {\n className,\n children,\n ...restProps\n } = props;\n return (<Primitive.RadioItem\n {...restProps}\n className={cn(dropdownItemStyles(), className)}\n >\n <span\n className={cn(dropdownIndicatorStyles())}\n aria-hidden=\"true\"\n >\n <Primitive.ItemIndicator>\n <Check\n size={16}\n aria-hidden=\"true\"\n />\n </Primitive.ItemIndicator>\n </span>\n {children}\n </Primitive.RadioItem>);\n};\n"],
5
+ "mappings": "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",
6
+ "names": ["cn", "Primitive", "jsx", "Primitive", "jsx", "jsx", "cn", "cva", "cn", "Primitive", "jsx", "cn", "cva", "cn", "Primitive", "jsx", "Primitive", "jsx", "cn", "cva", "cn", "Primitive", "jsx", "jsxs"]
7
7
  }
package/dist/styles.css CHANGED
@@ -1,5 +1,4 @@
1
1
  /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
2
- @layer properties;
3
2
  @layer theme, base, components, utilities;
4
3
  @layer theme {
5
4
  :root, :host {
@@ -8,225 +7,97 @@
8
7
  }
9
8
  }
10
9
  @layer utilities {
11
- .fixed {
12
- position: fixed;
13
- }
14
- .z-\(--gridui-z-popover\) {
10
+ .gridui-u-z-\(--gridui-z-popover\) {
15
11
  z-index: var(--gridui-z-popover);
16
12
  }
17
- .flex {
13
+ .gridui-u-flex {
18
14
  display: flex;
19
15
  }
20
- .max-h-\(--radix-dropdown-menu-content-available-height\) {
16
+ .gridui-u-max-h-\(--radix-dropdown-menu-content-available-height\) {
21
17
  max-height: var(--radix-dropdown-menu-content-available-height);
22
18
  }
23
- .min-h-10 {
19
+ .gridui-u-min-h-10 {
24
20
  min-height: calc(var(--spacing) * 10);
25
21
  }
26
- .w-gridui-16 {
22
+ .gridui-u-w-gridui-16 {
27
23
  width: var(--gridui-space-16);
28
24
  }
29
- .max-w-\[calc\(100vw-2\*var\(--gridui-page-gutter\)\)\] {
25
+ .gridui-u-max-w-\[calc\(100vw-2\*var\(--gridui-page-gutter\)\)\] {
30
26
  max-width: calc(100vw - 2 * var(--gridui-page-gutter));
31
27
  }
32
- .min-w-44 {
28
+ .gridui-u-min-w-44 {
33
29
  min-width: calc(var(--spacing) * 44);
34
30
  }
35
- .shrink-0 {
31
+ .gridui-u-shrink-0 {
36
32
  flex-shrink: 0;
37
33
  }
38
- .cursor-pointer {
34
+ .gridui-u-cursor-pointer {
39
35
  cursor: pointer;
40
36
  }
41
- .items-center {
37
+ .gridui-u-items-center {
42
38
  align-items: center;
43
39
  }
44
- .gap-gridui-8 {
40
+ .gridui-u-gap-gridui-8 {
45
41
  gap: var(--gridui-space-8);
46
42
  }
47
- .overflow-y-auto {
43
+ .gridui-u-overflow-y-auto {
48
44
  overflow-y: auto;
49
45
  }
50
- .rounded-control {
51
- border-radius: var(--gridui-control-radius);
52
- }
53
- .rounded-xs {
46
+ .gridui-u-rounded-xs {
54
47
  border-radius: var(--radius-xs);
55
48
  }
56
- .border {
57
- border-style: var(--tw-border-style);
58
- border-width: 1px;
59
- }
60
- .border-solid {
61
- --tw-border-style: solid;
62
- border-style: solid;
63
- }
64
- .border-border {
65
- border-color: var(--gridui-border);
66
- }
67
- .bg-background {
68
- background-color: var(--gridui-background);
69
- }
70
- .p-gridui-4 {
49
+ .gridui-u-p-gridui-4 {
71
50
  padding: var(--gridui-space-4);
72
51
  }
73
- .p-gridui-8 {
52
+ .gridui-u-p-gridui-8 {
74
53
  padding: var(--gridui-space-8);
75
54
  }
76
- .px-gridui-8 {
55
+ .gridui-u-px-gridui-8 {
77
56
  padding-inline: var(--gridui-space-8);
78
57
  }
79
- .py-gridui-8 {
58
+ .gridui-u-py-gridui-8 {
80
59
  padding-block: var(--gridui-space-8);
81
60
  }
82
- .type-data {
61
+ .gridui-u-type-data {
83
62
  font: var(--gridui-type-data);
84
63
  letter-spacing: normal;
85
64
  font-variant-numeric: tabular-nums;
86
65
  }
87
- .type-caption {
66
+ .gridui-u-type-caption {
88
67
  font: var(--gridui-type-caption);
89
68
  letter-spacing: normal;
90
69
  }
91
- .text-foreground {
70
+ .gridui-u-text-foreground {
92
71
  color: var(--gridui-foreground);
93
72
  }
94
- .text-inherit {
73
+ .gridui-u-text-inherit {
95
74
  color: inherit;
96
75
  }
97
- .text-muted {
76
+ .gridui-u-text-muted {
98
77
  color: var(--gridui-muted);
99
78
  }
100
- .no-underline {
79
+ .gridui-u-no-underline {
101
80
  text-decoration-line: none;
102
81
  }
103
- .blur {
104
- --tw-blur: blur(8px);
105
- filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
106
- }
107
- .outline-none {
82
+ .gridui-u-outline-none {
108
83
  --tw-outline-style: none;
109
84
  outline-style: none;
110
85
  }
111
- .data-disabled\:pointer-events-none[data-disabled] {
86
+ .gridui-u-data-disabled\:pointer-events-none[data-disabled] {
112
87
  pointer-events: none;
113
88
  }
114
- .data-disabled\:opacity-50[data-disabled] {
89
+ .gridui-u-data-disabled\:opacity-50[data-disabled] {
115
90
  opacity: 50%;
116
91
  }
117
- .data-highlighted\:bg-surface[data-highlighted] {
92
+ .gridui-u-data-highlighted\:bg-surface[data-highlighted] {
118
93
  background-color: var(--gridui-surface);
119
94
  }
120
- .data-highlighted\:\[box-shadow\:inset_0_0_0_1px_var\(--gridui-border\)\][data-highlighted] {
95
+ .gridui-u-data-highlighted\:\[box-shadow\:inset_0_0_0_1px_var\(--gridui-border\)\][data-highlighted] {
121
96
  box-shadow: inset 0 0 0 1px var(--gridui-border);
122
97
  }
123
- .data-\[state\=\'closed\'\]\:pointer-events-none[data-state='closed'] {
124
- pointer-events: none;
125
- }
126
98
  }
127
99
  @layer components {
128
100
  .gridui-dropdown-content {
129
- transform-origin: var(--radix-dropdown-menu-content-transform-origin);
130
- }
131
- .gridui-dropdown-content[data-side="bottom"] {
132
- --gridui-surface-offset-y: calc(-1 * var(--gridui-motion-distance));
133
- }
134
- .gridui-dropdown-content[data-side="top"] {
135
- --gridui-surface-offset-y: var(--gridui-motion-distance);
136
- }
137
- .gridui-dropdown-content[data-side="left"] {
138
- --gridui-surface-offset-x: var(--gridui-motion-distance);
139
- }
140
- .gridui-dropdown-content[data-side="right"] {
141
- --gridui-surface-offset-x: calc(-1 * var(--gridui-motion-distance));
142
- }
143
- .gridui-dropdown-content[data-state="open"] {
144
- animation: gridui-surface-enter var(--gridui-motion-duration-normal) var(--gridui-motion-ease-out) both;
145
- }
146
- .gridui-dropdown-content[data-state="closed"] {
147
- animation: gridui-surface-exit var(--gridui-motion-duration-quick) var(--gridui-motion-ease-in) both;
148
- }
149
- @media (prefers-reduced-motion: reduce) {
150
- .gridui-dropdown-content[data-state] {
151
- animation: none;
152
- }
153
- }
154
- }
155
- @property --tw-border-style {
156
- syntax: "*";
157
- inherits: false;
158
- initial-value: solid;
159
- }
160
- @property --tw-blur {
161
- syntax: "*";
162
- inherits: false;
163
- }
164
- @property --tw-brightness {
165
- syntax: "*";
166
- inherits: false;
167
- }
168
- @property --tw-contrast {
169
- syntax: "*";
170
- inherits: false;
171
- }
172
- @property --tw-grayscale {
173
- syntax: "*";
174
- inherits: false;
175
- }
176
- @property --tw-hue-rotate {
177
- syntax: "*";
178
- inherits: false;
179
- }
180
- @property --tw-invert {
181
- syntax: "*";
182
- inherits: false;
183
- }
184
- @property --tw-opacity {
185
- syntax: "*";
186
- inherits: false;
187
- }
188
- @property --tw-saturate {
189
- syntax: "*";
190
- inherits: false;
191
- }
192
- @property --tw-sepia {
193
- syntax: "*";
194
- inherits: false;
195
- }
196
- @property --tw-drop-shadow {
197
- syntax: "*";
198
- inherits: false;
199
- }
200
- @property --tw-drop-shadow-color {
201
- syntax: "*";
202
- inherits: false;
203
- }
204
- @property --tw-drop-shadow-alpha {
205
- syntax: "<percentage>";
206
- inherits: false;
207
- initial-value: 100%;
208
- }
209
- @property --tw-drop-shadow-size {
210
- syntax: "*";
211
- inherits: false;
212
- }
213
- @layer properties {
214
- @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
215
- *, ::before, ::after, ::backdrop {
216
- --tw-border-style: solid;
217
- --tw-blur: initial;
218
- --tw-brightness: initial;
219
- --tw-contrast: initial;
220
- --tw-grayscale: initial;
221
- --tw-hue-rotate: initial;
222
- --tw-invert: initial;
223
- --tw-opacity: initial;
224
- --tw-saturate: initial;
225
- --tw-sepia: initial;
226
- --tw-drop-shadow: initial;
227
- --tw-drop-shadow-color: initial;
228
- --tw-drop-shadow-alpha: 100%;
229
- --tw-drop-shadow-size: initial;
230
- }
101
+ --gridui-overlay-origin: var(--radix-dropdown-menu-content-transform-origin);
231
102
  }
232
103
  }
@@ -0,0 +1,25 @@
1
+ # Point-anchored context menu
2
+
3
+ Import `ContextMenu`, `ContextMenuProps`, and the existing `DropdownMenuItem`,
4
+ `DropdownMenuRadioGroup`, `DropdownMenuRadioItem`, and `DropdownMenuLabel` from
5
+ `@gridui/dropdown-menu`. Load `@gridui/dropdown-menu/styles.css` after Theme.
6
+
7
+ Render `ContextMenu` only while open. Pass viewport `x` / `y` coordinates (for
8
+ example, `clientX` / `clientY`), an accessible `label`, menu children, and `onClose`
9
+ to clear the owner's open state. The owner decides which pointer or keyboard
10
+ interaction opens the menu and what each action does. For keyboard opening,
11
+ anchor to the invoking element's bounding rectangle.
12
+
13
+ The menu reuses dropdown keyboard navigation, disabled-item semantics, collision
14
+ handling, and item selection. It is nonmodal, closes on Escape, Tab, outside
15
+ interaction, or window focus loss, and portals its point anchor to the document
16
+ body so transformed application containers do not alter viewport coordinates.
17
+ It renders no server-side markup.
18
+
19
+ Content props such as `className`, `collisionPadding`, positioning options and
20
+ refs are forwarded. `onKeyDown` and `onCloseAutoFocus` are composed; preventing
21
+ their default cancels the library's corresponding behavior. Default close focus
22
+ returns to the element focused when mounted if focus has fallen back to the
23
+ body; it does not steal focus from an outside control. Focus the invoking element
24
+ before opening when it should be the return target. Consumers can override
25
+ return focus with `onCloseAutoFocus`.
package/package.json CHANGED
@@ -1,11 +1,12 @@
1
1
  {
2
2
  "name": "@gridui/dropdown-menu",
3
- "version": "1.0.0",
3
+ "version": "1.1.2",
4
4
  "description": "GridUI React dropdown menu",
5
5
  "license": "UNLICENSED",
6
6
  "type": "module",
7
7
  "files": [
8
8
  "dist",
9
+ "docs",
9
10
  "README.md"
10
11
  ],
11
12
  "sideEffects": [
@@ -26,18 +27,20 @@
26
27
  "react-dom": "^19.2.0"
27
28
  },
28
29
  "dependencies": {
29
- "@gridui/overlay": "^1.0.0",
30
- "@gridui/style-utils": "^2.1.2",
31
- "@gridui/theme": "^2.1.2",
30
+ "@gridui/overlay": "^1.1.2",
31
+ "@gridui/style-utils": "^2.1.4",
32
+ "@gridui/theme": "^2.3.2",
32
33
  "@radix-ui/react-dropdown-menu": "2.2.1",
33
34
  "class-variance-authority": "0.7.1",
34
- "lucide-react": "1.62.0"
35
+ "lucide-react": "1.65.0"
35
36
  },
36
37
  "devDependencies": {
37
- "@gridui-internal/configuration": "0.0.0",
38
+ "@gridui-internal/configuration": "0.0.0-internal",
39
+ "@gridui/button": "2.2.0",
38
40
  "@jest/globals": "30.5.2",
41
+ "@storybook/react-vite": "10.6.5",
39
42
  "@types/jest": "30.0.0",
40
- "@types/node": "26.6.5",
43
+ "@types/node": "26.6.6",
41
44
  "@types/react": "19.3.0",
42
45
  "@types/react-dom": "19.3.0",
43
46
  "jest": "30.5.2",
@@ -48,7 +51,7 @@
48
51
  "scripts": {
49
52
  "build": "node ../../scripts/compilation/package.ts",
50
53
  "compile": "tsc --project tsconfig.json",
51
- "test": "jest --passWithNoTests",
52
- "coverage": "jest --coverage --passWithNoTests"
54
+ "test": "jest",
55
+ "coverage": "jest --coverage"
53
56
  }
54
57
  }