@wordpress/components 29.13.1-next.719a03cbe.0 → 30.1.1-next.46f643fa0.0

package/build/validated-form-controls/components/textarea-control.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ValidatedTextareaControl = void 0;
+var _element = require("@wordpress/element");
+var _compose = require("@wordpress/compose");
+var _controlWithError = require("../control-with-error");
+var _textareaControl = _interopRequireDefault(require("../../textarea-control"));
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+const UnforwardedValidatedTextareaControl = ({
+  required,
+  customValidator,
+  onChange,
+  markWhenOptional,
+  ...restProps
+}, forwardedRef) => {
+  const validityTargetRef = (0, _element.useRef)(null);
+  const mergedRefs = (0, _compose.useMergeRefs)([forwardedRef, validityTargetRef]);
+  const valueRef = (0, _element.useRef)(restProps.value);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_controlWithError.ControlWithError, {
+    required: required,
+    markWhenOptional: markWhenOptional,
+    customValidator: () => {
+      return customValidator?.(valueRef.current);
+    },
+    getValidityTarget: () => validityTargetRef.current,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_textareaControl.default, {
+      __nextHasNoMarginBottom: true,
+      ref: mergedRefs,
+      onChange: value => {
+        valueRef.current = value;
+        onChange?.(value);
+      },
+      ...restProps
+    })
+  });
+};
+const ValidatedTextareaControl = exports.ValidatedTextareaControl = (0, _element.forwardRef)(UnforwardedValidatedTextareaControl);
+//# sourceMappingURL=textarea-control.js.map

package/build/validated-form-controls/components/textarea-control.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_element","require","_compose","_controlWithError","_textareaControl","_interopRequireDefault","_jsxRuntime","UnforwardedValidatedTextareaControl","required","customValidator","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","useRef","mergedRefs","useMergeRefs","valueRef","value","jsx","ControlWithError","current","getValidityTarget","children","default","__nextHasNoMarginBottom","ref","ValidatedTextareaControl","exports","forwardRef"],"sources":["@wordpress/components/src/validated-form-controls/components/textarea-control.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport type { ValidatedControlProps } from './types';\nimport TextareaControl from '../../textarea-control';\nimport type { TextareaControlProps } from '../../textarea-control/types';\n\ntype Value = TextareaControlProps[ 'value' ];\n\nconst UnforwardedValidatedTextareaControl = (\n\t{\n\t\trequired,\n\t\tcustomValidator,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof TextareaControl >,\n\t\t'__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLTextAreaElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLTextAreaElement >( null );\n\tconst mergedRefs = useMergeRefs( [ forwardedRef, validityTargetRef ] );\n\tconst valueRef = useRef< Value >( restProps.value );\n\n\treturn (\n\t\t<ControlWithError\n\t\t\trequired={ required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidator={ () => {\n\t\t\t\treturn customValidator?.( valueRef.current );\n\t\t\t} }\n\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t>\n\t\t\t<TextareaControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tref={ mergedRefs }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\tonChange?.( value );\n\t\t\t\t} }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t</ControlWithError>\n\t);\n};\n\nexport const ValidatedTextareaControl = forwardRef(\n\tUnforwardedValidatedTextareaControl\n);\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,iBAAA,GAAAF,OAAA;AAEA,IAAAG,gBAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAAqD,IAAAK,WAAA,GAAAL,OAAA;AAXrD;AACA;AACA;;AAIA;AACA;AACA;;AAQA,MAAMM,mCAAmC,GAAGA,CAC3C;EACCC,QAAQ;EACRC,eAAe;EACfC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAuD,KACnD;EACJ,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAyB,IAAK,CAAC;EAC/D,MAAMC,UAAU,GAAG,IAAAC,qBAAY,EAAE,CAAEJ,YAAY,EAAEC,iBAAiB,CAAG,CAAC;EACtE,MAAMI,QAAQ,GAAG,IAAAH,eAAM,EAAWH,SAAS,CAACO,KAAM,CAAC;EAEnD,oBACC,IAAAb,WAAA,CAAAc,GAAA,EAACjB,iBAAA,CAAAkB,gBAAgB;IAChBb,QAAQ,EAAGA,QAAU;IACrBG,gBAAgB,EAAGA,gBAAkB;IACrCF,eAAe,EAAGA,CAAA,KAAM;MACvB,OAAOA,eAAe,GAAIS,QAAQ,CAACI,OAAQ,CAAC;IAC7C,CAAG;IACHC,iBAAiB,EAAGA,CAAA,KAAMT,iBAAiB,CAACQ,OAAS;IAAAE,QAAA,eAErD,IAAAlB,WAAA,CAAAc,GAAA,EAAChB,gBAAA,CAAAqB,OAAe;MACfC,uBAAuB;MACvBC,GAAG,EAAGX,UAAY;MAClBN,QAAQ,EAAKS,KAAK,IAAM;QACvBD,QAAQ,CAACI,OAAO,GAAGH,KAAK;QACxBT,QAAQ,GAAIS,KAAM,CAAC;MACpB,CAAG;MAAA,GACEP;IAAS,CACd;EAAC,CACe,CAAC;AAErB,CAAC;AAEM,MAAMgB,wBAAwB,GAAAC,OAAA,CAAAD,wBAAA,GAAG,IAAAE,mBAAU,EACjDvB,mCACD,CAAC","ignoreList":[]}

package/build/validated-form-controls/components/toggle-control.js

@@ -0,0 +1,60 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ValidatedToggleControl = void 0;
+var _element = require("@wordpress/element");
+var _compose = require("@wordpress/compose");
+var _controlWithError = require("../control-with-error");
+var _toggleControl = _interopRequireDefault(require("../../toggle-control"));
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+// TODO: Should we customize the default `missingValue` message? It says to "check this box".
+
+const UnforwardedValidatedToggleControl = ({
+  required,
+  customValidator,
+  onChange,
+  markWhenOptional,
+  ...restProps
+}, forwardedRef) => {
+  const validityTargetRef = (0, _element.useRef)(null);
+  const mergedRefs = (0, _compose.useMergeRefs)([forwardedRef, validityTargetRef]);
+  const valueRef = (0, _element.useRef)(restProps.checked);
+
+  // TODO: Upstream limitation - The `required` attribute is not passed down to the input,
+  // so we need to set it manually.
+  (0, _element.useEffect)(() => {
+    if (validityTargetRef.current) {
+      validityTargetRef.current.required = required !== null && required !== void 0 ? required : false;
+    }
+  }, [required]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_controlWithError.ControlWithError, {
+    required: required,
+    markWhenOptional: markWhenOptional,
+    customValidator: () => {
+      return customValidator?.(valueRef.current);
+    },
+    getValidityTarget: () => validityTargetRef.current,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_toggleControl.default, {
+      __nextHasNoMarginBottom: true,
+      ref: mergedRefs,
+      onChange: value => {
+        valueRef.current = value;
+        onChange?.(value);
+      },
+      ...restProps
+    })
+  });
+};
+const ValidatedToggleControl = exports.ValidatedToggleControl = (0, _element.forwardRef)(UnforwardedValidatedToggleControl);
+//# sourceMappingURL=toggle-control.js.map

package/build/validated-form-controls/components/toggle-control.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_element","require","_compose","_controlWithError","_toggleControl","_interopRequireDefault","_jsxRuntime","UnforwardedValidatedToggleControl","required","customValidator","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","useRef","mergedRefs","useMergeRefs","valueRef","checked","useEffect","current","jsx","ControlWithError","getValidityTarget","children","default","__nextHasNoMarginBottom","ref","value","ValidatedToggleControl","exports","forwardRef"],"sources":["@wordpress/components/src/validated-form-controls/components/toggle-control.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef, useEffect } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport type { ValidatedControlProps } from './types';\nimport ToggleControl from '../../toggle-control';\nimport type { ToggleControlProps } from '../../toggle-control/types';\n\ntype Value = ToggleControlProps[ 'checked' ];\n\n// TODO: Should we customize the default `missingValue` message? It says to \"check this box\".\n\nconst UnforwardedValidatedToggleControl = (\n\t{\n\t\trequired,\n\t\tcustomValidator,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof ToggleControl >,\n\t\t'__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLInputElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst mergedRefs = useMergeRefs( [ forwardedRef, validityTargetRef ] );\n\tconst valueRef = useRef< Value >( restProps.checked );\n\n\t// TODO: Upstream limitation - The `required` attribute is not passed down to the input,\n\t// so we need to set it manually.\n\tuseEffect( () => {\n\t\tif ( validityTargetRef.current ) {\n\t\t\tvalidityTargetRef.current.required = required ?? false;\n\t\t}\n\t}, [ required ] );\n\n\treturn (\n\t\t<ControlWithError\n\t\t\trequired={ required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidator={ () => {\n\t\t\t\treturn customValidator?.( valueRef.current );\n\t\t\t} }\n\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t>\n\t\t\t<ToggleControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tref={ mergedRefs }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\tonChange?.( value );\n\t\t\t\t} }\n\t\t\t\t{ ...restProps }\n\t\t\t/>\n\t\t</ControlWithError>\n\t);\n};\n\nexport const ValidatedToggleControl = forwardRef(\n\tUnforwardedValidatedToggleControl\n);\n"],"mappings":";;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AACA,IAAAC,QAAA,GAAAD,OAAA;AAKA,IAAAE,iBAAA,GAAAF,OAAA;AAEA,IAAAG,cAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAAiD,IAAAK,WAAA,GAAAL,OAAA;AAXjD;AACA;AACA;;AAIA;AACA;AACA;;AAQA;;AAEA,MAAMM,iCAAiC,GAAGA,CACzC;EACCC,QAAQ;EACRC,eAAe;EACfC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAoD,KAChD;EACJ,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAsB,IAAK,CAAC;EAC5D,MAAMC,UAAU,GAAG,IAAAC,qBAAY,EAAE,CAAEJ,YAAY,EAAEC,iBAAiB,CAAG,CAAC;EACtE,MAAMI,QAAQ,GAAG,IAAAH,eAAM,EAAWH,SAAS,CAACO,OAAQ,CAAC;;EAErD;EACA;EACA,IAAAC,kBAAS,EAAE,MAAM;IAChB,IAAKN,iBAAiB,CAACO,OAAO,EAAG;MAChCP,iBAAiB,CAACO,OAAO,CAACb,QAAQ,GAAGA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAI,KAAK;IACvD;EACD,CAAC,EAAE,CAAEA,QAAQ,CAAG,CAAC;EAEjB,oBACC,IAAAF,WAAA,CAAAgB,GAAA,EAACnB,iBAAA,CAAAoB,gBAAgB;IAChBf,QAAQ,EAAGA,QAAU;IACrBG,gBAAgB,EAAGA,gBAAkB;IACrCF,eAAe,EAAGA,CAAA,KAAM;MACvB,OAAOA,eAAe,GAAIS,QAAQ,CAACG,OAAQ,CAAC;IAC7C,CAAG;IACHG,iBAAiB,EAAGA,CAAA,KAAMV,iBAAiB,CAACO,OAAS;IAAAI,QAAA,eAErD,IAAAnB,WAAA,CAAAgB,GAAA,EAAClB,cAAA,CAAAsB,OAAa;MACbC,uBAAuB;MACvBC,GAAG,EAAGZ,UAAY;MAClBN,QAAQ,EAAKmB,KAAK,IAAM;QACvBX,QAAQ,CAACG,OAAO,GAAGQ,KAAK;QACxBnB,QAAQ,GAAImB,KAAM,CAAC;MACpB,CAAG;MAAA,GACEjB;IAAS,CACd;EAAC,CACe,CAAC;AAErB,CAAC;AAEM,MAAMkB,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,GAAG,IAAAE,mBAAU,EAC/CzB,iCACD,CAAC","ignoreList":[]}

package/build/validated-form-controls/components/toggle-group-control.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ValidatedToggleGroupControl = void 0;
+var _element = require("@wordpress/element");
+var _controlWithError = require("../control-with-error");
+var _toggleGroupControl = require("../../toggle-group-control");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+const UnforwardedValidatedToggleGroupControl = ({
+  required,
+  customValidator,
+  onChange,
+  markWhenOptional,
+  ...restProps
+}, forwardedRef) => {
+  const validityTargetRef = (0, _element.useRef)(null);
+  const valueRef = (0, _element.useRef)(restProps.value);
+  const nameAttr = (0, _element.useId)();
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "components-validated-control__wrapper-with-error-delegate",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_controlWithError.ControlWithError, {
+      required: required,
+      markWhenOptional: markWhenOptional,
+      customValidator: () => {
+        return customValidator?.(valueRef.current);
+      },
+      getValidityTarget: () => validityTargetRef.current,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_toggleGroupControl.ToggleGroupControl, {
+        __nextHasNoMarginBottom: true,
+        __next40pxDefaultSize: true,
+        ref: forwardedRef
+        // TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then
+        // setting a value has a visual bug.
+        ,
+        onChange: value => {
+          valueRef.current = value;
+          onChange?.(value);
+        },
+        ...restProps
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+      className: "components-validated-control__error-delegate",
+      type: "radio",
+      ref: validityTargetRef,
+      required: required,
+      checked: restProps.value !== null,
+      tabIndex: -1
+      // A name attribute is needed for the `required` behavior to work.
+      ,
+      name: nameAttr,
+      onChange: () => {},
+      onFocus: e => {
+        e.target.previousElementSibling?.querySelector('[data-active-item="true"]')?.focus();
+      }
+    })]
+  });
+};
+const ValidatedToggleGroupControl = exports.ValidatedToggleGroupControl = (0, _element.forwardRef)(UnforwardedValidatedToggleGroupControl);
+//# sourceMappingURL=toggle-group-control.js.map

package/build/validated-form-controls/components/toggle-group-control.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_element","require","_controlWithError","_toggleGroupControl","_jsxRuntime","UnforwardedValidatedToggleGroupControl","required","customValidator","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","useRef","valueRef","value","nameAttr","useId","jsxs","className","children","jsx","ControlWithError","current","getValidityTarget","ToggleGroupControl","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","type","checked","tabIndex","name","onFocus","e","target","previousElementSibling","querySelector","focus","ValidatedToggleGroupControl","exports","forwardRef"],"sources":["@wordpress/components/src/validated-form-controls/components/toggle-group-control.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useId, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport type { ValidatedControlProps } from './types';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport type { ToggleGroupControlProps } from '../../toggle-group-control/types';\n\ntype Value = ToggleGroupControlProps[ 'value' ];\n\nconst UnforwardedValidatedToggleGroupControl = (\n\t{\n\t\trequired,\n\t\tcustomValidator,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof ToggleGroupControl >,\n\t\t'__next40pxDefaultSize' | '__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLInputElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst valueRef = useRef< Value >( restProps.value );\n\n\tconst nameAttr = useId();\n\n\treturn (\n\t\t<div className=\"components-validated-control__wrapper-with-error-delegate\">\n\t\t\t<ControlWithError\n\t\t\t\trequired={ required }\n\t\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\t\tcustomValidator={ () => {\n\t\t\t\t\treturn customValidator?.( valueRef.current );\n\t\t\t\t} }\n\t\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t\t>\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\t// TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then\n\t\t\t\t\t// setting a value has a visual bug.\n\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\t\tonChange?.( value );\n\t\t\t\t\t} }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t/>\n\t\t\t</ControlWithError>\n\t\t\t<input\n\t\t\t\tclassName=\"components-validated-control__error-delegate\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tref={ validityTargetRef }\n\t\t\t\trequired={ required }\n\t\t\t\tchecked={ restProps.value !== null }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\t// A name attribute is needed for the `required` behavior to work.\n\t\t\t\tname={ nameAttr }\n\t\t\t\tonChange={ () => {} }\n\t\t\t\tonFocus={ ( e ) => {\n\t\t\t\t\te.target.previousElementSibling\n\t\t\t\t\t\t?.querySelector< HTMLButtonElement | HTMLInputElement >(\n\t\t\t\t\t\t\t'[data-active-item=\"true\"]'\n\t\t\t\t\t\t)\n\t\t\t\t\t\t?.focus();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport const ValidatedToggleGroupControl = forwardRef(\n\tUnforwardedValidatedToggleGroupControl\n);\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,iBAAA,GAAAD,OAAA;AAEA,IAAAE,mBAAA,GAAAF,OAAA;AAAgE,IAAAG,WAAA,GAAAH,OAAA;AAVhE;AACA;AACA;;AAGA;AACA;AACA;;AAQA,MAAMI,sCAAsC,GAAGA,CAC9C;EACCC,QAAQ;EACRC,eAAe;EACfC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAoD,KAChD;EACJ,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAsB,IAAK,CAAC;EAC5D,MAAMC,QAAQ,GAAG,IAAAD,eAAM,EAAWH,SAAS,CAACK,KAAM,CAAC;EAEnD,MAAMC,QAAQ,GAAG,IAAAC,cAAK,EAAC,CAAC;EAExB,oBACC,IAAAb,WAAA,CAAAc,IAAA;IAAKC,SAAS,EAAC,2DAA2D;IAAAC,QAAA,gBACzE,IAAAhB,WAAA,CAAAiB,GAAA,EAACnB,iBAAA,CAAAoB,gBAAgB;MAChBhB,QAAQ,EAAGA,QAAU;MACrBG,gBAAgB,EAAGA,gBAAkB;MACrCF,eAAe,EAAGA,CAAA,KAAM;QACvB,OAAOA,eAAe,GAAIO,QAAQ,CAACS,OAAQ,CAAC;MAC7C,CAAG;MACHC,iBAAiB,EAAGA,CAAA,KAAMZ,iBAAiB,CAACW,OAAS;MAAAH,QAAA,eAErD,IAAAhB,WAAA,CAAAiB,GAAA,EAAClB,mBAAA,CAAAsB,kBAAkB;QAClBC,uBAAuB;QACvBC,qBAAqB;QACrBC,GAAG,EAAGjB;QACN;QACA;QAAA;QACAH,QAAQ,EAAKO,KAAK,IAAM;UACvBD,QAAQ,CAACS,OAAO,GAAGR,KAAK;UACxBP,QAAQ,GAAIO,KAAM,CAAC;QACpB,CAAG;QAAA,GACEL;MAAS,CACd;IAAC,CACe,CAAC,eACnB,IAAAN,WAAA,CAAAiB,GAAA;MACCF,SAAS,EAAC,8CAA8C;MACxDU,IAAI,EAAC,OAAO;MACZD,GAAG,EAAGhB,iBAAmB;MACzBN,QAAQ,EAAGA,QAAU;MACrBwB,OAAO,EAAGpB,SAAS,CAACK,KAAK,KAAK,IAAM;MACpCgB,QAAQ,EAAG,CAAC;MACZ;MAAA;MACAC,IAAI,EAAGhB,QAAU;MACjBR,QAAQ,EAAGA,CAAA,KAAM,CAAC,CAAG;MACrByB,OAAO,EAAKC,CAAC,IAAM;QAClBA,CAAC,CAACC,MAAM,CAACC,sBAAsB,EAC5BC,aAAa,CACd,2BACD,CAAC,EACCC,KAAK,CAAC,CAAC;MACX;IAAG,CACH,CAAC;EAAA,CACE,CAAC;AAER,CAAC;AAEM,MAAMC,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAG,IAAAE,mBAAU,EACpDpC,sCACD,CAAC","ignoreList":[]}

package/build/validated-form-controls/components/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/build/validated-form-controls/components/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["@wordpress/components/src/validated-form-controls/components/types.ts"],"sourcesContent":["export type ValidatedControlProps< V > = {\n\t/**\n\t * Whether the control is required.\n\t * @default false\n\t */\n\trequired?: boolean;\n\t/**\n\t * Label the control as \"optional\" when _not_ `required`, instead of the inverse.\n\t * @default false\n\t */\n\tmarkWhenOptional?: boolean;\n\t/**\n\t * A function that returns a custom validity message when applicable. This error message will be applied to the\n\t * underlying element using the native [`setCustomValidity()` method](https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement/setCustomValidity).\n\t * This means the custom validator will be run _in addition_ to any other HTML attribute-based validation, and\n\t * will be prioritized over any existing validity messages dictated by the HTML attributes.\n\t * An empty string or `undefined` return value will clear any existing custom validity message.\n\t *\n\t * Make sure you don't programatically pass a value (such as an initial value) to the control component\n\t * that fails this validator, because the validator will only run for user-initiated changes.\n\t *\n\t * Always prefer using standard HTML attributes like `required` and `min`/`max` over custom validators\n\t * when possible, as they are simpler and have localized error messages built in.\n\t */\n\t// TODO: Technically, we could add an optional `customValidity` string prop so the consumer can set\n\t// an error message at any point in time. We should wait until we have a use case though.\n\tcustomValidator?: ( currentValue: V ) => string | void;\n};\n"],"mappings":"","ignoreList":[]}

package/build/validated-form-controls/control-with-error.js

@@ -0,0 +1,137 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ControlWithError = void 0;
+var _i18n = require("@wordpress/i18n");
+var _icons = require("@wordpress/icons");
+var _element = require("@wordpress/element");
+var _withIgnoreImeEvents = require("../utils/with-ignore-ime-events");
+var _icon = _interopRequireDefault(require("../icon"));
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * External dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+function appendRequiredIndicator(label, required, markWhenOptional) {
+  if (required && !markWhenOptional) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [label, " ", `(${(0, _i18n.__)('Required')})`]
+    });
+  }
+  if (!required && markWhenOptional) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [label, " ", `(${(0, _i18n.__)('Optional')})`]
+    });
+  }
+  return label;
+}
+
+/**
+ * HTML elements that support the Constraint Validation API.
+ *
+ * Here, we exclude HTMLButtonElement because although it does technically support the API,
+ * normal buttons are actually exempted from any validation.
+ * @see https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Form_validation
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/willValidate
+ */
+
+function UnforwardedControlWithError({
+  required,
+  markWhenOptional,
+  customValidator,
+  getValidityTarget,
+  children
+}, forwardedRef) {
+  const [errorMessage, setErrorMessage] = (0, _element.useState)();
+  const [isTouched, setIsTouched] = (0, _element.useState)(false);
+
+  // Ensure that error messages are visible after user attemps to submit a form
+  // with multiple invalid fields.
+  (0, _element.useEffect)(() => {
+    const validityTarget = getValidityTarget();
+    const showValidationMessage = () => setErrorMessage(validityTarget?.validationMessage);
+    validityTarget?.addEventListener('invalid', showValidationMessage);
+    return () => {
+      validityTarget?.removeEventListener('invalid', showValidationMessage);
+    };
+  });
+  const validate = () => {
+    const message = customValidator?.();
+    const validityTarget = getValidityTarget();
+    validityTarget?.setCustomValidity(message !== null && message !== void 0 ? message : '');
+    setErrorMessage(validityTarget?.validationMessage);
+  };
+  const onBlur = event => {
+    // Only consider "blurred from the component" if focus has fully left the wrapping div.
+    // This prevents unnecessary blurs from components with multiple focusable elements.
+    if (!event.relatedTarget || !event.currentTarget.contains(event.relatedTarget)) {
+      setIsTouched(true);
+      const validityTarget = getValidityTarget();
+
+      // Prevents a double flash of the native error tooltip when the control is already showing one.
+      if (!validityTarget?.validity.valid) {
+        if (!errorMessage) {
+          setErrorMessage(validityTarget?.validationMessage);
+        }
+        return;
+      }
+      validate();
+    }
+  };
+  const onChange = (...args) => {
+    children.props.onChange?.(...args);
+
+    // Only validate incrementally if the field has blurred at least once,
+    // or currently has an error message.
+    if (isTouched || errorMessage) {
+      validate();
+    }
+  };
+  const onKeyDown = event => {
+    // Ensures that custom validators are triggered when the user submits by pressing Enter,
+    // without ever blurring the control.
+    if (event.key === 'Enter') {
+      validate();
+    }
+  };
+  return (
+    /*#__PURE__*/
+    // Disable reason: Just listening to a bubbled event, not for interaction.
+    // eslint-disable-next-line jsx-a11y/no-static-element-interactions
+    (0, _jsxRuntime.jsxs)("div", {
+      className: "components-validated-control",
+      ref: forwardedRef,
+      onBlur: onBlur,
+      onKeyDown: (0, _withIgnoreImeEvents.withIgnoreIMEEvents)(onKeyDown),
+      children: [(0, _element.cloneElement)(children, {
+        label: appendRequiredIndicator(children.props.label, required, markWhenOptional),
+        onChange,
+        required
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        "aria-live": "polite",
+        children: errorMessage && /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
+          className: "components-validated-control__error",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.default, {
+            className: "components-validated-control__error-icon",
+            icon: _icons.error,
+            size: 16,
+            fill: "currentColor"
+          }), errorMessage]
+        })
+      })]
+    })
+  );
+}
+const ControlWithError = exports.ControlWithError = (0, _element.forwardRef)(UnforwardedControlWithError);
+//# sourceMappingURL=control-with-error.js.map

package/build/validated-form-controls/control-with-error.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_i18n","require","_icons","_element","_withIgnoreImeEvents","_icon","_interopRequireDefault","_jsxRuntime","appendRequiredIndicator","label","required","markWhenOptional","jsxs","Fragment","children","__","UnforwardedControlWithError","customValidator","getValidityTarget","forwardedRef","errorMessage","setErrorMessage","useState","isTouched","setIsTouched","useEffect","validityTarget","showValidationMessage","validationMessage","addEventListener","removeEventListener","validate","message","setCustomValidity","onBlur","event","relatedTarget","currentTarget","contains","validity","valid","onChange","args","props","onKeyDown","key","className","ref","withIgnoreIMEEvents","cloneElement","jsx","default","icon","error","size","fill","ControlWithError","exports","forwardRef"],"sources":["@wordpress/components/src/validated-form-controls/control-with-error.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { error } from '@wordpress/icons';\n\n/**\n * External dependencies\n */\nimport {\n\tcloneElement,\n\tforwardRef,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nimport Icon from '../icon';\n\nfunction appendRequiredIndicator(\n\tlabel: React.ReactNode,\n\trequired: boolean | undefined,\n\tmarkWhenOptional: boolean | undefined\n) {\n\tif ( required && ! markWhenOptional ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ label } { `(${ __( 'Required' ) })` }\n\t\t\t</>\n\t\t);\n\t}\n\tif ( ! required && markWhenOptional ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ label } { `(${ __( 'Optional' ) })` }\n\t\t\t</>\n\t\t);\n\t}\n\treturn label;\n}\n\n/**\n * HTML elements that support the Constraint Validation API.\n *\n * Here, we exclude HTMLButtonElement because although it does technically support the API,\n * normal buttons are actually exempted from any validation.\n * @see https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Form_validation\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/willValidate\n */\ntype ValidityTarget =\n\t| HTMLFieldSetElement\n\t| HTMLInputElement\n\t| HTMLSelectElement\n\t| HTMLTextAreaElement;\n\nfunction UnforwardedControlWithError< C extends React.ReactElement >(\n\t{\n\t\trequired,\n\t\tmarkWhenOptional,\n\t\tcustomValidator,\n\t\tgetValidityTarget,\n\t\tchildren,\n\t}: {\n\t\t/**\n\t\t * Whether the control is required.\n\t\t */\n\t\trequired?: boolean;\n\t\t/**\n\t\t * Label the control as \"optional\" when _not_ `required`, instead of the inverse.\n\t\t */\n\t\tmarkWhenOptional?: boolean;\n\t\t/**\n\t\t * A function that returns a custom validity message when applicable.\n\t\t *\n\t\t * This message will be applied to the element returned by `getValidityTarget`.\n\t\t * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement/setCustomValidity\n\t\t */\n\t\tcustomValidator?: () => string | void;\n\t\t/**\n\t\t * A function that returns the actual element on which the validity data should be applied.\n\t\t */\n\t\tgetValidityTarget: () => ValidityTarget | null | undefined;\n\t\t/**\n\t\t * The control component to apply validation to.\n\t\t */\n\t\tchildren: C;\n\t},\n\tforwardedRef: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst [ errorMessage, setErrorMessage ] = useState< string | undefined >();\n\tconst [ isTouched, setIsTouched ] = useState( false );\n\n\t// Ensure that error messages are visible after user attemps to submit a form\n\t// with multiple invalid fields.\n\tuseEffect( () => {\n\t\tconst validityTarget = getValidityTarget();\n\t\tconst showValidationMessage = () =>\n\t\t\tsetErrorMessage( validityTarget?.validationMessage );\n\n\t\tvalidityTarget?.addEventListener( 'invalid', showValidationMessage );\n\n\t\treturn () => {\n\t\t\tvalidityTarget?.removeEventListener(\n\t\t\t\t'invalid',\n\t\t\t\tshowValidationMessage\n\t\t\t);\n\t\t};\n\t} );\n\n\tconst validate = () => {\n\t\tconst message = customValidator?.();\n\t\tconst validityTarget = getValidityTarget();\n\n\t\tvalidityTarget?.setCustomValidity( message ?? '' );\n\t\tsetErrorMessage( validityTarget?.validationMessage );\n\t};\n\n\tconst onBlur = ( event: React.FocusEvent< HTMLDivElement > ) => {\n\t\t// Only consider \"blurred from the component\" if focus has fully left the wrapping div.\n\t\t// This prevents unnecessary blurs from components with multiple focusable elements.\n\t\tif (\n\t\t\t! event.relatedTarget ||\n\t\t\t! event.currentTarget.contains( event.relatedTarget )\n\t\t) {\n\t\t\tsetIsTouched( true );\n\n\t\t\tconst validityTarget = getValidityTarget();\n\n\t\t\t// Prevents a double flash of the native error tooltip when the control is already showing one.\n\t\t\tif ( ! validityTarget?.validity.valid ) {\n\t\t\t\tif ( ! errorMessage ) {\n\t\t\t\t\tsetErrorMessage( validityTarget?.validationMessage );\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tvalidate();\n\t\t}\n\t};\n\n\tconst onChange = ( ...args: unknown[] ) => {\n\t\tchildren.props.onChange?.( ...args );\n\n\t\t// Only validate incrementally if the field has blurred at least once,\n\t\t// or currently has an error message.\n\t\tif ( isTouched || errorMessage ) {\n\t\t\tvalidate();\n\t\t}\n\t};\n\n\tconst onKeyDown = ( event: React.KeyboardEvent< HTMLDivElement > ) => {\n\t\t// Ensures that custom validators are triggered when the user submits by pressing Enter,\n\t\t// without ever blurring the control.\n\t\tif ( event.key === 'Enter' ) {\n\t\t\tvalidate();\n\t\t}\n\t};\n\n\treturn (\n\t\t// Disable reason: Just listening to a bubbled event, not for interaction.\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tclassName=\"components-validated-control\"\n\t\t\tref={ forwardedRef }\n\t\t\tonBlur={ onBlur }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( onKeyDown ) }\n\t\t>\n\t\t\t{ cloneElement( children, {\n\t\t\t\tlabel: appendRequiredIndicator(\n\t\t\t\t\tchildren.props.label,\n\t\t\t\t\trequired,\n\t\t\t\t\tmarkWhenOptional\n\t\t\t\t),\n\t\t\t\tonChange,\n\t\t\t\trequired,\n\t\t\t} ) }\n\t\t\t<div aria-live=\"polite\">\n\t\t\t\t{ errorMessage && (\n\t\t\t\t\t<p className=\"components-validated-control__error\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-validated-control__error-icon\"\n\t\t\t\t\t\t\ticon={ error }\n\t\t\t\t\t\t\tsize={ 16 }\n\t\t\t\t\t\t\tfill=\"currentColor\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ errorMessage }\n\t\t\t\t\t</p>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nexport const ControlWithError = forwardRef( UnforwardedControlWithError );\n"],"mappings":"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","ignoreList":[]}

package/build/validated-form-controls/index.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _components = require("./components");
+Object.keys(_components).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _components[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _components[key];
+    }
+  });
+});
+var _controlWithError = require("./control-with-error");
+Object.keys(_controlWithError).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _controlWithError[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _controlWithError[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/build/validated-form-controls/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_components","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_controlWithError"],"sources":["@wordpress/components/src/validated-form-controls/index.ts"],"sourcesContent":["export * from './components';\nexport * from './control-with-error';\n"],"mappings":";;;;;AAAA,IAAAA,WAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,WAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,WAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,WAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,iBAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,iBAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,iBAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,iBAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/build-module/autocomplete/index.js

@@ -78,6 +78,10 @@ export function useAutocomplete({
     // Reset autocomplete state after insertion rather than before
     // so insertion events don't cause the completion menu to redisplay.
     reset();
+
+    // Make sure that the content remains focused after making a selection
+    // and that the text cursor position is not lost.
+    contentRef.current?.focus();
   }
   function reset() {
     setSelectedIndex(0);

package/build-module/autocomplete/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["removeAccents","renderToString","useEffect","useState","useRef","useMemo","useInstanceId","useMergeRefs","useRefEffect","create","slice","insert","isCollapsed","getTextContent","speak","isAppleOS","getAutoCompleterUI","escapeRegExp","withIgnoreIMEEvents","getNodeText","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","EMPTY_FILTERED_OPTIONS","AUTOCOMPLETE_HOOK_REFERENCE","useAutocomplete","record","onChange","onReplace","completers","contentRef","instanceId","selectedIndex","setSelectedIndex","filteredOptions","setFilteredOptions","filterValue","setFilterValue","autocompleter","setAutocompleter","AutocompleterUI","setAutocompleterUI","backspacingRef","insertCompletion","replacement","end","start","triggerPrefix","length","toInsert","html","select","option","getOptionCompletion","isDisabled","completion","value","isCompletionObject","obj","action","undefined","completionObject","reset","onChangeOptions","options","handleKeyDown","event","current","key","defaultPrevented","newIndex","label","preventDefault","textContent","completer","reduce","lastTrigger","currentCompleter","triggerIndex","lastIndexOf","lastTriggerIndex","allowContext","textWithoutTrigger","tooDistantFromTrigger","mismatch","wordsFromTrigger","split","hasOneTriggerWord","matchingWhileBackspacing","textAfterSelection","test","safeTrigger","text","match","RegExp","query","selectedKey","className","isExpanded","listBoxId","activeId","hasSelection","showPopover","onKeyDown","popover","onSelect","useLastDifferentValue","history","Set","add","size","delete","Array","from","useAutocompleteProps","ref","onKeyDownRef","previousRecord","mergedRefs","element","_onKeyDown","addEventListener","removeEventListener","didUserInput","children","Autocomplete","isSelected","props"],"sources":["@wordpress/components/src/autocomplete/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n\tuseMemo,\n} from '@wordpress/element';\nimport { useInstanceId, useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport {\n\tcreate,\n\tslice,\n\tinsert,\n\tisCollapsed,\n\tgetTextContent,\n} from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { getAutoCompleterUI } from './autocompleter-ui';\nimport { escapeRegExp } from '../utils/strings';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport type {\n\tAutocompleteProps,\n\tAutocompleterUIProps,\n\tInsertOption,\n\tKeyedOption,\n\tOptionCompletion,\n\tReplaceOption,\n\tUseAutocompleteProps,\n\tWPCompleter,\n} from './types';\nimport getNodeText from '../utils/get-node-text';\n\nconst EMPTY_FILTERED_OPTIONS: KeyedOption[] = [];\n\n// Used for generating the instance ID\nconst AUTOCOMPLETE_HOOK_REFERENCE = {};\n\nexport function useAutocomplete( {\n\trecord,\n\tonChange,\n\tonReplace,\n\tcompleters,\n\tcontentRef,\n}: UseAutocompleteProps ) {\n\tconst instanceId = useInstanceId( AUTOCOMPLETE_HOOK_REFERENCE );\n\tconst [ selectedIndex, setSelectedIndex ] = useState( 0 );\n\n\tconst [ filteredOptions, setFilteredOptions ] = useState<\n\t\tArray< KeyedOption >\n\t>( EMPTY_FILTERED_OPTIONS );\n\tconst [ filterValue, setFilterValue ] =\n\t\tuseState< AutocompleterUIProps[ 'filterValue' ] >( '' );\n\tconst [ autocompleter, setAutocompleter ] = useState< WPCompleter | null >(\n\t\tnull\n\t);\n\tconst [ AutocompleterUI, setAutocompleterUI ] = useState<\n\t\t( ( props: AutocompleterUIProps ) => JSX.Element | null ) | null\n\t>( null );\n\n\tconst backspacingRef = useRef( false );\n\n\tfunction insertCompletion( replacement: React.ReactNode ) {\n\t\tif ( autocompleter === null ) {\n\t\t\treturn;\n\t\t}\n\t\tconst end = record.start;\n\t\tconst start =\n\t\t\tend - autocompleter.triggerPrefix.length - filterValue.length;\n\t\tconst toInsert = create( { html: renderToString( replacement ) } );\n\n\t\tonChange( insert( record, toInsert, start, end ) );\n\t}\n\n\tfunction select( option: KeyedOption ) {\n\t\tconst { getOptionCompletion } = autocompleter || {};\n\n\t\tif ( option.isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( getOptionCompletion ) {\n\t\t\tconst completion = getOptionCompletion( option.value, filterValue );\n\n\t\t\tconst isCompletionObject = (\n\t\t\t\tobj: OptionCompletion\n\t\t\t): obj is InsertOption | ReplaceOption => {\n\t\t\t\treturn (\n\t\t\t\t\tobj !== null &&\n\t\t\t\t\ttypeof obj === 'object' &&\n\t\t\t\t\t'action' in obj &&\n\t\t\t\t\tobj.action !== undefined &&\n\t\t\t\t\t'value' in obj &&\n\t\t\t\t\tobj.value !== undefined\n\t\t\t\t);\n\t\t\t};\n\n\t\t\tconst completionObject = isCompletionObject( completion )\n\t\t\t\t? completion\n\t\t\t\t: ( {\n\t\t\t\t\t\taction: 'insert-at-caret',\n\t\t\t\t\t\tvalue: completion,\n\t\t\t\t  } as InsertOption );\n\n\t\t\tif ( 'replace' === completionObject.action ) {\n\t\t\t\tonReplace( [ completionObject.value ] );\n\t\t\t\t// When replacing, the component will unmount, so don't reset\n\t\t\t\t// state (below) on an unmounted component.\n\t\t\t\treturn;\n\t\t\t} else if ( 'insert-at-caret' === completionObject.action ) {\n\t\t\t\tinsertCompletion( completionObject.value );\n\t\t\t}\n\t\t}\n\n\t\t// Reset autocomplete state after insertion rather than before\n\t\t// so insertion events don't cause the completion menu to redisplay.\n\t\treset();\n\t}\n\n\tfunction reset() {\n\t\tsetSelectedIndex( 0 );\n\t\tsetFilteredOptions( EMPTY_FILTERED_OPTIONS );\n\t\tsetFilterValue( '' );\n\t\tsetAutocompleter( null );\n\t\tsetAutocompleterUI( null );\n\t}\n\n\t/**\n\t * Load options for an autocompleter.\n\t *\n\t * @param {Array} options\n\t */\n\tfunction onChangeOptions( options: Array< KeyedOption > ) {\n\t\tsetSelectedIndex(\n\t\t\toptions.length === filteredOptions.length ? selectedIndex : 0\n\t\t);\n\t\tsetFilteredOptions( options );\n\t}\n\n\tfunction handleKeyDown( event: KeyboardEvent ) {\n\t\tbackspacingRef.current = event.key === 'Backspace';\n\n\t\tif ( ! autocompleter ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( filteredOptions.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.key ) {\n\t\t\tcase 'ArrowUp': {\n\t\t\t\tconst newIndex =\n\t\t\t\t\t( selectedIndex === 0\n\t\t\t\t\t\t? filteredOptions.length\n\t\t\t\t\t\t: selectedIndex ) - 1;\n\t\t\t\tsetSelectedIndex( newIndex );\n\t\t\t\t// See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.\n\t\t\t\tif ( isAppleOS() ) {\n\t\t\t\t\tspeak(\n\t\t\t\t\t\tgetNodeText( filteredOptions[ newIndex ].label ),\n\t\t\t\t\t\t'assertive'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tconst newIndex = ( selectedIndex + 1 ) % filteredOptions.length;\n\t\t\t\tsetSelectedIndex( newIndex );\n\t\t\t\tif ( isAppleOS() ) {\n\t\t\t\t\tspeak(\n\t\t\t\t\t\tgetNodeText( filteredOptions[ newIndex ].label ),\n\t\t\t\t\t\t'assertive'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase 'Escape':\n\t\t\t\tsetAutocompleter( null );\n\t\t\t\tsetAutocompleterUI( null );\n\t\t\t\tevent.preventDefault();\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tselect( filteredOptions[ selectedIndex ] );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\t\treset();\n\t\t\t\treturn;\n\n\t\t\tdefault:\n\t\t\t\treturn;\n\t\t}\n\n\t\t// Any handled key should prevent original behavior. This relies on\n\t\t// the early return in the default case.\n\t\tevent.preventDefault();\n\t}\n\n\t// textContent is a primitive (string), memoizing is not strictly necessary\n\t// but this is a preemptive performance improvement, since the autocompleter\n\t// is a potential bottleneck for the editor type metric.\n\tconst textContent = useMemo( () => {\n\t\tif ( isCollapsed( record ) ) {\n\t\t\treturn getTextContent( slice( record, 0 ) );\n\t\t}\n\t\treturn '';\n\t}, [ record ] );\n\n\tuseEffect( () => {\n\t\tif ( ! textContent ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\t// Find the completer with the highest triggerPrefix index in the\n\t\t// textContent.\n\t\tconst completer = completers.reduce< WPCompleter | null >(\n\t\t\t( lastTrigger, currentCompleter ) => {\n\t\t\t\tconst triggerIndex = textContent.lastIndexOf(\n\t\t\t\t\tcurrentCompleter.triggerPrefix\n\t\t\t\t);\n\t\t\t\tconst lastTriggerIndex =\n\t\t\t\t\tlastTrigger !== null\n\t\t\t\t\t\t? textContent.lastIndexOf( lastTrigger.triggerPrefix )\n\t\t\t\t\t\t: -1;\n\n\t\t\t\treturn triggerIndex > lastTriggerIndex\n\t\t\t\t\t? currentCompleter\n\t\t\t\t\t: lastTrigger;\n\t\t\t},\n\t\t\tnull\n\t\t);\n\n\t\tif ( ! completer ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst { allowContext, triggerPrefix } = completer;\n\t\tconst triggerIndex = textContent.lastIndexOf( triggerPrefix );\n\t\tconst textWithoutTrigger = textContent.slice(\n\t\t\ttriggerIndex + triggerPrefix.length\n\t\t);\n\n\t\tconst tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.\n\t\t// This is a final barrier to prevent the effect from completing with\n\t\t// an extremely long string, which causes the editor to slow-down\n\t\t// significantly. This could happen, for example, if `matchingWhileBackspacing`\n\t\t// is true and one of the \"words\" end up being too long. If that's the case,\n\t\t// it will be caught by this guard.\n\t\tif ( tooDistantFromTrigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst mismatch = filteredOptions.length === 0;\n\t\tconst wordsFromTrigger = textWithoutTrigger.split( /\\s/ );\n\t\t// We need to allow the effect to run when not backspacing and if there\n\t\t// was a mismatch. i.e when typing a trigger + the match string or when\n\t\t// clicking in an existing trigger word on the page. We do that if we\n\t\t// detect that we have one word from trigger in the current textual context.\n\t\t//\n\t\t// Ex.: \"Some text @a\" <-- \"@a\" will be detected as the trigger word and\n\t\t// allow the effect to run. It will run until there's a mismatch.\n\t\tconst hasOneTriggerWord = wordsFromTrigger.length === 1;\n\t\t// This is used to allow the effect to run when backspacing and if\n\t\t// \"touching\" a word that \"belongs\" to a trigger. We consider a \"trigger\n\t\t// word\" any word up to the limit of 3 from the trigger character.\n\t\t// Anything beyond that is ignored if there's a mismatch. This allows\n\t\t// us to \"escape\" a mismatch when backspacing, but still imposing some\n\t\t// sane limits.\n\t\t//\n\t\t// Ex: \"Some text @marcelo sekkkk\" <--- \"kkkk\" caused a mismatch, but\n\t\t// if the user presses backspace here, it will show the completion popup again.\n\t\tconst matchingWhileBackspacing =\n\t\t\tbackspacingRef.current && wordsFromTrigger.length <= 3;\n\n\t\tif ( mismatch && ! ( matchingWhileBackspacing || hasOneTriggerWord ) ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst textAfterSelection = getTextContent(\n\t\t\tslice( record, undefined, getTextContent( record ).length )\n\t\t);\n\n\t\tif (\n\t\t\tallowContext &&\n\t\t\t! allowContext(\n\t\t\t\ttextContent.slice( 0, triggerIndex ),\n\t\t\t\ttextAfterSelection\n\t\t\t)\n\t\t) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\t/^\\s/.test( textWithoutTrigger ) ||\n\t\t\t/\\s\\s+$/.test( textWithoutTrigger )\n\t\t) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tif ( ! /[\\u0000-\\uFFFF]*$/.test( textWithoutTrigger ) ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst safeTrigger = escapeRegExp( completer.triggerPrefix );\n\t\tconst text = removeAccents( textContent );\n\t\tconst match = text\n\t\t\t.slice( text.lastIndexOf( completer.triggerPrefix ) )\n\t\t\t.match( new RegExp( `${ safeTrigger }([\\u0000-\\uFFFF]*)$` ) );\n\t\tconst query = match && match[ 1 ];\n\n\t\tsetAutocompleter( completer );\n\t\tsetAutocompleterUI( () =>\n\t\t\tcompleter !== autocompleter\n\t\t\t\t? getAutoCompleterUI( completer )\n\t\t\t\t: AutocompleterUI\n\t\t);\n\t\tsetFilterValue( query === null ? '' : query );\n\t\t// We want to avoid introducing unexpected side effects.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t}, [ textContent ] );\n\n\tconst { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};\n\tconst { className } = autocompleter || {};\n\tconst isExpanded = !! autocompleter && filteredOptions.length > 0;\n\tconst listBoxId = isExpanded\n\t\t? `components-autocomplete-listbox-${ instanceId }`\n\t\t: undefined;\n\tconst activeId = isExpanded\n\t\t? `components-autocomplete-item-${ instanceId }-${ selectedKey }`\n\t\t: null;\n\tconst hasSelection = record.start !== undefined;\n\tconst showPopover = !! textContent && hasSelection && !! AutocompleterUI;\n\n\treturn {\n\t\tlistBoxId,\n\t\tactiveId,\n\t\tonKeyDown: withIgnoreIMEEvents( handleKeyDown ),\n\t\tpopover: showPopover && (\n\t\t\t<AutocompleterUI\n\t\t\t\tclassName={ className }\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tinstanceId={ instanceId }\n\t\t\t\tlistBoxId={ listBoxId }\n\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\tonChangeOptions={ onChangeOptions }\n\t\t\t\tonSelect={ select }\n\t\t\t\tvalue={ record }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\treset={ reset }\n\t\t\t/>\n\t\t),\n\t};\n}\n\nfunction useLastDifferentValue( value: UseAutocompleteProps[ 'record' ] ) {\n\tconst history = useRef< Set< typeof value > >( new Set() );\n\n\thistory.current.add( value );\n\n\t// Keep the history size to 2.\n\tif ( history.current.size > 2 ) {\n\t\thistory.current.delete( Array.from( history.current )[ 0 ] );\n\t}\n\n\treturn Array.from( history.current )[ 0 ];\n}\n\nexport function useAutocompleteProps( options: UseAutocompleteProps ) {\n\tconst ref = useRef< HTMLElement >( null );\n\tconst onKeyDownRef = useRef< ( event: KeyboardEvent ) => void >();\n\tconst { record } = options;\n\tconst previousRecord = useLastDifferentValue( record );\n\tconst { popover, listBoxId, activeId, onKeyDown } = useAutocomplete( {\n\t\t...options,\n\t\tcontentRef: ref,\n\t} );\n\tonKeyDownRef.current = onKeyDown;\n\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tuseRefEffect( ( element: HTMLElement ) => {\n\t\t\tfunction _onKeyDown( event: KeyboardEvent ) {\n\t\t\t\tonKeyDownRef.current?.( event );\n\t\t\t}\n\t\t\telement.addEventListener( 'keydown', _onKeyDown );\n\t\t\treturn () => {\n\t\t\t\telement.removeEventListener( 'keydown', _onKeyDown );\n\t\t\t};\n\t\t}, [] ),\n\t] );\n\n\t// We only want to show the popover if the user has typed something.\n\tconst didUserInput = record.text !== previousRecord?.text;\n\n\tif ( ! didUserInput ) {\n\t\treturn { ref: mergedRefs };\n\t}\n\n\treturn {\n\t\tref: mergedRefs,\n\t\tchildren: popover,\n\t\t'aria-autocomplete': listBoxId ? 'list' : undefined,\n\t\t'aria-owns': listBoxId,\n\t\t'aria-activedescendant': activeId,\n\t};\n}\n\nexport default function Autocomplete( {\n\tchildren,\n\tisSelected,\n\t...options\n}: AutocompleteProps ) {\n\tconst { popover, ...props } = useAutocomplete( options );\n\treturn (\n\t\t<>\n\t\t\t{ children( props ) }\n\t\t\t{ isSelected && popover }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["removeAccents","renderToString","useEffect","useState","useRef","useMemo","useInstanceId","useMergeRefs","useRefEffect","create","slice","insert","isCollapsed","getTextContent","speak","isAppleOS","getAutoCompleterUI","escapeRegExp","withIgnoreIMEEvents","getNodeText","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","EMPTY_FILTERED_OPTIONS","AUTOCOMPLETE_HOOK_REFERENCE","useAutocomplete","record","onChange","onReplace","completers","contentRef","instanceId","selectedIndex","setSelectedIndex","filteredOptions","setFilteredOptions","filterValue","setFilterValue","autocompleter","setAutocompleter","AutocompleterUI","setAutocompleterUI","backspacingRef","insertCompletion","replacement","end","start","triggerPrefix","length","toInsert","html","select","option","getOptionCompletion","isDisabled","completion","value","isCompletionObject","obj","action","undefined","completionObject","reset","current","focus","onChangeOptions","options","handleKeyDown","event","key","defaultPrevented","newIndex","label","preventDefault","textContent","completer","reduce","lastTrigger","currentCompleter","triggerIndex","lastIndexOf","lastTriggerIndex","allowContext","textWithoutTrigger","tooDistantFromTrigger","mismatch","wordsFromTrigger","split","hasOneTriggerWord","matchingWhileBackspacing","textAfterSelection","test","safeTrigger","text","match","RegExp","query","selectedKey","className","isExpanded","listBoxId","activeId","hasSelection","showPopover","onKeyDown","popover","onSelect","useLastDifferentValue","history","Set","add","size","delete","Array","from","useAutocompleteProps","ref","onKeyDownRef","previousRecord","mergedRefs","element","_onKeyDown","addEventListener","removeEventListener","didUserInput","children","Autocomplete","isSelected","props"],"sources":["@wordpress/components/src/autocomplete/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n\tuseMemo,\n} from '@wordpress/element';\nimport { useInstanceId, useMergeRefs, useRefEffect } from '@wordpress/compose';\nimport {\n\tcreate,\n\tslice,\n\tinsert,\n\tisCollapsed,\n\tgetTextContent,\n} from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\nimport { isAppleOS } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { getAutoCompleterUI } from './autocompleter-ui';\nimport { escapeRegExp } from '../utils/strings';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport type {\n\tAutocompleteProps,\n\tAutocompleterUIProps,\n\tInsertOption,\n\tKeyedOption,\n\tOptionCompletion,\n\tReplaceOption,\n\tUseAutocompleteProps,\n\tWPCompleter,\n} from './types';\nimport getNodeText from '../utils/get-node-text';\n\nconst EMPTY_FILTERED_OPTIONS: KeyedOption[] = [];\n\n// Used for generating the instance ID\nconst AUTOCOMPLETE_HOOK_REFERENCE = {};\n\nexport function useAutocomplete( {\n\trecord,\n\tonChange,\n\tonReplace,\n\tcompleters,\n\tcontentRef,\n}: UseAutocompleteProps ) {\n\tconst instanceId = useInstanceId( AUTOCOMPLETE_HOOK_REFERENCE );\n\tconst [ selectedIndex, setSelectedIndex ] = useState( 0 );\n\n\tconst [ filteredOptions, setFilteredOptions ] = useState<\n\t\tArray< KeyedOption >\n\t>( EMPTY_FILTERED_OPTIONS );\n\tconst [ filterValue, setFilterValue ] =\n\t\tuseState< AutocompleterUIProps[ 'filterValue' ] >( '' );\n\tconst [ autocompleter, setAutocompleter ] = useState< WPCompleter | null >(\n\t\tnull\n\t);\n\tconst [ AutocompleterUI, setAutocompleterUI ] = useState<\n\t\t( ( props: AutocompleterUIProps ) => JSX.Element | null ) | null\n\t>( null );\n\n\tconst backspacingRef = useRef( false );\n\n\tfunction insertCompletion( replacement: React.ReactNode ) {\n\t\tif ( autocompleter === null ) {\n\t\t\treturn;\n\t\t}\n\t\tconst end = record.start;\n\t\tconst start =\n\t\t\tend - autocompleter.triggerPrefix.length - filterValue.length;\n\t\tconst toInsert = create( { html: renderToString( replacement ) } );\n\n\t\tonChange( insert( record, toInsert, start, end ) );\n\t}\n\n\tfunction select( option: KeyedOption ) {\n\t\tconst { getOptionCompletion } = autocompleter || {};\n\n\t\tif ( option.isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( getOptionCompletion ) {\n\t\t\tconst completion = getOptionCompletion( option.value, filterValue );\n\n\t\t\tconst isCompletionObject = (\n\t\t\t\tobj: OptionCompletion\n\t\t\t): obj is InsertOption | ReplaceOption => {\n\t\t\t\treturn (\n\t\t\t\t\tobj !== null &&\n\t\t\t\t\ttypeof obj === 'object' &&\n\t\t\t\t\t'action' in obj &&\n\t\t\t\t\tobj.action !== undefined &&\n\t\t\t\t\t'value' in obj &&\n\t\t\t\t\tobj.value !== undefined\n\t\t\t\t);\n\t\t\t};\n\n\t\t\tconst completionObject = isCompletionObject( completion )\n\t\t\t\t? completion\n\t\t\t\t: ( {\n\t\t\t\t\t\taction: 'insert-at-caret',\n\t\t\t\t\t\tvalue: completion,\n\t\t\t\t  } as InsertOption );\n\n\t\t\tif ( 'replace' === completionObject.action ) {\n\t\t\t\tonReplace( [ completionObject.value ] );\n\t\t\t\t// When replacing, the component will unmount, so don't reset\n\t\t\t\t// state (below) on an unmounted component.\n\t\t\t\treturn;\n\t\t\t} else if ( 'insert-at-caret' === completionObject.action ) {\n\t\t\t\tinsertCompletion( completionObject.value );\n\t\t\t}\n\t\t}\n\n\t\t// Reset autocomplete state after insertion rather than before\n\t\t// so insertion events don't cause the completion menu to redisplay.\n\t\treset();\n\n\t\t// Make sure that the content remains focused after making a selection\n\t\t// and that the text cursor position is not lost.\n\t\tcontentRef.current?.focus();\n\t}\n\n\tfunction reset() {\n\t\tsetSelectedIndex( 0 );\n\t\tsetFilteredOptions( EMPTY_FILTERED_OPTIONS );\n\t\tsetFilterValue( '' );\n\t\tsetAutocompleter( null );\n\t\tsetAutocompleterUI( null );\n\t}\n\n\t/**\n\t * Load options for an autocompleter.\n\t *\n\t * @param {Array} options\n\t */\n\tfunction onChangeOptions( options: Array< KeyedOption > ) {\n\t\tsetSelectedIndex(\n\t\t\toptions.length === filteredOptions.length ? selectedIndex : 0\n\t\t);\n\t\tsetFilteredOptions( options );\n\t}\n\n\tfunction handleKeyDown( event: KeyboardEvent ) {\n\t\tbackspacingRef.current = event.key === 'Backspace';\n\n\t\tif ( ! autocompleter ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( filteredOptions.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.key ) {\n\t\t\tcase 'ArrowUp': {\n\t\t\t\tconst newIndex =\n\t\t\t\t\t( selectedIndex === 0\n\t\t\t\t\t\t? filteredOptions.length\n\t\t\t\t\t\t: selectedIndex ) - 1;\n\t\t\t\tsetSelectedIndex( newIndex );\n\t\t\t\t// See the related PR as to why this is necessary: https://github.com/WordPress/gutenberg/pull/54902.\n\t\t\t\tif ( isAppleOS() ) {\n\t\t\t\t\tspeak(\n\t\t\t\t\t\tgetNodeText( filteredOptions[ newIndex ].label ),\n\t\t\t\t\t\t'assertive'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase 'ArrowDown': {\n\t\t\t\tconst newIndex = ( selectedIndex + 1 ) % filteredOptions.length;\n\t\t\t\tsetSelectedIndex( newIndex );\n\t\t\t\tif ( isAppleOS() ) {\n\t\t\t\t\tspeak(\n\t\t\t\t\t\tgetNodeText( filteredOptions[ newIndex ].label ),\n\t\t\t\t\t\t'assertive'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase 'Escape':\n\t\t\t\tsetAutocompleter( null );\n\t\t\t\tsetAutocompleterUI( null );\n\t\t\t\tevent.preventDefault();\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tselect( filteredOptions[ selectedIndex ] );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\t\treset();\n\t\t\t\treturn;\n\n\t\t\tdefault:\n\t\t\t\treturn;\n\t\t}\n\n\t\t// Any handled key should prevent original behavior. This relies on\n\t\t// the early return in the default case.\n\t\tevent.preventDefault();\n\t}\n\n\t// textContent is a primitive (string), memoizing is not strictly necessary\n\t// but this is a preemptive performance improvement, since the autocompleter\n\t// is a potential bottleneck for the editor type metric.\n\tconst textContent = useMemo( () => {\n\t\tif ( isCollapsed( record ) ) {\n\t\t\treturn getTextContent( slice( record, 0 ) );\n\t\t}\n\t\treturn '';\n\t}, [ record ] );\n\n\tuseEffect( () => {\n\t\tif ( ! textContent ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\t// Find the completer with the highest triggerPrefix index in the\n\t\t// textContent.\n\t\tconst completer = completers.reduce< WPCompleter | null >(\n\t\t\t( lastTrigger, currentCompleter ) => {\n\t\t\t\tconst triggerIndex = textContent.lastIndexOf(\n\t\t\t\t\tcurrentCompleter.triggerPrefix\n\t\t\t\t);\n\t\t\t\tconst lastTriggerIndex =\n\t\t\t\t\tlastTrigger !== null\n\t\t\t\t\t\t? textContent.lastIndexOf( lastTrigger.triggerPrefix )\n\t\t\t\t\t\t: -1;\n\n\t\t\t\treturn triggerIndex > lastTriggerIndex\n\t\t\t\t\t? currentCompleter\n\t\t\t\t\t: lastTrigger;\n\t\t\t},\n\t\t\tnull\n\t\t);\n\n\t\tif ( ! completer ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst { allowContext, triggerPrefix } = completer;\n\t\tconst triggerIndex = textContent.lastIndexOf( triggerPrefix );\n\t\tconst textWithoutTrigger = textContent.slice(\n\t\t\ttriggerIndex + triggerPrefix.length\n\t\t);\n\n\t\tconst tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.\n\t\t// This is a final barrier to prevent the effect from completing with\n\t\t// an extremely long string, which causes the editor to slow-down\n\t\t// significantly. This could happen, for example, if `matchingWhileBackspacing`\n\t\t// is true and one of the \"words\" end up being too long. If that's the case,\n\t\t// it will be caught by this guard.\n\t\tif ( tooDistantFromTrigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst mismatch = filteredOptions.length === 0;\n\t\tconst wordsFromTrigger = textWithoutTrigger.split( /\\s/ );\n\t\t// We need to allow the effect to run when not backspacing and if there\n\t\t// was a mismatch. i.e when typing a trigger + the match string or when\n\t\t// clicking in an existing trigger word on the page. We do that if we\n\t\t// detect that we have one word from trigger in the current textual context.\n\t\t//\n\t\t// Ex.: \"Some text @a\" <-- \"@a\" will be detected as the trigger word and\n\t\t// allow the effect to run. It will run until there's a mismatch.\n\t\tconst hasOneTriggerWord = wordsFromTrigger.length === 1;\n\t\t// This is used to allow the effect to run when backspacing and if\n\t\t// \"touching\" a word that \"belongs\" to a trigger. We consider a \"trigger\n\t\t// word\" any word up to the limit of 3 from the trigger character.\n\t\t// Anything beyond that is ignored if there's a mismatch. This allows\n\t\t// us to \"escape\" a mismatch when backspacing, but still imposing some\n\t\t// sane limits.\n\t\t//\n\t\t// Ex: \"Some text @marcelo sekkkk\" <--- \"kkkk\" caused a mismatch, but\n\t\t// if the user presses backspace here, it will show the completion popup again.\n\t\tconst matchingWhileBackspacing =\n\t\t\tbackspacingRef.current && wordsFromTrigger.length <= 3;\n\n\t\tif ( mismatch && ! ( matchingWhileBackspacing || hasOneTriggerWord ) ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst textAfterSelection = getTextContent(\n\t\t\tslice( record, undefined, getTextContent( record ).length )\n\t\t);\n\n\t\tif (\n\t\t\tallowContext &&\n\t\t\t! allowContext(\n\t\t\t\ttextContent.slice( 0, triggerIndex ),\n\t\t\t\ttextAfterSelection\n\t\t\t)\n\t\t) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\t/^\\s/.test( textWithoutTrigger ) ||\n\t\t\t/\\s\\s+$/.test( textWithoutTrigger )\n\t\t) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tif ( ! /[\\u0000-\\uFFFF]*$/.test( textWithoutTrigger ) ) {\n\t\t\tif ( autocompleter ) {\n\t\t\t\treset();\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tconst safeTrigger = escapeRegExp( completer.triggerPrefix );\n\t\tconst text = removeAccents( textContent );\n\t\tconst match = text\n\t\t\t.slice( text.lastIndexOf( completer.triggerPrefix ) )\n\t\t\t.match( new RegExp( `${ safeTrigger }([\\u0000-\\uFFFF]*)$` ) );\n\t\tconst query = match && match[ 1 ];\n\n\t\tsetAutocompleter( completer );\n\t\tsetAutocompleterUI( () =>\n\t\t\tcompleter !== autocompleter\n\t\t\t\t? getAutoCompleterUI( completer )\n\t\t\t\t: AutocompleterUI\n\t\t);\n\t\tsetFilterValue( query === null ? '' : query );\n\t\t// We want to avoid introducing unexpected side effects.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t}, [ textContent ] );\n\n\tconst { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};\n\tconst { className } = autocompleter || {};\n\tconst isExpanded = !! autocompleter && filteredOptions.length > 0;\n\tconst listBoxId = isExpanded\n\t\t? `components-autocomplete-listbox-${ instanceId }`\n\t\t: undefined;\n\tconst activeId = isExpanded\n\t\t? `components-autocomplete-item-${ instanceId }-${ selectedKey }`\n\t\t: null;\n\tconst hasSelection = record.start !== undefined;\n\tconst showPopover = !! textContent && hasSelection && !! AutocompleterUI;\n\n\treturn {\n\t\tlistBoxId,\n\t\tactiveId,\n\t\tonKeyDown: withIgnoreIMEEvents( handleKeyDown ),\n\t\tpopover: showPopover && (\n\t\t\t<AutocompleterUI\n\t\t\t\tclassName={ className }\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tinstanceId={ instanceId }\n\t\t\t\tlistBoxId={ listBoxId }\n\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\tonChangeOptions={ onChangeOptions }\n\t\t\t\tonSelect={ select }\n\t\t\t\tvalue={ record }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\treset={ reset }\n\t\t\t/>\n\t\t),\n\t};\n}\n\nfunction useLastDifferentValue( value: UseAutocompleteProps[ 'record' ] ) {\n\tconst history = useRef< Set< typeof value > >( new Set() );\n\n\thistory.current.add( value );\n\n\t// Keep the history size to 2.\n\tif ( history.current.size > 2 ) {\n\t\thistory.current.delete( Array.from( history.current )[ 0 ] );\n\t}\n\n\treturn Array.from( history.current )[ 0 ];\n}\n\nexport function useAutocompleteProps( options: UseAutocompleteProps ) {\n\tconst ref = useRef< HTMLElement >( null );\n\tconst onKeyDownRef = useRef< ( event: KeyboardEvent ) => void >();\n\tconst { record } = options;\n\tconst previousRecord = useLastDifferentValue( record );\n\tconst { popover, listBoxId, activeId, onKeyDown } = useAutocomplete( {\n\t\t...options,\n\t\tcontentRef: ref,\n\t} );\n\tonKeyDownRef.current = onKeyDown;\n\n\tconst mergedRefs = useMergeRefs( [\n\t\tref,\n\t\tuseRefEffect( ( element: HTMLElement ) => {\n\t\t\tfunction _onKeyDown( event: KeyboardEvent ) {\n\t\t\t\tonKeyDownRef.current?.( event );\n\t\t\t}\n\t\t\telement.addEventListener( 'keydown', _onKeyDown );\n\t\t\treturn () => {\n\t\t\t\telement.removeEventListener( 'keydown', _onKeyDown );\n\t\t\t};\n\t\t}, [] ),\n\t] );\n\n\t// We only want to show the popover if the user has typed something.\n\tconst didUserInput = record.text !== previousRecord?.text;\n\n\tif ( ! didUserInput ) {\n\t\treturn { ref: mergedRefs };\n\t}\n\n\treturn {\n\t\tref: mergedRefs,\n\t\tchildren: popover,\n\t\t'aria-autocomplete': listBoxId ? 'list' : undefined,\n\t\t'aria-owns': listBoxId,\n\t\t'aria-activedescendant': activeId,\n\t};\n}\n\nexport default function Autocomplete( {\n\tchildren,\n\tisSelected,\n\t...options\n}: AutocompleteProps ) {\n\tconst { popover, ...props } = useAutocomplete( options );\n\treturn (\n\t\t<>\n\t\t\t{ children( props ) }\n\t\t\t{ isSelected && popover }\n\t\t</>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAOA,aAAa,MAAM,gBAAgB;;AAE1C;AACA;AACA;AACA,SACCC,cAAc,EACdC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,OAAO,QACD,oBAAoB;AAC3B,SAASC,aAAa,EAAEC,YAAY,EAAEC,YAAY,QAAQ,oBAAoB;AAC9E,SACCC,MAAM,EACNC,KAAK,EACLC,MAAM,EACNC,WAAW,EACXC,cAAc,QACR,sBAAsB;AAC7B,SAASC,KAAK,QAAQ,iBAAiB;AACvC,SAASC,SAAS,QAAQ,qBAAqB;;AAE/C;AACA;AACA;AACA,SAASC,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,YAAY,QAAQ,kBAAkB;AAC/C,SAASC,mBAAmB,QAAQ,iCAAiC;AAWrE,OAAOC,WAAW,MAAM,wBAAwB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAEjD,MAAMC,sBAAqC,GAAG,EAAE;;AAEhD;AACA,MAAMC,2BAA2B,GAAG,CAAC,CAAC;AAEtC,OAAO,SAASC,eAAeA,CAAE;EAChCC,MAAM;EACNC,QAAQ;EACRC,SAAS;EACTC,UAAU;EACVC;AACqB,CAAC,EAAG;EACzB,MAAMC,UAAU,GAAG5B,aAAa,CAAEqB,2BAA4B,CAAC;EAC/D,MAAM,CAAEQ,aAAa,EAAEC,gBAAgB,CAAE,GAAGjC,QAAQ,CAAE,CAAE,CAAC;EAEzD,MAAM,CAAEkC,eAAe,EAAEC,kBAAkB,CAAE,GAAGnC,QAAQ,CAErDuB,sBAAuB,CAAC;EAC3B,MAAM,CAAEa,WAAW,EAAEC,cAAc,CAAE,GACpCrC,QAAQ,CAA2C,EAAG,CAAC;EACxD,MAAM,CAAEsC,aAAa,EAAEC,gBAAgB,CAAE,GAAGvC,QAAQ,CACnD,IACD,CAAC;EACD,MAAM,CAAEwC,eAAe,EAAEC,kBAAkB,CAAE,GAAGzC,QAAQ,CAErD,IAAK,CAAC;EAET,MAAM0C,cAAc,GAAGzC,MAAM,CAAE,KAAM,CAAC;EAEtC,SAAS0C,gBAAgBA,CAAEC,WAA4B,EAAG;IACzD,IAAKN,aAAa,KAAK,IAAI,EAAG;MAC7B;IACD;IACA,MAAMO,GAAG,GAAGnB,MAAM,CAACoB,KAAK;IACxB,MAAMA,KAAK,GACVD,GAAG,GAAGP,aAAa,CAACS,aAAa,CAACC,MAAM,GAAGZ,WAAW,CAACY,MAAM;IAC9D,MAAMC,QAAQ,GAAG3C,MAAM,CAAE;MAAE4C,IAAI,EAAEpD,cAAc,CAAE8C,WAAY;IAAE,CAAE,CAAC;IAElEjB,QAAQ,CAAEnB,MAAM,CAAEkB,MAAM,EAAEuB,QAAQ,EAAEH,KAAK,EAAED,GAAI,CAAE,CAAC;EACnD;EAEA,SAASM,MAAMA,CAAEC,MAAmB,EAAG;IACtC,MAAM;MAAEC;IAAoB,CAAC,GAAGf,aAAa,IAAI,CAAC,CAAC;IAEnD,IAAKc,MAAM,CAACE,UAAU,EAAG;MACxB;IACD;IAEA,IAAKD,mBAAmB,EAAG;MAC1B,MAAME,UAAU,GAAGF,mBAAmB,CAAED,MAAM,CAACI,KAAK,EAAEpB,WAAY,CAAC;MAEnE,MAAMqB,kBAAkB,GACvBC,GAAqB,IACoB;QACzC,OACCA,GAAG,KAAK,IAAI,IACZ,OAAOA,GAAG,KAAK,QAAQ,IACvB,QAAQ,IAAIA,GAAG,IACfA,GAAG,CAACC,MAAM,KAAKC,SAAS,IACxB,OAAO,IAAIF,GAAG,IACdA,GAAG,CAACF,KAAK,KAAKI,SAAS;MAEzB,CAAC;MAED,MAAMC,gBAAgB,GAAGJ,kBAAkB,CAAEF,UAAW,CAAC,GACtDA,UAAU,GACR;QACFI,MAAM,EAAE,iBAAiB;QACzBH,KAAK,EAAED;MACP,CAAmB;MAEtB,IAAK,SAAS,KAAKM,gBAAgB,CAACF,MAAM,EAAG;QAC5C/B,SAAS,CAAE,CAAEiC,gBAAgB,CAACL,KAAK,CAAG,CAAC;QACvC;QACA;QACA;MACD,CAAC,MAAM,IAAK,iBAAiB,KAAKK,gBAAgB,CAACF,MAAM,EAAG;QAC3DhB,gBAAgB,CAAEkB,gBAAgB,CAACL,KAAM,CAAC;MAC3C;IACD;;IAEA;IACA;IACAM,KAAK,CAAC,CAAC;;IAEP;IACA;IACAhC,UAAU,CAACiC,OAAO,EAAEC,KAAK,CAAC,CAAC;EAC5B;EAEA,SAASF,KAAKA,CAAA,EAAG;IAChB7B,gBAAgB,CAAE,CAAE,CAAC;IACrBE,kBAAkB,CAAEZ,sBAAuB,CAAC;IAC5Cc,cAAc,CAAE,EAAG,CAAC;IACpBE,gBAAgB,CAAE,IAAK,CAAC;IACxBE,kBAAkB,CAAE,IAAK,CAAC;EAC3B;;EAEA;AACD;AACA;AACA;AACA;EACC,SAASwB,eAAeA,CAAEC,OAA6B,EAAG;IACzDjC,gBAAgB,CACfiC,OAAO,CAAClB,MAAM,KAAKd,eAAe,CAACc,MAAM,GAAGhB,aAAa,GAAG,CAC7D,CAAC;IACDG,kBAAkB,CAAE+B,OAAQ,CAAC;EAC9B;EAEA,SAASC,aAAaA,CAAEC,KAAoB,EAAG;IAC9C1B,cAAc,CAACqB,OAAO,GAAGK,KAAK,CAACC,GAAG,KAAK,WAAW;IAElD,IAAK,CAAE/B,aAAa,EAAG;MACtB;IACD;IACA,IAAKJ,eAAe,CAACc,MAAM,KAAK,CAAC,EAAG;MACnC;IACD;IAEA,IAAKoB,KAAK,CAACE,gBAAgB,EAAG;MAC7B;IACD;IAEA,QAASF,KAAK,CAACC,GAAG;MACjB,KAAK,SAAS;QAAE;UACf,MAAME,QAAQ,GACb,CAAEvC,aAAa,KAAK,CAAC,GAClBE,eAAe,CAACc,MAAM,GACtBhB,aAAa,IAAK,CAAC;UACvBC,gBAAgB,CAAEsC,QAAS,CAAC;UAC5B;UACA,IAAK3D,SAAS,CAAC,CAAC,EAAG;YAClBD,KAAK,CACJK,WAAW,CAAEkB,eAAe,CAAEqC,QAAQ,CAAE,CAACC,KAAM,CAAC,EAChD,WACD,CAAC;UACF;UACA;QACD;MAEA,KAAK,WAAW;QAAE;UACjB,MAAMD,QAAQ,GAAG,CAAEvC,aAAa,GAAG,CAAC,IAAKE,eAAe,CAACc,MAAM;UAC/Df,gBAAgB,CAAEsC,QAAS,CAAC;UAC5B,IAAK3D,SAAS,CAAC,CAAC,EAAG;YAClBD,KAAK,CACJK,WAAW,CAAEkB,eAAe,CAAEqC,QAAQ,CAAE,CAACC,KAAM,CAAC,EAChD,WACD,CAAC;UACF;UACA;QACD;MAEA,KAAK,QAAQ;QACZjC,gBAAgB,CAAE,IAAK,CAAC;QACxBE,kBAAkB,CAAE,IAAK,CAAC;QAC1B2B,KAAK,CAACK,cAAc,CAAC,CAAC;QACtB;MAED,KAAK,OAAO;QACXtB,MAAM,CAAEjB,eAAe,CAAEF,aAAa,CAAG,CAAC;QAC1C;MAED,KAAK,WAAW;MAChB,KAAK,YAAY;QAChB8B,KAAK,CAAC,CAAC;QACP;MAED;QACC;IACF;;IAEA;IACA;IACAM,KAAK,CAACK,cAAc,CAAC,CAAC;EACvB;;EAEA;EACA;EACA;EACA,MAAMC,WAAW,GAAGxE,OAAO,CAAE,MAAM;IAClC,IAAKO,WAAW,CAAEiB,MAAO,CAAC,EAAG;MAC5B,OAAOhB,cAAc,CAAEH,KAAK,CAAEmB,MAAM,EAAE,CAAE,CAAE,CAAC;IAC5C;IACA,OAAO,EAAE;EACV,CAAC,EAAE,CAAEA,MAAM,CAAG,CAAC;EAEf3B,SAAS,CAAE,MAAM;IAChB,IAAK,CAAE2E,WAAW,EAAG;MACpB,IAAKpC,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;;IAEA;IACA;IACA,MAAMa,SAAS,GAAG9C,UAAU,CAAC+C,MAAM,CAClC,CAAEC,WAAW,EAAEC,gBAAgB,KAAM;MACpC,MAAMC,YAAY,GAAGL,WAAW,CAACM,WAAW,CAC3CF,gBAAgB,CAAC/B,aAClB,CAAC;MACD,MAAMkC,gBAAgB,GACrBJ,WAAW,KAAK,IAAI,GACjBH,WAAW,CAACM,WAAW,CAAEH,WAAW,CAAC9B,aAAc,CAAC,GACpD,CAAC,CAAC;MAEN,OAAOgC,YAAY,GAAGE,gBAAgB,GACnCH,gBAAgB,GAChBD,WAAW;IACf,CAAC,EACD,IACD,CAAC;IAED,IAAK,CAAEF,SAAS,EAAG;MAClB,IAAKrC,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,MAAM;MAAEoB,YAAY;MAAEnC;IAAc,CAAC,GAAG4B,SAAS;IACjD,MAAMI,YAAY,GAAGL,WAAW,CAACM,WAAW,CAAEjC,aAAc,CAAC;IAC7D,MAAMoC,kBAAkB,GAAGT,WAAW,CAACnE,KAAK,CAC3CwE,YAAY,GAAGhC,aAAa,CAACC,MAC9B,CAAC;IAED,MAAMoC,qBAAqB,GAAGD,kBAAkB,CAACnC,MAAM,GAAG,EAAE,CAAC,CAAC;IAC9D;IACA;IACA;IACA;IACA;IACA,IAAKoC,qBAAqB,EAAG;MAC5B;IACD;IAEA,MAAMC,QAAQ,GAAGnD,eAAe,CAACc,MAAM,KAAK,CAAC;IAC7C,MAAMsC,gBAAgB,GAAGH,kBAAkB,CAACI,KAAK,CAAE,IAAK,CAAC;IACzD;IACA;IACA;IACA;IACA;IACA;IACA;IACA,MAAMC,iBAAiB,GAAGF,gBAAgB,CAACtC,MAAM,KAAK,CAAC;IACvD;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,MAAMyC,wBAAwB,GAC7B/C,cAAc,CAACqB,OAAO,IAAIuB,gBAAgB,CAACtC,MAAM,IAAI,CAAC;IAEvD,IAAKqC,QAAQ,IAAI,EAAII,wBAAwB,IAAID,iBAAiB,CAAE,EAAG;MACtE,IAAKlD,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,MAAM4B,kBAAkB,GAAGhF,cAAc,CACxCH,KAAK,CAAEmB,MAAM,EAAEkC,SAAS,EAAElD,cAAc,CAAEgB,MAAO,CAAC,CAACsB,MAAO,CAC3D,CAAC;IAED,IACCkC,YAAY,IACZ,CAAEA,YAAY,CACbR,WAAW,CAACnE,KAAK,CAAE,CAAC,EAAEwE,YAAa,CAAC,EACpCW,kBACD,CAAC,EACA;MACD,IAAKpD,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,IACC,KAAK,CAAC6B,IAAI,CAAER,kBAAmB,CAAC,IAChC,QAAQ,CAACQ,IAAI,CAAER,kBAAmB,CAAC,EAClC;MACD,IAAK7C,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,IAAK,CAAE,mBAAmB,CAAC6B,IAAI,CAAER,kBAAmB,CAAC,EAAG;MACvD,IAAK7C,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,MAAM8B,WAAW,GAAG9E,YAAY,CAAE6D,SAAS,CAAC5B,aAAc,CAAC;IAC3D,MAAM8C,IAAI,GAAGhG,aAAa,CAAE6E,WAAY,CAAC;IACzC,MAAMoB,KAAK,GAAGD,IAAI,CAChBtF,KAAK,CAAEsF,IAAI,CAACb,WAAW,CAAEL,SAAS,CAAC5B,aAAc,CAAE,CAAC,CACpD+C,KAAK,CAAE,IAAIC,MAAM,CAAE,GAAIH,WAAW,qBAAuB,CAAE,CAAC;IAC9D,MAAMI,KAAK,GAAGF,KAAK,IAAIA,KAAK,CAAE,CAAC,CAAE;IAEjCvD,gBAAgB,CAAEoC,SAAU,CAAC;IAC7BlC,kBAAkB,CAAE,MACnBkC,SAAS,KAAKrC,aAAa,GACxBzB,kBAAkB,CAAE8D,SAAU,CAAC,GAC/BnC,eACJ,CAAC;IACDH,cAAc,CAAE2D,KAAK,KAAK,IAAI,GAAG,EAAE,GAAGA,KAAM,CAAC;IAC7C;IACA;EACD,CAAC,EAAE,CAAEtB,WAAW,CAAG,CAAC;EAEpB,MAAM;IAAEL,GAAG,EAAE4B,WAAW,GAAG;EAAG,CAAC,GAAG/D,eAAe,CAAEF,aAAa,CAAE,IAAI,CAAC,CAAC;EACxE,MAAM;IAAEkE;EAAU,CAAC,GAAG5D,aAAa,IAAI,CAAC,CAAC;EACzC,MAAM6D,UAAU,GAAG,CAAC,CAAE7D,aAAa,IAAIJ,eAAe,CAACc,MAAM,GAAG,CAAC;EACjE,MAAMoD,SAAS,GAAGD,UAAU,GACzB,mCAAoCpE,UAAU,EAAG,GACjD6B,SAAS;EACZ,MAAMyC,QAAQ,GAAGF,UAAU,GACxB,gCAAiCpE,UAAU,IAAMkE,WAAW,EAAG,GAC/D,IAAI;EACP,MAAMK,YAAY,GAAG5E,MAAM,CAACoB,KAAK,KAAKc,SAAS;EAC/C,MAAM2C,WAAW,GAAG,CAAC,CAAE7B,WAAW,IAAI4B,YAAY,IAAI,CAAC,CAAE9D,eAAe;EAExE,OAAO;IACN4D,SAAS;IACTC,QAAQ;IACRG,SAAS,EAAEzF,mBAAmB,CAAEoD,aAAc,CAAC;IAC/CsC,OAAO,EAAEF,WAAW,iBACnBrF,IAAA,CAACsB,eAAe;MACf0D,SAAS,EAAGA,SAAW;MACvB9D,WAAW,EAAGA,WAAa;MAC3BL,UAAU,EAAGA,UAAY;MACzBqE,SAAS,EAAGA,SAAW;MACvBpE,aAAa,EAAGA,aAAe;MAC/BiC,eAAe,EAAGA,eAAiB;MACnCyC,QAAQ,EAAGvD,MAAQ;MACnBK,KAAK,EAAG9B,MAAQ;MAChBI,UAAU,EAAGA,UAAY;MACzBgC,KAAK,EAAGA;IAAO,CACf;EAEH,CAAC;AACF;AAEA,SAAS6C,qBAAqBA,CAAEnD,KAAuC,EAAG;EACzE,MAAMoD,OAAO,GAAG3G,MAAM,CAAyB,IAAI4G,GAAG,CAAC,CAAE,CAAC;EAE1DD,OAAO,CAAC7C,OAAO,CAAC+C,GAAG,CAAEtD,KAAM,CAAC;;EAE5B;EACA,IAAKoD,OAAO,CAAC7C,OAAO,CAACgD,IAAI,GAAG,CAAC,EAAG;IAC/BH,OAAO,CAAC7C,OAAO,CAACiD,MAAM,CAAEC,KAAK,CAACC,IAAI,CAAEN,OAAO,CAAC7C,OAAQ,CAAC,CAAE,CAAC,CAAG,CAAC;EAC7D;EAEA,OAAOkD,KAAK,CAACC,IAAI,CAAEN,OAAO,CAAC7C,OAAQ,CAAC,CAAE,CAAC,CAAE;AAC1C;AAEA,OAAO,SAASoD,oBAAoBA,CAAEjD,OAA6B,EAAG;EACrE,MAAMkD,GAAG,GAAGnH,MAAM,CAAiB,IAAK,CAAC;EACzC,MAAMoH,YAAY,GAAGpH,MAAM,CAAqC,CAAC;EACjE,MAAM;IAAEyB;EAAO,CAAC,GAAGwC,OAAO;EAC1B,MAAMoD,cAAc,GAAGX,qBAAqB,CAAEjF,MAAO,CAAC;EACtD,MAAM;IAAE+E,OAAO;IAAEL,SAAS;IAAEC,QAAQ;IAAEG;EAAU,CAAC,GAAG/E,eAAe,CAAE;IACpE,GAAGyC,OAAO;IACVpC,UAAU,EAAEsF;EACb,CAAE,CAAC;EACHC,YAAY,CAACtD,OAAO,GAAGyC,SAAS;EAEhC,MAAMe,UAAU,GAAGnH,YAAY,CAAE,CAChCgH,GAAG,EACH/G,YAAY,CAAImH,OAAoB,IAAM;IACzC,SAASC,UAAUA,CAAErD,KAAoB,EAAG;MAC3CiD,YAAY,CAACtD,OAAO,GAAIK,KAAM,CAAC;IAChC;IACAoD,OAAO,CAACE,gBAAgB,CAAE,SAAS,EAAED,UAAW,CAAC;IACjD,OAAO,MAAM;MACZD,OAAO,CAACG,mBAAmB,CAAE,SAAS,EAAEF,UAAW,CAAC;IACrD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC,CACN,CAAC;;EAEH;EACA,MAAMG,YAAY,GAAGlG,MAAM,CAACmE,IAAI,KAAKyB,cAAc,EAAEzB,IAAI;EAEzD,IAAK,CAAE+B,YAAY,EAAG;IACrB,OAAO;MAAER,GAAG,EAAEG;IAAW,CAAC;EAC3B;EAEA,OAAO;IACNH,GAAG,EAAEG,UAAU;IACfM,QAAQ,EAAEpB,OAAO;IACjB,mBAAmB,EAAEL,SAAS,GAAG,MAAM,GAAGxC,SAAS;IACnD,WAAW,EAAEwC,SAAS;IACtB,uBAAuB,EAAEC;EAC1B,CAAC;AACF;AAEA,eAAe,SAASyB,YAAYA,CAAE;EACrCD,QAAQ;EACRE,UAAU;EACV,GAAG7D;AACe,CAAC,EAAG;EACtB,MAAM;IAAEuC,OAAO;IAAE,GAAGuB;EAAM,CAAC,GAAGvG,eAAe,CAAEyC,OAAQ,CAAC;EACxD,oBACC5C,KAAA,CAAAF,SAAA;IAAAyG,QAAA,GACGA,QAAQ,CAAEG,KAAM,CAAC,EACjBD,UAAU,IAAItB,OAAO;EAAA,CACtB,CAAC;AAEL","ignoreList":[]}

package/build-module/calendar/date-calendar/index.js

@@ -3,12 +3,16 @@
  */
 import { DayPicker } from 'react-day-picker';
 import { enUS } from 'react-day-picker/locale';
+/**
+ * WordPress dependencies
+ */
+import { useCallback } from '@wordpress/element';
 /**
  * Internal dependencies
  */
 import { COMMON_PROPS } from '../utils/constants';
 import { clampNumberOfMonths } from '../utils/misc';
-import { useControlledValue } from '../utils/use-controlled-value';
+import { useControlledValue } from '../../utils/hooks';
 import { useLocalizationProps } from '../utils/use-localization-props';
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
@@ -33,10 +37,14 @@ export const DateCalendar = ({
     timeZone,
     mode: 'single'
   });
+  const onChange = useCallback((selected, triggerDate, modifiers, e) => {
+    // Convert internal `null` to `undefined` for the public event handler.
+    onSelect?.(selected !== null && selected !== void 0 ? selected : undefined, triggerDate, modifiers, e);
+  }, [onSelect]);
   const [selected, setSelected] = useControlledValue({
     defaultValue: defaultSelected,
     value: selectedProp,
-    onChange: onSelect
+    onChange
   });
   return /*#__PURE__*/_jsx(DayPicker, {
     ...COMMON_PROPS,
@@ -44,7 +52,7 @@ export const DateCalendar = ({
     ...props,
     mode: "single",
     numberOfMonths: clampNumberOfMonths(numberOfMonths),
-    selected: selected,
+    selected: selected !== null && selected !== void 0 ? selected : undefined,
     onSelect: setSelected
   });
 };

package/build-module/calendar/date-calendar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["DayPicker","enUS","COMMON_PROPS","clampNumberOfMonths","useControlledValue","useLocalizationProps","jsx","_jsx","DateCalendar","defaultSelected","selected","selectedProp","onSelect","numberOfMonths","locale","timeZone","props","localizationProps","mode","setSelected","defaultValue","value","onChange"],"sources":["@wordpress/components/src/calendar/date-calendar/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { DayPicker } from 'react-day-picker';\nimport { enUS } from 'react-day-picker/locale';\n/**\n * Internal dependencies\n */\nimport { COMMON_PROPS } from '../utils/constants';\nimport { clampNumberOfMonths } from '../utils/misc';\nimport { useControlledValue } from '../utils/use-controlled-value';\nimport { useLocalizationProps } from '../utils/use-localization-props';\nimport type { DateCalendarProps } from '../types';\n\n/**\n * `DateCalendar` is a React component that provides a customizable calendar\n * interface for **single date** selection.\n *\n * The component is built with accessibility in mind and follows ARIA best\n * practices for calendar widgets. It provides keyboard navigation, screen reader\n * support, and customizable labels for internationalization.\n */\nexport const DateCalendar = ( {\n\tdefaultSelected,\n\tselected: selectedProp,\n\tonSelect,\n\tnumberOfMonths = 1,\n\tlocale = enUS,\n\ttimeZone,\n\t...props\n}: DateCalendarProps ) => {\n\tconst localizationProps = useLocalizationProps( {\n\t\tlocale,\n\t\ttimeZone,\n\t\tmode: 'single',\n\t} );\n\n\tconst [ selected, setSelected ] = useControlledValue< Date | undefined >( {\n\t\tdefaultValue: defaultSelected,\n\t\tvalue: selectedProp,\n\t\tonChange: onSelect,\n\t} );\n\n\treturn (\n\t\t<DayPicker\n\t\t\t{ ...COMMON_PROPS }\n\t\t\t{ ...localizationProps }\n\t\t\t{ ...props }\n\t\t\tmode=\"single\"\n\t\t\tnumberOfMonths={ clampNumberOfMonths( numberOfMonths ) }\n\t\t\tselected={ selected }\n\t\t\tonSelect={ setSelected }\n\t\t/>\n\t);\n};\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,IAAI,QAAQ,yBAAyB;AAC9C;AACA;AACA;AACA,SAASC,YAAY,QAAQ,oBAAoB;AACjD,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,kBAAkB,QAAQ,+BAA+B;AAClE,SAASC,oBAAoB,QAAQ,iCAAiC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,YAAY,GAAGA,CAAE;EAC7BC,eAAe;EACfC,QAAQ,EAAEC,YAAY;EACtBC,QAAQ;EACRC,cAAc,GAAG,CAAC;EAClBC,MAAM,GAAGb,IAAI;EACbc,QAAQ;EACR,GAAGC;AACe,CAAC,KAAM;EACzB,MAAMC,iBAAiB,GAAGZ,oBAAoB,CAAE;IAC/CS,MAAM;IACNC,QAAQ;IACRG,IAAI,EAAE;EACP,CAAE,CAAC;EAEH,MAAM,CAAER,QAAQ,EAAES,WAAW,CAAE,GAAGf,kBAAkB,CAAsB;IACzEgB,YAAY,EAAEX,eAAe;IAC7BY,KAAK,EAAEV,YAAY;IACnBW,QAAQ,EAAEV;EACX,CAAE,CAAC;EAEH,oBACCL,IAAA,CAACP,SAAS;IAAA,GACJE,YAAY;IAAA,GACZe,iBAAiB;IAAA,GACjBD,KAAK;IACVE,IAAI,EAAC,QAAQ;IACbL,cAAc,EAAGV,mBAAmB,CAAEU,cAAe,CAAG;IACxDH,QAAQ,EAAGA,QAAU;IACrBE,QAAQ,EAAGO;EAAa,CACxB,CAAC;AAEJ,CAAC","ignoreList":[]}
+{"version":3,"names":["DayPicker","enUS","useCallback","COMMON_PROPS","clampNumberOfMonths","useControlledValue","useLocalizationProps","jsx","_jsx","DateCalendar","defaultSelected","selected","selectedProp","onSelect","numberOfMonths","locale","timeZone","props","localizationProps","mode","onChange","triggerDate","modifiers","e","undefined","setSelected","defaultValue","value"],"sources":["@wordpress/components/src/calendar/date-calendar/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { DayPicker } from 'react-day-picker';\nimport { enUS } from 'react-day-picker/locale';\n/**\n * WordPress dependencies\n */\nimport { useCallback } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport { COMMON_PROPS } from '../utils/constants';\nimport { clampNumberOfMonths } from '../utils/misc';\nimport { useControlledValue } from '../../utils/hooks';\nimport { useLocalizationProps } from '../utils/use-localization-props';\nimport type { DateCalendarProps, OnSelectHandler } from '../types';\n\n/**\n * `DateCalendar` is a React component that provides a customizable calendar\n * interface for **single date** selection.\n *\n * The component is built with accessibility in mind and follows ARIA best\n * practices for calendar widgets. It provides keyboard navigation, screen reader\n * support, and customizable labels for internationalization.\n */\nexport const DateCalendar = ( {\n\tdefaultSelected,\n\tselected: selectedProp,\n\tonSelect,\n\tnumberOfMonths = 1,\n\tlocale = enUS,\n\ttimeZone,\n\t...props\n}: DateCalendarProps ) => {\n\tconst localizationProps = useLocalizationProps( {\n\t\tlocale,\n\t\ttimeZone,\n\t\tmode: 'single',\n\t} );\n\n\tconst onChange: OnSelectHandler< typeof selectedProp > = useCallback(\n\t\t( selected, triggerDate, modifiers, e ) => {\n\t\t\t// Convert internal `null` to `undefined` for the public event handler.\n\t\t\tonSelect?.( selected ?? undefined, triggerDate, modifiers, e );\n\t\t},\n\t\t[ onSelect ]\n\t);\n\n\tconst [ selected, setSelected ] = useControlledValue< typeof selectedProp >(\n\t\t{\n\t\t\tdefaultValue: defaultSelected,\n\t\t\tvalue: selectedProp,\n\t\t\tonChange,\n\t\t}\n\t);\n\n\treturn (\n\t\t<DayPicker\n\t\t\t{ ...COMMON_PROPS }\n\t\t\t{ ...localizationProps }\n\t\t\t{ ...props }\n\t\t\tmode=\"single\"\n\t\t\tnumberOfMonths={ clampNumberOfMonths( numberOfMonths ) }\n\t\t\tselected={ selected ?? undefined }\n\t\t\tonSelect={ setSelected }\n\t\t/>\n\t);\n};\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,IAAI,QAAQ,yBAAyB;AAC9C;AACA;AACA;AACA,SAASC,WAAW,QAAQ,oBAAoB;AAChD;AACA;AACA;AACA,SAASC,YAAY,QAAQ,oBAAoB;AACjD,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,kBAAkB,QAAQ,mBAAmB;AACtD,SAASC,oBAAoB,QAAQ,iCAAiC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGvE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,YAAY,GAAGA,CAAE;EAC7BC,eAAe;EACfC,QAAQ,EAAEC,YAAY;EACtBC,QAAQ;EACRC,cAAc,GAAG,CAAC;EAClBC,MAAM,GAAGd,IAAI;EACbe,QAAQ;EACR,GAAGC;AACe,CAAC,KAAM;EACzB,MAAMC,iBAAiB,GAAGZ,oBAAoB,CAAE;IAC/CS,MAAM;IACNC,QAAQ;IACRG,IAAI,EAAE;EACP,CAAE,CAAC;EAEH,MAAMC,QAAgD,GAAGlB,WAAW,CACnE,CAAES,QAAQ,EAAEU,WAAW,EAAEC,SAAS,EAAEC,CAAC,KAAM;IAC1C;IACAV,QAAQ,GAAIF,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIa,SAAS,EAAEH,WAAW,EAAEC,SAAS,EAAEC,CAAE,CAAC;EAC/D,CAAC,EACD,CAAEV,QAAQ,CACX,CAAC;EAED,MAAM,CAAEF,QAAQ,EAAEc,WAAW,CAAE,GAAGpB,kBAAkB,CACnD;IACCqB,YAAY,EAAEhB,eAAe;IAC7BiB,KAAK,EAAEf,YAAY;IACnBQ;EACD,CACD,CAAC;EAED,oBACCZ,IAAA,CAACR,SAAS;IAAA,GACJG,YAAY;IAAA,GACZe,iBAAiB;IAAA,GACjBD,KAAK;IACVE,IAAI,EAAC,QAAQ;IACbL,cAAc,EAAGV,mBAAmB,CAAEU,cAAe,CAAG;IACxDH,QAAQ,EAAGA,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIa,SAAW;IAClCX,QAAQ,EAAGY;EAAa,CACxB,CAAC;AAEJ,CAAC","ignoreList":[]}