@wordpress/components 25.13.0 → 25.15.0

package/build-module/date-time/date/styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["Button","COLORS","CONFIG","HStack","Heading","space","Wrapper","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Navigator","NavigatorHeading","fontSize","fontWeight","fontWeightHeading","Calendar","DayOfWeek","gray","fontLineHeightBase","DayButton","shouldForwardProp","prop","includes","props","column","disabled","isSelected","theme","accent","white","isToday","hasEvents"],"sources":["@wordpress/components/src/date-time/date/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { COLORS, CONFIG } from '../../utils';\nimport { HStack } from '../../h-stack';\nimport { Heading } from '../../heading';\nimport { space } from '../../utils/space';\n\nexport const Wrapper = styled.div`\n\tbox-sizing: border-box;\n`;\n\nexport const Navigator = styled( HStack )`\n\tmargin-bottom: ${ space( 4 ) };\n`;\n\nexport const NavigatorHeading = styled( Heading )`\n\tfont-size: ${ CONFIG.fontSize };\n\tfont-weight: ${ CONFIG.fontWeight };\n\n\tstrong {\n\t\tfont-weight: ${ CONFIG.fontWeightHeading };\n\t}\n`;\n\nexport const Calendar = styled.div`\n\tcolumn-gap: ${ space( 2 ) };\n\tdisplay: grid;\n\tgrid-template-columns: 0.5fr repeat( 5, 1fr ) 0.5fr;\n\tjustify-items: center;\n\trow-gap: ${ space( 2 ) };\n`;\n\nexport const DayOfWeek = styled.div`\n\tcolor: ${ COLORS.gray[ 700 ] };\n\tfont-size: ${ CONFIG.fontSize };\n\tline-height: ${ CONFIG.fontLineHeightBase };\n\n\t&:nth-of-type( 1 ) {\n\t\tjustify-self: start;\n\t}\n\n\t&:nth-of-type( 7 ) {\n\t\tjustify-self: end;\n\t}\n`;\n\nexport const DayButton = styled( Button, {\n\tshouldForwardProp: ( prop: string ) =>\n\t\t! [ 'column', 'isSelected', 'isToday', 'hasEvents' ].includes( prop ),\n} )< {\n\tcolumn: number;\n\tisSelected: boolean;\n\tisToday: boolean;\n\thasEvents: boolean;\n} >`\n\tgrid-column: ${ ( props ) => props.column };\n\tposition: relative;\n\tjustify-content: center;\n\n\t${ ( props ) =>\n\t\tprops.column === 1 &&\n\t\t`\n\t\tjustify-self: start;\n\t\t` }\n\n\t${ ( props ) =>\n\t\tprops.column === 7 &&\n\t\t`\n\t\tjustify-self: end;\n\t\t` }\n\n\t${ ( props ) =>\n\t\tprops.disabled &&\n\t\t`\n\t\tpointer-events: none;\n\t\t` }\n\n\t&&& {\n\t\tborder-radius: 100%;\n\t\theight: ${ space( 7 ) };\n\t\twidth: ${ space( 7 ) };\n\n\t\t${ ( props ) =>\n\t\t\tprops.isSelected &&\n\t\t\t`\n\t\t\tbackground: ${ COLORS.theme.accent };\n\t\t\tcolor: ${ COLORS.white };\n\t\t\t` }\n\n\t\t${ ( props ) =>\n\t\t\t! props.isSelected &&\n\t\t\tprops.isToday &&\n\t\t\t`\n\t\t\tbackground: ${ COLORS.gray[ 200 ] };\n\t\t\t` }\n\t}\n\n\t${ ( props ) =>\n\t\tprops.hasEvents &&\n\t\t`\n\t\t::before {\n\t\t\tbackground: ${ props.isSelected ? COLORS.white : COLORS.theme.accent };\n\t\t\tborder-radius: 2px;\n\t\t\tbottom: 0;\n\t\t\tcontent: \" \";\n\t\t\theight: 4px;\n\t\t\tleft: 50%;\n\t\t\tmargin-left: -2px;\n\t\t\tposition: absolute;\n\t\t\twidth: 4px;\n\t\t}\n\t\t` }\n`;\n"],"mappings":";;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,OAAOA,MAAM,MAAM,cAAc;AACjC,SAASC,MAAM,EAAEC,MAAM,QAAQ,aAAa;AAC5C,SAASC,MAAM,QAAQ,eAAe;AACtC,SAASC,OAAO,QAAQ,eAAe;AACvC,SAASC,KAAK,QAAQ,mBAAmB;AAEzC,OAAO,MAAMC,OAAO,GAAAC,OAAA,QAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAEnB;AAED,OAAO,MAAMC,SAAS,GAAG,aAAAX,OAAA,CAAQJ,MAAM,EAAAK,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,mBACtBP,KAAK,CAAE,CAAE,CAAC,SAAAG,OAAA,CAAAC,GAAA,CAAAC,QAAA,goHAC5B;AAED,OAAO,MAAMS,gBAAgB,GAAG,aAAAZ,OAAA,CAAQH,OAAO,EAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,eAClCV,MAAM,CAACkB,QAAQ,mBACblB,MAAM,CAACmB,UAAU,0BAGhBnB,MAAM,CAACoB,iBAAiB,UAAAd,OAAA,CAAAC,GAAA,CAAAC,QAAA,goHAEzC;AAED,OAAO,MAAMa,QAAQ,GAAAhB,OAAA,QAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,kBACLP,KAAK,CAAE,CAAE,CAAC,oGAIbA,KAAK,CAAE,CAAE,CAAC,SAAAG,OAAA,CAAAC,GAAA,CAAAC,QAAA,goHACtB;AAED,OAAO,MAAMc,SAAS,GAAAjB,OAAA,QAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,aACXX,MAAM,CAACwB,IAAI,CAAE,GAAG,CAAE,iBACdvB,MAAM,CAACkB,QAAQ,mBACblB,MAAM,CAACwB,kBAAkB,qFAAAlB,OAAA,CAAAC,GAAA,CAAAC,QAAA,goHASzC;AAED,OAAO,MAAMiB,SAAS,GAAG,aAAApB,OAAA,CAAQP,MAAM,EAAAQ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EACtCkB,iBAAiB,EAAIC,IAAY,IAChC,CAAE,CAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,WAAW,CAAE,CAACC,QAAQ,CAAED,IAAK,CAAC;EAAAlB,MAAA;AAAA;EADtEiB,iBAAiB,EAAIC,IAAY,IAChC,CAAE,CAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,WAAW,CAAE,CAACC,QAAQ,CAAED,IAAK,CAAC;EAAAlB,MAAA;EAAAC,KAAA;AAAA,CACrE,CAAC,iBAMgBmB,KAAK,IAAMA,KAAK,CAACC,MAAM,gDAIpCD,KAAK,IACTA,KAAK,CAACC,MAAM,KAAK,CAAC,IACjB;AACH;AACA,GAAG,OAEGD,KAAK,IACTA,KAAK,CAACC,MAAM,KAAK,CAAC,IACjB;AACH;AACA,GAAG,OAEGD,KAAK,IACTA,KAAK,CAACE,QAAQ,IACb;AACH;AACA,GAAG,qCAIU5B,KAAK,CAAE,CAAE,CAAC,aACXA,KAAK,CAAE,CAAE,CAAC,OAEf0B,KAAK,IACTA,KAAK,CAACG,UAAU,IACf;AACJ,iBAAkBjC,MAAM,CAACkC,KAAK,CAACC,MAAQ;AACvC,YAAanC,MAAM,CAACoC,KAAO;AAC3B,IAAI,OAEGN,KAAK,IACT,CAAEA,KAAK,CAACG,UAAU,IAClBH,KAAK,CAACO,OAAO,IACZ;AACJ,iBAAkBrC,MAAM,CAACwB,IAAI,CAAE,GAAG,CAAI;AACtC,IAAI,QAGEM,KAAK,IACTA,KAAK,CAACQ,SAAS,IACd;AACH;AACA,iBAAkBR,KAAK,CAACG,UAAU,GAAGjC,MAAM,CAACoC,KAAK,GAAGpC,MAAM,CAACkC,KAAK,CAACC,MAAQ;AACzE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAAG,SAAA5B,OAAA,CAAAC,GAAA,CAAAC,QAAA,goHACF"}
+{"version":3,"names":["Button","COLORS","CONFIG","HStack","Heading","space","Wrapper","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Navigator","NavigatorHeading","fontSize","fontWeight","fontWeightHeading","Calendar","DayOfWeek","gray","fontLineHeightBase","DayButton","shouldForwardProp","prop","includes","props","column","disabled","isSelected","theme","accent","white","isToday","hasEvents"],"sources":["@wordpress/components/src/date-time/date/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { COLORS, CONFIG } from '../../utils';\nimport { HStack } from '../../h-stack';\nimport { Heading } from '../../heading';\nimport { space } from '../../utils/space';\n\nexport const Wrapper = styled.div`\n\tbox-sizing: border-box;\n`;\n\nexport const Navigator = styled( HStack )`\n\tmargin-bottom: ${ space( 4 ) };\n`;\n\nexport const NavigatorHeading = styled( Heading )`\n\tfont-size: ${ CONFIG.fontSize };\n\tfont-weight: ${ CONFIG.fontWeight };\n\n\tstrong {\n\t\tfont-weight: ${ CONFIG.fontWeightHeading };\n\t}\n`;\n\nexport const Calendar = styled.div`\n\tcolumn-gap: ${ space( 2 ) };\n\tdisplay: grid;\n\tgrid-template-columns: 0.5fr repeat( 5, 1fr ) 0.5fr;\n\tjustify-items: center;\n\trow-gap: ${ space( 2 ) };\n`;\n\nexport const DayOfWeek = styled.div`\n\tcolor: ${ COLORS.gray[ 700 ] };\n\tfont-size: ${ CONFIG.fontSize };\n\tline-height: ${ CONFIG.fontLineHeightBase };\n\n\t&:nth-of-type( 1 ) {\n\t\tjustify-self: start;\n\t}\n\n\t&:nth-of-type( 7 ) {\n\t\tjustify-self: end;\n\t}\n`;\n\nexport const DayButton = styled( Button, {\n\tshouldForwardProp: ( prop: string ) =>\n\t\t! [ 'column', 'isSelected', 'isToday', 'hasEvents' ].includes( prop ),\n} )< {\n\tcolumn: number;\n\tisSelected: boolean;\n\tisToday: boolean;\n\thasEvents: boolean;\n} >`\n\tgrid-column: ${ ( props ) => props.column };\n\tposition: relative;\n\tjustify-content: center;\n\n\t${ ( props ) =>\n\t\tprops.column === 1 &&\n\t\t`\n\t\tjustify-self: start;\n\t\t` }\n\n\t${ ( props ) =>\n\t\tprops.column === 7 &&\n\t\t`\n\t\tjustify-self: end;\n\t\t` }\n\n\t${ ( props ) =>\n\t\tprops.disabled &&\n\t\t`\n\t\tpointer-events: none;\n\t\t` }\n\n\t&&& {\n\t\tborder-radius: 100%;\n\t\theight: ${ space( 8 ) };\n\t\twidth: ${ space( 8 ) };\n\n\t\t${ ( props ) =>\n\t\t\tprops.isSelected &&\n\t\t\t`\n\t\t\tbackground: ${ COLORS.theme.accent };\n\t\t\tcolor: ${ COLORS.white };\n\t\t\t` }\n\n\t\t${ ( props ) =>\n\t\t\t! props.isSelected &&\n\t\t\tprops.isToday &&\n\t\t\t`\n\t\t\tbackground: ${ COLORS.gray[ 200 ] };\n\t\t\t` }\n\t}\n\n\t${ ( props ) =>\n\t\tprops.hasEvents &&\n\t\t`\n\t\t::before {\n\t\t\tbackground: ${ props.isSelected ? COLORS.white : COLORS.theme.accent };\n\t\t\tborder-radius: 2px;\n\t\t\tbottom: 2px;\n\t\t\tcontent: \" \";\n\t\t\theight: 4px;\n\t\t\tleft: 50%;\n\t\t\tmargin-left: -2px;\n\t\t\tposition: absolute;\n\t\t\twidth: 4px;\n\t\t}\n\t\t` }\n`;\n"],"mappings":"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"}

package/build-module/date-time/time/timezone.js

@@ -30,8 +30,17 @@ const TimeZone = () => {
   }
   const offsetSymbol = Number(timezone.offset) >= 0 ? '+' : '';
   const zoneAbbr = '' !== timezone.abbr && isNaN(Number(timezone.abbr)) ? timezone.abbr : `UTC${offsetSymbol}${timezone.offset}`;
-  const timezoneDetail = 'UTC' === timezone.string ? __('Coordinated Universal Time') : `(${zoneAbbr}) ${timezone.string.replace('_', ' ')}`;
-  return createElement(Tooltip, {
+
+  // Replace underscore with space in strings like `America/Costa_Rica`.
+  const prettyTimezoneString = timezone.string.replace('_', ' ');
+  const timezoneDetail = 'UTC' === timezone.string ? __('Coordinated Universal Time') : `(${zoneAbbr}) ${prettyTimezoneString}`;
+
+  // When the prettyTimezoneString is empty, there is no additional timezone
+  // detail information to show in a Tooltip.
+  const hasNoAdditionalTimezoneDetail = prettyTimezoneString.trim().length === 0;
+  return hasNoAdditionalTimezoneDetail ? createElement(StyledComponent, {
+    className: "components-datetime__timezone"
+  }, zoneAbbr) : createElement(Tooltip, {
     placement: "top",
     text: timezoneDetail
   }, createElement(StyledComponent, {

package/build-module/date-time/time/timezone.js.map

@@ -1 +1 @@
-{"version":3,"names":["__","getSettings","getDateSettings","Tooltip","TimeZone","StyledComponent","timezone","userTimezoneOffset","Date","getTimezoneOffset","Number","offset","offsetSymbol","zoneAbbr","abbr","isNaN","timezoneDetail","string","replace","createElement","placement","text","className"],"sources":["@wordpress/components/src/date-time/time/timezone.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { getSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../../tooltip';\nimport { TimeZone as StyledComponent } from './styles';\n\n/**\n * Displays timezone information when user timezone is different from site\n * timezone.\n */\nconst TimeZone = () => {\n\tconst { timezone } = getDateSettings();\n\n\t// Convert timezone offset to hours.\n\tconst userTimezoneOffset = -1 * ( new Date().getTimezoneOffset() / 60 );\n\n\t// System timezone and user timezone match, nothing needed.\n\t// Compare as numbers because it comes over as string.\n\tif ( Number( timezone.offset ) === userTimezoneOffset ) {\n\t\treturn null;\n\t}\n\n\tconst offsetSymbol = Number( timezone.offset ) >= 0 ? '+' : '';\n\tconst zoneAbbr =\n\t\t'' !== timezone.abbr && isNaN( Number( timezone.abbr ) )\n\t\t\t? timezone.abbr\n\t\t\t: `UTC${ offsetSymbol }${ timezone.offset }`;\n\n\tconst timezoneDetail =\n\t\t'UTC' === timezone.string\n\t\t\t? __( 'Coordinated Universal Time' )\n\t\t\t: `(${ zoneAbbr }) ${ timezone.string.replace( '_', ' ' ) }`;\n\n\treturn (\n\t\t<Tooltip placement=\"top\" text={ timezoneDetail }>\n\t\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t\t{ zoneAbbr }\n\t\t\t</StyledComponent>\n\t\t</Tooltip>\n\t);\n};\n\nexport default TimeZone;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,eAAe,QAAQ,iBAAiB;;AAEhE;AACA;AACA;AACA,OAAOC,OAAO,MAAM,eAAe;AACnC,SAASC,QAAQ,IAAIC,eAAe,QAAQ,UAAU;;AAEtD;AACA;AACA;AACA;AACA,MAAMD,QAAQ,GAAGA,CAAA,KAAM;EACtB,MAAM;IAAEE;EAAS,CAAC,GAAGJ,eAAe,CAAC,CAAC;;EAEtC;EACA,MAAMK,kBAAkB,GAAG,CAAC,CAAC,IAAK,IAAIC,IAAI,CAAC,CAAC,CAACC,iBAAiB,CAAC,CAAC,GAAG,EAAE,CAAE;;EAEvE;EACA;EACA,IAAKC,MAAM,CAAEJ,QAAQ,CAACK,MAAO,CAAC,KAAKJ,kBAAkB,EAAG;IACvD,OAAO,IAAI;EACZ;EAEA,MAAMK,YAAY,GAAGF,MAAM,CAAEJ,QAAQ,CAACK,MAAO,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE;EAC9D,MAAME,QAAQ,GACb,EAAE,KAAKP,QAAQ,CAACQ,IAAI,IAAIC,KAAK,CAAEL,MAAM,CAAEJ,QAAQ,CAACQ,IAAK,CAAE,CAAC,GACrDR,QAAQ,CAACQ,IAAI,GACZ,MAAMF,YAAc,GAAGN,QAAQ,CAACK,MAAQ,EAAC;EAE9C,MAAMK,cAAc,GACnB,KAAK,KAAKV,QAAQ,CAACW,MAAM,GACtBjB,EAAE,CAAE,4BAA6B,CAAC,GACjC,IAAIa,QAAU,KAAKP,QAAQ,CAACW,MAAM,CAACC,OAAO,CAAE,GAAG,EAAE,GAAI,CAAG,EAAC;EAE9D,OACCC,aAAA,CAAChB,OAAO;IAACiB,SAAS,EAAC,KAAK;IAACC,IAAI,EAAGL;EAAgB,GAC/CG,aAAA,CAACd,eAAe;IAACiB,SAAS,EAAC;EAA+B,GACvDT,QACc,CACT,CAAC;AAEZ,CAAC;AAED,eAAeT,QAAQ"}
+{"version":3,"names":["__","getSettings","getDateSettings","Tooltip","TimeZone","StyledComponent","timezone","userTimezoneOffset","Date","getTimezoneOffset","Number","offset","offsetSymbol","zoneAbbr","abbr","isNaN","prettyTimezoneString","string","replace","timezoneDetail","hasNoAdditionalTimezoneDetail","trim","length","createElement","className","placement","text"],"sources":["@wordpress/components/src/date-time/time/timezone.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { getSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../../tooltip';\nimport { TimeZone as StyledComponent } from './styles';\n\n/**\n * Displays timezone information when user timezone is different from site\n * timezone.\n */\nconst TimeZone = () => {\n\tconst { timezone } = getDateSettings();\n\n\t// Convert timezone offset to hours.\n\tconst userTimezoneOffset = -1 * ( new Date().getTimezoneOffset() / 60 );\n\n\t// System timezone and user timezone match, nothing needed.\n\t// Compare as numbers because it comes over as string.\n\tif ( Number( timezone.offset ) === userTimezoneOffset ) {\n\t\treturn null;\n\t}\n\n\tconst offsetSymbol = Number( timezone.offset ) >= 0 ? '+' : '';\n\tconst zoneAbbr =\n\t\t'' !== timezone.abbr && isNaN( Number( timezone.abbr ) )\n\t\t\t? timezone.abbr\n\t\t\t: `UTC${ offsetSymbol }${ timezone.offset }`;\n\n\t// Replace underscore with space in strings like `America/Costa_Rica`.\n\tconst prettyTimezoneString = timezone.string.replace( '_', ' ' );\n\n\tconst timezoneDetail =\n\t\t'UTC' === timezone.string\n\t\t\t? __( 'Coordinated Universal Time' )\n\t\t\t: `(${ zoneAbbr }) ${ prettyTimezoneString }`;\n\n\t// When the prettyTimezoneString is empty, there is no additional timezone\n\t// detail information to show in a Tooltip.\n\tconst hasNoAdditionalTimezoneDetail =\n\t\tprettyTimezoneString.trim().length === 0;\n\n\treturn hasNoAdditionalTimezoneDetail ? (\n\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t{ zoneAbbr }\n\t\t</StyledComponent>\n\t) : (\n\t\t<Tooltip placement=\"top\" text={ timezoneDetail }>\n\t\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t\t{ zoneAbbr }\n\t\t\t</StyledComponent>\n\t\t</Tooltip>\n\t);\n};\n\nexport default TimeZone;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,eAAe,QAAQ,iBAAiB;;AAEhE;AACA;AACA;AACA,OAAOC,OAAO,MAAM,eAAe;AACnC,SAASC,QAAQ,IAAIC,eAAe,QAAQ,UAAU;;AAEtD;AACA;AACA;AACA;AACA,MAAMD,QAAQ,GAAGA,CAAA,KAAM;EACtB,MAAM;IAAEE;EAAS,CAAC,GAAGJ,eAAe,CAAC,CAAC;;EAEtC;EACA,MAAMK,kBAAkB,GAAG,CAAC,CAAC,IAAK,IAAIC,IAAI,CAAC,CAAC,CAACC,iBAAiB,CAAC,CAAC,GAAG,EAAE,CAAE;;EAEvE;EACA;EACA,IAAKC,MAAM,CAAEJ,QAAQ,CAACK,MAAO,CAAC,KAAKJ,kBAAkB,EAAG;IACvD,OAAO,IAAI;EACZ;EAEA,MAAMK,YAAY,GAAGF,MAAM,CAAEJ,QAAQ,CAACK,MAAO,CAAC,IAAI,CAAC,GAAG,GAAG,GAAG,EAAE;EAC9D,MAAME,QAAQ,GACb,EAAE,KAAKP,QAAQ,CAACQ,IAAI,IAAIC,KAAK,CAAEL,MAAM,CAAEJ,QAAQ,CAACQ,IAAK,CAAE,CAAC,GACrDR,QAAQ,CAACQ,IAAI,GACZ,MAAMF,YAAc,GAAGN,QAAQ,CAACK,MAAQ,EAAC;;EAE9C;EACA,MAAMK,oBAAoB,GAAGV,QAAQ,CAACW,MAAM,CAACC,OAAO,CAAE,GAAG,EAAE,GAAI,CAAC;EAEhE,MAAMC,cAAc,GACnB,KAAK,KAAKb,QAAQ,CAACW,MAAM,GACtBjB,EAAE,CAAE,4BAA6B,CAAC,GACjC,IAAIa,QAAU,KAAKG,oBAAsB,EAAC;;EAE/C;EACA;EACA,MAAMI,6BAA6B,GAClCJ,oBAAoB,CAACK,IAAI,CAAC,CAAC,CAACC,MAAM,KAAK,CAAC;EAEzC,OAAOF,6BAA6B,GACnCG,aAAA,CAAClB,eAAe;IAACmB,SAAS,EAAC;EAA+B,GACvDX,QACc,CAAC,GAElBU,aAAA,CAACpB,OAAO;IAACsB,SAAS,EAAC,KAAK;IAACC,IAAI,EAAGP;EAAgB,GAC/CI,aAAA,CAAClB,eAAe;IAACmB,SAAS,EAAC;EAA+B,GACvDX,QACc,CACT,CACT;AACF,CAAC;AAED,eAAeT,QAAQ"}

package/build-module/dimension-control/index.js

@@ -40,6 +40,7 @@ import sizesTable, { findSizeBySlug } from './sizes';
  */
 export function DimensionControl(props) {
   const {
+    __next40pxDefaultSize = false,
     label,
     value,
     sizes = sizesTable,
@@ -72,6 +73,7 @@ export function DimensionControl(props) {
     icon: icon
   }), label);
   return createElement(SelectControl, {
+    __next40pxDefaultSize: __next40pxDefaultSize,
     className: classnames(className, 'block-editor-dimension-control'),
     label: selectLabel,
     hideLabelFromVision: false,

package/build-module/dimension-control/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","__","Icon","SelectControl","sizesTable","findSizeBySlug","DimensionControl","props","label","value","sizes","icon","onChange","className","onChangeSpacingSize","val","theSize","slug","undefined","formatSizesAsOptions","theSizes","options","map","name","selectLabel","createElement","Fragment","hideLabelFromVision"],"sources":["@wordpress/components/src/dimension-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport SelectControl from '../select-control';\nimport sizesTable, { findSizeBySlug } from './sizes';\nimport type { DimensionControlProps, Size } from './types';\nimport type { SelectControlSingleSelectionProps } from '../select-control/types';\n\n/**\n * `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.\n *\n * This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.\n *\n * ```jsx\n * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * export default function MyCustomDimensionControl() {\n * \tconst [ paddingSize, setPaddingSize ] = useState( '' );\n *\n * \treturn (\n * \t\t<DimensionControl\n * \t\t\tlabel={ 'Padding' }\n * \t\t\ticon={ 'desktop' }\n * \t\t\tonChange={ ( value ) => setPaddingSize( value ) }\n * \t\t\tvalue={ paddingSize }\n * \t\t/>\n * \t);\n * }\n * ```\n */\nexport function DimensionControl( props: DimensionControlProps ) {\n\tconst {\n\t\tlabel,\n\t\tvalue,\n\t\tsizes = sizesTable,\n\t\ticon,\n\t\tonChange,\n\t\tclassName = '',\n\t} = props;\n\n\tconst onChangeSpacingSize: SelectControlSingleSelectionProps[ 'onChange' ] =\n\t\t( val ) => {\n\t\t\tconst theSize = findSizeBySlug( sizes, val );\n\n\t\t\tif ( ! theSize || value === theSize.slug ) {\n\t\t\t\tonChange?.( undefined );\n\t\t\t} else if ( typeof onChange === 'function' ) {\n\t\t\t\tonChange( theSize.slug );\n\t\t\t}\n\t\t};\n\n\tconst formatSizesAsOptions = ( theSizes: Size[] ) => {\n\t\tconst options = theSizes.map( ( { name, slug } ) => ( {\n\t\t\tlabel: name,\n\t\t\tvalue: slug,\n\t\t} ) );\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: __( 'Default' ),\n\t\t\t\tvalue: '',\n\t\t\t},\n\t\t\t...options,\n\t\t];\n\t};\n\n\tconst selectLabel = (\n\t\t<>\n\t\t\t{ icon && <Icon icon={ icon } /> }\n\t\t\t{ label }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<SelectControl\n\t\t\tclassName={ classnames(\n\t\t\t\tclassName,\n\t\t\t\t'block-editor-dimension-control'\n\t\t\t) }\n\t\t\tlabel={ selectLabel }\n\t\t\thideLabelFromVision={ false }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChangeSpacingSize }\n\t\t\toptions={ formatSizesAsOptions( sizes ) }\n\t\t/>\n\t);\n}\n\nexport default DimensionControl;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,IAAI,MAAM,SAAS;AAC1B,OAAOC,aAAa,MAAM,mBAAmB;AAC7C,OAAOC,UAAU,IAAIC,cAAc,QAAQ,SAAS;AAIpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgBA,CAAEC,KAA4B,EAAG;EAChE,MAAM;IACLC,KAAK;IACLC,KAAK;IACLC,KAAK,GAAGN,UAAU;IAClBO,IAAI;IACJC,QAAQ;IACRC,SAAS,GAAG;EACb,CAAC,GAAGN,KAAK;EAET,MAAMO,mBAAoE,GACvEC,GAAG,IAAM;IACV,MAAMC,OAAO,GAAGX,cAAc,CAAEK,KAAK,EAAEK,GAAI,CAAC;IAE5C,IAAK,CAAEC,OAAO,IAAIP,KAAK,KAAKO,OAAO,CAACC,IAAI,EAAG;MAC1CL,QAAQ,GAAIM,SAAU,CAAC;IACxB,CAAC,MAAM,IAAK,OAAON,QAAQ,KAAK,UAAU,EAAG;MAC5CA,QAAQ,CAAEI,OAAO,CAACC,IAAK,CAAC;IACzB;EACD,CAAC;EAEF,MAAME,oBAAoB,GAAKC,QAAgB,IAAM;IACpD,MAAMC,OAAO,GAAGD,QAAQ,CAACE,GAAG,CAAE,CAAE;MAAEC,IAAI;MAAEN;IAAK,CAAC,MAAQ;MACrDT,KAAK,EAAEe,IAAI;MACXd,KAAK,EAAEQ;IACR,CAAC,CAAG,CAAC;IAEL,OAAO,CACN;MACCT,KAAK,EAAEP,EAAE,CAAE,SAAU,CAAC;MACtBQ,KAAK,EAAE;IACR,CAAC,EACD,GAAGY,OAAO,CACV;EACF,CAAC;EAED,MAAMG,WAAW,GAChBC,aAAA,CAAAC,QAAA,QACGf,IAAI,IAAIc,aAAA,CAACvB,IAAI;IAACS,IAAI,EAAGA;EAAM,CAAE,CAAC,EAC9BH,KACD,CACF;EAED,OACCiB,aAAA,CAACtB,aAAa;IACbU,SAAS,EAAGb,UAAU,CACrBa,SAAS,EACT,gCACD,CAAG;IACHL,KAAK,EAAGgB,WAAa;IACrBG,mBAAmB,EAAG,KAAO;IAC7BlB,KAAK,EAAGA,KAAO;IACfG,QAAQ,EAAGE,mBAAqB;IAChCO,OAAO,EAAGF,oBAAoB,CAAET,KAAM;EAAG,CACzC,CAAC;AAEJ;AAEA,eAAeJ,gBAAgB"}
+{"version":3,"names":["classnames","__","Icon","SelectControl","sizesTable","findSizeBySlug","DimensionControl","props","__next40pxDefaultSize","label","value","sizes","icon","onChange","className","onChangeSpacingSize","val","theSize","slug","undefined","formatSizesAsOptions","theSizes","options","map","name","selectLabel","createElement","Fragment","hideLabelFromVision"],"sources":["@wordpress/components/src/dimension-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Icon from '../icon';\nimport SelectControl from '../select-control';\nimport sizesTable, { findSizeBySlug } from './sizes';\nimport type { DimensionControlProps, Size } from './types';\nimport type { SelectControlSingleSelectionProps } from '../select-control/types';\n\n/**\n * `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.\n *\n * This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.\n *\n * ```jsx\n * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * export default function MyCustomDimensionControl() {\n * \tconst [ paddingSize, setPaddingSize ] = useState( '' );\n *\n * \treturn (\n * \t\t<DimensionControl\n * \t\t\tlabel={ 'Padding' }\n * \t\t\ticon={ 'desktop' }\n * \t\t\tonChange={ ( value ) => setPaddingSize( value ) }\n * \t\t\tvalue={ paddingSize }\n * \t\t/>\n * \t);\n * }\n * ```\n */\nexport function DimensionControl( props: DimensionControlProps ) {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tlabel,\n\t\tvalue,\n\t\tsizes = sizesTable,\n\t\ticon,\n\t\tonChange,\n\t\tclassName = '',\n\t} = props;\n\n\tconst onChangeSpacingSize: SelectControlSingleSelectionProps[ 'onChange' ] =\n\t\t( val ) => {\n\t\t\tconst theSize = findSizeBySlug( sizes, val );\n\n\t\t\tif ( ! theSize || value === theSize.slug ) {\n\t\t\t\tonChange?.( undefined );\n\t\t\t} else if ( typeof onChange === 'function' ) {\n\t\t\t\tonChange( theSize.slug );\n\t\t\t}\n\t\t};\n\n\tconst formatSizesAsOptions = ( theSizes: Size[] ) => {\n\t\tconst options = theSizes.map( ( { name, slug } ) => ( {\n\t\t\tlabel: name,\n\t\t\tvalue: slug,\n\t\t} ) );\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: __( 'Default' ),\n\t\t\t\tvalue: '',\n\t\t\t},\n\t\t\t...options,\n\t\t];\n\t};\n\n\tconst selectLabel = (\n\t\t<>\n\t\t\t{ icon && <Icon icon={ icon } /> }\n\t\t\t{ label }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\tclassName={ classnames(\n\t\t\t\tclassName,\n\t\t\t\t'block-editor-dimension-control'\n\t\t\t) }\n\t\t\tlabel={ selectLabel }\n\t\t\thideLabelFromVision={ false }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChangeSpacingSize }\n\t\t\toptions={ formatSizesAsOptions( sizes ) }\n\t\t/>\n\t);\n}\n\nexport default DimensionControl;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,IAAI,MAAM,SAAS;AAC1B,OAAOC,aAAa,MAAM,mBAAmB;AAC7C,OAAOC,UAAU,IAAIC,cAAc,QAAQ,SAAS;AAIpD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgBA,CAAEC,KAA4B,EAAG;EAChE,MAAM;IACLC,qBAAqB,GAAG,KAAK;IAC7BC,KAAK;IACLC,KAAK;IACLC,KAAK,GAAGP,UAAU;IAClBQ,IAAI;IACJC,QAAQ;IACRC,SAAS,GAAG;EACb,CAAC,GAAGP,KAAK;EAET,MAAMQ,mBAAoE,GACvEC,GAAG,IAAM;IACV,MAAMC,OAAO,GAAGZ,cAAc,CAAEM,KAAK,EAAEK,GAAI,CAAC;IAE5C,IAAK,CAAEC,OAAO,IAAIP,KAAK,KAAKO,OAAO,CAACC,IAAI,EAAG;MAC1CL,QAAQ,GAAIM,SAAU,CAAC;IACxB,CAAC,MAAM,IAAK,OAAON,QAAQ,KAAK,UAAU,EAAG;MAC5CA,QAAQ,CAAEI,OAAO,CAACC,IAAK,CAAC;IACzB;EACD,CAAC;EAEF,MAAME,oBAAoB,GAAKC,QAAgB,IAAM;IACpD,MAAMC,OAAO,GAAGD,QAAQ,CAACE,GAAG,CAAE,CAAE;MAAEC,IAAI;MAAEN;IAAK,CAAC,MAAQ;MACrDT,KAAK,EAAEe,IAAI;MACXd,KAAK,EAAEQ;IACR,CAAC,CAAG,CAAC;IAEL,OAAO,CACN;MACCT,KAAK,EAAER,EAAE,CAAE,SAAU,CAAC;MACtBS,KAAK,EAAE;IACR,CAAC,EACD,GAAGY,OAAO,CACV;EACF,CAAC;EAED,MAAMG,WAAW,GAChBC,aAAA,CAAAC,QAAA,QACGf,IAAI,IAAIc,aAAA,CAACxB,IAAI;IAACU,IAAI,EAAGA;EAAM,CAAE,CAAC,EAC9BH,KACD,CACF;EAED,OACCiB,aAAA,CAACvB,aAAa;IACbK,qBAAqB,EAAGA,qBAAuB;IAC/CM,SAAS,EAAGd,UAAU,CACrBc,SAAS,EACT,gCACD,CAAG;IACHL,KAAK,EAAGgB,WAAa;IACrBG,mBAAmB,EAAG,KAAO;IAC7BlB,KAAK,EAAGA,KAAO;IACfG,QAAQ,EAAGE,mBAAqB;IAChCO,OAAO,EAAGF,oBAAoB,CAAET,KAAM;EAAG,CACzC,CAAC;AAEJ;AAEA,eAAeL,gBAAgB"}

package/build-module/dimension-control/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/dimension-control/types.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { IconType } from '../icon';\n\nexport type Size = {\n\t/**\n\t * Human-readable name of the size.\n\t */\n\tname: string;\n\t/**\n\t * Short unique identifying name of the size.\n\t */\n\tslug: string;\n};\n\nexport type DimensionControlProps = {\n\t/**\n\t * Label for the control.\n\t */\n\tlabel: string;\n\t/**\n\t * An array of sizes to choose from.\n\t *\n\t * @default DEFAULT_SIZES\n\t *\n\t * @see packages/components/src/dimension-control/sizes.ts\n\t */\n\tsizes?: Size[];\n\t/**\n\t * Optional icon rendered in front on the label.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Used to externally control the current value of the control.\n\t */\n\tvalue?: string;\n\t/**\n\t * Function called with the control's internal state changes. The `value` property is equal to a given size slug.\n\t */\n\tonChange?: ( value?: string ) => void;\n\t/**\n\t * CSS class applied to `SelectControl`.\n\t *\n\t * @default ''\n\t */\n\tclassName?: string;\n};\n"],"mappings":""}
+{"version":3,"names":[],"sources":["@wordpress/components/src/dimension-control/types.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport type { IconType } from '../icon';\n\nexport type Size = {\n\t/**\n\t * Human-readable name of the size.\n\t */\n\tname: string;\n\t/**\n\t * Short unique identifying name of the size.\n\t */\n\tslug: string;\n};\n\nexport type DimensionControlProps = {\n\t/**\n\t * Label for the control.\n\t */\n\tlabel: string;\n\t/**\n\t * An array of sizes to choose from.\n\t *\n\t * @default DEFAULT_SIZES\n\t *\n\t * @see packages/components/src/dimension-control/sizes.ts\n\t */\n\tsizes?: Size[];\n\t/**\n\t * Optional icon rendered in front on the label.\n\t */\n\ticon?: IconType;\n\t/**\n\t * Used to externally control the current value of the control.\n\t */\n\tvalue?: string;\n\t/**\n\t * Function called with the control's internal state changes. The `value` property is equal to a given size slug.\n\t */\n\tonChange?: ( value?: string ) => void;\n\t/**\n\t * CSS class applied to `SelectControl`.\n\t *\n\t * @default ''\n\t */\n\tclassName?: string;\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n};\n"],"mappings":""}

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

@@ -2,189 +2,236 @@ import { createElement, Fragment } from "react";
 /**
  * External dependencies
  */
-import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+// eslint-disable-next-line no-restricted-imports
+import * as Ariakit from '@ariakit/react';
 
 /**
  * WordPress dependencies
  */
-import { forwardRef, createContext, useContext, useMemo } from '@wordpress/element';
+import { forwardRef, createContext, useContext, useMemo, cloneElement, isValidElement, useCallback } from '@wordpress/element';
 import { isRTL } from '@wordpress/i18n';
-import { check, chevronRightSmall, lineSolid } from '@wordpress/icons';
+import { check, chevronRightSmall } from '@wordpress/icons';
 import { SVG, Circle } from '@wordpress/primitives';
 
 /**
  * Internal dependencies
  */
-import { useContextSystem, contextConnectWithoutRef } from '../context';
-import { useSlot } from '../slot-fill';
+import { useContextSystem, contextConnect } from '../context';
 import Icon from '../icon';
-import { SLOT_NAME as POPOVER_DEFAULT_SLOT_NAME } from '../popover';
-import * as DropdownMenuStyled from './styles';
-// Menu content's side padding + 4px
-const SUB_MENU_OFFSET_SIDE = 16;
-// Opposite amount of the top padding of the menu item
-const SUB_MENU_OFFSET_ALIGN = -8;
-const DropdownMenuPrivateContext = createContext({
-  variant: undefined,
-  portalContainer: null
-});
-const UnconnectedDropdownMenu = props => {
-  const {
-    // Root props
-    defaultOpen,
-    open,
-    onOpenChange,
-    modal = true,
-    // Content positioning props
-    side = 'bottom',
-    sideOffset = 0,
-    align = 'center',
-    alignOffset = 0,
-    // Render props
-    children,
-    trigger,
-    // From internal components context
-    variant
-  } = useContextSystem(props, 'DropdownMenu');
-
-  // Render the portal in the default slot used by the legacy Popover component.
-  const slot = useSlot(POPOVER_DEFAULT_SLOT_NAME);
-  const portalContainer = slot.ref?.current;
-  const privateContextValue = useMemo(() => ({
-    variant,
-    portalContainer
-  }), [variant, portalContainer]);
-  return createElement(DropdownMenuPrimitive.Root, {
-    defaultOpen: defaultOpen,
-    open: open,
-    onOpenChange: onOpenChange,
-    modal: modal,
-    dir: isRTL() ? 'rtl' : 'ltr'
-  }, createElement(DropdownMenuPrimitive.Trigger, {
-    asChild: true
-  }, trigger), createElement(DropdownMenuPrimitive.Portal, {
-    container: portalContainer
-  }, createElement(DropdownMenuStyled.Content, {
-    side: side,
-    align: align,
-    sideOffset: sideOffset,
-    alignOffset: alignOffset,
-    loop: true,
-    variant: variant
-  }, 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.
- */
-export const DropdownMenu = contextConnectWithoutRef(UnconnectedDropdownMenu, 'DropdownMenu');
-export const DropdownSubMenuTrigger = ({
-  prefix,
-  suffix = createElement(DropdownMenuStyled.SubmenuRtlChevronIcon, {
-    icon: chevronRightSmall,
-    size: 24
-  }),
-  children
-}) => {
-  return createElement(Fragment, null, prefix && createElement(DropdownMenuStyled.ItemPrefixWrapper, null, prefix), children, suffix && createElement(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
-};
-export const DropdownSubMenu = ({
-  // Sub props
-  defaultOpen,
-  open,
-  onOpenChange,
-  // Sub trigger props
-  disabled,
-  textValue,
-  // Render props
-  children,
-  trigger
-}) => {
-  const {
-    variant,
-    portalContainer
-  } = useContext(DropdownMenuPrivateContext);
-  return createElement(DropdownMenuPrimitive.Sub, {
-    defaultOpen: defaultOpen,
-    open: open,
-    onOpenChange: onOpenChange
-  }, createElement(DropdownMenuStyled.SubTrigger, {
-    disabled: disabled,
-    textValue: textValue
-  }, trigger), createElement(DropdownMenuPrimitive.Portal, {
-    container: portalContainer
-  }, createElement(DropdownMenuStyled.SubContent, {
-    loop: true,
-    sideOffset: SUB_MENU_OFFSET_SIDE,
-    alignOffset: SUB_MENU_OFFSET_ALIGN,
-    variant: variant
-  }, children)));
-};
-export const DropdownMenuLabel = props => createElement(DropdownMenuStyled.Label, {
-  ...props
-});
-export const DropdownMenuGroup = props => createElement(DropdownMenuPrimitive.Group, {
-  ...props
-});
-export const DropdownMenuItem = forwardRef(({
-  children,
+import * as Styled from './styles';
+export const DropdownMenuContext = createContext(undefined);
+export const DropdownMenuItem = forwardRef(function DropdownMenuItem({
   prefix,
   suffix,
+  children,
+  hideOnClick = true,
   ...props
-}, forwardedRef) => {
-  return createElement(DropdownMenuStyled.Item, {
+}, ref) {
+  const dropdownMenuContext = useContext(DropdownMenuContext);
+  return createElement(Styled.DropdownMenuItem, {
+    ref: ref,
     ...props,
-    ref: forwardedRef
-  }, prefix && createElement(DropdownMenuStyled.ItemPrefixWrapper, null, prefix), children, suffix && createElement(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
+    accessibleWhenDisabled: true,
+    hideOnClick: hideOnClick,
+    store: dropdownMenuContext?.store
+  }, createElement(Styled.ItemPrefixWrapper, null, prefix), createElement(Styled.DropdownMenuItemContentWrapper, null, createElement(Styled.DropdownMenuItemChildrenWrapper, null, children), suffix && createElement(Styled.ItemSuffixWrapper, null, suffix)));
 });
-export const DropdownMenuCheckboxItem = ({
-  children,
-  checked = false,
+export const DropdownMenuCheckboxItem = forwardRef(function DropdownMenuCheckboxItem({
   suffix,
+  children,
+  hideOnClick = false,
   ...props
-}) => {
-  return createElement(DropdownMenuStyled.CheckboxItem, {
+}, ref) {
+  const dropdownMenuContext = useContext(DropdownMenuContext);
+  return createElement(Styled.DropdownMenuCheckboxItem, {
+    ref: ref,
     ...props,
-    checked: checked
-  }, createElement(DropdownMenuStyled.ItemPrefixWrapper, null, createElement(DropdownMenuStyled.ItemIndicator, null, (checked === 'indeterminate' || checked === true) && createElement(Icon, {
-    icon: checked === 'indeterminate' ? lineSolid : check,
+    accessibleWhenDisabled: true,
+    hideOnClick: hideOnClick,
+    store: dropdownMenuContext?.store
+  }, createElement(Ariakit.MenuItemCheck, {
+    store: dropdownMenuContext?.store,
+    render: createElement(Styled.ItemPrefixWrapper, null)
+    // Override some ariakit inline styles
+    ,
+    style: {
+      width: 'auto',
+      height: 'auto'
+    }
+  }, createElement(Icon, {
+    icon: check,
     size: 24
-  }))), children, suffix && createElement(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
-};
-export const DropdownMenuRadioGroup = props => createElement(DropdownMenuPrimitive.RadioGroup, {
-  ...props
+  })), createElement(Styled.DropdownMenuItemContentWrapper, null, createElement(Styled.DropdownMenuItemChildrenWrapper, null, children), suffix && createElement(Styled.ItemSuffixWrapper, null, suffix)));
 });
-const radioDot = createElement(SVG, {
-  viewBox: "0 0 24 24",
-  xmlns: "http://www.w3.org/2000/svg"
+const radioCheck = createElement(SVG, {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 24 24"
 }, createElement(Circle, {
   cx: 12,
   cy: 12,
-  r: 3,
-  fill: "currentColor"
+  r: 3
 }));
-export const DropdownMenuRadioItem = ({
-  children,
+export const DropdownMenuRadioItem = forwardRef(function DropdownMenuRadioItem({
   suffix,
+  children,
+  hideOnClick = false,
   ...props
-}) => {
-  return createElement(DropdownMenuStyled.RadioItem, {
-    ...props
-  }, createElement(DropdownMenuStyled.ItemPrefixWrapper, null, createElement(DropdownMenuStyled.ItemIndicator, null, createElement(Icon, {
-    icon: radioDot,
-    size: 22
-  }))), children, suffix && createElement(DropdownMenuStyled.ItemSuffixWrapper, null, suffix));
-};
-export const DropdownMenuSeparator = props => {
+}, ref) {
+  const dropdownMenuContext = useContext(DropdownMenuContext);
+  return createElement(Styled.DropdownMenuRadioItem, {
+    ref: ref,
+    ...props,
+    accessibleWhenDisabled: true,
+    hideOnClick: hideOnClick,
+    store: dropdownMenuContext?.store
+  }, createElement(Ariakit.MenuItemCheck, {
+    store: dropdownMenuContext?.store,
+    render: createElement(Styled.ItemPrefixWrapper, null)
+    // Override some ariakit inline styles
+    ,
+    style: {
+      width: 'auto',
+      height: 'auto'
+    }
+  }, createElement(Icon, {
+    icon: radioCheck,
+    size: 24
+  })), createElement(Styled.DropdownMenuItemContentWrapper, null, createElement(Styled.DropdownMenuItemChildrenWrapper, null, children), suffix && createElement(Styled.ItemSuffixWrapper, null, suffix)));
+});
+export const DropdownMenuGroup = forwardRef(function DropdownMenuGroup(props, ref) {
+  const dropdownMenuContext = useContext(DropdownMenuContext);
+  return createElement(Styled.DropdownMenuGroup, {
+    ref: ref,
+    ...props,
+    store: dropdownMenuContext?.store
+  });
+});
+const UnconnectedDropdownMenu = (props, ref) => {
+  var _props$placement;
   const {
+    // Store props
+    open,
+    defaultOpen = false,
+    onOpenChange,
+    placement,
+    // Menu trigger props
+    trigger,
+    // Menu props
+    gutter,
+    children,
+    shift,
+    modal = true,
+    // From internal components context
+    variant,
+    // Rest
+    ...otherProps
+  } = useContextSystem(props, 'DropdownMenu');
+  const parentContext = useContext(DropdownMenuContext);
+  const computedDirection = isRTL() ? 'rtl' : 'ltr';
+
+  // If an explicit value for the `placement` prop is not passed,
+  // apply a default placement of `bottom-start` for the root dropdown,
+  // and of `right-start` for nested dropdowns.
+  let computedPlacement = (_props$placement = props.placement) !== null && _props$placement !== void 0 ? _props$placement : parentContext?.store ? 'right-start' : 'bottom-start';
+  // Swap left/right in case of RTL direction
+  if (computedDirection === 'rtl') {
+    if (/right/.test(computedPlacement)) {
+      computedPlacement = computedPlacement.replace('right', 'left');
+    } else if (/left/.test(computedPlacement)) {
+      computedPlacement = computedPlacement.replace('left', 'right');
+    }
+  }
+  const dropdownMenuStore = Ariakit.useMenuStore({
+    parent: parentContext?.store,
+    open,
+    defaultOpen,
+    placement: computedPlacement,
+    focusLoop: true,
+    setOpen(willBeOpen) {
+      onOpenChange?.(willBeOpen);
+    },
+    rtl: computedDirection === 'rtl'
+  });
+  const contextValue = useMemo(() => ({
+    store: dropdownMenuStore,
     variant
-  } = useContext(DropdownMenuPrivateContext);
-  return createElement(DropdownMenuStyled.Separator, {
+  }), [dropdownMenuStore, variant]);
+
+  // Extract the side from the applied placement — useful for animations.
+  const appliedPlacementSide = dropdownMenuStore.useState('placement').split('-')[0];
+  if (dropdownMenuStore.parent && !(isValidElement(trigger) && DropdownMenuItem === trigger.type)) {
+    // eslint-disable-next-line no-console
+    console.warn('For nested DropdownMenus, the `trigger` should always be a `DropdownMenuItem`.');
+  }
+  const hideOnEscape = useCallback(event => {
+    // Pressing Escape can cause unexpected consequences (ie. exiting
+    // full screen mode on MacOs, close parent modals...).
+    event.preventDefault();
+    // Returning `true` causes the menu to hide.
+    return true;
+  }, []);
+  const wrapperProps = useMemo(() => ({
+    dir: computedDirection,
+    style: {
+      direction: computedDirection
+    }
+  }), [computedDirection]);
+  return createElement(Fragment, null, createElement(Ariakit.MenuButton, {
+    ref: ref,
+    store: dropdownMenuStore,
+    render: dropdownMenuStore.parent ? cloneElement(trigger, {
+      // Add submenu arrow, unless a `suffix` is explicitly specified
+      suffix: createElement(Fragment, null, trigger.props.suffix, createElement(Styled.SubmenuChevronIcon, {
+        "aria-hidden": "true",
+        icon: chevronRightSmall,
+        size: 24,
+        preserveAspectRatio: "xMidYMid slice"
+      }))
+    }) : trigger
+  }), createElement(Styled.DropdownMenu, {
+    ...otherProps,
+    modal: modal,
+    store: dropdownMenuStore
+    // Root menu has an 8px distance from its trigger,
+    // otherwise 0 (which causes the submenu to slightly overlap)
+    ,
+    gutter: gutter !== null && gutter !== void 0 ? gutter : dropdownMenuStore.parent ? 0 : 8
+    // Align nested menu by the same (but opposite) amount
+    // as the menu container's padding.
+    ,
+    shift: shift !== null && shift !== void 0 ? shift : dropdownMenuStore.parent ? -4 : 0,
+    hideOnHoverOutside: false,
+    "data-side": appliedPlacementSide,
+    variant: variant,
+    wrapperProps: wrapperProps,
+    hideOnEscape: hideOnEscape,
+    unmountOnHide: true
+  }, createElement(DropdownMenuContext.Provider, {
+    value: contextValue
+  }, children)));
+};
+export const DropdownMenu = contextConnect(UnconnectedDropdownMenu, 'DropdownMenu');
+export const DropdownMenuSeparator = forwardRef(function DropdownMenuSeparator(props, ref) {
+  const dropdownMenuContext = useContext(DropdownMenuContext);
+  return createElement(Styled.DropdownMenuSeparator, {
+    ref: ref,
     ...props,
-    variant: variant
+    store: dropdownMenuContext?.store,
+    variant: dropdownMenuContext?.variant
   });
-};
+});
+export const DropdownMenuItemLabel = forwardRef(function DropdownMenuItemLabel(props, ref) {
+  return createElement(Styled.DropdownMenuItemLabel, {
+    numberOfLines: 1,
+    ref: ref,
+    ...props
+  });
+});
+export const DropdownMenuItemHelpText = forwardRef(function DropdownMenuItemHelpText(props, ref) {
+  return createElement(Styled.DropdownMenuItemHelpText, {
+    numberOfLines: 2,
+    ref: ref,
+    ...props
+  });
+});
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["DropdownMenuPrimitive","forwardRef","createContext","useContext","useMemo","isRTL","check","chevronRightSmall","lineSolid","SVG","Circle","useContextSystem","contextConnectWithoutRef","useSlot","Icon","SLOT_NAME","POPOVER_DEFAULT_SLOT_NAME","DropdownMenuStyled","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","ref","current","privateContextValue","createElement","Root","dir","Trigger","asChild","Portal","container","Content","loop","Provider","value","DropdownMenu","DropdownSubMenuTrigger","prefix","suffix","SubmenuRtlChevronIcon","icon","size","Fragment","ItemPrefixWrapper","ItemSuffixWrapper","DropdownSubMenu","disabled","textValue","Sub","SubTrigger","SubContent","DropdownMenuLabel","Label","DropdownMenuGroup","Group","DropdownMenuItem","forwardedRef","Item","DropdownMenuCheckboxItem","checked","CheckboxItem","ItemIndicator","DropdownMenuRadioGroup","RadioGroup","radioDot","viewBox","xmlns","cx","cy","r","fill","DropdownMenuRadioItem","RadioItem","DropdownMenuSeparator","Separator"],"sources":["@wordpress/components/src/dropdown-menu-v2/index.tsx"],"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 '../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"],"mappings":"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"}
+{"version":3,"names":["Ariakit","forwardRef","createContext","useContext","useMemo","cloneElement","isValidElement","useCallback","isRTL","check","chevronRightSmall","SVG","Circle","useContextSystem","contextConnect","Icon","Styled","DropdownMenuContext","undefined","DropdownMenuItem","prefix","suffix","children","hideOnClick","props","ref","dropdownMenuContext","createElement","accessibleWhenDisabled","store","ItemPrefixWrapper","DropdownMenuItemContentWrapper","DropdownMenuItemChildrenWrapper","ItemSuffixWrapper","DropdownMenuCheckboxItem","MenuItemCheck","render","style","width","height","icon","size","radioCheck","xmlns","viewBox","cx","cy","r","DropdownMenuRadioItem","DropdownMenuGroup","UnconnectedDropdownMenu","_props$placement","open","defaultOpen","onOpenChange","placement","trigger","gutter","shift","modal","variant","otherProps","parentContext","computedDirection","computedPlacement","test","replace","dropdownMenuStore","useMenuStore","parent","focusLoop","setOpen","willBeOpen","rtl","contextValue","appliedPlacementSide","useState","split","type","console","warn","hideOnEscape","event","preventDefault","wrapperProps","dir","direction","Fragment","MenuButton","SubmenuChevronIcon","preserveAspectRatio","DropdownMenu","hideOnHoverOutside","unmountOnHide","Provider","value","DropdownMenuSeparator","DropdownMenuItemLabel","numberOfLines","DropdownMenuItemHelpText"],"sources":["@wordpress/components/src/dropdown-menu-v2/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tforwardRef,\n\tcreateContext,\n\tuseContext,\n\tuseMemo,\n\tcloneElement,\n\tisValidElement,\n\tuseCallback,\n} from '@wordpress/element';\nimport { isRTL } from '@wordpress/i18n';\nimport { check, chevronRightSmall } from '@wordpress/icons';\nimport { SVG, Circle } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem, contextConnect } from '../context';\nimport type { WordPressComponentProps } from '../context';\nimport Icon from '../icon';\nimport type {\n\tDropdownMenuContext as DropdownMenuContextType,\n\tDropdownMenuProps,\n\tDropdownMenuGroupProps,\n\tDropdownMenuItemProps,\n\tDropdownMenuCheckboxItemProps,\n\tDropdownMenuRadioItemProps,\n\tDropdownMenuSeparatorProps,\n} from './types';\nimport * as Styled from './styles';\n\nexport const DropdownMenuContext = createContext<\n\tDropdownMenuContextType | undefined\n>( undefined );\n\nexport const DropdownMenuItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuItemProps, 'div', false >\n>( function DropdownMenuItem(\n\t{ prefix, suffix, children, hideOnClick = true, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Styled.ItemPrefixWrapper>{ prefix }</Styled.ItemPrefixWrapper>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuItem>\n\t);\n} );\n\nexport const DropdownMenuCheckboxItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuCheckboxItemProps, 'div', false >\n>( function DropdownMenuCheckboxItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuCheckboxItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ check } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuCheckboxItem>\n\t);\n} );\n\nconst radioCheck = (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Circle cx={ 12 } cy={ 12 } r={ 3 }></Circle>\n\t</SVG>\n);\n\nexport const DropdownMenuRadioItem = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuRadioItemProps, 'div', false >\n>( function DropdownMenuRadioItem(\n\t{ suffix, children, hideOnClick = false, ...props },\n\tref\n) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\n\treturn (\n\t\t<Styled.DropdownMenuRadioItem\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\taccessibleWhenDisabled\n\t\t\thideOnClick={ hideOnClick }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t>\n\t\t\t<Ariakit.MenuItemCheck\n\t\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\t\trender={ <Styled.ItemPrefixWrapper /> }\n\t\t\t\t// Override some ariakit inline styles\n\t\t\t\tstyle={ { width: 'auto', height: 'auto' } }\n\t\t\t>\n\t\t\t\t<Icon icon={ radioCheck } size={ 24 } />\n\t\t\t</Ariakit.MenuItemCheck>\n\n\t\t\t<Styled.DropdownMenuItemContentWrapper>\n\t\t\t\t<Styled.DropdownMenuItemChildrenWrapper>\n\t\t\t\t\t{ children }\n\t\t\t\t</Styled.DropdownMenuItemChildrenWrapper>\n\n\t\t\t\t{ suffix && (\n\t\t\t\t\t<Styled.ItemSuffixWrapper>\n\t\t\t\t\t\t{ suffix }\n\t\t\t\t\t</Styled.ItemSuffixWrapper>\n\t\t\t\t) }\n\t\t\t</Styled.DropdownMenuItemContentWrapper>\n\t\t</Styled.DropdownMenuRadioItem>\n\t);\n} );\n\nexport const DropdownMenuGroup = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< DropdownMenuGroupProps, 'div', false >\n>( function DropdownMenuGroup( props, ref ) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\treturn (\n\t\t<Styled.DropdownMenuGroup\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t/>\n\t);\n} );\n\nconst UnconnectedDropdownMenu = (\n\tprops: WordPressComponentProps< DropdownMenuProps, 'div', false >,\n\tref: React.ForwardedRef< HTMLDivElement >\n) => {\n\tconst {\n\t\t// Store props\n\t\topen,\n\t\tdefaultOpen = false,\n\t\tonOpenChange,\n\t\tplacement,\n\n\t\t// Menu trigger props\n\t\ttrigger,\n\n\t\t// Menu props\n\t\tgutter,\n\t\tchildren,\n\t\tshift,\n\t\tmodal = true,\n\n\t\t// From internal components context\n\t\tvariant,\n\n\t\t// Rest\n\t\t...otherProps\n\t} = useContextSystem<\n\t\ttypeof props & Pick< DropdownMenuContextType, 'variant' >\n\t>( props, 'DropdownMenu' );\n\n\tconst parentContext = useContext( DropdownMenuContext );\n\n\tconst computedDirection = isRTL() ? 'rtl' : 'ltr';\n\n\t// If an explicit value for the `placement` prop is not passed,\n\t// apply a default placement of `bottom-start` for the root dropdown,\n\t// and of `right-start` for nested dropdowns.\n\tlet computedPlacement =\n\t\tprops.placement ??\n\t\t( parentContext?.store ? 'right-start' : 'bottom-start' );\n\t// Swap left/right in case of RTL direction\n\tif ( computedDirection === 'rtl' ) {\n\t\tif ( /right/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'right',\n\t\t\t\t'left'\n\t\t\t) as typeof computedPlacement;\n\t\t} else if ( /left/.test( computedPlacement ) ) {\n\t\t\tcomputedPlacement = computedPlacement.replace(\n\t\t\t\t'left',\n\t\t\t\t'right'\n\t\t\t) as typeof computedPlacement;\n\t\t}\n\t}\n\n\tconst dropdownMenuStore = Ariakit.useMenuStore( {\n\t\tparent: parentContext?.store,\n\t\topen,\n\t\tdefaultOpen,\n\t\tplacement: computedPlacement,\n\t\tfocusLoop: true,\n\t\tsetOpen( willBeOpen ) {\n\t\t\tonOpenChange?.( willBeOpen );\n\t\t},\n\t\trtl: computedDirection === 'rtl',\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( { store: dropdownMenuStore, variant } ),\n\t\t[ dropdownMenuStore, variant ]\n\t);\n\n\t// Extract the side from the applied placement — useful for animations.\n\tconst appliedPlacementSide = dropdownMenuStore\n\t\t.useState( 'placement' )\n\t\t.split( '-' )[ 0 ];\n\n\tif (\n\t\tdropdownMenuStore.parent &&\n\t\t! ( isValidElement( trigger ) && DropdownMenuItem === trigger.type )\n\t) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t'For nested DropdownMenus, the `trigger` should always be a `DropdownMenuItem`.'\n\t\t);\n\t}\n\n\tconst hideOnEscape = useCallback(\n\t\t( event: React.KeyboardEvent< Element > ) => {\n\t\t\t// Pressing Escape can cause unexpected consequences (ie. exiting\n\t\t\t// full screen mode on MacOs, close parent modals...).\n\t\t\tevent.preventDefault();\n\t\t\t// Returning `true` causes the menu to hide.\n\t\t\treturn true;\n\t\t},\n\t\t[]\n\t);\n\n\tconst wrapperProps = useMemo(\n\t\t() => ( {\n\t\t\tdir: computedDirection,\n\t\t\tstyle: {\n\t\t\t\tdirection:\n\t\t\t\t\tcomputedDirection as React.CSSProperties[ 'direction' ],\n\t\t\t},\n\t\t} ),\n\t\t[ computedDirection ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ /* Menu trigger */ }\n\t\t\t<Ariakit.MenuButton\n\t\t\t\tref={ ref }\n\t\t\t\tstore={ dropdownMenuStore }\n\t\t\t\trender={\n\t\t\t\t\tdropdownMenuStore.parent\n\t\t\t\t\t\t? cloneElement( trigger, {\n\t\t\t\t\t\t\t\t// Add submenu arrow, unless a `suffix` is explicitly specified\n\t\t\t\t\t\t\t\tsuffix: (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t{ trigger.props.suffix }\n\t\t\t\t\t\t\t\t\t\t<Styled.SubmenuChevronIcon\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ chevronRightSmall }\n\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\tpreserveAspectRatio=\"xMidYMid slice\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t  } )\n\t\t\t\t\t\t: trigger\n\t\t\t\t}\n\t\t\t/>\n\n\t\t\t{ /* Menu popover */ }\n\t\t\t<Styled.DropdownMenu\n\t\t\t\t{ ...otherProps }\n\t\t\t\tmodal={ modal }\n\t\t\t\tstore={ dropdownMenuStore }\n\t\t\t\t// Root menu has an 8px distance from its trigger,\n\t\t\t\t// otherwise 0 (which causes the submenu to slightly overlap)\n\t\t\t\tgutter={ gutter ?? ( dropdownMenuStore.parent ? 0 : 8 ) }\n\t\t\t\t// Align nested menu by the same (but opposite) amount\n\t\t\t\t// as the menu container's padding.\n\t\t\t\tshift={ shift ?? ( dropdownMenuStore.parent ? -4 : 0 ) }\n\t\t\t\thideOnHoverOutside={ false }\n\t\t\t\tdata-side={ appliedPlacementSide }\n\t\t\t\tvariant={ variant }\n\t\t\t\twrapperProps={ wrapperProps }\n\t\t\t\thideOnEscape={ hideOnEscape }\n\t\t\t\tunmountOnHide\n\t\t\t>\n\t\t\t\t<DropdownMenuContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</DropdownMenuContext.Provider>\n\t\t\t</Styled.DropdownMenu>\n\t\t</>\n\t);\n};\nexport const DropdownMenu = contextConnect(\n\tUnconnectedDropdownMenu,\n\t'DropdownMenu'\n);\n\nexport const DropdownMenuSeparator = forwardRef<\n\tHTMLHRElement,\n\tWordPressComponentProps< DropdownMenuSeparatorProps, 'hr', false >\n>( function DropdownMenuSeparator( props, ref ) {\n\tconst dropdownMenuContext = useContext( DropdownMenuContext );\n\treturn (\n\t\t<Styled.DropdownMenuSeparator\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tstore={ dropdownMenuContext?.store }\n\t\t\tvariant={ dropdownMenuContext?.variant }\n\t\t/>\n\t);\n} );\n\nexport const DropdownMenuItemLabel = forwardRef<\n\tHTMLSpanElement,\n\tWordPressComponentProps< { children: React.ReactNode }, 'span', true >\n>( function DropdownMenuItemLabel( props, ref ) {\n\treturn (\n\t\t<Styled.DropdownMenuItemLabel\n\t\t\tnumberOfLines={ 1 }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n} );\n\nexport const DropdownMenuItemHelpText = forwardRef<\n\tHTMLSpanElement,\n\tWordPressComponentProps< { children: React.ReactNode }, 'span', true >\n>( function DropdownMenuItemHelpText( props, ref ) {\n\treturn (\n\t\t<Styled.DropdownMenuItemHelpText\n\t\t\tnumberOfLines={ 2 }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n} );\n"],"mappings":"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"}