@wordpress/components 25.0.0 → 25.1.1

package/build/dropdown-menu-v2/index.js

@@ -9,8 +9,6 @@ exports.DropdownSubMenuTrigger = exports.DropdownSubMenu = exports.DropdownMenuS
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var DropdownMenuPrimitive = _interopRequireWildcard(require("@radix-ui/react-dropdown-menu"));
 
 var _i18n = require("@wordpress/i18n");
@@ -19,8 +17,14 @@ var _icons = require("@wordpress/icons");
 
 var _primitives = require("@wordpress/primitives");
 
+var _context = require("../ui/context");
+
+var _slotFill = require("../slot-fill");
+
 var _icon = _interopRequireDefault(require("../icon"));
 
+var _popover = require("../popover");
+
 var DropdownMenuStyled = _interopRequireWildcard(require("./styles"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -39,16 +43,16 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * Internal dependencies
  */
 // Menu content's side padding + 4px
-const SUB_MENU_OFFSET_SIDE = 12; // Opposite amount of the top padding of the menu item
+const SUB_MENU_OFFSET_SIDE = 16; // Opposite amount of the top padding of the menu item
 
 const SUB_MENU_OFFSET_ALIGN = -8;
-/**
- * `DropdownMenu` displays a menu to the user (such as a set of actions
- * or functions) triggered by a button.
- */
+const DropdownMenuPrivateContext = (0, _element.createContext)({
+  variant: undefined,
+  portalContainer: null
+});
 
-const DropdownMenu = _ref => {
-  let {
+const UnconnectedDropdownMenu = props => {
+  const {
     // Root props
     defaultOpen,
     open,
@@ -61,8 +65,17 @@ const DropdownMenu = _ref => {
     alignOffset = 0,
     // Render props
     children,
-    trigger
-  } = _ref;
+    trigger,
+    // From internal components context
+    variant
+  } = (0, _context.useContextSystem)(props, 'DropdownMenu'); // Render the portal in the default slot used by the legacy Popover component.
+
+  const slot = (0, _slotFill.useSlot)(_popover.SLOT_NAME);
+  const portalContainer = slot.ref?.current;
+  const privateContextValue = (0, _element.useMemo)(() => ({
+    variant,
+    portalContainer
+  }), [variant, portalContainer]);
   return (0, _element.createElement)(DropdownMenuPrimitive.Root, {
     defaultOpen: defaultOpen,
     open: open,
@@ -71,44 +84,57 @@ const DropdownMenu = _ref => {
     dir: (0, _i18n.isRTL)() ? 'rtl' : 'ltr'
   }, (0, _element.createElement)(DropdownMenuPrimitive.Trigger, {
     asChild: true
-  }, trigger), (0, _element.createElement)(DropdownMenuPrimitive.Portal, null, (0, _element.createElement)(DropdownMenuStyled.Content, {
+  }, trigger), (0, _element.createElement)(DropdownMenuPrimitive.Portal, {
+    container: portalContainer
+  }, (0, _element.createElement)(DropdownMenuStyled.Content, {
     side: side,
     align: align,
     sideOffset: sideOffset,
     alignOffset: alignOffset,
-    loop: true
-  }, children)));
+    loop: true,
+    variant: variant
+  }, (0, _element.createElement)(DropdownMenuPrivateContext.Provider, {
+    value: privateContextValue
+  }, children))));
 };
+/**
+ * `DropdownMenu` displays a menu to the user (such as a set of actions
+ * or functions) triggered by a button.
+ */
 
+
+const DropdownMenu = (0, _context.contextConnectWithoutRef)(UnconnectedDropdownMenu, 'DropdownMenu');
 exports.DropdownMenu = DropdownMenu;
 
-const DropdownSubMenuTrigger = _ref2 => {
-  let {
-    prefix,
-    suffix = (0, _element.createElement)(DropdownMenuStyled.SubmenuRtlChevronIcon, {
-      icon: _icons.chevronRightSmall,
-      size: 24
-    }),
-    children
-  } = _ref2;
+const DropdownSubMenuTrigger = ({
+  prefix,
+  suffix = (0, _element.createElement)(DropdownMenuStyled.SubmenuRtlChevronIcon, {
+    icon: _icons.chevronRightSmall,
+    size: 24
+  }),
+  children
+}) => {
   return (0, _element.createElement)(_element.Fragment, null, prefix && (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, prefix), children, suffix && (0, _element.createElement)(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
 };
 
 exports.DropdownSubMenuTrigger = DropdownSubMenuTrigger;
 
-const DropdownSubMenu = _ref3 => {
-  let {
-    // Sub props
-    defaultOpen,
-    open,
-    onOpenChange,
-    // Sub trigger props
-    disabled,
-    textValue,
-    // Render props
-    children,
-    trigger
-  } = _ref3;
+const DropdownSubMenu = ({
+  // Sub props
+  defaultOpen,
+  open,
+  onOpenChange,
+  // Sub trigger props
+  disabled,
+  textValue,
+  // Render props
+  children,
+  trigger
+}) => {
+  const {
+    variant,
+    portalContainer
+  } = (0, _element.useContext)(DropdownMenuPrivateContext);
   return (0, _element.createElement)(DropdownMenuPrimitive.Sub, {
     defaultOpen: defaultOpen,
     open: open,
@@ -116,45 +142,48 @@ const DropdownSubMenu = _ref3 => {
   }, (0, _element.createElement)(DropdownMenuStyled.SubTrigger, {
     disabled: disabled,
     textValue: textValue
-  }, trigger), (0, _element.createElement)(DropdownMenuPrimitive.Portal, null, (0, _element.createElement)(DropdownMenuStyled.SubContent, {
+  }, trigger), (0, _element.createElement)(DropdownMenuPrimitive.Portal, {
+    container: portalContainer
+  }, (0, _element.createElement)(DropdownMenuStyled.SubContent, {
     loop: true,
     sideOffset: SUB_MENU_OFFSET_SIDE,
-    alignOffset: SUB_MENU_OFFSET_ALIGN
+    alignOffset: SUB_MENU_OFFSET_ALIGN,
+    variant: variant
   }, children)));
 };
 
 exports.DropdownSubMenu = DropdownSubMenu;
 
-const DropdownMenuLabel = props => (0, _element.createElement)(DropdownMenuStyled.Label, props);
+const DropdownMenuLabel = props => (0, _element.createElement)(DropdownMenuStyled.Label, { ...props
+});
 
 exports.DropdownMenuLabel = DropdownMenuLabel;
 
-const DropdownMenuGroup = props => (0, _element.createElement)(DropdownMenuPrimitive.Group, props);
+const DropdownMenuGroup = props => (0, _element.createElement)(DropdownMenuPrimitive.Group, { ...props
+});
 
 exports.DropdownMenuGroup = DropdownMenuGroup;
-const DropdownMenuItem = (0, _element.forwardRef)((_ref4, forwardedRef) => {
-  let {
-    children,
-    prefix,
-    suffix,
-    ...props
-  } = _ref4;
-  return (0, _element.createElement)(DropdownMenuStyled.Item, (0, _extends2.default)({}, props, {
+const DropdownMenuItem = (0, _element.forwardRef)(({
+  children,
+  prefix,
+  suffix,
+  ...props
+}, forwardedRef) => {
+  return (0, _element.createElement)(DropdownMenuStyled.Item, { ...props,
     ref: forwardedRef
-  }), prefix && (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, prefix), children, suffix && (0, _element.createElement)(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
+  }, prefix && (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, prefix), children, suffix && (0, _element.createElement)(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
 });
 exports.DropdownMenuItem = DropdownMenuItem;
 
-const DropdownMenuCheckboxItem = _ref5 => {
-  let {
-    children,
-    checked = false,
-    suffix,
-    ...props
-  } = _ref5;
-  return (0, _element.createElement)(DropdownMenuStyled.CheckboxItem, (0, _extends2.default)({}, props, {
+const DropdownMenuCheckboxItem = ({
+  children,
+  checked = false,
+  suffix,
+  ...props
+}) => {
+  return (0, _element.createElement)(DropdownMenuStyled.CheckboxItem, { ...props,
     checked: checked
-  }), (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, (0, _element.createElement)(DropdownMenuStyled.ItemIndicator, null, (checked === 'indeterminate' || checked === true) && (0, _element.createElement)(_icon.default, {
+  }, (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, (0, _element.createElement)(DropdownMenuStyled.ItemIndicator, null, (checked === 'indeterminate' || checked === true) && (0, _element.createElement)(_icon.default, {
     icon: checked === 'indeterminate' ? _icons.lineSolid : _icons.check,
     size: 24
   }))), children, suffix && (0, _element.createElement)(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
@@ -162,7 +191,8 @@ const DropdownMenuCheckboxItem = _ref5 => {
 
 exports.DropdownMenuCheckboxItem = DropdownMenuCheckboxItem;
 
-const DropdownMenuRadioGroup = props => (0, _element.createElement)(DropdownMenuPrimitive.RadioGroup, props);
+const DropdownMenuRadioGroup = props => (0, _element.createElement)(DropdownMenuPrimitive.RadioGroup, { ...props
+});
 
 exports.DropdownMenuRadioGroup = DropdownMenuRadioGroup;
 const radioDot = (0, _element.createElement)(_primitives.SVG, {
@@ -175,13 +205,13 @@ const radioDot = (0, _element.createElement)(_primitives.SVG, {
   fill: "currentColor"
 }));
 
-const DropdownMenuRadioItem = _ref6 => {
-  let {
-    children,
-    suffix,
-    ...props
-  } = _ref6;
-  return (0, _element.createElement)(DropdownMenuStyled.RadioItem, props, (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, (0, _element.createElement)(DropdownMenuStyled.ItemIndicator, null, (0, _element.createElement)(_icon.default, {
+const DropdownMenuRadioItem = ({
+  children,
+  suffix,
+  ...props
+}) => {
+  return (0, _element.createElement)(DropdownMenuStyled.RadioItem, { ...props
+  }, (0, _element.createElement)(DropdownMenuStyled.ItemPrefixWrapper, null, (0, _element.createElement)(DropdownMenuStyled.ItemIndicator, null, (0, _element.createElement)(_icon.default, {
     icon: radioDot,
     size: 22
   }))), children, suffix && (0, _element.createElement)(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
@@ -189,7 +219,14 @@ const DropdownMenuRadioItem = _ref6 => {
 
 exports.DropdownMenuRadioItem = DropdownMenuRadioItem;
 
-const DropdownMenuSeparator = props => (0, _element.createElement)(DropdownMenuStyled.Separator, props);
+const DropdownMenuSeparator = props => {
+  const {
+    variant
+  } = (0, _element.useContext)(DropdownMenuPrivateContext);
+  return (0, _element.createElement)(DropdownMenuStyled.Separator, { ...props,
+    variant: variant
+  });
+};
 
 exports.DropdownMenuSeparator = DropdownMenuSeparator;
 //# sourceMappingURL=index.js.map

package/build/dropdown-menu-v2/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/dropdown-menu-v2/index.tsx"],"names":["SUB_MENU_OFFSET_SIDE","SUB_MENU_OFFSET_ALIGN","DropdownMenu","defaultOpen","open","onOpenChange","modal","side","sideOffset","align","alignOffset","children","trigger","DropdownSubMenuTrigger","prefix","suffix","chevronRightSmall","DropdownSubMenu","disabled","textValue","DropdownMenuLabel","props","DropdownMenuGroup","DropdownMenuItem","forwardedRef","DropdownMenuCheckboxItem","checked","lineSolid","check","DropdownMenuRadioGroup","radioDot","DropdownMenuRadioItem","DropdownMenuSeparator"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\nimport { check, chevronRightSmall, lineSolid } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport * as DropdownMenuStyled from './styles';\nimport type {\n\tDropdownMenuProps,\n\tDropdownSubMenuProps,\n\tDropdownMenuItemProps,\n\tDropdownMenuLabelProps,\n\tDropdownMenuGroupProps,\n\tDropdownMenuCheckboxItemProps,\n\tDropdownMenuRadioGroupProps,\n\tDropdownMenuRadioItemProps,\n\tDropdownMenuSeparatorProps,\n\tDropdownSubMenuTriggerProps,\n} from './types';\n\n// Menu content's side padding + 4px\nconst SUB_MENU_OFFSET_SIDE = 12;\n// Opposite amount of the top padding of the menu item\nconst SUB_MENU_OFFSET_ALIGN = -8;\n\n/**\n * `DropdownMenu` displays a menu to the user (such as a set of actions\n * or functions) triggered by a button.\n */\nexport const DropdownMenu = ( {\n\t// Root props\n\tdefaultOpen,\n\topen,\n\tonOpenChange,\n\tmodal = true,\n\t// Content positioning props\n\tside = 'bottom',\n\tsideOffset = 0,\n\talign = 'center',\n\talignOffset = 0,\n\t// Render props\n\tchildren,\n\ttrigger,\n}: DropdownMenuProps ) => {\n\treturn (\n\t\t<DropdownMenuPrimitive.Root\n\t\t\tdefaultOpen={ defaultOpen }\n\t\t\topen={ open }\n\t\t\tonOpenChange={ onOpenChange }\n\t\t\tmodal={ modal }\n\t\t\tdir={ isRTL() ? 'rtl' : 'ltr' }\n\t\t>\n\t\t\t<DropdownMenuPrimitive.Trigger asChild>\n\t\t\t\t{ trigger }\n\t\t\t</DropdownMenuPrimitive.Trigger>\n\t\t\t<DropdownMenuPrimitive.Portal>\n\t\t\t\t<DropdownMenuStyled.Content\n\t\t\t\t\tside={ side }\n\t\t\t\t\talign={ align }\n\t\t\t\t\tsideOffset={ sideOffset }\n\t\t\t\t\talignOffset={ alignOffset }\n\t\t\t\t\tloop={ true }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownMenuStyled.Content>\n\t\t\t</DropdownMenuPrimitive.Portal>\n\t\t</DropdownMenuPrimitive.Root>\n\t);\n};\n\nexport const DropdownSubMenuTrigger = ( {\n\tprefix,\n\tsuffix = (\n\t\t<DropdownMenuStyled.SubmenuRtlChevronIcon\n\t\t\ticon={ chevronRightSmall }\n\t\t\tsize={ 24 }\n\t\t/>\n\t),\n\tchildren,\n}: DropdownSubMenuTriggerProps ) => {\n\treturn (\n\t\t<>\n\t\t\t{ prefix && (\n\t\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t\t{ prefix }\n\t\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t{ suffix && (\n\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t{ suffix }\n\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport const DropdownSubMenu = ( {\n\t// Sub props\n\tdefaultOpen,\n\topen,\n\tonOpenChange,\n\t// Sub trigger props\n\tdisabled,\n\ttextValue,\n\t// Render props\n\tchildren,\n\ttrigger,\n}: DropdownSubMenuProps ) => {\n\treturn (\n\t\t<DropdownMenuPrimitive.Sub\n\t\t\tdefaultOpen={ defaultOpen }\n\t\t\topen={ open }\n\t\t\tonOpenChange={ onOpenChange }\n\t\t>\n\t\t\t<DropdownMenuStyled.SubTrigger\n\t\t\t\tdisabled={ disabled }\n\t\t\t\ttextValue={ textValue }\n\t\t\t>\n\t\t\t\t{ trigger }\n\t\t\t</DropdownMenuStyled.SubTrigger>\n\t\t\t<DropdownMenuPrimitive.Portal>\n\t\t\t\t<DropdownMenuStyled.SubContent\n\t\t\t\t\tloop\n\t\t\t\t\tsideOffset={ SUB_MENU_OFFSET_SIDE }\n\t\t\t\t\talignOffset={ SUB_MENU_OFFSET_ALIGN }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownMenuStyled.SubContent>\n\t\t\t</DropdownMenuPrimitive.Portal>\n\t\t</DropdownMenuPrimitive.Sub>\n\t);\n};\n\nexport const DropdownMenuLabel = ( props: DropdownMenuLabelProps ) => (\n\t<DropdownMenuStyled.Label { ...props } />\n);\n\nexport const DropdownMenuGroup = ( props: DropdownMenuGroupProps ) => (\n\t<DropdownMenuPrimitive.Group { ...props } />\n);\n\nexport const DropdownMenuItem = forwardRef(\n\t(\n\t\t{ children, prefix, suffix, ...props }: DropdownMenuItemProps,\n\t\tforwardedRef: React.ForwardedRef< any >\n\t) => {\n\t\treturn (\n\t\t\t<DropdownMenuStyled.Item { ...props } ref={ forwardedRef }>\n\t\t\t\t{ prefix && (\n\t\t\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t\t\t{ prefix }\n\t\t\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</DropdownMenuStyled.Item>\n\t\t);\n\t}\n);\n\nexport const DropdownMenuCheckboxItem = ( {\n\tchildren,\n\tchecked = false,\n\tsuffix,\n\t...props\n}: DropdownMenuCheckboxItemProps ) => {\n\treturn (\n\t\t<DropdownMenuStyled.CheckboxItem { ...props } checked={ checked }>\n\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t<DropdownMenuStyled.ItemIndicator>\n\t\t\t\t\t{ ( checked === 'indeterminate' || checked === true ) && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\tchecked === 'indeterminate' ? lineSolid : check\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenuStyled.ItemIndicator>\n\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t{ children }\n\t\t\t{ suffix && (\n\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t{ suffix }\n\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t) }\n\t\t</DropdownMenuStyled.CheckboxItem>\n\t);\n};\n\nexport const DropdownMenuRadioGroup = (\n\tprops: DropdownMenuRadioGroupProps\n) => <DropdownMenuPrimitive.RadioGroup { ...props } />;\n\nconst radioDot = (\n\t<SVG viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 } fill=\"currentColor\"></Circle>\n\t</SVG>\n);\n\nexport const DropdownMenuRadioItem = ( {\n\tchildren,\n\tsuffix,\n\t...props\n}: DropdownMenuRadioItemProps ) => {\n\treturn (\n\t\t<DropdownMenuStyled.RadioItem { ...props }>\n\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t<DropdownMenuStyled.ItemIndicator>\n\t\t\t\t\t<Icon icon={ radioDot } size={ 22 } />\n\t\t\t\t</DropdownMenuStyled.ItemIndicator>\n\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t{ children }\n\t\t\t{ suffix && (\n\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t{ suffix }\n\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t) }\n\t\t</DropdownMenuStyled.RadioItem>\n\t);\n};\n\nexport const DropdownMenuSeparator = ( props: DropdownMenuSeparatorProps ) => (\n\t<DropdownMenuStyled.Separator { ...props } />\n);\n"]}
+{"version":3,"sources":["@wordpress/components/src/dropdown-menu-v2/index.tsx"],"names":["SUB_MENU_OFFSET_SIDE","SUB_MENU_OFFSET_ALIGN","DropdownMenuPrivateContext","variant","undefined","portalContainer","UnconnectedDropdownMenu","props","defaultOpen","open","onOpenChange","modal","side","sideOffset","align","alignOffset","children","trigger","slot","POPOVER_DEFAULT_SLOT_NAME","ref","current","privateContextValue","DropdownMenu","DropdownSubMenuTrigger","prefix","suffix","chevronRightSmall","DropdownSubMenu","disabled","textValue","DropdownMenuLabel","DropdownMenuGroup","DropdownMenuItem","forwardedRef","DropdownMenuCheckboxItem","checked","lineSolid","check","DropdownMenuRadioGroup","radioDot","DropdownMenuRadioItem","DropdownMenuSeparator"],"mappings":";;;;;;;;;AAQA;;AALA;;AAWA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;;;;;AAzBA;AACA;AACA;;AAGA;AACA;AACA;;AAWA;AACA;AACA;AAqBA;AACA,MAAMA,oBAAoB,GAAG,EAA7B,C,CACA;;AACA,MAAMC,qBAAqB,GAAG,CAAC,CAA/B;AAEA,MAAMC,0BAA0B,GAC/B,4BAAiD;AAChDC,EAAAA,OAAO,EAAEC,SADuC;AAEhDC,EAAAA,eAAe,EAAE;AAF+B,CAAjD,CADD;;AAMA,MAAMC,uBAAuB,GAAKC,KAAF,IAAgC;AAC/D,QAAM;AACL;AACAC,IAAAA,WAFK;AAGLC,IAAAA,IAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,KAAK,GAAG,IALH;AAML;AACAC,IAAAA,IAAI,GAAG,QAPF;AAQLC,IAAAA,UAAU,GAAG,CARR;AASLC,IAAAA,KAAK,GAAG,QATH;AAULC,IAAAA,WAAW,GAAG,CAVT;AAWL;AACAC,IAAAA,QAZK;AAaLC,IAAAA,OAbK;AAeL;AACAd,IAAAA;AAhBK,MAiBF,+BAGDI,KAHC,EAGM,cAHN,CAjBJ,CAD+D,CAuB/D;;AACA,QAAMW,IAAI,GAAG,uBAASC,kBAAT,CAAb;AACA,QAAMd,eAAe,GAAGa,IAAI,CAACE,GAAL,EAAUC,OAAlC;AAEA,QAAMC,mBAAmB,GAAG,sBAC3B,OAAQ;AACPnB,IAAAA,OADO;AAEPE,IAAAA;AAFO,GAAR,CAD2B,EAK3B,CAAEF,OAAF,EAAWE,eAAX,CAL2B,CAA5B;AAQA,SACC,4BAAC,qBAAD,CAAuB,IAAvB;AACC,IAAA,WAAW,EAAGG,WADf;AAEC,IAAA,IAAI,EAAGC,IAFR;AAGC,IAAA,YAAY,EAAGC,YAHhB;AAIC,IAAA,KAAK,EAAGC,KAJT;AAKC,IAAA,GAAG,EAAG,qBAAU,KAAV,GAAkB;AALzB,KAOC,4BAAC,qBAAD,CAAuB,OAAvB;AAA+B,IAAA,OAAO;AAAtC,KACGM,OADH,CAPD,EAUC,4BAAC,qBAAD,CAAuB,MAAvB;AAA8B,IAAA,SAAS,EAAGZ;AAA1C,KACC,4BAAC,kBAAD,CAAoB,OAApB;AACC,IAAA,IAAI,EAAGO,IADR;AAEC,IAAA,KAAK,EAAGE,KAFT;AAGC,IAAA,UAAU,EAAGD,UAHd;AAIC,IAAA,WAAW,EAAGE,WAJf;AAKC,IAAA,IAAI,EAAG,IALR;AAMC,IAAA,OAAO,EAAGZ;AANX,KAQC,4BAAC,0BAAD,CAA4B,QAA5B;AACC,IAAA,KAAK,EAAGmB;AADT,KAGGN,QAHH,CARD,CADD,CAVD,CADD;AA6BA,CAhED;AAkEA;AACA;AACA;AACA;;;AACO,MAAMO,YAAY,GAAG,uCAC3BjB,uBAD2B,EAE3B,cAF2B,CAArB;;;AAKA,MAAMkB,sBAAsB,GAAG,CAAE;AACvCC,EAAAA,MADuC;AAEvCC,EAAAA,MAAM,GACL,4BAAC,kBAAD,CAAoB,qBAApB;AACC,IAAA,IAAI,EAAGC,wBADR;AAEC,IAAA,IAAI,EAAG;AAFR,IAHsC;AAQvCX,EAAAA;AARuC,CAAF,KASF;AACnC,SACC,qDACGS,MAAM,IACP,4BAAC,kBAAD,CAAoB,iBAApB,QACGA,MADH,CAFF,EAMGT,QANH,EAOGU,MAAM,IACP,4BAAC,kBAAD,CAAoB,iBAApB,QACGA,MADH,CARF,CADD;AAeA,CAzBM;;;;AA2BA,MAAME,eAAe,GAAG,CAAE;AAChC;AACApB,EAAAA,WAFgC;AAGhCC,EAAAA,IAHgC;AAIhCC,EAAAA,YAJgC;AAKhC;AACAmB,EAAAA,QANgC;AAOhCC,EAAAA,SAPgC;AAQhC;AACAd,EAAAA,QATgC;AAUhCC,EAAAA;AAVgC,CAAF,KAWF;AAC5B,QAAM;AAAEd,IAAAA,OAAF;AAAWE,IAAAA;AAAX,MAA+B,yBACpCH,0BADoC,CAArC;AAIA,SACC,4BAAC,qBAAD,CAAuB,GAAvB;AACC,IAAA,WAAW,EAAGM,WADf;AAEC,IAAA,IAAI,EAAGC,IAFR;AAGC,IAAA,YAAY,EAAGC;AAHhB,KAKC,4BAAC,kBAAD,CAAoB,UAApB;AACC,IAAA,QAAQ,EAAGmB,QADZ;AAEC,IAAA,SAAS,EAAGC;AAFb,KAIGb,OAJH,CALD,EAWC,4BAAC,qBAAD,CAAuB,MAAvB;AAA8B,IAAA,SAAS,EAAGZ;AAA1C,KACC,4BAAC,kBAAD,CAAoB,UAApB;AACC,IAAA,IAAI,MADL;AAEC,IAAA,UAAU,EAAGL,oBAFd;AAGC,IAAA,WAAW,EAAGC,qBAHf;AAIC,IAAA,OAAO,EAAGE;AAJX,KAMGa,QANH,CADD,CAXD,CADD;AAwBA,CAxCM;;;;AA0CA,MAAMe,iBAAiB,GAAKxB,KAAF,IAChC,4BAAC,kBAAD,CAAoB,KAApB,OAA+BA;AAA/B,EADM;;;;AAIA,MAAMyB,iBAAiB,GAAKzB,KAAF,IAChC,4BAAC,qBAAD,CAAuB,KAAvB,OAAkCA;AAAlC,EADM;;;AAIA,MAAM0B,gBAAgB,GAAG,yBAC/B,CACC;AAAEjB,EAAAA,QAAF;AAAYS,EAAAA,MAAZ;AAAoBC,EAAAA,MAApB;AAA4B,KAAGnB;AAA/B,CADD,EAEC2B,YAFD,KAGK;AACJ,SACC,4BAAC,kBAAD,CAAoB,IAApB,OAA8B3B,KAA9B;AAAsC,IAAA,GAAG,EAAG2B;AAA5C,KACGT,MAAM,IACP,4BAAC,kBAAD,CAAoB,iBAApB,QACGA,MADH,CAFF,EAMGT,QANH,EAOGU,MAAM,IACP,4BAAC,kBAAD,CAAoB,iBAApB,QACGA,MADH,CARF,CADD;AAeA,CApB8B,CAAzB;;;AAuBA,MAAMS,wBAAwB,GAAG,CAAE;AACzCnB,EAAAA,QADyC;AAEzCoB,EAAAA,OAAO,GAAG,KAF+B;AAGzCV,EAAAA,MAHyC;AAIzC,KAAGnB;AAJsC,CAAF,KAKF;AACrC,SACC,4BAAC,kBAAD,CAAoB,YAApB,OAAsCA,KAAtC;AAA8C,IAAA,OAAO,EAAG6B;AAAxD,KACC,4BAAC,kBAAD,CAAoB,iBAApB,QACC,4BAAC,kBAAD,CAAoB,aAApB,QACG,CAAEA,OAAO,KAAK,eAAZ,IAA+BA,OAAO,KAAK,IAA7C,KACD,4BAAC,aAAD;AACC,IAAA,IAAI,EACHA,OAAO,KAAK,eAAZ,GAA8BC,gBAA9B,GAA0CC,YAF5C;AAIC,IAAA,IAAI,EAAG;AAJR,IAFF,CADD,CADD,EAaGtB,QAbH,EAcGU,MAAM,IACP,4BAAC,kBAAD,CAAoB,iBAApB,QACGA,MADH,CAfF,CADD;AAsBA,CA5BM;;;;AA8BA,MAAMa,sBAAsB,GAClChC,KADqC,IAEjC,4BAAC,qBAAD,CAAuB,UAAvB,OAAuCA;AAAvC,EAFE;;;AAIP,MAAMiC,QAAQ,GACb,4BAAC,eAAD;AAAK,EAAA,OAAO,EAAC,WAAb;AAAyB,EAAA,KAAK,EAAC;AAA/B,GACC,4BAAC,kBAAD;AAAQ,EAAA,EAAE,EAAG,EAAb;AAAkB,EAAA,EAAE,EAAG,EAAvB;AAA4B,EAAA,CAAC,EAAG,CAAhC;AAAoC,EAAA,IAAI,EAAC;AAAzC,EADD,CADD;;AAMO,MAAMC,qBAAqB,GAAG,CAAE;AACtCzB,EAAAA,QADsC;AAEtCU,EAAAA,MAFsC;AAGtC,KAAGnB;AAHmC,CAAF,KAIF;AAClC,SACC,4BAAC,kBAAD,CAAoB,SAApB,OAAmCA;AAAnC,KACC,4BAAC,kBAAD,CAAoB,iBAApB,QACC,4BAAC,kBAAD,CAAoB,aAApB,QACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGiC,QAAb;AAAwB,IAAA,IAAI,EAAG;AAA/B,IADD,CADD,CADD,EAMGxB,QANH,EAOGU,MAAM,IACP,4BAAC,kBAAD,CAAoB,iBAApB,QACGA,MADH,CARF,CADD;AAeA,CApBM;;;;AAsBA,MAAMgB,qBAAqB,GAAKnC,KAAF,IAAyC;AAC7E,QAAM;AAAEJ,IAAAA;AAAF,MAAc,yBAAYD,0BAAZ,CAApB;AACA,SAAO,4BAAC,kBAAD,CAAoB,SAApB,OAAmCK,KAAnC;AAA2C,IAAA,OAAO,EAAGJ;AAArD,IAAP;AACA,CAHM","sourcesContent":["/**\n * External dependencies\n */\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n} from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\nimport { check, chevronRightSmall, lineSolid } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnectWithoutRef } from '../ui/context';\nimport { useSlot } from '../slot-fill';\nimport Icon from '../icon';\nimport { SLOT_NAME as POPOVER_DEFAULT_SLOT_NAME } from '../popover';\nimport * as DropdownMenuStyled from './styles';\nimport type {\n\tDropdownMenuProps,\n\tDropdownSubMenuProps,\n\tDropdownMenuItemProps,\n\tDropdownMenuLabelProps,\n\tDropdownMenuGroupProps,\n\tDropdownMenuCheckboxItemProps,\n\tDropdownMenuRadioGroupProps,\n\tDropdownMenuRadioItemProps,\n\tDropdownMenuSeparatorProps,\n\tDropdownSubMenuTriggerProps,\n\tDropdownMenuInternalContext,\n\tDropdownMenuPrivateContext as DropdownMenuPrivateContextType,\n} from './types';\n\n// Menu content's side padding + 4px\nconst SUB_MENU_OFFSET_SIDE = 16;\n// Opposite amount of the top padding of the menu item\nconst SUB_MENU_OFFSET_ALIGN = -8;\n\nconst DropdownMenuPrivateContext =\n\tcreateContext< DropdownMenuPrivateContextType >( {\n\t\tvariant: undefined,\n\t\tportalContainer: null,\n\t} );\n\nconst UnconnectedDropdownMenu = ( props: DropdownMenuProps ) => {\n\tconst {\n\t\t// Root props\n\t\tdefaultOpen,\n\t\topen,\n\t\tonOpenChange,\n\t\tmodal = true,\n\t\t// Content positioning props\n\t\tside = 'bottom',\n\t\tsideOffset = 0,\n\t\talign = 'center',\n\t\talignOffset = 0,\n\t\t// Render props\n\t\tchildren,\n\t\ttrigger,\n\n\t\t// From internal components context\n\t\tvariant,\n\t} = useContextSystem<\n\t\t// Adding `className` to the context type to avoid a TS error\n\t\tDropdownMenuProps & DropdownMenuInternalContext & { className?: string }\n\t>( props, 'DropdownMenu' );\n\n\t// Render the portal in the default slot used by the legacy Popover component.\n\tconst slot = useSlot( POPOVER_DEFAULT_SLOT_NAME );\n\tconst portalContainer = slot.ref?.current;\n\n\tconst privateContextValue = useMemo(\n\t\t() => ( {\n\t\t\tvariant,\n\t\t\tportalContainer,\n\t\t} ),\n\t\t[ variant, portalContainer ]\n\t);\n\n\treturn (\n\t\t<DropdownMenuPrimitive.Root\n\t\t\tdefaultOpen={ defaultOpen }\n\t\t\topen={ open }\n\t\t\tonOpenChange={ onOpenChange }\n\t\t\tmodal={ modal }\n\t\t\tdir={ isRTL() ? 'rtl' : 'ltr' }\n\t\t>\n\t\t\t<DropdownMenuPrimitive.Trigger asChild>\n\t\t\t\t{ trigger }\n\t\t\t</DropdownMenuPrimitive.Trigger>\n\t\t\t<DropdownMenuPrimitive.Portal container={ portalContainer }>\n\t\t\t\t<DropdownMenuStyled.Content\n\t\t\t\t\tside={ side }\n\t\t\t\t\talign={ align }\n\t\t\t\t\tsideOffset={ sideOffset }\n\t\t\t\t\talignOffset={ alignOffset }\n\t\t\t\t\tloop={ true }\n\t\t\t\t\tvariant={ variant }\n\t\t\t\t>\n\t\t\t\t\t<DropdownMenuPrivateContext.Provider\n\t\t\t\t\t\tvalue={ privateContextValue }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</DropdownMenuPrivateContext.Provider>\n\t\t\t\t</DropdownMenuStyled.Content>\n\t\t\t</DropdownMenuPrimitive.Portal>\n\t\t</DropdownMenuPrimitive.Root>\n\t);\n};\n\n/**\n * `DropdownMenu` displays a menu to the user (such as a set of actions\n * or functions) triggered by a button.\n */\nexport const DropdownMenu = contextConnectWithoutRef(\n\tUnconnectedDropdownMenu,\n\t'DropdownMenu'\n);\n\nexport const DropdownSubMenuTrigger = ( {\n\tprefix,\n\tsuffix = (\n\t\t<DropdownMenuStyled.SubmenuRtlChevronIcon\n\t\t\ticon={ chevronRightSmall }\n\t\t\tsize={ 24 }\n\t\t/>\n\t),\n\tchildren,\n}: DropdownSubMenuTriggerProps ) => {\n\treturn (\n\t\t<>\n\t\t\t{ prefix && (\n\t\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t\t{ prefix }\n\t\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t) }\n\t\t\t{ children }\n\t\t\t{ suffix && (\n\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t{ suffix }\n\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport const DropdownSubMenu = ( {\n\t// Sub props\n\tdefaultOpen,\n\topen,\n\tonOpenChange,\n\t// Sub trigger props\n\tdisabled,\n\ttextValue,\n\t// Render props\n\tchildren,\n\ttrigger,\n}: DropdownSubMenuProps ) => {\n\tconst { variant, portalContainer } = useContext(\n\t\tDropdownMenuPrivateContext\n\t);\n\n\treturn (\n\t\t<DropdownMenuPrimitive.Sub\n\t\t\tdefaultOpen={ defaultOpen }\n\t\t\topen={ open }\n\t\t\tonOpenChange={ onOpenChange }\n\t\t>\n\t\t\t<DropdownMenuStyled.SubTrigger\n\t\t\t\tdisabled={ disabled }\n\t\t\t\ttextValue={ textValue }\n\t\t\t>\n\t\t\t\t{ trigger }\n\t\t\t</DropdownMenuStyled.SubTrigger>\n\t\t\t<DropdownMenuPrimitive.Portal container={ portalContainer }>\n\t\t\t\t<DropdownMenuStyled.SubContent\n\t\t\t\t\tloop\n\t\t\t\t\tsideOffset={ SUB_MENU_OFFSET_SIDE }\n\t\t\t\t\talignOffset={ SUB_MENU_OFFSET_ALIGN }\n\t\t\t\t\tvariant={ variant }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownMenuStyled.SubContent>\n\t\t\t</DropdownMenuPrimitive.Portal>\n\t\t</DropdownMenuPrimitive.Sub>\n\t);\n};\n\nexport const DropdownMenuLabel = ( props: DropdownMenuLabelProps ) => (\n\t<DropdownMenuStyled.Label { ...props } />\n);\n\nexport const DropdownMenuGroup = ( props: DropdownMenuGroupProps ) => (\n\t<DropdownMenuPrimitive.Group { ...props } />\n);\n\nexport const DropdownMenuItem = forwardRef(\n\t(\n\t\t{ children, prefix, suffix, ...props }: DropdownMenuItemProps,\n\t\tforwardedRef: React.ForwardedRef< any >\n\t) => {\n\t\treturn (\n\t\t\t<DropdownMenuStyled.Item { ...props } ref={ forwardedRef }>\n\t\t\t\t{ prefix && (\n\t\t\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t\t\t{ prefix }\n\t\t\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</DropdownMenuStyled.Item>\n\t\t);\n\t}\n);\n\nexport const DropdownMenuCheckboxItem = ( {\n\tchildren,\n\tchecked = false,\n\tsuffix,\n\t...props\n}: DropdownMenuCheckboxItemProps ) => {\n\treturn (\n\t\t<DropdownMenuStyled.CheckboxItem { ...props } checked={ checked }>\n\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t<DropdownMenuStyled.ItemIndicator>\n\t\t\t\t\t{ ( checked === 'indeterminate' || checked === true ) && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\tchecked === 'indeterminate' ? lineSolid : check\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenuStyled.ItemIndicator>\n\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t{ children }\n\t\t\t{ suffix && (\n\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t{ suffix }\n\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t) }\n\t\t</DropdownMenuStyled.CheckboxItem>\n\t);\n};\n\nexport const DropdownMenuRadioGroup = (\n\tprops: DropdownMenuRadioGroupProps\n) => <DropdownMenuPrimitive.RadioGroup { ...props } />;\n\nconst radioDot = (\n\t<SVG viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 } fill=\"currentColor\"></Circle>\n\t</SVG>\n);\n\nexport const DropdownMenuRadioItem = ( {\n\tchildren,\n\tsuffix,\n\t...props\n}: DropdownMenuRadioItemProps ) => {\n\treturn (\n\t\t<DropdownMenuStyled.RadioItem { ...props }>\n\t\t\t<DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t\t<DropdownMenuStyled.ItemIndicator>\n\t\t\t\t\t<Icon icon={ radioDot } size={ 22 } />\n\t\t\t\t</DropdownMenuStyled.ItemIndicator>\n\t\t\t</DropdownMenuStyled.ItemPrefixWrapper>\n\t\t\t{ children }\n\t\t\t{ suffix && (\n\t\t\t\t<DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t\t\t{ suffix }\n\t\t\t\t</DropdownMenuStyled.ItemSuffixWrapper>\n\t\t\t) }\n\t\t</DropdownMenuStyled.RadioItem>\n\t);\n};\n\nexport const DropdownMenuSeparator = ( props: DropdownMenuSeparatorProps ) => {\n\tconst { variant } = useContext( DropdownMenuPrivateContext );\n\treturn <DropdownMenuStyled.Separator { ...props } variant={ variant } />;\n};\n"]}