@crystallize/design-system 1.17.5 → 1.17.6

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @crystallize/design-system
 
+## 1.17.6
+
+### Patch Changes
+
+- 30a9c6c: Extend the dropdown menu component to take a `modal` as a prop and pass it to the root element.
+
 ## 1.17.5
 
 ### Patch Changes

package/dist/index.d.ts

@@ -34,15 +34,14 @@ type DropdownMenuLabelProps = {
 declare function DropdownMenuLabel({ children }: DropdownMenuLabelProps): JSX.Element;
 
 type Container = HTMLElement | null | undefined;
-type DropdownMenuRootProps = DropdownMenuPrimitive.MenuContentProps & {
+type DropdownMenuRootProps = DropdownMenuPrimitive.MenuContentProps & Pick<DropdownMenuPrimitive.DropdownMenuProps, 'onOpenChange' | 'modal'> & {
     children: ReactNode;
     content: ReactNode;
     alignContent?: 'start' | 'center' | 'end';
     disabled?: boolean;
-    onOpenChange?: (open: boolean) => void;
     container?: Container;
 };
-declare function DropdownMenuRoot({ children, content, alignContent, disabled, onOpenChange, container, ...delegated }: DropdownMenuRootProps): JSX.Element;
+declare function DropdownMenuRoot({ children, content, alignContent, disabled, onOpenChange, container, modal, ...delegated }: DropdownMenuRootProps): JSX.Element;
 
 declare const DropdownMenu: {
     Root: typeof DropdownMenuRoot;

package/dist/index.js

@@ -29124,6 +29124,7 @@ function DropdownMenuRoot({
   disabled,
   onOpenChange,
   container,
+  modal,
   ...delegated
 }) {
   const contentProps = {
@@ -29135,6 +29136,7 @@ function DropdownMenuRoot({
   };
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(DropdownMenuPrimitive3.Root, {
     onOpenChange,
+    modal,
     children: [
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DropdownMenuPrimitive3.Trigger, {
         disabled,

package/dist/index.mjs

@@ -236,6 +236,7 @@ function DropdownMenuRoot({
   disabled,
   onOpenChange,
   container,
+  modal,
   ...delegated
 }) {
   const contentProps = {
@@ -247,6 +248,7 @@ function DropdownMenuRoot({
   };
   return /* @__PURE__ */ jsxs3(DropdownMenuPrimitive3.Root, {
     onOpenChange,
+    modal,
     children: [
       /* @__PURE__ */ jsx6(DropdownMenuPrimitive3.Trigger, {
         disabled,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystallize/design-system",
-  "version": "1.17.5",
+  "version": "1.17.6",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/dropdown-menu/dropdown-menu-root.tsx

@@ -3,14 +3,14 @@ import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 export type Container = HTMLElement | null | undefined;
 
-export type DropdownMenuRootProps = DropdownMenuPrimitive.MenuContentProps & {
-  children: ReactNode;
-  content: ReactNode;
-  alignContent?: 'start' | 'center' | 'end';
-  disabled?: boolean;
-  onOpenChange?: (open: boolean) => void;
-  container?: Container;
-};
+export type DropdownMenuRootProps = DropdownMenuPrimitive.MenuContentProps &
+  Pick<DropdownMenuPrimitive.DropdownMenuProps, 'onOpenChange' | 'modal'> & {
+    children: ReactNode;
+    content: ReactNode;
+    alignContent?: 'start' | 'center' | 'end';
+    disabled?: boolean;
+    container?: Container;
+  };
 
 export function DropdownMenuRoot({
   children,
@@ -19,6 +19,7 @@ export function DropdownMenuRoot({
   disabled,
   onOpenChange,
   container,
+  modal,
   ...delegated
 }: DropdownMenuRootProps) {
   const contentProps = {
@@ -30,7 +31,7 @@ export function DropdownMenuRoot({
   };
 
   return (
-    <DropdownMenuPrimitive.Root onOpenChange={onOpenChange}>
+    <DropdownMenuPrimitive.Root onOpenChange={onOpenChange} modal={modal}>
       <DropdownMenuPrimitive.Trigger disabled={disabled} asChild>
         {children}
       </DropdownMenuPrimitive.Trigger>