@wordpress/components 29.13.1-next.719a03cbe.0 → 30.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (233) hide show
  1. package/CHANGELOG.md +14 -3
  2. package/build/autocomplete/index.js +4 -0
  3. package/build/autocomplete/index.js.map +1 -1
  4. package/build/calendar/date-calendar/index.js +13 -4
  5. package/build/calendar/date-calendar/index.js.map +1 -1
  6. package/build/calendar/date-range-calendar/index.js +8 -4
  7. package/build/calendar/date-range-calendar/index.js.map +1 -1
  8. package/build/calendar/types.js.map +1 -1
  9. package/build/icon/index.js +2 -0
  10. package/build/icon/index.js.map +1 -1
  11. package/build/index.js +0 -19
  12. package/build/index.js.map +1 -1
  13. package/build/private-apis.js +5 -1
  14. package/build/private-apis.js.map +1 -1
  15. package/build/select-control/index.js +1 -1
  16. package/build/select-control/index.js.map +1 -1
  17. package/build/toggle-group-control/toggle-group-control/as-button-group.js.map +1 -1
  18. package/build/utils/hooks/use-controlled-value.js +8 -4
  19. package/build/utils/hooks/use-controlled-value.js.map +1 -1
  20. package/build/validated-form-controls/components/checkbox-control.js +52 -0
  21. package/build/validated-form-controls/components/checkbox-control.js.map +1 -0
  22. package/build/validated-form-controls/components/combobox-control.js +64 -0
  23. package/build/validated-form-controls/components/combobox-control.js.map +1 -0
  24. package/build/validated-form-controls/components/custom-select-control.js +71 -0
  25. package/build/validated-form-controls/components/custom-select-control.js.map +1 -0
  26. package/build/validated-form-controls/components/index.js +138 -0
  27. package/build/validated-form-controls/components/index.js.map +1 -0
  28. package/build/validated-form-controls/components/input-control.js +50 -0
  29. package/build/validated-form-controls/components/input-control.js.map +1 -0
  30. package/build/validated-form-controls/components/number-control.js +53 -0
  31. package/build/validated-form-controls/components/number-control.js.map +1 -0
  32. package/build/validated-form-controls/components/radio-control.js +51 -0
  33. package/build/validated-form-controls/components/radio-control.js.map +1 -0
  34. package/build/validated-form-controls/components/range-control.js +51 -0
  35. package/build/validated-form-controls/components/range-control.js.map +1 -0
  36. package/build/validated-form-controls/components/select-control.js +53 -0
  37. package/build/validated-form-controls/components/select-control.js.map +1 -0
  38. package/build/validated-form-controls/components/text-control.js +51 -0
  39. package/build/validated-form-controls/components/text-control.js.map +1 -0
  40. package/build/validated-form-controls/components/textarea-control.js +50 -0
  41. package/build/validated-form-controls/components/textarea-control.js.map +1 -0
  42. package/build/validated-form-controls/components/toggle-control.js +60 -0
  43. package/build/validated-form-controls/components/toggle-control.js.map +1 -0
  44. package/build/validated-form-controls/components/toggle-group-control.js +69 -0
  45. package/build/validated-form-controls/components/toggle-group-control.js.map +1 -0
  46. package/build/validated-form-controls/components/types.js +6 -0
  47. package/build/validated-form-controls/components/types.js.map +1 -0
  48. package/build/validated-form-controls/control-with-error.js +137 -0
  49. package/build/validated-form-controls/control-with-error.js.map +1 -0
  50. package/build/validated-form-controls/index.js +28 -0
  51. package/build/validated-form-controls/index.js.map +1 -0
  52. package/build-module/autocomplete/index.js +4 -0
  53. package/build-module/autocomplete/index.js.map +1 -1
  54. package/build-module/calendar/date-calendar/index.js +11 -3
  55. package/build-module/calendar/date-calendar/index.js.map +1 -1
  56. package/build-module/calendar/date-range-calendar/index.js +8 -4
  57. package/build-module/calendar/date-range-calendar/index.js.map +1 -1
  58. package/build-module/calendar/types.js.map +1 -1
  59. package/build-module/icon/index.js +2 -0
  60. package/build-module/icon/index.js.map +1 -1
  61. package/build-module/index.js +0 -1
  62. package/build-module/index.js.map +1 -1
  63. package/build-module/private-apis.js +5 -1
  64. package/build-module/private-apis.js.map +1 -1
  65. package/build-module/select-control/index.js +1 -1
  66. package/build-module/select-control/index.js.map +1 -1
  67. package/build-module/toggle-group-control/toggle-group-control/as-button-group.js.map +1 -1
  68. package/build-module/utils/hooks/use-controlled-value.js +9 -5
  69. package/build-module/utils/hooks/use-controlled-value.js.map +1 -1
  70. package/build-module/validated-form-controls/components/checkbox-control.js +44 -0
  71. package/build-module/validated-form-controls/components/checkbox-control.js.map +1 -0
  72. package/build-module/validated-form-controls/components/combobox-control.js +56 -0
  73. package/build-module/validated-form-controls/components/combobox-control.js.map +1 -0
  74. package/build-module/validated-form-controls/components/custom-select-control.js +63 -0
  75. package/build-module/validated-form-controls/components/custom-select-control.js.map +1 -0
  76. package/build-module/validated-form-controls/components/index.js +13 -0
  77. package/build-module/validated-form-controls/components/index.js.map +1 -0
  78. package/build-module/validated-form-controls/components/input-control.js +42 -0
  79. package/build-module/validated-form-controls/components/input-control.js.map +1 -0
  80. package/build-module/validated-form-controls/components/number-control.js +45 -0
  81. package/build-module/validated-form-controls/components/number-control.js.map +1 -0
  82. package/build-module/validated-form-controls/components/radio-control.js +43 -0
  83. package/build-module/validated-form-controls/components/radio-control.js.map +1 -0
  84. package/build-module/validated-form-controls/components/range-control.js +43 -0
  85. package/build-module/validated-form-controls/components/range-control.js.map +1 -0
  86. package/build-module/validated-form-controls/components/select-control.js +45 -0
  87. package/build-module/validated-form-controls/components/select-control.js.map +1 -0
  88. package/build-module/validated-form-controls/components/text-control.js +43 -0
  89. package/build-module/validated-form-controls/components/text-control.js.map +1 -0
  90. package/build-module/validated-form-controls/components/textarea-control.js +42 -0
  91. package/build-module/validated-form-controls/components/textarea-control.js.map +1 -0
  92. package/build-module/validated-form-controls/components/toggle-control.js +52 -0
  93. package/build-module/validated-form-controls/components/toggle-control.js.map +1 -0
  94. package/build-module/validated-form-controls/components/toggle-group-control.js +62 -0
  95. package/build-module/validated-form-controls/components/toggle-group-control.js.map +1 -0
  96. package/build-module/validated-form-controls/components/types.js +2 -0
  97. package/build-module/validated-form-controls/components/types.js.map +1 -0
  98. package/build-module/validated-form-controls/control-with-error.js +129 -0
  99. package/build-module/validated-form-controls/control-with-error.js.map +1 -0
  100. package/build-module/validated-form-controls/index.js +3 -0
  101. package/build-module/validated-form-controls/index.js.map +1 -0
  102. package/build-style/style-rtl.css +60 -17
  103. package/build-style/style.css +60 -17
  104. package/build-types/autocomplete/index.d.ts.map +1 -1
  105. package/build-types/calendar/date-calendar/index.d.ts.map +1 -1
  106. package/build-types/calendar/date-range-calendar/index.d.ts.map +1 -1
  107. package/build-types/calendar/types.d.ts +2 -2
  108. package/build-types/calendar/types.d.ts.map +1 -1
  109. package/build-types/color-picker/styles.d.ts.map +1 -1
  110. package/build-types/icon/index.d.ts.map +1 -1
  111. package/build-types/index.d.ts +0 -1
  112. package/build-types/index.d.ts.map +1 -1
  113. package/build-types/private-apis.d.ts.map +1 -1
  114. package/build-types/select-control/stories/index.story.d.ts.map +1 -1
  115. package/build-types/toggle-group-control/toggle-group-control/as-button-group.d.ts.map +1 -1
  116. package/build-types/utils/hooks/use-controlled-value.d.ts +2 -2
  117. package/build-types/utils/hooks/use-controlled-value.d.ts.map +1 -1
  118. package/build-types/validated-form-controls/components/checkbox-control.d.ts +9 -0
  119. package/build-types/validated-form-controls/components/checkbox-control.d.ts.map +1 -0
  120. package/build-types/validated-form-controls/components/combobox-control.d.ts +21 -0
  121. package/build-types/validated-form-controls/components/combobox-control.d.ts.map +1 -0
  122. package/build-types/validated-form-controls/components/custom-select-control.d.ts +4 -0
  123. package/build-types/validated-form-controls/components/custom-select-control.d.ts.map +1 -0
  124. package/build-types/validated-form-controls/components/index.d.ts +13 -0
  125. package/build-types/validated-form-controls/components/index.d.ts.map +1 -0
  126. package/build-types/validated-form-controls/components/input-control.d.ts +4 -0
  127. package/build-types/validated-form-controls/components/input-control.d.ts.map +1 -0
  128. package/build-types/validated-form-controls/components/number-control.d.ts +17 -0
  129. package/build-types/validated-form-controls/components/number-control.d.ts.map +1 -0
  130. package/build-types/validated-form-controls/components/radio-control.d.ts +11 -0
  131. package/build-types/validated-form-controls/components/radio-control.d.ts.map +1 -0
  132. package/build-types/validated-form-controls/components/range-control.d.ts +36 -0
  133. package/build-types/validated-form-controls/components/range-control.d.ts.map +1 -0
  134. package/build-types/validated-form-controls/components/select-control.d.ts +9 -0
  135. package/build-types/validated-form-controls/components/select-control.d.ts.map +1 -0
  136. package/build-types/validated-form-controls/components/stories/checkbox-control.story.d.ts +12 -0
  137. package/build-types/validated-form-controls/components/stories/checkbox-control.story.d.ts.map +1 -0
  138. package/build-types/validated-form-controls/components/stories/combobox-control.story.d.ts +12 -0
  139. package/build-types/validated-form-controls/components/stories/combobox-control.story.d.ts.map +1 -0
  140. package/build-types/validated-form-controls/components/stories/custom-select-control.story.d.ts +12 -0
  141. package/build-types/validated-form-controls/components/stories/custom-select-control.story.d.ts.map +1 -0
  142. package/build-types/validated-form-controls/components/stories/input-control.story.d.ts +18 -0
  143. package/build-types/validated-form-controls/components/stories/input-control.story.d.ts.map +1 -0
  144. package/build-types/validated-form-controls/components/stories/number-control.story.d.ts +12 -0
  145. package/build-types/validated-form-controls/components/stories/number-control.story.d.ts.map +1 -0
  146. package/build-types/validated-form-controls/components/stories/overview.story.d.ts +19 -0
  147. package/build-types/validated-form-controls/components/stories/overview.story.d.ts.map +1 -0
  148. package/build-types/validated-form-controls/components/stories/radio-control.story.d.ts +12 -0
  149. package/build-types/validated-form-controls/components/stories/radio-control.story.d.ts.map +1 -0
  150. package/build-types/validated-form-controls/components/stories/range-control.story.d.ts +9 -0
  151. package/build-types/validated-form-controls/components/stories/range-control.story.d.ts.map +1 -0
  152. package/build-types/validated-form-controls/components/stories/select-control.story.d.ts +12 -0
  153. package/build-types/validated-form-controls/components/stories/select-control.story.d.ts.map +1 -0
  154. package/build-types/validated-form-controls/components/stories/story-utils.d.ts +9 -0
  155. package/build-types/validated-form-controls/components/stories/story-utils.d.ts.map +1 -0
  156. package/build-types/validated-form-controls/components/stories/text-control.story.d.ts +9 -0
  157. package/build-types/validated-form-controls/components/stories/text-control.story.d.ts.map +1 -0
  158. package/build-types/validated-form-controls/components/stories/textarea-control.story.d.ts +9 -0
  159. package/build-types/validated-form-controls/components/stories/textarea-control.story.d.ts.map +1 -0
  160. package/build-types/validated-form-controls/components/stories/toggle-control.story.d.ts +9 -0
  161. package/build-types/validated-form-controls/components/stories/toggle-control.story.d.ts.map +1 -0
  162. package/build-types/validated-form-controls/components/stories/toggle-group-control.story.d.ts +9 -0
  163. package/build-types/validated-form-controls/components/stories/toggle-group-control.story.d.ts.map +1 -0
  164. package/build-types/validated-form-controls/components/text-control.d.ts +8 -0
  165. package/build-types/validated-form-controls/components/text-control.d.ts.map +1 -0
  166. package/build-types/validated-form-controls/components/textarea-control.d.ts +7 -0
  167. package/build-types/validated-form-controls/components/textarea-control.d.ts.map +1 -0
  168. package/build-types/validated-form-controls/components/toggle-control.d.ts +7 -0
  169. package/build-types/validated-form-controls/components/toggle-control.d.ts.map +1 -0
  170. package/build-types/validated-form-controls/components/toggle-group-control.d.ts +15 -0
  171. package/build-types/validated-form-controls/components/toggle-group-control.d.ts.map +1 -0
  172. package/build-types/validated-form-controls/components/types.d.ts +27 -0
  173. package/build-types/validated-form-controls/components/types.d.ts.map +1 -0
  174. package/build-types/validated-form-controls/control-with-error.d.ts +36 -0
  175. package/build-types/validated-form-controls/control-with-error.d.ts.map +1 -0
  176. package/build-types/validated-form-controls/index.d.ts +3 -0
  177. package/build-types/validated-form-controls/index.d.ts.map +1 -0
  178. package/package.json +19 -19
  179. package/src/autocomplete/index.tsx +4 -0
  180. package/src/calendar/date-calendar/README.md +57 -46
  181. package/src/calendar/date-calendar/index.tsx +22 -8
  182. package/src/calendar/date-range-calendar/README.md +63 -52
  183. package/src/calendar/date-range-calendar/index.tsx +23 -11
  184. package/src/calendar/types.ts +2 -2
  185. package/src/dimension-control/test/__snapshots__/index.test.js.snap +8 -8
  186. package/src/icon/index.tsx +2 -0
  187. package/src/index.ts +0 -1
  188. package/src/private-apis.ts +5 -0
  189. package/src/select-control/index.tsx +1 -1
  190. package/src/style.scss +2 -2
  191. package/src/toggle-group-control/toggle-group-control/as-button-group.tsx +3 -1
  192. package/src/utils/hooks/use-controlled-value.ts +16 -8
  193. package/src/validated-form-controls/components/checkbox-control.tsx +64 -0
  194. package/src/validated-form-controls/components/combobox-control.tsx +77 -0
  195. package/src/validated-form-controls/components/custom-select-control.tsx +86 -0
  196. package/src/validated-form-controls/components/index.ts +12 -0
  197. package/src/validated-form-controls/components/input-control.tsx +59 -0
  198. package/src/validated-form-controls/components/number-control.tsx +61 -0
  199. package/src/validated-form-controls/components/radio-control.tsx +60 -0
  200. package/src/validated-form-controls/components/range-control.tsx +60 -0
  201. package/src/validated-form-controls/components/select-control.tsx +75 -0
  202. package/src/validated-form-controls/components/stories/checkbox-control.story.tsx +57 -0
  203. package/src/validated-form-controls/components/stories/combobox-control.story.tsx +64 -0
  204. package/src/validated-form-controls/components/stories/custom-select-control.story.tsx +64 -0
  205. package/src/validated-form-controls/components/stories/input-control.story.tsx +132 -0
  206. package/src/validated-form-controls/components/stories/number-control.story.tsx +62 -0
  207. package/src/validated-form-controls/components/stories/overview.mdx +52 -0
  208. package/src/validated-form-controls/components/stories/overview.story.tsx +100 -0
  209. package/src/validated-form-controls/components/stories/radio-control.story.tsx +64 -0
  210. package/src/validated-form-controls/components/stories/range-control.story.tsx +60 -0
  211. package/src/validated-form-controls/components/stories/select-control.story.tsx +60 -0
  212. package/src/validated-form-controls/components/stories/story-utils.tsx +46 -0
  213. package/src/validated-form-controls/components/stories/text-control.story.tsx +55 -0
  214. package/src/validated-form-controls/components/stories/textarea-control.story.tsx +52 -0
  215. package/src/validated-form-controls/components/stories/toggle-control.story.tsx +55 -0
  216. package/src/validated-form-controls/components/stories/toggle-group-control.story.tsx +66 -0
  217. package/src/validated-form-controls/components/text-control.tsx +60 -0
  218. package/src/validated-form-controls/components/textarea-control.tsx +59 -0
  219. package/src/validated-form-controls/components/toggle-control.tsx +69 -0
  220. package/src/validated-form-controls/components/toggle-group-control.tsx +82 -0
  221. package/src/validated-form-controls/components/types.ts +28 -0
  222. package/src/validated-form-controls/control-with-error.tsx +198 -0
  223. package/src/validated-form-controls/index.ts +2 -0
  224. package/src/validated-form-controls/style.scss +75 -0
  225. package/tsconfig.tsbuildinfo +1 -1
  226. package/build/calendar/utils/use-controlled-value.js +0 -58
  227. package/build/calendar/utils/use-controlled-value.js.map +0 -1
  228. package/build-module/calendar/utils/use-controlled-value.js +0 -51
  229. package/build-module/calendar/utils/use-controlled-value.js.map +0 -1
  230. package/build-types/calendar/utils/use-controlled-value.d.ts +0 -27
  231. package/build-types/calendar/utils/use-controlled-value.d.ts.map +0 -1
  232. package/src/calendar/utils/use-controlled-value.ts +0 -61
  233. package/src/dimension-control/style.scss +0 -22
@@ -0,0 +1,137 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.ControlWithError = void 0;
8
+ var _i18n = require("@wordpress/i18n");
9
+ var _icons = require("@wordpress/icons");
10
+ var _element = require("@wordpress/element");
11
+ var _withIgnoreImeEvents = require("../utils/with-ignore-ime-events");
12
+ var _icon = _interopRequireDefault(require("../icon"));
13
+ var _jsxRuntime = require("react/jsx-runtime");
14
+ /**
15
+ * WordPress dependencies
16
+ */
17
+
18
+ /**
19
+ * External dependencies
20
+ */
21
+
22
+ /**
23
+ * Internal dependencies
24
+ */
25
+
26
+ function appendRequiredIndicator(label, required, markWhenOptional) {
27
+ if (required && !markWhenOptional) {
28
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
29
+ children: [label, " ", `(${(0, _i18n.__)('Required')})`]
30
+ });
31
+ }
32
+ if (!required && markWhenOptional) {
33
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
34
+ children: [label, " ", `(${(0, _i18n.__)('Optional')})`]
35
+ });
36
+ }
37
+ return label;
38
+ }
39
+
40
+ /**
41
+ * HTML elements that support the Constraint Validation API.
42
+ *
43
+ * Here, we exclude HTMLButtonElement because although it does technically support the API,
44
+ * normal buttons are actually exempted from any validation.
45
+ * @see https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Form_validation
46
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/willValidate
47
+ */
48
+
49
+ function UnforwardedControlWithError({
50
+ required,
51
+ markWhenOptional,
52
+ customValidator,
53
+ getValidityTarget,
54
+ children
55
+ }, forwardedRef) {
56
+ const [errorMessage, setErrorMessage] = (0, _element.useState)();
57
+ const [isTouched, setIsTouched] = (0, _element.useState)(false);
58
+
59
+ // Ensure that error messages are visible after user attemps to submit a form
60
+ // with multiple invalid fields.
61
+ (0, _element.useEffect)(() => {
62
+ const validityTarget = getValidityTarget();
63
+ const showValidationMessage = () => setErrorMessage(validityTarget?.validationMessage);
64
+ validityTarget?.addEventListener('invalid', showValidationMessage);
65
+ return () => {
66
+ validityTarget?.removeEventListener('invalid', showValidationMessage);
67
+ };
68
+ });
69
+ const validate = () => {
70
+ const message = customValidator?.();
71
+ const validityTarget = getValidityTarget();
72
+ validityTarget?.setCustomValidity(message !== null && message !== void 0 ? message : '');
73
+ setErrorMessage(validityTarget?.validationMessage);
74
+ };
75
+ const onBlur = event => {
76
+ // Only consider "blurred from the component" if focus has fully left the wrapping div.
77
+ // This prevents unnecessary blurs from components with multiple focusable elements.
78
+ if (!event.relatedTarget || !event.currentTarget.contains(event.relatedTarget)) {
79
+ setIsTouched(true);
80
+ const validityTarget = getValidityTarget();
81
+
82
+ // Prevents a double flash of the native error tooltip when the control is already showing one.
83
+ if (!validityTarget?.validity.valid) {
84
+ if (!errorMessage) {
85
+ setErrorMessage(validityTarget?.validationMessage);
86
+ }
87
+ return;
88
+ }
89
+ validate();
90
+ }
91
+ };
92
+ const onChange = (...args) => {
93
+ children.props.onChange?.(...args);
94
+
95
+ // Only validate incrementally if the field has blurred at least once,
96
+ // or currently has an error message.
97
+ if (isTouched || errorMessage) {
98
+ validate();
99
+ }
100
+ };
101
+ const onKeyDown = event => {
102
+ // Ensures that custom validators are triggered when the user submits by pressing Enter,
103
+ // without ever blurring the control.
104
+ if (event.key === 'Enter') {
105
+ validate();
106
+ }
107
+ };
108
+ return (
109
+ /*#__PURE__*/
110
+ // Disable reason: Just listening to a bubbled event, not for interaction.
111
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
112
+ (0, _jsxRuntime.jsxs)("div", {
113
+ className: "components-validated-control",
114
+ ref: forwardedRef,
115
+ onBlur: onBlur,
116
+ onKeyDown: (0, _withIgnoreImeEvents.withIgnoreIMEEvents)(onKeyDown),
117
+ children: [(0, _element.cloneElement)(children, {
118
+ label: appendRequiredIndicator(children.props.label, required, markWhenOptional),
119
+ onChange,
120
+ required
121
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
122
+ "aria-live": "polite",
123
+ children: errorMessage && /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
124
+ className: "components-validated-control__error",
125
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_icon.default, {
126
+ className: "components-validated-control__error-icon",
127
+ icon: _icons.error,
128
+ size: 16,
129
+ fill: "currentColor"
130
+ }), errorMessage]
131
+ })
132
+ })]
133
+ })
134
+ );
135
+ }
136
+ const ControlWithError = exports.ControlWithError = (0, _element.forwardRef)(UnforwardedControlWithError);
137
+ //# sourceMappingURL=control-with-error.js.map
@@ -0,0 +1 @@
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":[]}
@@ -0,0 +1,28 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ var _components = require("./components");
7
+ Object.keys(_components).forEach(function (key) {
8
+ if (key === "default" || key === "__esModule") return;
9
+ if (key in exports && exports[key] === _components[key]) return;
10
+ Object.defineProperty(exports, key, {
11
+ enumerable: true,
12
+ get: function () {
13
+ return _components[key];
14
+ }
15
+ });
16
+ });
17
+ var _controlWithError = require("./control-with-error");
18
+ Object.keys(_controlWithError).forEach(function (key) {
19
+ if (key === "default" || key === "__esModule") return;
20
+ if (key in exports && exports[key] === _controlWithError[key]) return;
21
+ Object.defineProperty(exports, key, {
22
+ enumerable: true,
23
+ get: function () {
24
+ return _controlWithError[key];
25
+ }
26
+ });
27
+ });
28
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
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":[]}
@@ -78,6 +78,10 @@ export function useAutocomplete({
78
78
  // Reset autocomplete state after insertion rather than before
79
79
  // so insertion events don't cause the completion menu to redisplay.
80
80
  reset();
81
+
82
+ // Make sure that the content remains focused after making a selection
83
+ // and that the text cursor position is not lost.
84
+ contentRef.current?.focus();
81
85
  }
82
86
  function reset() {
83
87
  setSelectedIndex(0);
@@ -1 +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":"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;EACR;EAEA,SAASA,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,SAASsB,eAAeA,CAAEC,OAA6B,EAAG;IACzD/B,gBAAgB,CACf+B,OAAO,CAAChB,MAAM,KAAKd,eAAe,CAACc,MAAM,GAAGhB,aAAa,GAAG,CAC7D,CAAC;IACDG,kBAAkB,CAAE6B,OAAQ,CAAC;EAC9B;EAEA,SAASC,aAAaA,CAAEC,KAAoB,EAAG;IAC9CxB,cAAc,CAACyB,OAAO,GAAGD,KAAK,CAACE,GAAG,KAAK,WAAW;IAElD,IAAK,CAAE9B,aAAa,EAAG;MACtB;IACD;IACA,IAAKJ,eAAe,CAACc,MAAM,KAAK,CAAC,EAAG;MACnC;IACD;IAEA,IAAKkB,KAAK,CAACG,gBAAgB,EAAG;MAC7B;IACD;IAEA,QAASH,KAAK,CAACE,GAAG;MACjB,KAAK,SAAS;QAAE;UACf,MAAME,QAAQ,GACb,CAAEtC,aAAa,KAAK,CAAC,GAClBE,eAAe,CAACc,MAAM,GACtBhB,aAAa,IAAK,CAAC;UACvBC,gBAAgB,CAAEqC,QAAS,CAAC;UAC5B;UACA,IAAK1D,SAAS,CAAC,CAAC,EAAG;YAClBD,KAAK,CACJK,WAAW,CAAEkB,eAAe,CAAEoC,QAAQ,CAAE,CAACC,KAAM,CAAC,EAChD,WACD,CAAC;UACF;UACA;QACD;MAEA,KAAK,WAAW;QAAE;UACjB,MAAMD,QAAQ,GAAG,CAAEtC,aAAa,GAAG,CAAC,IAAKE,eAAe,CAACc,MAAM;UAC/Df,gBAAgB,CAAEqC,QAAS,CAAC;UAC5B,IAAK1D,SAAS,CAAC,CAAC,EAAG;YAClBD,KAAK,CACJK,WAAW,CAAEkB,eAAe,CAAEoC,QAAQ,CAAE,CAACC,KAAM,CAAC,EAChD,WACD,CAAC;UACF;UACA;QACD;MAEA,KAAK,QAAQ;QACZhC,gBAAgB,CAAE,IAAK,CAAC;QACxBE,kBAAkB,CAAE,IAAK,CAAC;QAC1ByB,KAAK,CAACM,cAAc,CAAC,CAAC;QACtB;MAED,KAAK,OAAO;QACXrB,MAAM,CAAEjB,eAAe,CAAEF,aAAa,CAAG,CAAC;QAC1C;MAED,KAAK,WAAW;MAChB,KAAK,YAAY;QAChB8B,KAAK,CAAC,CAAC;QACP;MAED;QACC;IACF;;IAEA;IACA;IACAI,KAAK,CAACM,cAAc,CAAC,CAAC;EACvB;;EAEA;EACA;EACA;EACA,MAAMC,WAAW,GAAGvE,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,CAAE0E,WAAW,EAAG;MACpB,IAAKnC,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;;IAEA;IACA;IACA,MAAMY,SAAS,GAAG7C,UAAU,CAAC8C,MAAM,CAClC,CAAEC,WAAW,EAAEC,gBAAgB,KAAM;MACpC,MAAMC,YAAY,GAAGL,WAAW,CAACM,WAAW,CAC3CF,gBAAgB,CAAC9B,aAClB,CAAC;MACD,MAAMiC,gBAAgB,GACrBJ,WAAW,KAAK,IAAI,GACjBH,WAAW,CAACM,WAAW,CAAEH,WAAW,CAAC7B,aAAc,CAAC,GACpD,CAAC,CAAC;MAEN,OAAO+B,YAAY,GAAGE,gBAAgB,GACnCH,gBAAgB,GAChBD,WAAW;IACf,CAAC,EACD,IACD,CAAC;IAED,IAAK,CAAEF,SAAS,EAAG;MAClB,IAAKpC,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,MAAM;MAAEmB,YAAY;MAAElC;IAAc,CAAC,GAAG2B,SAAS;IACjD,MAAMI,YAAY,GAAGL,WAAW,CAACM,WAAW,CAAEhC,aAAc,CAAC;IAC7D,MAAMmC,kBAAkB,GAAGT,WAAW,CAAClE,KAAK,CAC3CuE,YAAY,GAAG/B,aAAa,CAACC,MAC9B,CAAC;IAED,MAAMmC,qBAAqB,GAAGD,kBAAkB,CAAClC,MAAM,GAAG,EAAE,CAAC,CAAC;IAC9D;IACA;IACA;IACA;IACA;IACA,IAAKmC,qBAAqB,EAAG;MAC5B;IACD;IAEA,MAAMC,QAAQ,GAAGlD,eAAe,CAACc,MAAM,KAAK,CAAC;IAC7C,MAAMqC,gBAAgB,GAAGH,kBAAkB,CAACI,KAAK,CAAE,IAAK,CAAC;IACzD;IACA;IACA;IACA;IACA;IACA;IACA;IACA,MAAMC,iBAAiB,GAAGF,gBAAgB,CAACrC,MAAM,KAAK,CAAC;IACvD;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA,MAAMwC,wBAAwB,GAC7B9C,cAAc,CAACyB,OAAO,IAAIkB,gBAAgB,CAACrC,MAAM,IAAI,CAAC;IAEvD,IAAKoC,QAAQ,IAAI,EAAII,wBAAwB,IAAID,iBAAiB,CAAE,EAAG;MACtE,IAAKjD,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,MAAM2B,kBAAkB,GAAG/E,cAAc,CACxCH,KAAK,CAAEmB,MAAM,EAAEkC,SAAS,EAAElD,cAAc,CAAEgB,MAAO,CAAC,CAACsB,MAAO,CAC3D,CAAC;IAED,IACCiC,YAAY,IACZ,CAAEA,YAAY,CACbR,WAAW,CAAClE,KAAK,CAAE,CAAC,EAAEuE,YAAa,CAAC,EACpCW,kBACD,CAAC,EACA;MACD,IAAKnD,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,IACC,KAAK,CAAC4B,IAAI,CAAER,kBAAmB,CAAC,IAChC,QAAQ,CAACQ,IAAI,CAAER,kBAAmB,CAAC,EAClC;MACD,IAAK5C,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,IAAK,CAAE,mBAAmB,CAAC4B,IAAI,CAAER,kBAAmB,CAAC,EAAG;MACvD,IAAK5C,aAAa,EAAG;QACpBwB,KAAK,CAAC,CAAC;MACR;MACA;IACD;IAEA,MAAM6B,WAAW,GAAG7E,YAAY,CAAE4D,SAAS,CAAC3B,aAAc,CAAC;IAC3D,MAAM6C,IAAI,GAAG/F,aAAa,CAAE4E,WAAY,CAAC;IACzC,MAAMoB,KAAK,GAAGD,IAAI,CAChBrF,KAAK,CAAEqF,IAAI,CAACb,WAAW,CAAEL,SAAS,CAAC3B,aAAc,CAAE,CAAC,CACpD8C,KAAK,CAAE,IAAIC,MAAM,CAAE,GAAIH,WAAW,qBAAuB,CAAE,CAAC;IAC9D,MAAMI,KAAK,GAAGF,KAAK,IAAIA,KAAK,CAAE,CAAC,CAAE;IAEjCtD,gBAAgB,CAAEmC,SAAU,CAAC;IAC7BjC,kBAAkB,CAAE,MACnBiC,SAAS,KAAKpC,aAAa,GACxBzB,kBAAkB,CAAE6D,SAAU,CAAC,GAC/BlC,eACJ,CAAC;IACDH,cAAc,CAAE0D,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,GAAG9D,eAAe,CAAEF,aAAa,CAAE,IAAI,CAAC,CAAC;EACxE,MAAM;IAAEiE;EAAU,CAAC,GAAG3D,aAAa,IAAI,CAAC,CAAC;EACzC,MAAM4D,UAAU,GAAG,CAAC,CAAE5D,aAAa,IAAIJ,eAAe,CAACc,MAAM,GAAG,CAAC;EACjE,MAAMmD,SAAS,GAAGD,UAAU,GACzB,mCAAoCnE,UAAU,EAAG,GACjD6B,SAAS;EACZ,MAAMwC,QAAQ,GAAGF,UAAU,GACxB,gCAAiCnE,UAAU,IAAMiE,WAAW,EAAG,GAC/D,IAAI;EACP,MAAMK,YAAY,GAAG3E,MAAM,CAACoB,KAAK,KAAKc,SAAS;EAC/C,MAAM0C,WAAW,GAAG,CAAC,CAAE7B,WAAW,IAAI4B,YAAY,IAAI,CAAC,CAAE7D,eAAe;EAExE,OAAO;IACN2D,SAAS;IACTC,QAAQ;IACRG,SAAS,EAAExF,mBAAmB,CAAEkD,aAAc,CAAC;IAC/CuC,OAAO,EAAEF,WAAW,iBACnBpF,IAAA,CAACsB,eAAe;MACfyD,SAAS,EAAGA,SAAW;MACvB7D,WAAW,EAAGA,WAAa;MAC3BL,UAAU,EAAGA,UAAY;MACzBoE,SAAS,EAAGA,SAAW;MACvBnE,aAAa,EAAGA,aAAe;MAC/B+B,eAAe,EAAGA,eAAiB;MACnC0C,QAAQ,EAAGtD,MAAQ;MACnBK,KAAK,EAAG9B,MAAQ;MAChBI,UAAU,EAAGA,UAAY;MACzBgC,KAAK,EAAGA;IAAO,CACf;EAEH,CAAC;AACF;AAEA,SAAS4C,qBAAqBA,CAAElD,KAAuC,EAAG;EACzE,MAAMmD,OAAO,GAAG1G,MAAM,CAAyB,IAAI2G,GAAG,CAAC,CAAE,CAAC;EAE1DD,OAAO,CAACxC,OAAO,CAAC0C,GAAG,CAAErD,KAAM,CAAC;;EAE5B;EACA,IAAKmD,OAAO,CAACxC,OAAO,CAAC2C,IAAI,GAAG,CAAC,EAAG;IAC/BH,OAAO,CAACxC,OAAO,CAAC4C,MAAM,CAAEC,KAAK,CAACC,IAAI,CAAEN,OAAO,CAACxC,OAAQ,CAAC,CAAE,CAAC,CAAG,CAAC;EAC7D;EAEA,OAAO6C,KAAK,CAACC,IAAI,CAAEN,OAAO,CAACxC,OAAQ,CAAC,CAAE,CAAC,CAAE;AAC1C;AAEA,OAAO,SAAS+C,oBAAoBA,CAAElD,OAA6B,EAAG;EACrE,MAAMmD,GAAG,GAAGlH,MAAM,CAAiB,IAAK,CAAC;EACzC,MAAMmH,YAAY,GAAGnH,MAAM,CAAqC,CAAC;EACjE,MAAM;IAAEyB;EAAO,CAAC,GAAGsC,OAAO;EAC1B,MAAMqD,cAAc,GAAGX,qBAAqB,CAAEhF,MAAO,CAAC;EACtD,MAAM;IAAE8E,OAAO;IAAEL,SAAS;IAAEC,QAAQ;IAAEG;EAAU,CAAC,GAAG9E,eAAe,CAAE;IACpE,GAAGuC,OAAO;IACVlC,UAAU,EAAEqF;EACb,CAAE,CAAC;EACHC,YAAY,CAACjD,OAAO,GAAGoC,SAAS;EAEhC,MAAMe,UAAU,GAAGlH,YAAY,CAAE,CAChC+G,GAAG,EACH9G,YAAY,CAAIkH,OAAoB,IAAM;IACzC,SAASC,UAAUA,CAAEtD,KAAoB,EAAG;MAC3CkD,YAAY,CAACjD,OAAO,GAAID,KAAM,CAAC;IAChC;IACAqD,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,GAAGjG,MAAM,CAACkE,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,GAAGvC,SAAS;IACnD,WAAW,EAAEuC,SAAS;IACtB,uBAAuB,EAAEC;EAC1B,CAAC;AACF;AAEA,eAAe,SAASyB,YAAYA,CAAE;EACrCD,QAAQ;EACRE,UAAU;EACV,GAAG9D;AACe,CAAC,EAAG;EACtB,MAAM;IAAEwC,OAAO;IAAE,GAAGuB;EAAM,CAAC,GAAGtG,eAAe,CAAEuC,OAAQ,CAAC;EACxD,oBACC1C,KAAA,CAAAF,SAAA;IAAAwG,QAAA,GACGA,QAAQ,CAAEG,KAAM,CAAC,EACjBD,UAAU,IAAItB,OAAO;EAAA,CACtB,CAAC;AAEL","ignoreList":[]}
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","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":"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","ignoreList":[]}
@@ -3,12 +3,16 @@
3
3
  */
4
4
  import { DayPicker } from 'react-day-picker';
5
5
  import { enUS } from 'react-day-picker/locale';
6
+ /**
7
+ * WordPress dependencies
8
+ */
9
+ import { useCallback } from '@wordpress/element';
6
10
  /**
7
11
  * Internal dependencies
8
12
  */
9
13
  import { COMMON_PROPS } from '../utils/constants';
10
14
  import { clampNumberOfMonths } from '../utils/misc';
11
- import { useControlledValue } from '../utils/use-controlled-value';
15
+ import { useControlledValue } from '../../utils/hooks';
12
16
  import { useLocalizationProps } from '../utils/use-localization-props';
13
17
  import { jsx as _jsx } from "react/jsx-runtime";
14
18
  /**
@@ -33,10 +37,14 @@ export const DateCalendar = ({
33
37
  timeZone,
34
38
  mode: 'single'
35
39
  });
40
+ const onChange = useCallback((selected, triggerDate, modifiers, e) => {
41
+ // Convert internal `null` to `undefined` for the public event handler.
42
+ onSelect?.(selected !== null && selected !== void 0 ? selected : undefined, triggerDate, modifiers, e);
43
+ }, [onSelect]);
36
44
  const [selected, setSelected] = useControlledValue({
37
45
  defaultValue: defaultSelected,
38
46
  value: selectedProp,
39
- onChange: onSelect
47
+ onChange
40
48
  });
41
49
  return /*#__PURE__*/_jsx(DayPicker, {
42
50
  ...COMMON_PROPS,
@@ -44,7 +52,7 @@ export const DateCalendar = ({
44
52
  ...props,
45
53
  mode: "single",
46
54
  numberOfMonths: clampNumberOfMonths(numberOfMonths),
47
- selected: selected,
55
+ selected: selected !== null && selected !== void 0 ? selected : undefined,
48
56
  onSelect: setSelected
49
57
  });
50
58
  };
@@ -1 +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":[]}
1
+ {"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":[]}
@@ -7,13 +7,13 @@ import { enUS } from 'react-day-picker/locale';
7
7
  /**
8
8
  * WordPress dependencies
9
9
  */
10
- import { useMemo, useState } from '@wordpress/element';
10
+ import { useMemo, useState, useCallback } from '@wordpress/element';
11
11
  /**
12
12
  * Internal dependencies
13
13
  */
14
14
  import { COMMON_PROPS, MODIFIER_CLASSNAMES } from '../utils/constants';
15
15
  import { clampNumberOfMonths } from '../utils/misc';
16
- import { useControlledValue } from '../utils/use-controlled-value';
16
+ import { useControlledValue } from '../../utils/hooks';
17
17
  import { useLocalizationProps } from '../utils/use-localization-props';
18
18
  import { jsx as _jsx } from "react/jsx-runtime";
19
19
  export function usePreviewRange({
@@ -113,10 +113,14 @@ export const DateRangeCalendar = ({
113
113
  timeZone,
114
114
  mode: 'range'
115
115
  });
116
+ const onChange = useCallback((selected, triggerDate, modifiers, e) => {
117
+ // Convert internal `null` to `undefined` for the public event handler.
118
+ onSelect?.(selected !== null && selected !== void 0 ? selected : undefined, triggerDate, modifiers, e);
119
+ }, [onSelect]);
116
120
  const [selected, setSelected] = useControlledValue({
117
121
  defaultValue: defaultSelected,
118
122
  value: selectedProp,
119
- onChange: onSelect
123
+ onChange
120
124
  });
121
125
  const [hoveredDate, setHoveredDate] = useState(undefined);
122
126
 
@@ -146,7 +150,7 @@ export const DateRangeCalendar = ({
146
150
  excludeDisabled: excludeDisabled,
147
151
  min: min,
148
152
  max: max,
149
- selected: selected,
153
+ selected: selected !== null && selected !== void 0 ? selected : undefined,
150
154
  onSelect: setSelected,
151
155
  onDayMouseEnter: date => setHoveredDate(date),
152
156
  onDayMouseLeave: () => setHoveredDate(undefined),
@@ -1 +1 @@
1
- {"version":3,"names":["differenceInCalendarDays","DayPicker","rangeContainsModifiers","enUS","useMemo","useState","COMMON_PROPS","MODIFIER_CLASSNAMES","clampNumberOfMonths","useControlledValue","useLocalizationProps","jsx","_jsx","usePreviewRange","selected","hoveredDate","excludeDisabled","min","max","disabled","from","previewHighlight","potentialNewRange","_selected$to","to","_selected$to2","undefined","DateRangeCalendar","defaultSelected","selectedProp","onSelect","numberOfMonths","locale","timeZone","props","localizationProps","mode","setSelected","defaultValue","value","onChange","setHoveredDate","previewRange","modifiers","preview","preview_start","preview_end","onDayMouseEnter","date","onDayMouseLeave","modifiersClassNames"],"sources":["@wordpress/components/src/calendar/date-range-calendar/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { differenceInCalendarDays } from 'date-fns';\nimport { DayPicker, rangeContainsModifiers } from 'react-day-picker';\nimport { enUS } from 'react-day-picker/locale';\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport { COMMON_PROPS, MODIFIER_CLASSNAMES } from '../utils/constants';\nimport { clampNumberOfMonths } from '../utils/misc';\nimport { useControlledValue } from '../utils/use-controlled-value';\nimport { useLocalizationProps } from '../utils/use-localization-props';\nimport type { DateRangeCalendarProps, DateRange } from '../types';\n\nexport function usePreviewRange( {\n\tselected,\n\thoveredDate,\n\texcludeDisabled,\n\tmin,\n\tmax,\n\tdisabled,\n}: Pick<\n\tDateRangeCalendarProps,\n\t'selected' | 'excludeDisabled' | 'min' | 'max' | 'disabled'\n> & {\n\thoveredDate: Date | undefined;\n} ) {\n\treturn useMemo( () => {\n\t\tif ( ! hoveredDate || ! selected?.from ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet previewHighlight: DateRange | undefined;\n\t\tlet potentialNewRange: { from: Date; to: Date } | undefined;\n\n\t\t// Hovering on a date before the start of the selected range\n\t\tif ( hoveredDate < selected.from ) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: selected.from,\n\t\t\t};\n\n\t\t\tpotentialNewRange = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: selected.to ?? selected.from,\n\t\t\t};\n\t\t} else if (\n\t\t\tselected.to &&\n\t\t\thoveredDate > selected.from &&\n\t\t\thoveredDate < selected.to\n\t\t) {\n\t\t\t// Hovering on a date between the start and end of the selected range\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\n\t\t\tpotentialNewRange = {\n\t\t\t\tfrom: selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t} else if ( hoveredDate > selected.from ) {\n\t\t\t// Hovering on a date after the end of the selected range (either\n\t\t\t// because it's greater than selected.to, or because it's not defined)\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: selected.to ?? selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\n\t\t\tpotentialNewRange = {\n\t\t\t\tfrom: selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\tif (\n\t\t\tmin !== undefined &&\n\t\t\tmin > 0 &&\n\t\t\tpotentialNewRange &&\n\t\t\tdifferenceInCalendarDays(\n\t\t\t\tpotentialNewRange.to,\n\t\t\t\tpotentialNewRange.from\n\t\t\t) < min\n\t\t) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\tif (\n\t\t\tmax !== undefined &&\n\t\t\tmax > 0 &&\n\t\t\tpotentialNewRange &&\n\t\t\tdifferenceInCalendarDays(\n\t\t\t\tpotentialNewRange.to,\n\t\t\t\tpotentialNewRange.from\n\t\t\t) > max\n\t\t) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\tif (\n\t\t\texcludeDisabled &&\n\t\t\tdisabled &&\n\t\t\tpotentialNewRange &&\n\t\t\trangeContainsModifiers( potentialNewRange, disabled )\n\t\t) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\treturn previewHighlight;\n\t}, [ selected, hoveredDate, excludeDisabled, min, max, disabled ] );\n}\n\n/**\n * `DateRangeCalendar` is a React component that provides a customizable calendar\n * interface for **date range** 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 DateRangeCalendar = ( {\n\tdefaultSelected,\n\tselected: selectedProp,\n\tonSelect,\n\tnumberOfMonths = 1,\n\texcludeDisabled,\n\tmin,\n\tmax,\n\tdisabled,\n\tlocale = enUS,\n\ttimeZone,\n\t...props\n}: DateRangeCalendarProps ) => {\n\tconst localizationProps = useLocalizationProps( {\n\t\tlocale,\n\t\ttimeZone,\n\t\tmode: 'range',\n\t} );\n\n\tconst [ selected, setSelected ] = useControlledValue<\n\t\tDateRange | undefined\n\t>( {\n\t\tdefaultValue: defaultSelected,\n\t\tvalue: selectedProp,\n\t\tonChange: onSelect,\n\t} );\n\n\tconst [ hoveredDate, setHoveredDate ] = useState< Date | undefined >(\n\t\tundefined\n\t);\n\n\t// Compute the preview range for hover effect\n\tconst previewRange = usePreviewRange( {\n\t\tselected,\n\t\thoveredDate,\n\t\texcludeDisabled,\n\t\tmin,\n\t\tmax,\n\t\tdisabled,\n\t} );\n\n\tconst modifiers = useMemo( () => {\n\t\treturn {\n\t\t\tpreview: previewRange,\n\t\t\tpreview_start: previewRange?.from,\n\t\t\tpreview_end: previewRange?.to,\n\t\t};\n\t}, [ previewRange ] );\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=\"range\"\n\t\t\tnumberOfMonths={ clampNumberOfMonths( numberOfMonths ) }\n\t\t\tdisabled={ disabled }\n\t\t\texcludeDisabled={ excludeDisabled }\n\t\t\tmin={ min }\n\t\t\tmax={ max }\n\t\t\tselected={ selected }\n\t\t\tonSelect={ setSelected }\n\t\t\tonDayMouseEnter={ ( date ) => setHoveredDate( date ) }\n\t\t\tonDayMouseLeave={ () => setHoveredDate( undefined ) }\n\t\t\tmodifiers={ modifiers }\n\t\t\tmodifiersClassNames={ MODIFIER_CLASSNAMES }\n\t\t/>\n\t);\n};\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["differenceInCalendarDays","DayPicker","rangeContainsModifiers","enUS","useMemo","useState","useCallback","COMMON_PROPS","MODIFIER_CLASSNAMES","clampNumberOfMonths","useControlledValue","useLocalizationProps","jsx","_jsx","usePreviewRange","selected","hoveredDate","excludeDisabled","min","max","disabled","from","previewHighlight","potentialNewRange","_selected$to","to","_selected$to2","undefined","DateRangeCalendar","defaultSelected","selectedProp","onSelect","numberOfMonths","locale","timeZone","props","localizationProps","mode","onChange","triggerDate","modifiers","e","setSelected","defaultValue","value","setHoveredDate","previewRange","preview","preview_start","preview_end","onDayMouseEnter","date","onDayMouseLeave","modifiersClassNames"],"sources":["@wordpress/components/src/calendar/date-range-calendar/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { differenceInCalendarDays } from 'date-fns';\nimport { DayPicker, rangeContainsModifiers } from 'react-day-picker';\nimport { enUS } from 'react-day-picker/locale';\n/**\n * WordPress dependencies\n */\nimport { useMemo, useState, useCallback } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport { COMMON_PROPS, MODIFIER_CLASSNAMES } from '../utils/constants';\nimport { clampNumberOfMonths } from '../utils/misc';\nimport { useControlledValue } from '../../utils/hooks';\nimport { useLocalizationProps } from '../utils/use-localization-props';\nimport type {\n\tDateRangeCalendarProps,\n\tDateRange,\n\tOnSelectHandler,\n} from '../types';\n\nexport function usePreviewRange( {\n\tselected,\n\thoveredDate,\n\texcludeDisabled,\n\tmin,\n\tmax,\n\tdisabled,\n}: Pick<\n\tDateRangeCalendarProps,\n\t'selected' | 'excludeDisabled' | 'min' | 'max' | 'disabled'\n> & {\n\thoveredDate: Date | undefined;\n} ) {\n\treturn useMemo( () => {\n\t\tif ( ! hoveredDate || ! selected?.from ) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet previewHighlight: DateRange | undefined;\n\t\tlet potentialNewRange: { from: Date; to: Date } | undefined;\n\n\t\t// Hovering on a date before the start of the selected range\n\t\tif ( hoveredDate < selected.from ) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: selected.from,\n\t\t\t};\n\n\t\t\tpotentialNewRange = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: selected.to ?? selected.from,\n\t\t\t};\n\t\t} else if (\n\t\t\tselected.to &&\n\t\t\thoveredDate > selected.from &&\n\t\t\thoveredDate < selected.to\n\t\t) {\n\t\t\t// Hovering on a date between the start and end of the selected range\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\n\t\t\tpotentialNewRange = {\n\t\t\t\tfrom: selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t} else if ( hoveredDate > selected.from ) {\n\t\t\t// Hovering on a date after the end of the selected range (either\n\t\t\t// because it's greater than selected.to, or because it's not defined)\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: selected.to ?? selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\n\t\t\tpotentialNewRange = {\n\t\t\t\tfrom: selected.from,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\tif (\n\t\t\tmin !== undefined &&\n\t\t\tmin > 0 &&\n\t\t\tpotentialNewRange &&\n\t\t\tdifferenceInCalendarDays(\n\t\t\t\tpotentialNewRange.to,\n\t\t\t\tpotentialNewRange.from\n\t\t\t) < min\n\t\t) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\tif (\n\t\t\tmax !== undefined &&\n\t\t\tmax > 0 &&\n\t\t\tpotentialNewRange &&\n\t\t\tdifferenceInCalendarDays(\n\t\t\t\tpotentialNewRange.to,\n\t\t\t\tpotentialNewRange.from\n\t\t\t) > max\n\t\t) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\tif (\n\t\t\texcludeDisabled &&\n\t\t\tdisabled &&\n\t\t\tpotentialNewRange &&\n\t\t\trangeContainsModifiers( potentialNewRange, disabled )\n\t\t) {\n\t\t\tpreviewHighlight = {\n\t\t\t\tfrom: hoveredDate,\n\t\t\t\tto: hoveredDate,\n\t\t\t};\n\t\t}\n\n\t\treturn previewHighlight;\n\t}, [ selected, hoveredDate, excludeDisabled, min, max, disabled ] );\n}\n\n/**\n * `DateRangeCalendar` is a React component that provides a customizable calendar\n * interface for **date range** 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 DateRangeCalendar = ( {\n\tdefaultSelected,\n\tselected: selectedProp,\n\tonSelect,\n\tnumberOfMonths = 1,\n\texcludeDisabled,\n\tmin,\n\tmax,\n\tdisabled,\n\tlocale = enUS,\n\ttimeZone,\n\t...props\n}: DateRangeCalendarProps ) => {\n\tconst localizationProps = useLocalizationProps( {\n\t\tlocale,\n\t\ttimeZone,\n\t\tmode: 'range',\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\tconst [ hoveredDate, setHoveredDate ] = useState< Date | undefined >(\n\t\tundefined\n\t);\n\n\t// Compute the preview range for hover effect\n\tconst previewRange = usePreviewRange( {\n\t\tselected,\n\t\thoveredDate,\n\t\texcludeDisabled,\n\t\tmin,\n\t\tmax,\n\t\tdisabled,\n\t} );\n\n\tconst modifiers = useMemo( () => {\n\t\treturn {\n\t\t\tpreview: previewRange,\n\t\t\tpreview_start: previewRange?.from,\n\t\t\tpreview_end: previewRange?.to,\n\t\t};\n\t}, [ previewRange ] );\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=\"range\"\n\t\t\tnumberOfMonths={ clampNumberOfMonths( numberOfMonths ) }\n\t\t\tdisabled={ disabled }\n\t\t\texcludeDisabled={ excludeDisabled }\n\t\t\tmin={ min }\n\t\t\tmax={ max }\n\t\t\tselected={ selected ?? undefined }\n\t\t\tonSelect={ setSelected }\n\t\t\tonDayMouseEnter={ ( date ) => setHoveredDate( date ) }\n\t\t\tonDayMouseLeave={ () => setHoveredDate( undefined ) }\n\t\t\tmodifiers={ modifiers }\n\t\t\tmodifiersClassNames={ MODIFIER_CLASSNAMES }\n\t\t/>\n\t);\n};\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["@wordpress/components/src/calendar/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { Locale } from 'date-fns';\nimport type * as React from 'react';\n\n/**\n * Represents the modifiers that match a specific day in the calendar.\n * @example\n * const modifiers: Modifiers = {\n * today: false, // the day is not today\n * selected: true, // the day is selected\n * disabled: false, // the day is not disabled\n * outside: false, // the day is not outside the month\n * focused: false, // the day is not focused\n *\n * weekend: false // custom modifier example for matching a weekend\n * booked: true // custom modifier example for matching a booked day\n * available: false // custom modifier example for matching an available day\n * };\n */\nexport type Modifiers = Record< string, boolean >;\n\n/**\n * A value or a function that matches a specific day.\n * @example\n * // will always match the day\n * const booleanMatcher: Matcher = true;\n *\n * // will match the today's date\n * const dateMatcher: Matcher = new Date();\n *\n * // will match the days in the array\n * const arrayMatcher: Matcher = [\n * new Date(2019, 1, 2),\n * new Date(2019, 1, 4)\n * ];\n *\n * // will match days after the 2nd of February 2019\n * const afterMatcher: DateAfter = { after: new Date(2019, 1, 2) };\n *\n * // will match days before the 2nd of February 2019 }\n * const beforeMatcher: DateBefore = { before: new Date(2019, 1, 2) };\n *\n * // will match Sundays\n * const dayOfWeekMatcher: DayOfWeek = {\n * dayOfWeek: 0\n * };\n *\n * // will match the included days, except the two dates\n * const intervalMatcher: DateInterval = {\n * after: new Date(2019, 1, 2),\n * before: new Date(2019, 1, 5)\n * };\n *\n * // will match the included days, including the two dates\n * const rangeMatcher: DateRange = {\n * from: new Date(2019, 1, 2),\n * to: new Date(2019, 1, 5)\n * };\n *\n * // will match when the function return true\n * const functionMatcher: Matcher = (day: Date) => {\n * return day.getMonth() === 2; // match when month is March\n * };\n */\ntype Matcher =\n\t| boolean\n\t| ( ( date: Date ) => boolean )\n\t| Date\n\t| Date[]\n\t| DateRange\n\t| DateBefore\n\t| DateAfter\n\t| DateInterval\n\t| DayOfWeek;\n/**\n * Match a day falling after the specified date, with the date not included.\n * @example\n * // Match days after the 2nd of February 2019\n * const matcher: DateAfter = { after: new Date(2019, 1, 2) };\n */\ntype DateAfter = {\n\tafter: Date;\n};\n/**\n * Match a day falling before the specified date, with the date not included.\n * @example\n * // Match days before the 2nd of February 2019\n * const matcher: DateBefore = { before: new Date(2019, 1, 2) };\n */\ntype DateBefore = {\n\tbefore: Date;\n};\n/**\n * An interval of dates. Differently from `DateRange`, the range ends here\n * are not included.\n * @example\n * // Match the days between the 2nd and the 5th of February 2019\n * const matcher: DateInterval = {\n * after: new Date(2019, 1, 2),\n * before: new Date(2019, 1, 5)\n * };\n */\ntype DateInterval = {\n\tbefore: Date;\n\tafter: Date;\n};\n/**\n * A range of dates. The range can be open. Differently from\n * `DateInterval`, the range ends here are included.\n * @example\n * // Match the days between the 2nd and the 5th of February 2019\n * const matcher: DateRange = {\n * from: new Date(2019, 1, 2),\n * to: new Date(2019, 1, 5)\n * };\n */\nexport type DateRange = {\n\tfrom: Date | undefined;\n\tto?: Date | undefined;\n};\n/**\n * Match dates being one of the specified days of the week (`0-6`, where `0` is\n * Sunday).\n * @example\n * // Match Sundays\n * const matcher: DayOfWeek = { dayOfWeek: 0 };\n * // Match weekends\n * const matcher: DayOfWeek = { dayOfWeek: [0, 6] };\n */\ntype DayOfWeek = {\n\tdayOfWeek: number | number[];\n};\n\n/**\n * Shared handler type for `onSelect` callback when a selection mode is set.\n * @example\n * const handleSelect: OnSelectHandler<Date> = (\n * selected,\n * triggerDate,\n * modifiers,\n * e\n * ) => {\n * console.log( \"Selected:\", selected );\n * console.log( \"Triggered by:\", triggerDate );\n * };\n * @template T - The type of the selected item.\n * @callback OnSelectHandler\n * @param {T} selected - The selected item after the event.\n * @param {Date} triggerDate - The date when the event was triggered. This is\n * typically the day clicked or interacted with.\n * @param {Modifiers} modifiers - The modifiers associated with the event.\n * @param {React.MouseEvent | React.KeyboardEvent} e - The event object.\n */\ntype OnSelectHandler< T > = (\n\tselected: T,\n\ttriggerDate: Date,\n\tmodifiers: Modifiers,\n\te: React.MouseEvent | React.KeyboardEvent\n) => void;\n\nexport interface BaseProps\n\textends Omit<\n\t\tReact.HTMLAttributes< HTMLDivElement >,\n\t\t'onSelect' | 'defaultValue'\n\t> {\n\t/**\n\t * Whether the selection is required.\n\t * When `true`, there always needs to be a date selected.\n\t * @default false\n\t */\n\trequired?: boolean;\n\n\t/**\n\t * The initial month to show in the calendar view (uncontrolled).\n\t * @default The current month\n\t */\n\tdefaultMonth?: Date;\n\t/**\n\t * The month displayed in the calendar view (controlled). Use together with\n\t * `onMonthChange` to change the month programmatically.\n\t */\n\tmonth?: Date;\n\t/**\n\t * The number of months displayed at once.\n\t * @default 1\n\t */\n\tnumberOfMonths?: number;\n\t/**\n\t * The earliest month to start the month navigation.\n\t */\n\tstartMonth?: Date;\n\t/**\n\t * The latest month to end the month navigation.\n\t */\n\tendMonth?: Date;\n\t/**\n\t * Focus the first selected day (if set) or today's date (if not disabled).\n\t *\n\t * Use this prop when you need to focus the calendar after a user action\n\t * (e.g. opening the dialog with the calendar).\n\t */\n\tautoFocus?: boolean;\n\t/**\n\t * Specify which days are disabled. Using `true` will disable all dates.\n\t */\n\tdisabled?: Matcher | Matcher[] | undefined;\n\t/**\n\t * Disable the navigation buttons.\n\t */\n\tdisableNavigation?: boolean;\n\t/**\n\t * Use custom labels, useful for translating the component.\n\t *\n\t * For a correct localized experience, consumers should make sure the locale\n\t * used for the translated labels and `locale` prop are consistent.\n\t */\n\tlabels?: {\n\t\t/**\n\t\t * The label for the navigation toolbar.\n\t\t * @default \"\"\n\t\t */\n\t\tlabelNav?: () => string;\n\t\t/**\n\t\t * The label for the month grid.\n\t\t * @default \"LLLL y\" (e.g. \"November 2022\")\n\t\t */\n\t\tlabelGrid?: ( date: Date ) => string;\n\t\t/**\n\t\t * The label for the gridcell, when the calendar is not interactive.\n\t\t * @default The formatted date.\n\t\t */\n\t\tlabelGridcell?: ( date: Date, modifiers?: Modifiers ) => string;\n\t\t/**\n\t\t * The label for the \"next month\" button.\n\t\t * @default \"Go to the Next Month\"\n\t\t */\n\t\tlabelNext?: ( month: Date | undefined ) => string;\n\t\t/**\n\t\t * The label for the \"previous month\" button.\n\t\t * @default \"Go to the Previous Month\"\n\t\t */\n\t\tlabelPrevious?: ( month: Date | undefined ) => string;\n\t\t/**\n\t\t * The label for the day button.\n\t\t * @default The formatted date.\n\t\t */\n\t\tlabelDayButton?: ( date: Date, modifiers?: Modifiers ) => string;\n\t\t/**\n\t\t * The label for the weekday.\n\t\t * @default ( date: Date ) => \"Monday\" | \"Tuesday\" | \"Wednesday\" | \"Thursday\" | \"Friday\" | \"Saturday\" | \"Sunday\"\n\t\t */\n\t\tlabelWeekday?: ( date: Date ) => string;\n\t};\n\n\t/**\n\t * The locale object used to localize dates. Pass a locale from\n\t * `@date-fns/locale` to localize the calendar.\n\t *\n\t * For a correct localized experience, consumers should make sure the locale\n\t * used for the translated labels and `locale` prop are consistent.\n\t * @see https://github.com/date-fns/date-fns/tree/main/src/locale for a list of the supported locales\n\t * @default The `enUS` locale from `@date-fns/locale`\n\t */\n\tlocale?: Locale;\n\t/**\n\t * The index of the first day of the week (0 - Sunday). Overrides the locale's\n\t * one.\n\t * @default Based on the `locale` prop\n\t */\n\tweekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;\n\t/**\n\t * Event fired when the user navigates between months.\n\t */\n\tonMonthChange?: ( month: Date ) => void;\n\t/**\n\t * The time zone (IANA or UTC offset) to use in the calendar.\n\t *\n\t * See\n\t * [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones)\n\t * for the possible values.\n\t *\n\t * When working with time zones, use the `TZDate` object exported by this\n\t * package instead of the native `Date` object.\n\t * @example\n\t * import { DateCalendar, TZDate } from \"@automattic/components\";\n\t *\n\t * export function WithTimeZone() {\n\t * const timeZone = \"America/New_York\";\n\t * const [ selected, setSelected ] = useState< Date | undefined >(\n\t * new TZDate( 2024, 12, 10, timeZone ) // Use `TZDate` instead of `Date`\n\t * );\n\t * return (\n\t * <DateCalendar\n\t * timeZone={ timeZone }\n\t * selected={ selected }\n\t * onSelect={ setSelected }\n\t * />\n\t * );\n\t * }\n\t */\n\ttimeZone?: string;\n\t/**\n\t * The role attribute to add to the container element.\n\t * @default 'application'\n\t */\n\trole?: 'application' | 'dialog' | undefined;\n}\n\ninterface SingleProps {\n\t/** The selected date. */\n\tselected?: Date | undefined | null;\n\t/** Event handler when a day is selected. */\n\tonSelect?: OnSelectHandler< Date | undefined >;\n\t/** The default selected date (for uncontrolled usage). */\n\tdefaultSelected?: Date;\n}\n\ninterface RangeProps {\n\t/**\n\t * When `true`, the range will reset when including a disabled day.\n\t */\n\texcludeDisabled?: boolean;\n\t/**\n\t * The minimum number of nights to include in the range.\n\t */\n\tmin?: number;\n\t/**\n\t * The maximum number of nights to include in the range.\n\t */\n\tmax?: number;\n\t/** The selected range. */\n\tselected?: DateRange | undefined | null;\n\t/** Event handler when the selection changes. */\n\tonSelect?: OnSelectHandler< DateRange | undefined >;\n\t/** The default selected range (for uncontrolled usage). */\n\tdefaultSelected?: DateRange;\n}\n\nexport type DateCalendarProps = BaseProps & SingleProps;\nexport type DateRangeCalendarProps = BaseProps & RangeProps;\n"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"names":[],"sources":["@wordpress/components/src/calendar/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { Locale } from 'date-fns';\nimport type * as React from 'react';\n\n/**\n * Represents the modifiers that match a specific day in the calendar.\n * @example\n * const modifiers: Modifiers = {\n * today: false, // the day is not today\n * selected: true, // the day is selected\n * disabled: false, // the day is not disabled\n * outside: false, // the day is not outside the month\n * focused: false, // the day is not focused\n *\n * weekend: false // custom modifier example for matching a weekend\n * booked: true // custom modifier example for matching a booked day\n * available: false // custom modifier example for matching an available day\n * };\n */\nexport type Modifiers = Record< string, boolean >;\n\n/**\n * A value or a function that matches a specific day.\n * @example\n * // will always match the day\n * const booleanMatcher: Matcher = true;\n *\n * // will match the today's date\n * const dateMatcher: Matcher = new Date();\n *\n * // will match the days in the array\n * const arrayMatcher: Matcher = [\n * new Date(2019, 1, 2),\n * new Date(2019, 1, 4)\n * ];\n *\n * // will match days after the 2nd of February 2019\n * const afterMatcher: DateAfter = { after: new Date(2019, 1, 2) };\n *\n * // will match days before the 2nd of February 2019 }\n * const beforeMatcher: DateBefore = { before: new Date(2019, 1, 2) };\n *\n * // will match Sundays\n * const dayOfWeekMatcher: DayOfWeek = {\n * dayOfWeek: 0\n * };\n *\n * // will match the included days, except the two dates\n * const intervalMatcher: DateInterval = {\n * after: new Date(2019, 1, 2),\n * before: new Date(2019, 1, 5)\n * };\n *\n * // will match the included days, including the two dates\n * const rangeMatcher: DateRange = {\n * from: new Date(2019, 1, 2),\n * to: new Date(2019, 1, 5)\n * };\n *\n * // will match when the function return true\n * const functionMatcher: Matcher = (day: Date) => {\n * return day.getMonth() === 2; // match when month is March\n * };\n */\ntype Matcher =\n\t| boolean\n\t| ( ( date: Date ) => boolean )\n\t| Date\n\t| Date[]\n\t| DateRange\n\t| DateBefore\n\t| DateAfter\n\t| DateInterval\n\t| DayOfWeek;\n/**\n * Match a day falling after the specified date, with the date not included.\n * @example\n * // Match days after the 2nd of February 2019\n * const matcher: DateAfter = { after: new Date(2019, 1, 2) };\n */\ntype DateAfter = {\n\tafter: Date;\n};\n/**\n * Match a day falling before the specified date, with the date not included.\n * @example\n * // Match days before the 2nd of February 2019\n * const matcher: DateBefore = { before: new Date(2019, 1, 2) };\n */\ntype DateBefore = {\n\tbefore: Date;\n};\n/**\n * An interval of dates. Differently from `DateRange`, the range ends here\n * are not included.\n * @example\n * // Match the days between the 2nd and the 5th of February 2019\n * const matcher: DateInterval = {\n * after: new Date(2019, 1, 2),\n * before: new Date(2019, 1, 5)\n * };\n */\ntype DateInterval = {\n\tbefore: Date;\n\tafter: Date;\n};\n/**\n * A range of dates. The range can be open. Differently from\n * `DateInterval`, the range ends here are included.\n * @example\n * // Match the days between the 2nd and the 5th of February 2019\n * const matcher: DateRange = {\n * from: new Date(2019, 1, 2),\n * to: new Date(2019, 1, 5)\n * };\n */\nexport type DateRange = {\n\tfrom: Date | undefined;\n\tto?: Date | undefined;\n};\n/**\n * Match dates being one of the specified days of the week (`0-6`, where `0` is\n * Sunday).\n * @example\n * // Match Sundays\n * const matcher: DayOfWeek = { dayOfWeek: 0 };\n * // Match weekends\n * const matcher: DayOfWeek = { dayOfWeek: [0, 6] };\n */\ntype DayOfWeek = {\n\tdayOfWeek: number | number[];\n};\n\n/**\n * Shared handler type for `onSelect` callback when a selection mode is set.\n * @example\n * const handleSelect: OnSelectHandler<Date> = (\n * selected,\n * triggerDate,\n * modifiers,\n * e\n * ) => {\n * console.log( \"Selected:\", selected );\n * console.log( \"Triggered by:\", triggerDate );\n * };\n * @template T - The type of the selected item.\n * @callback OnSelectHandler\n * @param {T} selected - The selected item after the event.\n * @param {Date} triggerDate - The date when the event was triggered. This is\n * typically the day clicked or interacted with.\n * @param {Modifiers} modifiers - The modifiers associated with the event.\n * @param {React.MouseEvent | React.KeyboardEvent} e - The event object.\n */\nexport type OnSelectHandler< T > = (\n\tselected: T,\n\ttriggerDate: Date,\n\tmodifiers: Modifiers,\n\te: React.MouseEvent | React.KeyboardEvent\n) => void;\n\nexport interface BaseProps\n\textends Omit<\n\t\tReact.HTMLAttributes< HTMLDivElement >,\n\t\t'onSelect' | 'defaultValue'\n\t> {\n\t/**\n\t * Whether the selection is required.\n\t * When `true`, there always needs to be a date selected.\n\t * @default false\n\t */\n\trequired?: boolean;\n\n\t/**\n\t * The initial month to show in the calendar view (uncontrolled).\n\t * @default The current month\n\t */\n\tdefaultMonth?: Date;\n\t/**\n\t * The month displayed in the calendar view (controlled). Use together with\n\t * `onMonthChange` to change the month programmatically.\n\t */\n\tmonth?: Date;\n\t/**\n\t * The number of months displayed at once.\n\t * @default 1\n\t */\n\tnumberOfMonths?: number;\n\t/**\n\t * The earliest month to start the month navigation.\n\t */\n\tstartMonth?: Date;\n\t/**\n\t * The latest month to end the month navigation.\n\t */\n\tendMonth?: Date;\n\t/**\n\t * Focus the first selected day (if set) or today's date (if not disabled).\n\t *\n\t * Use this prop when you need to focus the calendar after a user action\n\t * (e.g. opening the dialog with the calendar).\n\t */\n\tautoFocus?: boolean;\n\t/**\n\t * Specify which days are disabled. Using `true` will disable all dates.\n\t */\n\tdisabled?: Matcher | Matcher[] | undefined;\n\t/**\n\t * Disable the navigation buttons.\n\t */\n\tdisableNavigation?: boolean;\n\t/**\n\t * Use custom labels, useful for translating the component.\n\t *\n\t * For a correct localized experience, consumers should make sure the locale\n\t * used for the translated labels and `locale` prop are consistent.\n\t */\n\tlabels?: {\n\t\t/**\n\t\t * The label for the navigation toolbar.\n\t\t * @default \"\"\n\t\t */\n\t\tlabelNav?: () => string;\n\t\t/**\n\t\t * The label for the month grid.\n\t\t * @default \"LLLL y\" (e.g. \"November 2022\")\n\t\t */\n\t\tlabelGrid?: ( date: Date ) => string;\n\t\t/**\n\t\t * The label for the gridcell, when the calendar is not interactive.\n\t\t * @default The formatted date.\n\t\t */\n\t\tlabelGridcell?: ( date: Date, modifiers?: Modifiers ) => string;\n\t\t/**\n\t\t * The label for the \"next month\" button.\n\t\t * @default \"Go to the Next Month\"\n\t\t */\n\t\tlabelNext?: ( month: Date | undefined ) => string;\n\t\t/**\n\t\t * The label for the \"previous month\" button.\n\t\t * @default \"Go to the Previous Month\"\n\t\t */\n\t\tlabelPrevious?: ( month: Date | undefined ) => string;\n\t\t/**\n\t\t * The label for the day button.\n\t\t * @default The formatted date.\n\t\t */\n\t\tlabelDayButton?: ( date: Date, modifiers?: Modifiers ) => string;\n\t\t/**\n\t\t * The label for the weekday.\n\t\t * @default ( date: Date ) => \"Monday\" | \"Tuesday\" | \"Wednesday\" | \"Thursday\" | \"Friday\" | \"Saturday\" | \"Sunday\"\n\t\t */\n\t\tlabelWeekday?: ( date: Date ) => string;\n\t};\n\n\t/**\n\t * The locale object used to localize dates. Pass a locale from\n\t * `@date-fns/locale` to localize the calendar.\n\t *\n\t * For a correct localized experience, consumers should make sure the locale\n\t * used for the translated labels and `locale` prop are consistent.\n\t * @see https://github.com/date-fns/date-fns/tree/main/src/locale for a list of the supported locales\n\t * @default The `enUS` locale from `@date-fns/locale`\n\t */\n\tlocale?: Locale;\n\t/**\n\t * The index of the first day of the week (0 - Sunday). Overrides the locale's\n\t * one.\n\t * @default Based on the `locale` prop\n\t */\n\tweekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;\n\t/**\n\t * Event fired when the user navigates between months.\n\t */\n\tonMonthChange?: ( month: Date ) => void;\n\t/**\n\t * The time zone (IANA or UTC offset) to use in the calendar.\n\t *\n\t * See\n\t * [Wikipedia](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones)\n\t * for the possible values.\n\t *\n\t * When working with time zones, use the `TZDate` object exported by this\n\t * package instead of the native `Date` object.\n\t * @example\n\t * import { DateCalendar, TZDate } from \"@wordpress/components\";\n\t *\n\t * export function WithTimeZone() {\n\t * const timeZone = \"America/New_York\";\n\t * const [ selected, setSelected ] = useState< Date | undefined >(\n\t * new TZDate( 2024, 12, 10, timeZone ) // Use `TZDate` instead of `Date`\n\t * );\n\t * return (\n\t * <DateCalendar\n\t * timeZone={ timeZone }\n\t * selected={ selected }\n\t * onSelect={ setSelected }\n\t * />\n\t * );\n\t * }\n\t */\n\ttimeZone?: string;\n\t/**\n\t * The role attribute to add to the container element.\n\t * @default 'application'\n\t */\n\trole?: 'application' | 'dialog' | undefined;\n}\n\ninterface SingleProps {\n\t/** The selected date. */\n\tselected?: Date | undefined | null;\n\t/** Event handler when a day is selected. */\n\tonSelect?: OnSelectHandler< Date | undefined >;\n\t/** The default selected date (for uncontrolled usage). */\n\tdefaultSelected?: Date;\n}\n\ninterface RangeProps {\n\t/**\n\t * When `true`, the range will reset when including a disabled day.\n\t */\n\texcludeDisabled?: boolean;\n\t/**\n\t * The minimum number of nights to include in the range.\n\t */\n\tmin?: number;\n\t/**\n\t * The maximum number of nights to include in the range.\n\t */\n\tmax?: number;\n\t/** The selected range. */\n\tselected?: DateRange | undefined | null;\n\t/** Event handler when the selection changes. */\n\tonSelect?: OnSelectHandler< DateRange | undefined >;\n\t/** The default selected range (for uncontrolled usage). */\n\tdefaultSelected?: DateRange;\n}\n\nexport type DateCalendarProps = BaseProps & SingleProps;\nexport type DateRangeCalendarProps = BaseProps & RangeProps;\n"],"mappings":"","ignoreList":[]}
@@ -60,6 +60,8 @@ function Icon({
60
60
  return cloneElement(icon, {
61
61
  // @ts-ignore Just forwarding the size prop along
62
62
  size,
63
+ width: size,
64
+ height: size,
63
65
  ...additionalProps
64
66
  });
65
67
  }
@@ -1 +1 @@
1
- {"version":3,"names":["cloneElement","createElement","isValidElement","SVG","Dashicon","jsx","_jsx","Icon","icon","size","additionalProps","type","appliedProps","props","width","height"],"sources":["@wordpress/components/src/icon/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ComponentType, HTMLProps, SVGProps } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcloneElement,\n\tcreateElement,\n\tisValidElement,\n} from '@wordpress/element';\nimport { SVG } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Dashicon from '../dashicon';\nimport type { IconKey as DashiconIconKey } from '../dashicon/types';\n\nexport type IconType =\n\t| DashiconIconKey\n\t| ComponentType< { size?: number } >\n\t| ( ( props: { size?: number } ) => JSX.Element )\n\t| JSX.Element;\n\ntype AdditionalProps< T > = T extends ComponentType< infer U >\n\t? U\n\t: T extends DashiconIconKey\n\t? SVGProps< SVGSVGElement >\n\t: {};\n\nexport type Props = {\n\t/**\n\t * The icon to render. In most cases, you should use an icon from\n\t * [the `@wordpress/icons` package](https://wordpress.github.io/gutenberg/?path=/story/icons-icon--library).\n\t *\n\t * Other supported values are: component instances, functions,\n\t * [Dashicons](https://developer.wordpress.org/resource/dashicons/)\n\t * (specified as strings), and `null`.\n\t *\n\t * The `size` value, as well as any other additional props, will be passed through.\n\t *\n\t * @default null\n\t */\n\ticon?: IconType | null;\n\t/**\n\t * The size (width and height) of the icon.\n\t *\n\t * Defaults to `20` when `icon` is a string (i.e. a Dashicon id), otherwise `24`.\n\t *\n\t * @default `'string' === typeof icon ? 20 : 24`.\n\t */\n\tsize?: number;\n} & AdditionalProps< IconType >;\n\n/**\n * Renders a raw icon without any initial styling or wrappers.\n *\n * ```jsx\n * import { wordpress } from '@wordpress/icons';\n *\n * <Icon icon={ wordpress } />\n * ```\n */\nfunction Icon( {\n\ticon = null,\n\tsize = 'string' === typeof icon ? 20 : 24,\n\t...additionalProps\n}: Props ) {\n\tif ( 'string' === typeof icon ) {\n\t\treturn (\n\t\t\t<Dashicon\n\t\t\t\ticon={ icon }\n\t\t\t\tsize={ size }\n\t\t\t\t{ ...( additionalProps as HTMLProps< HTMLSpanElement > ) }\n\t\t\t/>\n\t\t);\n\t}\n\n\tif ( isValidElement( icon ) && Dashicon === icon.type ) {\n\t\treturn cloneElement( icon, {\n\t\t\t...additionalProps,\n\t\t} );\n\t}\n\n\tif ( 'function' === typeof icon ) {\n\t\treturn createElement( icon, {\n\t\t\tsize,\n\t\t\t...additionalProps,\n\t\t} );\n\t}\n\n\tif ( icon && ( icon.type === 'svg' || icon.type === SVG ) ) {\n\t\tconst appliedProps = {\n\t\t\t...icon.props,\n\t\t\twidth: size,\n\t\t\theight: size,\n\t\t\t...additionalProps,\n\t\t};\n\n\t\treturn <SVG { ...appliedProps } />;\n\t}\n\n\tif ( isValidElement( icon ) ) {\n\t\treturn cloneElement( icon, {\n\t\t\t// @ts-ignore Just forwarding the size prop along\n\t\t\tsize,\n\t\t\t...additionalProps,\n\t\t} );\n\t}\n\n\treturn icon;\n}\n\nexport default Icon;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,YAAY,EACZC,aAAa,EACbC,cAAc,QACR,oBAAoB;AAC3B,SAASC,GAAG,QAAQ,uBAAuB;;AAE3C;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAuCnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,IAAIA,CAAE;EACdC,IAAI,GAAG,IAAI;EACXC,IAAI,GAAG,QAAQ,KAAK,OAAOD,IAAI,GAAG,EAAE,GAAG,EAAE;EACzC,GAAGE;AACG,CAAC,EAAG;EACV,IAAK,QAAQ,KAAK,OAAOF,IAAI,EAAG;IAC/B,oBACCF,IAAA,CAACF,QAAQ;MACRI,IAAI,EAAGA,IAAM;MACbC,IAAI,EAAGA,IAAM;MAAA,GACNC;IAAe,CACtB,CAAC;EAEJ;EAEA,IAAKR,cAAc,CAAEM,IAAK,CAAC,IAAIJ,QAAQ,KAAKI,IAAI,CAACG,IAAI,EAAG;IACvD,OAAOX,YAAY,CAAEQ,IAAI,EAAE;MAC1B,GAAGE;IACJ,CAAE,CAAC;EACJ;EAEA,IAAK,UAAU,KAAK,OAAOF,IAAI,EAAG;IACjC,OAAOP,aAAa,CAAEO,IAAI,EAAE;MAC3BC,IAAI;MACJ,GAAGC;IACJ,CAAE,CAAC;EACJ;EAEA,IAAKF,IAAI,KAAMA,IAAI,CAACG,IAAI,KAAK,KAAK,IAAIH,IAAI,CAACG,IAAI,KAAKR,GAAG,CAAE,EAAG;IAC3D,MAAMS,YAAY,GAAG;MACpB,GAAGJ,IAAI,CAACK,KAAK;MACbC,KAAK,EAAEL,IAAI;MACXM,MAAM,EAAEN,IAAI;MACZ,GAAGC;IACJ,CAAC;IAED,oBAAOJ,IAAA,CAACH,GAAG;MAAA,GAAMS;IAAY,CAAI,CAAC;EACnC;EAEA,IAAKV,cAAc,CAAEM,IAAK,CAAC,EAAG;IAC7B,OAAOR,YAAY,CAAEQ,IAAI,EAAE;MAC1B;MACAC,IAAI;MACJ,GAAGC;IACJ,CAAE,CAAC;EACJ;EAEA,OAAOF,IAAI;AACZ;AAEA,eAAeD,IAAI","ignoreList":[]}
1
+ {"version":3,"names":["cloneElement","createElement","isValidElement","SVG","Dashicon","jsx","_jsx","Icon","icon","size","additionalProps","type","appliedProps","props","width","height"],"sources":["@wordpress/components/src/icon/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ComponentType, HTMLProps, SVGProps } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcloneElement,\n\tcreateElement,\n\tisValidElement,\n} from '@wordpress/element';\nimport { SVG } from '@wordpress/primitives';\n\n/**\n * Internal dependencies\n */\nimport Dashicon from '../dashicon';\nimport type { IconKey as DashiconIconKey } from '../dashicon/types';\n\nexport type IconType =\n\t| DashiconIconKey\n\t| ComponentType< { size?: number } >\n\t| ( ( props: { size?: number } ) => JSX.Element )\n\t| JSX.Element;\n\ntype AdditionalProps< T > = T extends ComponentType< infer U >\n\t? U\n\t: T extends DashiconIconKey\n\t? SVGProps< SVGSVGElement >\n\t: {};\n\nexport type Props = {\n\t/**\n\t * The icon to render. In most cases, you should use an icon from\n\t * [the `@wordpress/icons` package](https://wordpress.github.io/gutenberg/?path=/story/icons-icon--library).\n\t *\n\t * Other supported values are: component instances, functions,\n\t * [Dashicons](https://developer.wordpress.org/resource/dashicons/)\n\t * (specified as strings), and `null`.\n\t *\n\t * The `size` value, as well as any other additional props, will be passed through.\n\t *\n\t * @default null\n\t */\n\ticon?: IconType | null;\n\t/**\n\t * The size (width and height) of the icon.\n\t *\n\t * Defaults to `20` when `icon` is a string (i.e. a Dashicon id), otherwise `24`.\n\t *\n\t * @default `'string' === typeof icon ? 20 : 24`.\n\t */\n\tsize?: number;\n} & AdditionalProps< IconType >;\n\n/**\n * Renders a raw icon without any initial styling or wrappers.\n *\n * ```jsx\n * import { wordpress } from '@wordpress/icons';\n *\n * <Icon icon={ wordpress } />\n * ```\n */\nfunction Icon( {\n\ticon = null,\n\tsize = 'string' === typeof icon ? 20 : 24,\n\t...additionalProps\n}: Props ) {\n\tif ( 'string' === typeof icon ) {\n\t\treturn (\n\t\t\t<Dashicon\n\t\t\t\ticon={ icon }\n\t\t\t\tsize={ size }\n\t\t\t\t{ ...( additionalProps as HTMLProps< HTMLSpanElement > ) }\n\t\t\t/>\n\t\t);\n\t}\n\n\tif ( isValidElement( icon ) && Dashicon === icon.type ) {\n\t\treturn cloneElement( icon, {\n\t\t\t...additionalProps,\n\t\t} );\n\t}\n\n\tif ( 'function' === typeof icon ) {\n\t\treturn createElement( icon, {\n\t\t\tsize,\n\t\t\t...additionalProps,\n\t\t} );\n\t}\n\n\tif ( icon && ( icon.type === 'svg' || icon.type === SVG ) ) {\n\t\tconst appliedProps = {\n\t\t\t...icon.props,\n\t\t\twidth: size,\n\t\t\theight: size,\n\t\t\t...additionalProps,\n\t\t};\n\n\t\treturn <SVG { ...appliedProps } />;\n\t}\n\n\tif ( isValidElement( icon ) ) {\n\t\treturn cloneElement( icon, {\n\t\t\t// @ts-ignore Just forwarding the size prop along\n\t\t\tsize,\n\t\t\twidth: size,\n\t\t\theight: size,\n\t\t\t...additionalProps,\n\t\t} );\n\t}\n\n\treturn icon;\n}\n\nexport default Icon;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,YAAY,EACZC,aAAa,EACbC,cAAc,QACR,oBAAoB;AAC3B,SAASC,GAAG,QAAQ,uBAAuB;;AAE3C;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAuCnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,IAAIA,CAAE;EACdC,IAAI,GAAG,IAAI;EACXC,IAAI,GAAG,QAAQ,KAAK,OAAOD,IAAI,GAAG,EAAE,GAAG,EAAE;EACzC,GAAGE;AACG,CAAC,EAAG;EACV,IAAK,QAAQ,KAAK,OAAOF,IAAI,EAAG;IAC/B,oBACCF,IAAA,CAACF,QAAQ;MACRI,IAAI,EAAGA,IAAM;MACbC,IAAI,EAAGA,IAAM;MAAA,GACNC;IAAe,CACtB,CAAC;EAEJ;EAEA,IAAKR,cAAc,CAAEM,IAAK,CAAC,IAAIJ,QAAQ,KAAKI,IAAI,CAACG,IAAI,EAAG;IACvD,OAAOX,YAAY,CAAEQ,IAAI,EAAE;MAC1B,GAAGE;IACJ,CAAE,CAAC;EACJ;EAEA,IAAK,UAAU,KAAK,OAAOF,IAAI,EAAG;IACjC,OAAOP,aAAa,CAAEO,IAAI,EAAE;MAC3BC,IAAI;MACJ,GAAGC;IACJ,CAAE,CAAC;EACJ;EAEA,IAAKF,IAAI,KAAMA,IAAI,CAACG,IAAI,KAAK,KAAK,IAAIH,IAAI,CAACG,IAAI,KAAKR,GAAG,CAAE,EAAG;IAC3D,MAAMS,YAAY,GAAG;MACpB,GAAGJ,IAAI,CAACK,KAAK;MACbC,KAAK,EAAEL,IAAI;MACXM,MAAM,EAAEN,IAAI;MACZ,GAAGC;IACJ,CAAC;IAED,oBAAOJ,IAAA,CAACH,GAAG;MAAA,GAAMS;IAAY,CAAI,CAAC;EACnC;EAEA,IAAKV,cAAc,CAAEM,IAAK,CAAC,EAAG;IAC7B,OAAOR,YAAY,CAAEQ,IAAI,EAAE;MAC1B;MACAC,IAAI;MACJK,KAAK,EAAEL,IAAI;MACXM,MAAM,EAAEN,IAAI;MACZ,GAAGC;IACJ,CAAE,CAAC;EACJ;EAEA,OAAOF,IAAI;AACZ;AAEA,eAAeD,IAAI","ignoreList":[]}
@@ -18,7 +18,6 @@ default as __experimentalBoxControl, default as BoxControl, applyValueToSides as
18
18
  export { default as Button } from './button';
19
19
  export { default as ButtonGroup } from './button-group';
20
20
  export { Card, CardBody, CardDivider, CardFooter, CardHeader, CardMedia } from './card';
21
- export { DateCalendar, DateRangeCalendar, TZDate } from './calendar';
22
21
  export { default as CheckboxControl } from './checkbox-control';
23
22
  export { default as ClipboardButton } from './clipboard-button';
24
23
  export { default as __experimentalPaletteEdit } from './palette-edit';