@wordpress/components 26.0.4 → 27.1.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 (382) hide show
  1. package/.stylelintrc.js +2 -2
  2. package/CHANGELOG.md +45 -0
  3. package/CONTRIBUTING.md +72 -0
  4. package/build/autocomplete/index.js +3 -8
  5. package/build/autocomplete/index.js.map +1 -1
  6. package/build/base-control/index.native.js.map +1 -1
  7. package/build/border-box-control/border-box-control/component.js.map +1 -1
  8. package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  9. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  10. package/build/button/index.js +2 -2
  11. package/build/button/index.js.map +1 -1
  12. package/build/button/index.native.js.map +1 -1
  13. package/build/color-picker/component.js +10 -1
  14. package/build/color-picker/component.js.map +1 -1
  15. package/build/color-picker/styles.js +8 -9
  16. package/build/color-picker/styles.js.map +1 -1
  17. package/build/combobox-control/index.js +4 -9
  18. package/build/combobox-control/index.js.map +1 -1
  19. package/build/confirm-dialog/component.js.map +1 -1
  20. package/build/custom-select-control/index.js +2 -15
  21. package/build/custom-select-control/index.js.map +1 -1
  22. package/build/custom-select-control-v2/custom-select-item.js +32 -0
  23. package/build/custom-select-control-v2/custom-select-item.js.map +1 -0
  24. package/build/custom-select-control-v2/custom-select.js +91 -0
  25. package/build/custom-select-control-v2/custom-select.js.map +1 -0
  26. package/build/custom-select-control-v2/default-component/index.js +41 -0
  27. package/build/custom-select-control-v2/default-component/index.js.map +1 -0
  28. package/build/custom-select-control-v2/index.js +13 -82
  29. package/build/custom-select-control-v2/index.js.map +1 -1
  30. package/build/custom-select-control-v2/legacy-component/index.js +123 -0
  31. package/build/custom-select-control-v2/legacy-component/index.js.map +1 -0
  32. package/build/custom-select-control-v2/styles.js +73 -50
  33. package/build/custom-select-control-v2/styles.js.map +1 -1
  34. package/build/custom-select-control-v2/types.js.map +1 -1
  35. package/build/draggable/index.native.js +2 -2
  36. package/build/draggable/index.native.js.map +1 -1
  37. package/build/dropdown-menu/index.native.js.map +1 -1
  38. package/build/flex/flex/hook.js +1 -1
  39. package/build/flex/flex/hook.js.map +1 -1
  40. package/build/font-size-picker/font-size-picker-select.js +0 -1
  41. package/build/font-size-picker/font-size-picker-select.js.map +1 -1
  42. package/build/font-size-picker/index.native.js.map +1 -1
  43. package/build/form-token-field/index.js +3 -8
  44. package/build/form-token-field/index.js.map +1 -1
  45. package/build/form-token-field/suggestions-list.js +5 -12
  46. package/build/form-token-field/suggestions-list.js.map +1 -1
  47. package/build/h-stack/hook.js +6 -1
  48. package/build/h-stack/hook.js.map +1 -1
  49. package/build/mobile/bottom-sheet/button.native.js.map +1 -1
  50. package/build/mobile/bottom-sheet/index.native.js.map +1 -1
  51. package/build/mobile/bottom-sheet/range-cell.native.js.map +1 -1
  52. package/build/mobile/bottom-sheet/stepper-cell/index.native.js.map +1 -1
  53. package/build/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  54. package/build/mobile/bottom-sheet-text-control/index.native.js.map +1 -1
  55. package/build/mobile/gradient/index.native.js.map +1 -1
  56. package/build/mobile/image/index.native.js +4 -13
  57. package/build/mobile/image/index.native.js.map +1 -1
  58. package/build/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +1 -1
  59. package/build/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js.map +1 -1
  60. package/build/mobile/media-edit/index.native.js.map +1 -1
  61. package/build/modal/index.js +2 -10
  62. package/build/modal/index.js.map +1 -1
  63. package/build/palette-edit/index.js.map +1 -1
  64. package/build/progress-bar/styles.js +5 -5
  65. package/build/progress-bar/styles.js.map +1 -1
  66. package/build/query-controls/index.native.js.map +1 -1
  67. package/build/range-control/index.js.map +1 -1
  68. package/build/search-control/index.native.js.map +1 -1
  69. package/build/snackbar/index.js +3 -2
  70. package/build/snackbar/index.js.map +1 -1
  71. package/build/snackbar/list.js +2 -1
  72. package/build/snackbar/list.js.map +1 -1
  73. package/build/snackbar/types.js.map +1 -1
  74. package/build/tabs/index.js +7 -7
  75. package/build/tabs/index.js.map +1 -1
  76. package/build/tabs/types.js.map +1 -1
  77. package/build/utils/hooks/index.js +0 -7
  78. package/build/utils/hooks/index.js.map +1 -1
  79. package/build/utils/with-ignore-ime-events.js +34 -0
  80. package/build/utils/with-ignore-ime-events.js.map +1 -0
  81. package/build-module/autocomplete/index.js +3 -8
  82. package/build-module/autocomplete/index.js.map +1 -1
  83. package/build-module/base-control/index.native.js.map +1 -1
  84. package/build-module/border-box-control/border-box-control/component.js.map +1 -1
  85. package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  86. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  87. package/build-module/button/index.js +2 -2
  88. package/build-module/button/index.js.map +1 -1
  89. package/build-module/button/index.native.js.map +1 -1
  90. package/build-module/color-picker/component.js +11 -2
  91. package/build-module/color-picker/component.js.map +1 -1
  92. package/build-module/color-picker/styles.js +8 -9
  93. package/build-module/color-picker/styles.js.map +1 -1
  94. package/build-module/combobox-control/index.js +4 -9
  95. package/build-module/combobox-control/index.js.map +1 -1
  96. package/build-module/confirm-dialog/component.js.map +1 -1
  97. package/build-module/custom-select-control/index.js +2 -15
  98. package/build-module/custom-select-control/index.js.map +1 -1
  99. package/build-module/custom-select-control-v2/custom-select-item.js +26 -0
  100. package/build-module/custom-select-control-v2/custom-select-item.js.map +1 -0
  101. package/build-module/custom-select-control-v2/custom-select.js +82 -0
  102. package/build-module/custom-select-control-v2/custom-select.js.map +1 -0
  103. package/build-module/custom-select-control-v2/default-component/index.js +30 -0
  104. package/build-module/custom-select-control-v2/default-component/index.js.map +1 -0
  105. package/build-module/custom-select-control-v2/index.js +2 -74
  106. package/build-module/custom-select-control-v2/index.js.map +1 -1
  107. package/build-module/custom-select-control-v2/legacy-component/index.js +111 -0
  108. package/build-module/custom-select-control-v2/legacy-component/index.js.map +1 -0
  109. package/build-module/custom-select-control-v2/styles.js +73 -42
  110. package/build-module/custom-select-control-v2/styles.js.map +1 -1
  111. package/build-module/custom-select-control-v2/types.js.map +1 -1
  112. package/build-module/draggable/index.native.js +2 -2
  113. package/build-module/draggable/index.native.js.map +1 -1
  114. package/build-module/dropdown-menu/index.native.js.map +1 -1
  115. package/build-module/flex/flex/hook.js +1 -1
  116. package/build-module/flex/flex/hook.js.map +1 -1
  117. package/build-module/font-size-picker/font-size-picker-select.js +0 -1
  118. package/build-module/font-size-picker/font-size-picker-select.js.map +1 -1
  119. package/build-module/font-size-picker/index.native.js.map +1 -1
  120. package/build-module/form-token-field/index.js +3 -8
  121. package/build-module/form-token-field/index.js.map +1 -1
  122. package/build-module/form-token-field/suggestions-list.js +5 -12
  123. package/build-module/form-token-field/suggestions-list.js.map +1 -1
  124. package/build-module/h-stack/hook.js +6 -1
  125. package/build-module/h-stack/hook.js.map +1 -1
  126. package/build-module/mobile/bottom-sheet/button.native.js.map +1 -1
  127. package/build-module/mobile/bottom-sheet/index.native.js.map +1 -1
  128. package/build-module/mobile/bottom-sheet/range-cell.native.js.map +1 -1
  129. package/build-module/mobile/bottom-sheet/stepper-cell/index.native.js.map +1 -1
  130. package/build-module/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  131. package/build-module/mobile/bottom-sheet-text-control/index.native.js.map +1 -1
  132. package/build-module/mobile/gradient/index.native.js.map +1 -1
  133. package/build-module/mobile/image/index.native.js +6 -15
  134. package/build-module/mobile/image/index.native.js.map +1 -1
  135. package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +1 -1
  136. package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js.map +1 -1
  137. package/build-module/mobile/media-edit/index.native.js.map +1 -1
  138. package/build-module/modal/index.js +3 -10
  139. package/build-module/modal/index.js.map +1 -1
  140. package/build-module/palette-edit/index.js.map +1 -1
  141. package/build-module/progress-bar/styles.js +5 -5
  142. package/build-module/progress-bar/styles.js.map +1 -1
  143. package/build-module/query-controls/index.native.js.map +1 -1
  144. package/build-module/range-control/index.js.map +1 -1
  145. package/build-module/search-control/index.native.js.map +1 -1
  146. package/build-module/snackbar/index.js +3 -2
  147. package/build-module/snackbar/index.js.map +1 -1
  148. package/build-module/snackbar/list.js +2 -1
  149. package/build-module/snackbar/list.js.map +1 -1
  150. package/build-module/snackbar/types.js.map +1 -1
  151. package/build-module/tabs/index.js +7 -7
  152. package/build-module/tabs/index.js.map +1 -1
  153. package/build-module/tabs/types.js.map +1 -1
  154. package/build-module/utils/hooks/index.js +0 -1
  155. package/build-module/utils/hooks/index.js.map +1 -1
  156. package/build-module/utils/with-ignore-ime-events.js +28 -0
  157. package/build-module/utils/with-ignore-ime-events.js.map +1 -0
  158. package/build-style/style-rtl.css +10 -2
  159. package/build-style/style.css +10 -2
  160. package/build-types/alignment-matrix-control/stories/index.story.d.ts +1 -1
  161. package/build-types/angle-picker-control/stories/index.story.d.ts +1 -1
  162. package/build-types/animate/stories/index.story.d.ts +7 -7
  163. package/build-types/autocomplete/index.d.ts.map +1 -1
  164. package/build-types/base-control/stories/index.story.d.ts +1 -1
  165. package/build-types/border-box-control/stories/index.story.d.ts +1 -1
  166. package/build-types/border-control/stories/index.story.d.ts +6 -6
  167. package/build-types/box-control/stories/index.story.d.ts +6 -6
  168. package/build-types/button/stories/e2e/index.story.d.ts +1 -1
  169. package/build-types/button/stories/index.story.d.ts +7 -7
  170. package/build-types/card/stories/index.story.d.ts +2 -2
  171. package/build-types/circular-option-picker/stories/index.story.d.ts +5 -5
  172. package/build-types/color-palette/stories/index.story.d.ts +3 -3
  173. package/build-types/color-picker/component.d.ts.map +1 -1
  174. package/build-types/color-picker/stories/index.story.d.ts +1 -1
  175. package/build-types/color-picker/styles.d.ts.map +1 -1
  176. package/build-types/combobox-control/index.d.ts.map +1 -1
  177. package/build-types/combobox-control/stories/index.story.d.ts +2 -2
  178. package/build-types/confirm-dialog/stories/index.story.d.ts +2 -2
  179. package/build-types/custom-gradient-picker/stories/index.story.d.ts +1 -1
  180. package/build-types/custom-select-control/index.d.ts.map +1 -1
  181. package/build-types/custom-select-control-v2/custom-select-item.d.ts +9 -0
  182. package/build-types/custom-select-control-v2/custom-select-item.d.ts.map +1 -0
  183. package/build-types/custom-select-control-v2/custom-select.d.ts +6 -0
  184. package/build-types/custom-select-control-v2/custom-select.d.ts.map +1 -0
  185. package/build-types/custom-select-control-v2/default-component/index.d.ts +6 -0
  186. package/build-types/custom-select-control-v2/default-component/index.d.ts.map +1 -0
  187. package/build-types/custom-select-control-v2/index.d.ts +5 -6
  188. package/build-types/custom-select-control-v2/index.d.ts.map +1 -1
  189. package/build-types/custom-select-control-v2/legacy-component/index.d.ts +5 -0
  190. package/build-types/custom-select-control-v2/legacy-component/index.d.ts.map +1 -0
  191. package/build-types/custom-select-control-v2/legacy-component/test/index.d.ts +2 -0
  192. package/build-types/custom-select-control-v2/legacy-component/test/index.d.ts.map +1 -0
  193. package/build-types/custom-select-control-v2/stories/default.story.d.ts +30 -0
  194. package/build-types/custom-select-control-v2/stories/default.story.d.ts.map +1 -0
  195. package/build-types/custom-select-control-v2/stories/legacy.story.d.ts +12 -0
  196. package/build-types/custom-select-control-v2/stories/legacy.story.d.ts.map +1 -0
  197. package/build-types/custom-select-control-v2/styles.d.ts +31 -6
  198. package/build-types/custom-select-control-v2/styles.d.ts.map +1 -1
  199. package/build-types/custom-select-control-v2/types.d.ts +136 -14
  200. package/build-types/custom-select-control-v2/types.d.ts.map +1 -1
  201. package/build-types/dimension-control/stories/index.story.d.ts +2 -2
  202. package/build-types/drop-zone/stories/index.story.d.ts +1 -1
  203. package/build-types/dropdown/stories/index.story.d.ts +3 -3
  204. package/build-types/dropdown-menu/stories/index.story.d.ts +2 -2
  205. package/build-types/dropdown-menu-v2/stories/index.story.d.ts.map +1 -1
  206. package/build-types/duotone-picker/stories/duotone-picker.story.d.ts +1 -1
  207. package/build-types/duotone-picker/stories/duotone-swatch.story.d.ts +3 -3
  208. package/build-types/flex/flex/hook.d.ts +2 -3
  209. package/build-types/flex/flex/hook.d.ts.map +1 -1
  210. package/build-types/focal-point-picker/stories/index.story.d.ts +4 -4
  211. package/build-types/font-size-picker/font-size-picker-select.d.ts.map +1 -1
  212. package/build-types/form-file-upload/stories/index.story.d.ts +5 -5
  213. package/build-types/form-token-field/index.d.ts.map +1 -1
  214. package/build-types/form-token-field/suggestions-list.d.ts.map +1 -1
  215. package/build-types/gradient-picker/stories/index.story.d.ts +3 -3
  216. package/build-types/guide/stories/index.story.d.ts +1 -1
  217. package/build-types/h-stack/hook.d.ts +2 -4
  218. package/build-types/h-stack/hook.d.ts.map +1 -1
  219. package/build-types/icon/stories/index.story.d.ts +4 -4
  220. package/build-types/input-control/stories/index.story.d.ts +6 -6
  221. package/build-types/keyboard-shortcuts/stories/index.story.d.ts +1 -1
  222. package/build-types/menu-group/stories/index.story.d.ts +1 -1
  223. package/build-types/menu-item/stories/index.story.d.ts +4 -4
  224. package/build-types/modal/index.d.ts.map +1 -1
  225. package/build-types/navigation/stories/index.story.d.ts +6 -6
  226. package/build-types/navigation/stories/utils/hide-if-empty.d.ts.map +1 -1
  227. package/build-types/notice/stories/index.story.d.ts +4 -4
  228. package/build-types/number-control/stories/index.story.d.ts +1 -1
  229. package/build-types/palette-edit/stories/index.story.d.ts +2 -2
  230. package/build-types/progress-bar/stories/index.story.d.ts.map +1 -1
  231. package/build-types/query-controls/stories/index.story.d.ts +1 -1
  232. package/build-types/radio-group/stories/index.story.d.ts.map +1 -1
  233. package/build-types/resizable-box/stories/index.story.d.ts +2 -2
  234. package/build-types/responsive-wrapper/stories/index.story.d.ts +1 -1
  235. package/build-types/sandbox/stories/index.story.d.ts +1 -1
  236. package/build-types/search-control/stories/index.story.d.ts +2 -2
  237. package/build-types/select-control/stories/index.story.d.ts +2 -2
  238. package/build-types/shortcut/stories/index.story.d.ts +1 -1
  239. package/build-types/snackbar/index.d.ts +5 -2
  240. package/build-types/snackbar/index.d.ts.map +1 -1
  241. package/build-types/snackbar/list.d.ts.map +1 -1
  242. package/build-types/snackbar/test/index.d.ts +2 -0
  243. package/build-types/snackbar/test/index.d.ts.map +1 -0
  244. package/build-types/snackbar/test/list.d.ts +2 -0
  245. package/build-types/snackbar/test/list.d.ts.map +1 -0
  246. package/build-types/snackbar/types.d.ts +18 -2
  247. package/build-types/snackbar/types.d.ts.map +1 -1
  248. package/build-types/tab-panel/stories/index.story.d.ts +4 -4
  249. package/build-types/tabs/index.d.ts +1 -1
  250. package/build-types/tabs/stories/index.story.d.ts +9 -9
  251. package/build-types/tabs/stories/index.story.d.ts.map +1 -1
  252. package/build-types/tabs/types.d.ts +1 -1
  253. package/build-types/text/stories/index.story.d.ts +3 -3
  254. package/build-types/theme/stories/index.story.d.ts +1 -1
  255. package/build-types/theme/stories/index.story.d.ts.map +1 -1
  256. package/build-types/toggle-control/stories/index.story.d.ts +2 -2
  257. package/build-types/toolbar/stories/index.story.d.ts +3 -3
  258. package/build-types/tooltip/stories/index.story.d.ts +1 -1
  259. package/build-types/tree-grid/stories/index.story.d.ts +1 -1
  260. package/build-types/tree-select/stories/index.story.d.ts +1 -1
  261. package/build-types/utils/hooks/index.d.ts +0 -1
  262. package/build-types/utils/with-ignore-ime-events.d.ts +15 -0
  263. package/build-types/utils/with-ignore-ime-events.d.ts.map +1 -0
  264. package/build-types/v-stack/hook.d.ts +2 -4
  265. package/build-types/v-stack/hook.d.ts.map +1 -1
  266. package/build-types/v-stack/stories/index.story.d.ts +1 -1
  267. package/package.json +19 -20
  268. package/src/alignment-matrix-control/test/index.tsx +3 -1
  269. package/src/autocomplete/index.tsx +3 -10
  270. package/src/base-control/index.native.js +1 -1
  271. package/src/base-control/test/index.tsx +1 -1
  272. package/src/border-box-control/border-box-control/component.tsx +1 -1
  273. package/src/border-box-control/border-box-control-split-controls/component.tsx +4 -4
  274. package/src/border-control/border-control-dropdown/component.tsx +1 -1
  275. package/src/button/index.native.js +1 -1
  276. package/src/button/index.tsx +1 -1
  277. package/src/button/style.scss +1 -3
  278. package/src/circular-option-picker/test/index.tsx +6 -5
  279. package/src/color-picker/component.tsx +22 -11
  280. package/src/color-picker/styles.ts +1 -15
  281. package/src/combobox-control/index.tsx +33 -41
  282. package/src/combobox-control/test/index.tsx +1 -1
  283. package/src/composite/legacy/test/index.tsx +18 -2
  284. package/src/confirm-dialog/component.tsx +1 -1
  285. package/src/confirm-dialog/test/index.tsx +5 -21
  286. package/src/custom-select-control/README.md +0 -10
  287. package/src/custom-select-control/index.js +3 -22
  288. package/src/custom-select-control/stories/index.story.js +0 -1
  289. package/src/custom-select-control/test/index.js +17 -17
  290. package/src/custom-select-control-v2/README.md +97 -7
  291. package/src/custom-select-control-v2/custom-select-item.tsx +29 -0
  292. package/src/custom-select-control-v2/custom-select.tsx +122 -0
  293. package/src/custom-select-control-v2/default-component/index.tsx +27 -0
  294. package/src/custom-select-control-v2/index.tsx +2 -102
  295. package/src/custom-select-control-v2/legacy-component/index.tsx +133 -0
  296. package/src/custom-select-control-v2/legacy-component/test/index.tsx +457 -0
  297. package/src/custom-select-control-v2/stories/{index.story.tsx → default.story.tsx} +27 -33
  298. package/src/custom-select-control-v2/stories/legacy.story.tsx +87 -0
  299. package/src/custom-select-control-v2/styles.ts +82 -38
  300. package/src/custom-select-control-v2/test/index.tsx +207 -17
  301. package/src/custom-select-control-v2/types.ts +147 -20
  302. package/src/disabled/test/index.tsx +1 -1
  303. package/src/draggable/index.native.js +2 -2
  304. package/src/draggable/test/index.native.js +6 -2
  305. package/src/dropdown-menu/index.native.js +2 -2
  306. package/src/dropdown-menu-v2/stories/index.story.tsx +1 -0
  307. package/src/dropdown-menu-v2/test/index.tsx +4 -1
  308. package/src/flex/flex/hook.ts +1 -1
  309. package/src/font-size-picker/font-size-picker-select.tsx +0 -1
  310. package/src/font-size-picker/index.native.js +2 -2
  311. package/src/form-token-field/index.tsx +4 -11
  312. package/src/form-token-field/suggestions-list.tsx +5 -17
  313. package/src/h-stack/hook.tsx +2 -1
  314. package/src/h-stack/test/index.tsx +10 -0
  315. package/src/item-group/test/index.js +2 -2
  316. package/src/mobile/bottom-sheet/bottom-sheet-navigation/test/navigation-container.native.js +10 -15
  317. package/src/mobile/bottom-sheet/button.native.js +1 -5
  318. package/src/mobile/bottom-sheet/index.native.js +2 -2
  319. package/src/mobile/bottom-sheet/range-cell.native.js +1 -1
  320. package/src/mobile/bottom-sheet/stepper-cell/index.native.js +2 -2
  321. package/src/mobile/bottom-sheet-select-control/index.native.js +1 -1
  322. package/src/mobile/bottom-sheet-text-control/index.native.js +1 -1
  323. package/src/mobile/gradient/index.native.js +1 -1
  324. package/src/mobile/image/index.native.js +8 -23
  325. package/src/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js +1 -1
  326. package/src/mobile/media-edit/index.native.js +1 -1
  327. package/src/modal/index.tsx +2 -12
  328. package/src/modal/style.scss +1 -0
  329. package/src/modal/test/index.tsx +1 -1
  330. package/src/navigation/stories/utils/hide-if-empty.tsx +2 -6
  331. package/src/palette-edit/index.tsx +2 -2
  332. package/src/popover/test/index.tsx +1 -4
  333. package/src/progress-bar/stories/index.story.tsx +1 -0
  334. package/src/progress-bar/styles.ts +2 -2
  335. package/src/query-controls/index.native.js +2 -2
  336. package/src/radio-group/stories/index.story.tsx +1 -0
  337. package/src/range-control/index.tsx +3 -3
  338. package/src/range-control/test/index.tsx +2 -2
  339. package/src/search-control/index.native.js +1 -1
  340. package/src/snackbar/index.tsx +5 -2
  341. package/src/snackbar/list.tsx +6 -1
  342. package/src/snackbar/stories/list.story.tsx +0 -3
  343. package/src/snackbar/test/index.tsx +267 -0
  344. package/src/snackbar/test/list.tsx +46 -0
  345. package/src/snackbar/types.ts +31 -3
  346. package/src/tab-panel/test/index.tsx +8 -1
  347. package/src/tabs/README.md +18 -18
  348. package/src/tabs/index.tsx +7 -7
  349. package/src/tabs/stories/index.story.tsx +2 -1
  350. package/src/tabs/test/index.tsx +66 -36
  351. package/src/tabs/types.ts +1 -1
  352. package/src/theme/stories/index.story.tsx +1 -0
  353. package/src/toggle-group-control/test/index.tsx +5 -1
  354. package/src/toolbar/toolbar-group/style.scss +1 -0
  355. package/src/tools-panel/stories/index.story.tsx +8 -8
  356. package/src/tools-panel/test/index.tsx +10 -28
  357. package/src/tooltip/style.scss +2 -1
  358. package/src/tooltip/test/index.native.js +3 -3
  359. package/src/tooltip/test/index.tsx +5 -0
  360. package/src/tree-grid/test/index.tsx +1 -1
  361. package/src/utils/hooks/index.js +0 -1
  362. package/src/utils/with-ignore-ime-events.ts +32 -0
  363. package/src/v-stack/test/index.tsx +10 -0
  364. package/tsconfig.json +0 -1
  365. package/tsconfig.tsbuildinfo +1 -1
  366. package/build/custom-select-control/styles.js +0 -27
  367. package/build/custom-select-control/styles.js.map +0 -1
  368. package/build/utils/hooks/use-latest-ref.js +0 -33
  369. package/build/utils/hooks/use-latest-ref.js.map +0 -1
  370. package/build-module/custom-select-control/styles.js +0 -18
  371. package/build-module/custom-select-control/styles.js.map +0 -1
  372. package/build-module/utils/hooks/use-latest-ref.js +0 -27
  373. package/build-module/utils/hooks/use-latest-ref.js.map +0 -1
  374. package/build-types/custom-select-control/styles.d.ts +0 -11
  375. package/build-types/custom-select-control/styles.d.ts.map +0 -1
  376. package/build-types/custom-select-control-v2/stories/index.story.d.ts +0 -20
  377. package/build-types/custom-select-control-v2/stories/index.story.d.ts.map +0 -1
  378. package/build-types/utils/hooks/use-latest-ref.d.ts +0 -15
  379. package/build-types/utils/hooks/use-latest-ref.d.ts.map +0 -1
  380. package/src/custom-select-control/styles.ts +0 -28
  381. package/src/utils/hooks/test/use-latest-ref.js +0 -119
  382. package/src/utils/hooks/use-latest-ref.ts +0 -29
@@ -59,7 +59,7 @@ export function useFlex(props) {
59
59
  justifyContent: justify,
60
60
  height: isColumn && expanded ? '100%' : undefined,
61
61
  width: !isColumn && expanded ? '100%' : undefined
62
- }, process.env.NODE_ENV === "production" ? "" : ";label:base;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmxleC9mbGV4L2hvb2sudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0VlIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmxleC9mbGV4L2hvb2sudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcbmltcG9ydCBkZXByZWNhdGVkIGZyb20gJ0B3b3JkcHJlc3MvZGVwcmVjYXRlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB0eXBlIHsgV29yZFByZXNzQ29tcG9uZW50UHJvcHMgfSBmcm9tICcuLi8uLi9jb250ZXh0JztcbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0gfSBmcm9tICcuLi8uLi9jb250ZXh0JztcbmltcG9ydCB7IHVzZVJlc3BvbnNpdmVWYWx1ZSB9IGZyb20gJy4uLy4uL3V0aWxzL3VzZS1yZXNwb25zaXZlLXZhbHVlJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vLi4vdXRpbHMvc3BhY2UnO1xuaW1wb3J0ICogYXMgc3R5bGVzIGZyb20gJy4uL3N0eWxlcyc7XG5pbXBvcnQgeyB1c2VDeCB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHsgRmxleFByb3BzIH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5mdW5jdGlvbiB1c2VEZXByZWNhdGVkUHJvcHMoXG5cdHByb3BzOiBXb3JkUHJlc3NDb21wb25lbnRQcm9wczwgRmxleFByb3BzLCAnZGl2JyA+XG4pOiBXb3JkUHJlc3NDb21wb25lbnRQcm9wczwgRmxleFByb3BzLCAnZGl2JyA+IHtcblx0Y29uc3QgeyBpc1JldmVyc2VkLCAuLi5vdGhlclByb3BzIH0gPSBwcm9wcztcblxuXHRpZiAoIHR5cGVvZiBpc1JldmVyc2VkICE9PSAndW5kZWZpbmVkJyApIHtcblx0XHRkZXByZWNhdGVkKCAnRmxleCBpc1JldmVyc2VkJywge1xuXHRcdFx0YWx0ZXJuYXRpdmU6ICdGbGV4IGRpcmVjdGlvbj1cInJvdy1yZXZlcnNlXCIgb3IgXCJjb2x1bW4tcmV2ZXJzZVwiJyxcblx0XHRcdHNpbmNlOiAnNS45Jyxcblx0XHR9ICk7XG5cdFx0cmV0dXJuIHtcblx0XHRcdC4uLm90aGVyUHJvcHMsXG5cdFx0XHRkaXJlY3Rpb246IGlzUmV2ZXJzZWQgPyAncm93LXJldmVyc2UnIDogJ3JvdycsXG5cdFx0fTtcblx0fVxuXG5cdHJldHVybiBvdGhlclByb3BzO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gdXNlRmxleCggcHJvcHM6IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBGbGV4UHJvcHMsICdkaXYnID4gKSB7XG5cdGNvbnN0IHtcblx0XHRhbGlnbixcblx0XHRjbGFzc05hbWUsXG5cdFx0ZGlyZWN0aW9uOiBkaXJlY3Rpb25Qcm9wID0gJ3JvdycsXG5cdFx0ZXhwYW5kZWQgPSB0cnVlLFxuXHRcdGdhcCA9IDIsXG5cdFx0anVzdGlmeSA9ICdzcGFjZS1iZXR3ZWVuJyxcblx0XHR3cmFwID0gZmFsc2UsXG5cdFx0Li4ub3RoZXJQcm9wc1xuXHR9ID0gdXNlQ29udGV4dFN5c3RlbSggdXNlRGVwcmVjYXRlZFByb3BzKCBwcm9wcyApLCAnRmxleCcgKTtcblxuXHRjb25zdCBkaXJlY3Rpb25Bc0FycmF5ID0gQXJyYXkuaXNBcnJheSggZGlyZWN0aW9uUHJvcCApXG5cdFx0PyBkaXJlY3Rpb25Qcm9wXG5cdFx0OiBbIGRpcmVjdGlvblByb3AgXTtcblx0Y29uc3QgZGlyZWN0aW9uID0gdXNlUmVzcG9uc2l2ZVZhbHVlKCBkaXJlY3Rpb25Bc0FycmF5ICk7XG5cblx0Y29uc3QgaXNDb2x1bW4gPVxuXHRcdHR5cGVvZiBkaXJlY3Rpb24gPT09ICdzdHJpbmcnICYmICEhIGRpcmVjdGlvbi5pbmNsdWRlcyggJ2NvbHVtbicgKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgY2xhc3NlcyA9IHVzZU1lbW8oICgpID0+IHtcblx0XHRjb25zdCBiYXNlID0gY3NzKCB7XG5cdFx0XHRhbGlnbkl0ZW1zOiBhbGlnbiA/PyAoIGlzQ29sdW1uID8gJ25vcm1hbCcgOiAnY2VudGVyJyApLFxuXHRcdFx0ZmxleERpcmVjdGlvbjogZGlyZWN0aW9uLFxuXHRcdFx0ZmxleFdyYXA6IHdyYXAgPyAnd3JhcCcgOiB1bmRlZmluZWQsXG5cdFx0XHRnYXA6IHNwYWNlKCBnYXAgKSxcblx0XHRcdGp1c3RpZnlDb250ZW50OiBqdXN0aWZ5LFxuXHRcdFx0aGVpZ2h0OiBpc0NvbHVtbiAmJiBleHBhbmRlZCA/ICcxMDAlJyA6IHVuZGVmaW5lZCxcblx0XHRcdHdpZHRoOiAhIGlzQ29sdW1uICYmIGV4cGFuZGVkID8gJzEwMCUnIDogdW5kZWZpbmVkLFxuXHRcdH0gKTtcblxuXHRcdHJldHVybiBjeChcblx0XHRcdHN0eWxlcy5GbGV4LFxuXHRcdFx0YmFzZSxcblx0XHRcdGlzQ29sdW1uID8gc3R5bGVzLkl0ZW1zQ29sdW1uIDogc3R5bGVzLkl0ZW1zUm93LFxuXHRcdFx0Y2xhc3NOYW1lXG5cdFx0KTtcblx0fSwgW1xuXHRcdGFsaWduLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRjeCxcblx0XHRkaXJlY3Rpb24sXG5cdFx0ZXhwYW5kZWQsXG5cdFx0Z2FwLFxuXHRcdGlzQ29sdW1uLFxuXHRcdGp1c3RpZnksXG5cdFx0d3JhcCxcblx0XSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgaXNDb2x1bW4gfTtcbn1cbiJdfQ== */");
62
+ }, process.env.NODE_ENV === "production" ? "" : ";label:base;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmxleC9mbGV4L2hvb2sudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0VlIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmxleC9mbGV4L2hvb2sudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyB1c2VNZW1vIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcbmltcG9ydCBkZXByZWNhdGVkIGZyb20gJ0B3b3JkcHJlc3MvZGVwcmVjYXRlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB0eXBlIHsgV29yZFByZXNzQ29tcG9uZW50UHJvcHMgfSBmcm9tICcuLi8uLi9jb250ZXh0JztcbmltcG9ydCB7IHVzZUNvbnRleHRTeXN0ZW0gfSBmcm9tICcuLi8uLi9jb250ZXh0JztcbmltcG9ydCB7IHVzZVJlc3BvbnNpdmVWYWx1ZSB9IGZyb20gJy4uLy4uL3V0aWxzL3VzZS1yZXNwb25zaXZlLXZhbHVlJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vLi4vdXRpbHMvc3BhY2UnO1xuaW1wb3J0ICogYXMgc3R5bGVzIGZyb20gJy4uL3N0eWxlcyc7XG5pbXBvcnQgeyB1c2VDeCB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHsgRmxleFByb3BzIH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5mdW5jdGlvbiB1c2VEZXByZWNhdGVkUHJvcHMoXG5cdHByb3BzOiBXb3JkUHJlc3NDb21wb25lbnRQcm9wczwgRmxleFByb3BzLCAnZGl2JyA+XG4pOiBPbWl0PCB0eXBlb2YgcHJvcHMsICdpc1JldmVyc2VkJyA+IHtcblx0Y29uc3QgeyBpc1JldmVyc2VkLCAuLi5vdGhlclByb3BzIH0gPSBwcm9wcztcblxuXHRpZiAoIHR5cGVvZiBpc1JldmVyc2VkICE9PSAndW5kZWZpbmVkJyApIHtcblx0XHRkZXByZWNhdGVkKCAnRmxleCBpc1JldmVyc2VkJywge1xuXHRcdFx0YWx0ZXJuYXRpdmU6ICdGbGV4IGRpcmVjdGlvbj1cInJvdy1yZXZlcnNlXCIgb3IgXCJjb2x1bW4tcmV2ZXJzZVwiJyxcblx0XHRcdHNpbmNlOiAnNS45Jyxcblx0XHR9ICk7XG5cdFx0cmV0dXJuIHtcblx0XHRcdC4uLm90aGVyUHJvcHMsXG5cdFx0XHRkaXJlY3Rpb246IGlzUmV2ZXJzZWQgPyAncm93LXJldmVyc2UnIDogJ3JvdycsXG5cdFx0fTtcblx0fVxuXG5cdHJldHVybiBvdGhlclByb3BzO1xufVxuXG5leHBvcnQgZnVuY3Rpb24gdXNlRmxleCggcHJvcHM6IFdvcmRQcmVzc0NvbXBvbmVudFByb3BzPCBGbGV4UHJvcHMsICdkaXYnID4gKSB7XG5cdGNvbnN0IHtcblx0XHRhbGlnbixcblx0XHRjbGFzc05hbWUsXG5cdFx0ZGlyZWN0aW9uOiBkaXJlY3Rpb25Qcm9wID0gJ3JvdycsXG5cdFx0ZXhwYW5kZWQgPSB0cnVlLFxuXHRcdGdhcCA9IDIsXG5cdFx0anVzdGlmeSA9ICdzcGFjZS1iZXR3ZWVuJyxcblx0XHR3cmFwID0gZmFsc2UsXG5cdFx0Li4ub3RoZXJQcm9wc1xuXHR9ID0gdXNlQ29udGV4dFN5c3RlbSggdXNlRGVwcmVjYXRlZFByb3BzKCBwcm9wcyApLCAnRmxleCcgKTtcblxuXHRjb25zdCBkaXJlY3Rpb25Bc0FycmF5ID0gQXJyYXkuaXNBcnJheSggZGlyZWN0aW9uUHJvcCApXG5cdFx0PyBkaXJlY3Rpb25Qcm9wXG5cdFx0OiBbIGRpcmVjdGlvblByb3AgXTtcblx0Y29uc3QgZGlyZWN0aW9uID0gdXNlUmVzcG9uc2l2ZVZhbHVlKCBkaXJlY3Rpb25Bc0FycmF5ICk7XG5cblx0Y29uc3QgaXNDb2x1bW4gPVxuXHRcdHR5cGVvZiBkaXJlY3Rpb24gPT09ICdzdHJpbmcnICYmICEhIGRpcmVjdGlvbi5pbmNsdWRlcyggJ2NvbHVtbicgKTtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgY2xhc3NlcyA9IHVzZU1lbW8oICgpID0+IHtcblx0XHRjb25zdCBiYXNlID0gY3NzKCB7XG5cdFx0XHRhbGlnbkl0ZW1zOiBhbGlnbiA/PyAoIGlzQ29sdW1uID8gJ25vcm1hbCcgOiAnY2VudGVyJyApLFxuXHRcdFx0ZmxleERpcmVjdGlvbjogZGlyZWN0aW9uLFxuXHRcdFx0ZmxleFdyYXA6IHdyYXAgPyAnd3JhcCcgOiB1bmRlZmluZWQsXG5cdFx0XHRnYXA6IHNwYWNlKCBnYXAgKSxcblx0XHRcdGp1c3RpZnlDb250ZW50OiBqdXN0aWZ5LFxuXHRcdFx0aGVpZ2h0OiBpc0NvbHVtbiAmJiBleHBhbmRlZCA/ICcxMDAlJyA6IHVuZGVmaW5lZCxcblx0XHRcdHdpZHRoOiAhIGlzQ29sdW1uICYmIGV4cGFuZGVkID8gJzEwMCUnIDogdW5kZWZpbmVkLFxuXHRcdH0gKTtcblxuXHRcdHJldHVybiBjeChcblx0XHRcdHN0eWxlcy5GbGV4LFxuXHRcdFx0YmFzZSxcblx0XHRcdGlzQ29sdW1uID8gc3R5bGVzLkl0ZW1zQ29sdW1uIDogc3R5bGVzLkl0ZW1zUm93LFxuXHRcdFx0Y2xhc3NOYW1lXG5cdFx0KTtcblx0fSwgW1xuXHRcdGFsaWduLFxuXHRcdGNsYXNzTmFtZSxcblx0XHRjeCxcblx0XHRkaXJlY3Rpb24sXG5cdFx0ZXhwYW5kZWQsXG5cdFx0Z2FwLFxuXHRcdGlzQ29sdW1uLFxuXHRcdGp1c3RpZnksXG5cdFx0d3JhcCxcblx0XSApO1xuXG5cdHJldHVybiB7IC4uLm90aGVyUHJvcHMsIGNsYXNzTmFtZTogY2xhc3NlcywgaXNDb2x1bW4gfTtcbn1cbiJdfQ== */");
63
63
  return cx(styles.Flex, base, isColumn ? styles.ItemsColumn : styles.ItemsRow, className);
64
64
  }, [align, className, cx, direction, expanded, gap, isColumn, justify, wrap]);
65
65
  return {
@@ -1 +1 @@
1
- {"version":3,"names":["css","useMemo","deprecated","useContextSystem","useResponsiveValue","space","styles","useCx","useDeprecatedProps","props","isReversed","otherProps","alternative","since","direction","useFlex","align","className","directionProp","expanded","gap","justify","wrap","directionAsArray","Array","isArray","isColumn","includes","cx","classes","base","alignItems","flexDirection","flexWrap","undefined","justifyContent","height","width","process","env","NODE_ENV","Flex","ItemsColumn","ItemsRow"],"sources":["@wordpress/components/src/flex/flex/hook.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { useContextSystem } from '../../context';\nimport { useResponsiveValue } from '../../utils/use-responsive-value';\nimport { space } from '../../utils/space';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils';\nimport type { FlexProps } from '../types';\n\nfunction useDeprecatedProps(\n\tprops: WordPressComponentProps< FlexProps, 'div' >\n): WordPressComponentProps< FlexProps, 'div' > {\n\tconst { isReversed, ...otherProps } = props;\n\n\tif ( typeof isReversed !== 'undefined' ) {\n\t\tdeprecated( 'Flex isReversed', {\n\t\t\talternative: 'Flex direction=\"row-reverse\" or \"column-reverse\"',\n\t\t\tsince: '5.9',\n\t\t} );\n\t\treturn {\n\t\t\t...otherProps,\n\t\t\tdirection: isReversed ? 'row-reverse' : 'row',\n\t\t};\n\t}\n\n\treturn otherProps;\n}\n\nexport function useFlex( props: WordPressComponentProps< FlexProps, 'div' > ) {\n\tconst {\n\t\talign,\n\t\tclassName,\n\t\tdirection: directionProp = 'row',\n\t\texpanded = true,\n\t\tgap = 2,\n\t\tjustify = 'space-between',\n\t\twrap = false,\n\t\t...otherProps\n\t} = useContextSystem( useDeprecatedProps( props ), 'Flex' );\n\n\tconst directionAsArray = Array.isArray( directionProp )\n\t\t? directionProp\n\t\t: [ directionProp ];\n\tconst direction = useResponsiveValue( directionAsArray );\n\n\tconst isColumn =\n\t\ttypeof direction === 'string' && !! direction.includes( 'column' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo( () => {\n\t\tconst base = css( {\n\t\t\talignItems: align ?? ( isColumn ? 'normal' : 'center' ),\n\t\t\tflexDirection: direction,\n\t\t\tflexWrap: wrap ? 'wrap' : undefined,\n\t\t\tgap: space( gap ),\n\t\t\tjustifyContent: justify,\n\t\t\theight: isColumn && expanded ? '100%' : undefined,\n\t\t\twidth: ! isColumn && expanded ? '100%' : undefined,\n\t\t} );\n\n\t\treturn cx(\n\t\t\tstyles.Flex,\n\t\t\tbase,\n\t\t\tisColumn ? styles.ItemsColumn : styles.ItemsRow,\n\t\t\tclassName\n\t\t);\n\t}, [\n\t\talign,\n\t\tclassName,\n\t\tcx,\n\t\tdirection,\n\t\texpanded,\n\t\tgap,\n\t\tisColumn,\n\t\tjustify,\n\t\twrap,\n\t] );\n\n\treturn { ...otherProps, className: classes, isColumn };\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,GAAG,QAAQ,gBAAgB;;AAEpC;AACA;AACA;AACA,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,OAAOC,UAAU,MAAM,uBAAuB;;AAE9C;AACA;AACA;;AAEA,SAASC,gBAAgB,QAAQ,eAAe;AAChD,SAASC,kBAAkB,QAAQ,kCAAkC;AACrE,SAASC,KAAK,QAAQ,mBAAmB;AACzC,OAAO,KAAKC,MAAM,MAAM,WAAW;AACnC,SAASC,KAAK,QAAQ,aAAa;AAGnC,SAASC,kBAAkBA,CAC1BC,KAAkD,EACJ;EAC9C,MAAM;IAAEC,UAAU;IAAE,GAAGC;EAAW,CAAC,GAAGF,KAAK;EAE3C,IAAK,OAAOC,UAAU,KAAK,WAAW,EAAG;IACxCR,UAAU,CAAE,iBAAiB,EAAE;MAC9BU,WAAW,EAAE,kDAAkD;MAC/DC,KAAK,EAAE;IACR,CAAE,CAAC;IACH,OAAO;MACN,GAAGF,UAAU;MACbG,SAAS,EAAEJ,UAAU,GAAG,aAAa,GAAG;IACzC,CAAC;EACF;EAEA,OAAOC,UAAU;AAClB;AAEA,OAAO,SAASI,OAAOA,CAAEN,KAAkD,EAAG;EAC7E,MAAM;IACLO,KAAK;IACLC,SAAS;IACTH,SAAS,EAAEI,aAAa,GAAG,KAAK;IAChCC,QAAQ,GAAG,IAAI;IACfC,GAAG,GAAG,CAAC;IACPC,OAAO,GAAG,eAAe;IACzBC,IAAI,GAAG,KAAK;IACZ,GAAGX;EACJ,CAAC,GAAGR,gBAAgB,CAAEK,kBAAkB,CAAEC,KAAM,CAAC,EAAE,MAAO,CAAC;EAE3D,MAAMc,gBAAgB,GAAGC,KAAK,CAACC,OAAO,CAAEP,aAAc,CAAC,GACpDA,aAAa,GACb,CAAEA,aAAa,CAAE;EACpB,MAAMJ,SAAS,GAAGV,kBAAkB,CAAEmB,gBAAiB,CAAC;EAExD,MAAMG,QAAQ,GACb,OAAOZ,SAAS,KAAK,QAAQ,IAAI,CAAC,CAAEA,SAAS,CAACa,QAAQ,CAAE,QAAS,CAAC;EAEnE,MAAMC,EAAE,GAAGrB,KAAK,CAAC,CAAC;EAElB,MAAMsB,OAAO,GAAG5B,OAAO,CAAE,MAAM;IAC9B,MAAM6B,IAAI,gBAAG9B,GAAG,CAAE;MACjB+B,UAAU,EAAEf,KAAK,aAALA,KAAK,cAALA,KAAK,GAAMU,QAAQ,GAAG,QAAQ,GAAG,QAAU;MACvDM,aAAa,EAAElB,SAAS;MACxBmB,QAAQ,EAAEX,IAAI,GAAG,MAAM,GAAGY,SAAS;MACnCd,GAAG,EAAEf,KAAK,CAAEe,GAAI,CAAC;MACjBe,cAAc,EAAEd,OAAO;MACvBe,MAAM,EAAEV,QAAQ,IAAIP,QAAQ,GAAG,MAAM,GAAGe,SAAS;MACjDG,KAAK,EAAE,CAAEX,QAAQ,IAAIP,QAAQ,GAAG,MAAM,GAAGe;IAC1C,CAAC,EAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,yCAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,sgHAAC,CAAC;IAEH,OAAOZ,EAAE,CACRtB,MAAM,CAACmC,IAAI,EACXX,IAAI,EACJJ,QAAQ,GAAGpB,MAAM,CAACoC,WAAW,GAAGpC,MAAM,CAACqC,QAAQ,EAC/C1B,SACD,CAAC;EACF,CAAC,EAAE,CACFD,KAAK,EACLC,SAAS,EACTW,EAAE,EACFd,SAAS,EACTK,QAAQ,EACRC,GAAG,EACHM,QAAQ,EACRL,OAAO,EACPC,IAAI,CACH,CAAC;EAEH,OAAO;IAAE,GAAGX,UAAU;IAAEM,SAAS,EAAEY,OAAO;IAAEH;EAAS,CAAC;AACvD"}
1
+ {"version":3,"names":["css","useMemo","deprecated","useContextSystem","useResponsiveValue","space","styles","useCx","useDeprecatedProps","props","isReversed","otherProps","alternative","since","direction","useFlex","align","className","directionProp","expanded","gap","justify","wrap","directionAsArray","Array","isArray","isColumn","includes","cx","classes","base","alignItems","flexDirection","flexWrap","undefined","justifyContent","height","width","process","env","NODE_ENV","Flex","ItemsColumn","ItemsRow"],"sources":["@wordpress/components/src/flex/flex/hook.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../context';\nimport { useContextSystem } from '../../context';\nimport { useResponsiveValue } from '../../utils/use-responsive-value';\nimport { space } from '../../utils/space';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils';\nimport type { FlexProps } from '../types';\n\nfunction useDeprecatedProps(\n\tprops: WordPressComponentProps< FlexProps, 'div' >\n): Omit< typeof props, 'isReversed' > {\n\tconst { isReversed, ...otherProps } = props;\n\n\tif ( typeof isReversed !== 'undefined' ) {\n\t\tdeprecated( 'Flex isReversed', {\n\t\t\talternative: 'Flex direction=\"row-reverse\" or \"column-reverse\"',\n\t\t\tsince: '5.9',\n\t\t} );\n\t\treturn {\n\t\t\t...otherProps,\n\t\t\tdirection: isReversed ? 'row-reverse' : 'row',\n\t\t};\n\t}\n\n\treturn otherProps;\n}\n\nexport function useFlex( props: WordPressComponentProps< FlexProps, 'div' > ) {\n\tconst {\n\t\talign,\n\t\tclassName,\n\t\tdirection: directionProp = 'row',\n\t\texpanded = true,\n\t\tgap = 2,\n\t\tjustify = 'space-between',\n\t\twrap = false,\n\t\t...otherProps\n\t} = useContextSystem( useDeprecatedProps( props ), 'Flex' );\n\n\tconst directionAsArray = Array.isArray( directionProp )\n\t\t? directionProp\n\t\t: [ directionProp ];\n\tconst direction = useResponsiveValue( directionAsArray );\n\n\tconst isColumn =\n\t\ttypeof direction === 'string' && !! direction.includes( 'column' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo( () => {\n\t\tconst base = css( {\n\t\t\talignItems: align ?? ( isColumn ? 'normal' : 'center' ),\n\t\t\tflexDirection: direction,\n\t\t\tflexWrap: wrap ? 'wrap' : undefined,\n\t\t\tgap: space( gap ),\n\t\t\tjustifyContent: justify,\n\t\t\theight: isColumn && expanded ? '100%' : undefined,\n\t\t\twidth: ! isColumn && expanded ? '100%' : undefined,\n\t\t} );\n\n\t\treturn cx(\n\t\t\tstyles.Flex,\n\t\t\tbase,\n\t\t\tisColumn ? styles.ItemsColumn : styles.ItemsRow,\n\t\t\tclassName\n\t\t);\n\t}, [\n\t\talign,\n\t\tclassName,\n\t\tcx,\n\t\tdirection,\n\t\texpanded,\n\t\tgap,\n\t\tisColumn,\n\t\tjustify,\n\t\twrap,\n\t] );\n\n\treturn { ...otherProps, className: classes, isColumn };\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,GAAG,QAAQ,gBAAgB;;AAEpC;AACA;AACA;AACA,SAASC,OAAO,QAAQ,oBAAoB;AAC5C,OAAOC,UAAU,MAAM,uBAAuB;;AAE9C;AACA;AACA;;AAEA,SAASC,gBAAgB,QAAQ,eAAe;AAChD,SAASC,kBAAkB,QAAQ,kCAAkC;AACrE,SAASC,KAAK,QAAQ,mBAAmB;AACzC,OAAO,KAAKC,MAAM,MAAM,WAAW;AACnC,SAASC,KAAK,QAAQ,aAAa;AAGnC,SAASC,kBAAkBA,CAC1BC,KAAkD,EACb;EACrC,MAAM;IAAEC,UAAU;IAAE,GAAGC;EAAW,CAAC,GAAGF,KAAK;EAE3C,IAAK,OAAOC,UAAU,KAAK,WAAW,EAAG;IACxCR,UAAU,CAAE,iBAAiB,EAAE;MAC9BU,WAAW,EAAE,kDAAkD;MAC/DC,KAAK,EAAE;IACR,CAAE,CAAC;IACH,OAAO;MACN,GAAGF,UAAU;MACbG,SAAS,EAAEJ,UAAU,GAAG,aAAa,GAAG;IACzC,CAAC;EACF;EAEA,OAAOC,UAAU;AAClB;AAEA,OAAO,SAASI,OAAOA,CAAEN,KAAkD,EAAG;EAC7E,MAAM;IACLO,KAAK;IACLC,SAAS;IACTH,SAAS,EAAEI,aAAa,GAAG,KAAK;IAChCC,QAAQ,GAAG,IAAI;IACfC,GAAG,GAAG,CAAC;IACPC,OAAO,GAAG,eAAe;IACzBC,IAAI,GAAG,KAAK;IACZ,GAAGX;EACJ,CAAC,GAAGR,gBAAgB,CAAEK,kBAAkB,CAAEC,KAAM,CAAC,EAAE,MAAO,CAAC;EAE3D,MAAMc,gBAAgB,GAAGC,KAAK,CAACC,OAAO,CAAEP,aAAc,CAAC,GACpDA,aAAa,GACb,CAAEA,aAAa,CAAE;EACpB,MAAMJ,SAAS,GAAGV,kBAAkB,CAAEmB,gBAAiB,CAAC;EAExD,MAAMG,QAAQ,GACb,OAAOZ,SAAS,KAAK,QAAQ,IAAI,CAAC,CAAEA,SAAS,CAACa,QAAQ,CAAE,QAAS,CAAC;EAEnE,MAAMC,EAAE,GAAGrB,KAAK,CAAC,CAAC;EAElB,MAAMsB,OAAO,GAAG5B,OAAO,CAAE,MAAM;IAC9B,MAAM6B,IAAI,gBAAG9B,GAAG,CAAE;MACjB+B,UAAU,EAAEf,KAAK,aAALA,KAAK,cAALA,KAAK,GAAMU,QAAQ,GAAG,QAAQ,GAAG,QAAU;MACvDM,aAAa,EAAElB,SAAS;MACxBmB,QAAQ,EAAEX,IAAI,GAAG,MAAM,GAAGY,SAAS;MACnCd,GAAG,EAAEf,KAAK,CAAEe,GAAI,CAAC;MACjBe,cAAc,EAAEd,OAAO;MACvBe,MAAM,EAAEV,QAAQ,IAAIP,QAAQ,GAAG,MAAM,GAAGe,SAAS;MACjDG,KAAK,EAAE,CAAEX,QAAQ,IAAIP,QAAQ,GAAG,MAAM,GAAGe;IAC1C,CAAC,EAAAI,OAAA,CAAAC,GAAA,CAAAC,QAAA,yCAAAF,OAAA,CAAAC,GAAA,CAAAC,QAAA,0/GAAC,CAAC;IAEH,OAAOZ,EAAE,CACRtB,MAAM,CAACmC,IAAI,EACXX,IAAI,EACJJ,QAAQ,GAAGpB,MAAM,CAACoC,WAAW,GAAGpC,MAAM,CAACqC,QAAQ,EAC/C1B,SACD,CAAC;EACF,CAAC,EAAE,CACFD,KAAK,EACLC,SAAS,EACTW,EAAE,EACFd,SAAS,EACTK,QAAQ,EACRC,GAAG,EACHM,QAAQ,EACRL,OAAO,EACPC,IAAI,CACH,CAAC;EAEH,OAAO;IAAE,GAAGX,UAAU;IAAEM,SAAS,EAAEY,OAAO;IAAEH;EAAS,CAAC;AACvD"}
@@ -51,7 +51,6 @@ const FontSizePickerSelect = props => {
51
51
  const selectedOption = value ? (_options$find = options.find(option => option.value === value)) !== null && _options$find !== void 0 ? _options$find : CUSTOM_OPTION : DEFAULT_OPTION;
52
52
  return createElement(CustomSelectControl, {
53
53
  __next40pxDefaultSize: __next40pxDefaultSize,
54
- __nextUnconstrainedWidth: true,
55
54
  className: "components-font-size-picker__select",
56
55
  label: __('Font size'),
57
56
  hideLabelFromVision: true,
@@ -1 +1 @@
1
- {"version":3,"names":["__","sprintf","CustomSelectControl","parseQuantityAndUnitFromRawValue","getCommonSizeUnit","isSimpleCssValue","DEFAULT_OPTION","key","name","value","undefined","CUSTOM_OPTION","FontSizePickerSelect","props","_options$find","__next40pxDefaultSize","fontSizes","disableCustomFontSizes","size","onChange","onSelectCustom","areAllSizesSameUnit","options","map","fontSize","hint","quantity","String","slug","__experimentalHint","selectedOption","find","option","createElement","__nextUnconstrainedWidth","className","label","hideLabelFromVision","describedBy","__experimentalShowSelectedHint","selectedItem"],"sources":["@wordpress/components/src/font-size-picker/font-size-picker-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport CustomSelectControl from '../custom-select-control';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\nimport type {\n\tFontSizePickerSelectProps,\n\tFontSizePickerSelectOption,\n} from './types';\nimport { getCommonSizeUnit, isSimpleCssValue } from './utils';\n\nconst DEFAULT_OPTION: FontSizePickerSelectOption = {\n\tkey: 'default',\n\tname: __( 'Default' ),\n\tvalue: undefined,\n};\n\nconst CUSTOM_OPTION: FontSizePickerSelectOption = {\n\tkey: 'custom',\n\tname: __( 'Custom' ),\n};\n\nconst FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tfontSizes,\n\t\tvalue,\n\t\tdisableCustomFontSizes,\n\t\tsize,\n\t\tonChange,\n\t\tonSelectCustom,\n\t} = props;\n\n\tconst areAllSizesSameUnit = !! getCommonSizeUnit( fontSizes );\n\n\tconst options: FontSizePickerSelectOption[] = [\n\t\tDEFAULT_OPTION,\n\t\t...fontSizes.map( ( fontSize ) => {\n\t\t\tlet hint;\n\t\t\tif ( areAllSizesSameUnit ) {\n\t\t\t\tconst [ quantity ] = parseQuantityAndUnitFromRawValue(\n\t\t\t\t\tfontSize.size\n\t\t\t\t);\n\t\t\t\tif ( quantity !== undefined ) {\n\t\t\t\t\thint = String( quantity );\n\t\t\t\t}\n\t\t\t} else if ( isSimpleCssValue( fontSize.size ) ) {\n\t\t\t\thint = String( fontSize.size );\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tkey: fontSize.slug,\n\t\t\t\tname: fontSize.name || fontSize.slug,\n\t\t\t\tvalue: fontSize.size,\n\t\t\t\t__experimentalHint: hint,\n\t\t\t};\n\t\t} ),\n\t\t...( disableCustomFontSizes ? [] : [ CUSTOM_OPTION ] ),\n\t];\n\n\tconst selectedOption = value\n\t\t? options.find( ( option ) => option.value === value ) ?? CUSTOM_OPTION\n\t\t: DEFAULT_OPTION;\n\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t__nextUnconstrainedWidth\n\t\t\tclassName=\"components-font-size-picker__select\"\n\t\t\tlabel={ __( 'Font size' ) }\n\t\t\thideLabelFromVision\n\t\t\tdescribedBy={ sprintf(\n\t\t\t\t// translators: %s: Currently selected font size.\n\t\t\t\t__( 'Currently selected font size: %s' ),\n\t\t\t\tselectedOption.name\n\t\t\t) }\n\t\t\toptions={ options }\n\t\t\tvalue={ selectedOption }\n\t\t\t__experimentalShowSelectedHint\n\t\t\tonChange={ ( {\n\t\t\t\tselectedItem,\n\t\t\t}: {\n\t\t\t\tselectedItem: FontSizePickerSelectOption;\n\t\t\t} ) => {\n\t\t\t\tif ( selectedItem === CUSTOM_OPTION ) {\n\t\t\t\t\tonSelectCustom();\n\t\t\t\t} else {\n\t\t\t\t\tonChange( selectedItem.value );\n\t\t\t\t}\n\t\t\t} }\n\t\t\tsize={ size }\n\t\t/>\n\t);\n};\n\nexport default FontSizePickerSelect;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;;AAE7C;AACA;AACA;AACA,OAAOC,mBAAmB,MAAM,0BAA0B;AAC1D,SAASC,gCAAgC,QAAQ,iBAAiB;AAKlE,SAASC,iBAAiB,EAAEC,gBAAgB,QAAQ,SAAS;AAE7D,MAAMC,cAA0C,GAAG;EAClDC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAER,EAAE,CAAE,SAAU,CAAC;EACrBS,KAAK,EAAEC;AACR,CAAC;AAED,MAAMC,aAAyC,GAAG;EACjDJ,GAAG,EAAE,QAAQ;EACbC,IAAI,EAAER,EAAE,CAAE,QAAS;AACpB,CAAC;AAED,MAAMY,oBAAoB,GAAKC,KAAgC,IAAM;EAAA,IAAAC,aAAA;EACpE,MAAM;IACLC,qBAAqB;IACrBC,SAAS;IACTP,KAAK;IACLQ,sBAAsB;IACtBC,IAAI;IACJC,QAAQ;IACRC;EACD,CAAC,GAAGP,KAAK;EAET,MAAMQ,mBAAmB,GAAG,CAAC,CAAEjB,iBAAiB,CAAEY,SAAU,CAAC;EAE7D,MAAMM,OAAqC,GAAG,CAC7ChB,cAAc,EACd,GAAGU,SAAS,CAACO,GAAG,CAAIC,QAAQ,IAAM;IACjC,IAAIC,IAAI;IACR,IAAKJ,mBAAmB,EAAG;MAC1B,MAAM,CAAEK,QAAQ,CAAE,GAAGvB,gCAAgC,CACpDqB,QAAQ,CAACN,IACV,CAAC;MACD,IAAKQ,QAAQ,KAAKhB,SAAS,EAAG;QAC7Be,IAAI,GAAGE,MAAM,CAAED,QAAS,CAAC;MAC1B;IACD,CAAC,MAAM,IAAKrB,gBAAgB,CAAEmB,QAAQ,CAACN,IAAK,CAAC,EAAG;MAC/CO,IAAI,GAAGE,MAAM,CAAEH,QAAQ,CAACN,IAAK,CAAC;IAC/B;IACA,OAAO;MACNX,GAAG,EAAEiB,QAAQ,CAACI,IAAI;MAClBpB,IAAI,EAAEgB,QAAQ,CAAChB,IAAI,IAAIgB,QAAQ,CAACI,IAAI;MACpCnB,KAAK,EAAEe,QAAQ,CAACN,IAAI;MACpBW,kBAAkB,EAAEJ;IACrB,CAAC;EACF,CAAE,CAAC,EACH,IAAKR,sBAAsB,GAAG,EAAE,GAAG,CAAEN,aAAa,CAAE,CAAE,CACtD;EAED,MAAMmB,cAAc,GAAGrB,KAAK,IAAAK,aAAA,GACzBQ,OAAO,CAACS,IAAI,CAAIC,MAAM,IAAMA,MAAM,CAACvB,KAAK,KAAKA,KAAM,CAAC,cAAAK,aAAA,cAAAA,aAAA,GAAIH,aAAa,GACrEL,cAAc;EAEjB,OACC2B,aAAA,CAAC/B,mBAAmB;IACnBa,qBAAqB,EAAGA,qBAAuB;IAC/CmB,wBAAwB;IACxBC,SAAS,EAAC,qCAAqC;IAC/CC,KAAK,EAAGpC,EAAE,CAAE,WAAY,CAAG;IAC3BqC,mBAAmB;IACnBC,WAAW,EAAGrC,OAAO;IACpB;IACAD,EAAE,CAAE,kCAAmC,CAAC,EACxC8B,cAAc,CAACtB,IAChB,CAAG;IACHc,OAAO,EAAGA,OAAS;IACnBb,KAAK,EAAGqB,cAAgB;IACxBS,8BAA8B;IAC9BpB,QAAQ,EAAGA,CAAE;MACZqB;IAGD,CAAC,KAAM;MACN,IAAKA,YAAY,KAAK7B,aAAa,EAAG;QACrCS,cAAc,CAAC,CAAC;MACjB,CAAC,MAAM;QACND,QAAQ,CAAEqB,YAAY,CAAC/B,KAAM,CAAC;MAC/B;IACD,CAAG;IACHS,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ,CAAC;AAED,eAAeN,oBAAoB"}
1
+ {"version":3,"names":["__","sprintf","CustomSelectControl","parseQuantityAndUnitFromRawValue","getCommonSizeUnit","isSimpleCssValue","DEFAULT_OPTION","key","name","value","undefined","CUSTOM_OPTION","FontSizePickerSelect","props","_options$find","__next40pxDefaultSize","fontSizes","disableCustomFontSizes","size","onChange","onSelectCustom","areAllSizesSameUnit","options","map","fontSize","hint","quantity","String","slug","__experimentalHint","selectedOption","find","option","createElement","className","label","hideLabelFromVision","describedBy","__experimentalShowSelectedHint","selectedItem"],"sources":["@wordpress/components/src/font-size-picker/font-size-picker-select.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport CustomSelectControl from '../custom-select-control';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\nimport type {\n\tFontSizePickerSelectProps,\n\tFontSizePickerSelectOption,\n} from './types';\nimport { getCommonSizeUnit, isSimpleCssValue } from './utils';\n\nconst DEFAULT_OPTION: FontSizePickerSelectOption = {\n\tkey: 'default',\n\tname: __( 'Default' ),\n\tvalue: undefined,\n};\n\nconst CUSTOM_OPTION: FontSizePickerSelectOption = {\n\tkey: 'custom',\n\tname: __( 'Custom' ),\n};\n\nconst FontSizePickerSelect = ( props: FontSizePickerSelectProps ) => {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tfontSizes,\n\t\tvalue,\n\t\tdisableCustomFontSizes,\n\t\tsize,\n\t\tonChange,\n\t\tonSelectCustom,\n\t} = props;\n\n\tconst areAllSizesSameUnit = !! getCommonSizeUnit( fontSizes );\n\n\tconst options: FontSizePickerSelectOption[] = [\n\t\tDEFAULT_OPTION,\n\t\t...fontSizes.map( ( fontSize ) => {\n\t\t\tlet hint;\n\t\t\tif ( areAllSizesSameUnit ) {\n\t\t\t\tconst [ quantity ] = parseQuantityAndUnitFromRawValue(\n\t\t\t\t\tfontSize.size\n\t\t\t\t);\n\t\t\t\tif ( quantity !== undefined ) {\n\t\t\t\t\thint = String( quantity );\n\t\t\t\t}\n\t\t\t} else if ( isSimpleCssValue( fontSize.size ) ) {\n\t\t\t\thint = String( fontSize.size );\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tkey: fontSize.slug,\n\t\t\t\tname: fontSize.name || fontSize.slug,\n\t\t\t\tvalue: fontSize.size,\n\t\t\t\t__experimentalHint: hint,\n\t\t\t};\n\t\t} ),\n\t\t...( disableCustomFontSizes ? [] : [ CUSTOM_OPTION ] ),\n\t];\n\n\tconst selectedOption = value\n\t\t? options.find( ( option ) => option.value === value ) ?? CUSTOM_OPTION\n\t\t: DEFAULT_OPTION;\n\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\tclassName=\"components-font-size-picker__select\"\n\t\t\tlabel={ __( 'Font size' ) }\n\t\t\thideLabelFromVision\n\t\t\tdescribedBy={ sprintf(\n\t\t\t\t// translators: %s: Currently selected font size.\n\t\t\t\t__( 'Currently selected font size: %s' ),\n\t\t\t\tselectedOption.name\n\t\t\t) }\n\t\t\toptions={ options }\n\t\t\tvalue={ selectedOption }\n\t\t\t__experimentalShowSelectedHint\n\t\t\tonChange={ ( {\n\t\t\t\tselectedItem,\n\t\t\t}: {\n\t\t\t\tselectedItem: FontSizePickerSelectOption;\n\t\t\t} ) => {\n\t\t\t\tif ( selectedItem === CUSTOM_OPTION ) {\n\t\t\t\t\tonSelectCustom();\n\t\t\t\t} else {\n\t\t\t\t\tonChange( selectedItem.value );\n\t\t\t\t}\n\t\t\t} }\n\t\t\tsize={ size }\n\t\t/>\n\t);\n};\n\nexport default FontSizePickerSelect;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;;AAE7C;AACA;AACA;AACA,OAAOC,mBAAmB,MAAM,0BAA0B;AAC1D,SAASC,gCAAgC,QAAQ,iBAAiB;AAKlE,SAASC,iBAAiB,EAAEC,gBAAgB,QAAQ,SAAS;AAE7D,MAAMC,cAA0C,GAAG;EAClDC,GAAG,EAAE,SAAS;EACdC,IAAI,EAAER,EAAE,CAAE,SAAU,CAAC;EACrBS,KAAK,EAAEC;AACR,CAAC;AAED,MAAMC,aAAyC,GAAG;EACjDJ,GAAG,EAAE,QAAQ;EACbC,IAAI,EAAER,EAAE,CAAE,QAAS;AACpB,CAAC;AAED,MAAMY,oBAAoB,GAAKC,KAAgC,IAAM;EAAA,IAAAC,aAAA;EACpE,MAAM;IACLC,qBAAqB;IACrBC,SAAS;IACTP,KAAK;IACLQ,sBAAsB;IACtBC,IAAI;IACJC,QAAQ;IACRC;EACD,CAAC,GAAGP,KAAK;EAET,MAAMQ,mBAAmB,GAAG,CAAC,CAAEjB,iBAAiB,CAAEY,SAAU,CAAC;EAE7D,MAAMM,OAAqC,GAAG,CAC7ChB,cAAc,EACd,GAAGU,SAAS,CAACO,GAAG,CAAIC,QAAQ,IAAM;IACjC,IAAIC,IAAI;IACR,IAAKJ,mBAAmB,EAAG;MAC1B,MAAM,CAAEK,QAAQ,CAAE,GAAGvB,gCAAgC,CACpDqB,QAAQ,CAACN,IACV,CAAC;MACD,IAAKQ,QAAQ,KAAKhB,SAAS,EAAG;QAC7Be,IAAI,GAAGE,MAAM,CAAED,QAAS,CAAC;MAC1B;IACD,CAAC,MAAM,IAAKrB,gBAAgB,CAAEmB,QAAQ,CAACN,IAAK,CAAC,EAAG;MAC/CO,IAAI,GAAGE,MAAM,CAAEH,QAAQ,CAACN,IAAK,CAAC;IAC/B;IACA,OAAO;MACNX,GAAG,EAAEiB,QAAQ,CAACI,IAAI;MAClBpB,IAAI,EAAEgB,QAAQ,CAAChB,IAAI,IAAIgB,QAAQ,CAACI,IAAI;MACpCnB,KAAK,EAAEe,QAAQ,CAACN,IAAI;MACpBW,kBAAkB,EAAEJ;IACrB,CAAC;EACF,CAAE,CAAC,EACH,IAAKR,sBAAsB,GAAG,EAAE,GAAG,CAAEN,aAAa,CAAE,CAAE,CACtD;EAED,MAAMmB,cAAc,GAAGrB,KAAK,IAAAK,aAAA,GACzBQ,OAAO,CAACS,IAAI,CAAIC,MAAM,IAAMA,MAAM,CAACvB,KAAK,KAAKA,KAAM,CAAC,cAAAK,aAAA,cAAAA,aAAA,GAAIH,aAAa,GACrEL,cAAc;EAEjB,OACC2B,aAAA,CAAC/B,mBAAmB;IACnBa,qBAAqB,EAAGA,qBAAuB;IAC/CmB,SAAS,EAAC,qCAAqC;IAC/CC,KAAK,EAAGnC,EAAE,CAAE,WAAY,CAAG;IAC3BoC,mBAAmB;IACnBC,WAAW,EAAGpC,OAAO;IACpB;IACAD,EAAE,CAAE,kCAAmC,CAAC,EACxC8B,cAAc,CAACtB,IAChB,CAAG;IACHc,OAAO,EAAGA,OAAS;IACnBb,KAAK,EAAGqB,cAAgB;IACxBQ,8BAA8B;IAC9BnB,QAAQ,EAAGA,CAAE;MACZoB;IAGD,CAAC,KAAM;MACN,IAAKA,YAAY,KAAK5B,aAAa,EAAG;QACrCS,cAAc,CAAC,CAAC;MACjB,CAAC,MAAM;QACND,QAAQ,CAAEoB,YAAY,CAAC9B,KAAM,CAAC;MAC/B;IACD,CAAG;IACHS,IAAI,EAAGA;EAAM,CACb,CAAC;AAEJ,CAAC;AAED,eAAeN,oBAAoB"}
@@ -1 +1 @@
1
- {"version":3,"names":["View","useWindowDimensions","useNavigation","useState","Icon","chevronRight","check","__","sprintf","BottomSheet","default","getPxFromCssUnit","UnitControl","useCustomUnits","styles","DEFAULT_FONT_SIZE","FontSizePicker","fontSizes","disableCustomFontSizes","onChange","value","selectedValue","_fontSizes$find","showSubSheet","setShowSubSheet","navigation","height","width","cssUnitOptions","fontSize","selectedPxValue","onChangeValue","goBack","selectedOption","find","option","sizePx","name","openSubSheet","navigate","SubSheet","screenName","label","units","availableUnits","accessibilityLabel","createElement","navigationButton","Cell","separatorType","onPress","accessibilityRole","accessibilityHint","icon","showSheet","Fragment","NavBar","BackButton","Heading","style","customActionButton","undefined","leftAlign","key","map","item","index","parseFloat","subLabel","min","max","step","nextSize"],"sources":["@wordpress/components/src/font-size-picker/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, useWindowDimensions } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\nimport { useState } from '@wordpress/element';\nimport { Icon, chevronRight, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { BottomSheet } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { default as getPxFromCssUnit } from '../mobile/utils/get-px-from-css-unit';\nimport { default as UnitControl, useCustomUnits } from '../unit-control';\nimport styles from './style.scss';\n\nconst DEFAULT_FONT_SIZE = 16;\n\nfunction FontSizePicker( {\n\tfontSizes = [],\n\tdisableCustomFontSizes = false,\n\tonChange,\n\tvalue: selectedValue,\n} ) {\n\tconst [ showSubSheet, setShowSubSheet ] = useState( false );\n\tconst navigation = useNavigation();\n\n\tconst { height, width } = useWindowDimensions();\n\tconst cssUnitOptions = { height, width, fontSize: DEFAULT_FONT_SIZE };\n\t// We need to always convert to px units because the selected value\n\t// could be coming from the web where it could be stored as a different unit.\n\tconst selectedPxValue = getPxFromCssUnit( selectedValue, cssUnitOptions );\n\n\tconst onChangeValue = ( value ) => {\n\t\treturn () => {\n\t\t\tgoBack();\n\t\t\tonChange( value );\n\t\t};\n\t};\n\n\tconst selectedOption = fontSizes.find(\n\t\t( option ) => option.sizePx === selectedPxValue\n\t) ?? { name: 'Custom' };\n\n\tconst goBack = () => {\n\t\tsetShowSubSheet( false );\n\t\tnavigation.goBack();\n\t};\n\n\tconst openSubSheet = () => {\n\t\tnavigation.navigate( BottomSheet.SubSheet.screenName );\n\t\tsetShowSubSheet( true );\n\t};\n\tconst label = __( 'Font Size' );\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ 'px', 'em', 'rem' ],\n\t} );\n\n\tconst accessibilityLabel = sprintf(\n\t\t// translators: %1$s: Font size name e.g. Small\n\t\t__( 'Font Size, %1$s' ),\n\t\tselectedOption.name\n\t);\n\n\treturn (\n\t\t<BottomSheet.SubSheet\n\t\t\tnavigationButton={\n\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\tselectedValue\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t// translators: %1$s: Select control font size name e.g. Small, %2$s: Select control font size e.g. 12px\n\t\t\t\t\t\t\t\t\t__( '%1$s (%2$s)' ),\n\t\t\t\t\t\t\t\t\tselectedOption.name,\n\t\t\t\t\t\t\t\t\tselectedPxValue\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: __( 'Default' )\n\t\t\t\t\t}\n\t\t\t\t\tonPress={ openSubSheet }\n\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityHint={ sprintf(\n\t\t\t\t\t\t// translators: %s: Select control button label e.g. Small\n\t\t\t\t\t\t__( 'Navigates to select %s' ),\n\t\t\t\t\t\tselectedOption.name\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ chevronRight }></Icon>\n\t\t\t\t</BottomSheet.Cell>\n\t\t\t}\n\t\t\tshowSheet={ showSubSheet }\n\t\t>\n\t\t\t<>\n\t\t\t\t<BottomSheet.NavBar>\n\t\t\t\t\t<BottomSheet.NavBar.BackButton onPress={ goBack } />\n\t\t\t\t\t<BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</BottomSheet.NavBar.Heading>\n\t\t\t\t</BottomSheet.NavBar>\n\t\t\t\t<View style={ styles[ 'components-font-size-picker' ] }>\n\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\tlabel={ __( 'Default' ) }\n\t\t\t\t\t\tonPress={ onChangeValue( undefined ) }\n\t\t\t\t\t\tleftAlign={ true }\n\t\t\t\t\t\tkey={ 'default' }\n\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\taccessibilityLabel={ __( 'Selected: Default' ) }\n\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t'Double tap to select default font size'\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t{ selectedValue === undefined && (\n\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t{ fontSizes.map( ( item, index ) => {\n\t\t\t\t\t\t// Only display a choice that we can currenly select.\n\t\t\t\t\t\tif ( ! parseFloat( item.sizePx ) ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\t\t\tlabel={ item.name }\n\t\t\t\t\t\t\t\tsubLabel={ item.sizePx }\n\t\t\t\t\t\t\t\tonPress={ onChangeValue( item.sizePx ) }\n\t\t\t\t\t\t\t\tleftAlign={ true }\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\titem.sizePx === selectedValue\n\t\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Select font size option value e.g: \"Selected: Large\".\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Selected: %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\titem.name\n\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t: item.name\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t\t\t'Double tap to select font size'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t\t\t{ item.sizePx === selectedPxValue && (\n\t\t\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 200 }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tvalue={ selectedValue }\n\t\t\t\t\t\t\tonChange={ ( nextSize ) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t0 === parseFloat( nextSize ) ||\n\t\t\t\t\t\t\t\t\t! nextSize\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonChange( nextSize );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</View>\n\t\t\t</>\n\t\t</BottomSheet.SubSheet>\n\t);\n}\n\nexport default FontSizePicker;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,mBAAmB,QAAQ,cAAc;;AAExD;AACA;AACA;AACA,SAASC,aAAa,QAAQ,0BAA0B;AACxD,SAASC,QAAQ,QAAQ,oBAAoB;AAC7C,SAASC,IAAI,EAAEC,YAAY,EAAEC,KAAK,QAAQ,kBAAkB;AAC5D,SAASC,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;AAC7C,SAASC,WAAW,QAAQ,uBAAuB;;AAEnD;AACA;AACA;AACA,SAASC,OAAO,IAAIC,gBAAgB,QAAQ,sCAAsC;AAClF,SAASD,OAAO,IAAIE,WAAW,EAAEC,cAAc,QAAQ,iBAAiB;AACxE,OAAOC,MAAM,MAAM,cAAc;AAEjC,MAAMC,iBAAiB,GAAG,EAAE;AAE5B,SAASC,cAAcA,CAAE;EACxBC,SAAS,GAAG,EAAE;EACdC,sBAAsB,GAAG,KAAK;EAC9BC,QAAQ;EACRC,KAAK,EAAEC;AACR,CAAC,EAAG;EAAA,IAAAC,eAAA;EACH,MAAM,CAAEC,YAAY,EAAEC,eAAe,CAAE,GAAGrB,QAAQ,CAAE,KAAM,CAAC;EAC3D,MAAMsB,UAAU,GAAGvB,aAAa,CAAC,CAAC;EAElC,MAAM;IAAEwB,MAAM;IAAEC;EAAM,CAAC,GAAG1B,mBAAmB,CAAC,CAAC;EAC/C,MAAM2B,cAAc,GAAG;IAAEF,MAAM;IAAEC,KAAK;IAAEE,QAAQ,EAAEd;EAAkB,CAAC;EACrE;EACA;EACA,MAAMe,eAAe,GAAGnB,gBAAgB,CAAEU,aAAa,EAAEO,cAAe,CAAC;EAEzE,MAAMG,aAAa,GAAKX,KAAK,IAAM;IAClC,OAAO,MAAM;MACZY,MAAM,CAAC,CAAC;MACRb,QAAQ,CAAEC,KAAM,CAAC;IAClB,CAAC;EACF,CAAC;EAED,MAAMa,cAAc,IAAAX,eAAA,GAAGL,SAAS,CAACiB,IAAI,CAClCC,MAAM,IAAMA,MAAM,CAACC,MAAM,KAAKN,eACjC,CAAC,cAAAR,eAAA,cAAAA,eAAA,GAAI;IAAEe,IAAI,EAAE;EAAS,CAAC;EAEvB,MAAML,MAAM,GAAGA,CAAA,KAAM;IACpBR,eAAe,CAAE,KAAM,CAAC;IACxBC,UAAU,CAACO,MAAM,CAAC,CAAC;EACpB,CAAC;EAED,MAAMM,YAAY,GAAGA,CAAA,KAAM;IAC1Bb,UAAU,CAACc,QAAQ,CAAE9B,WAAW,CAAC+B,QAAQ,CAACC,UAAW,CAAC;IACtDjB,eAAe,CAAE,IAAK,CAAC;EACxB,CAAC;EACD,MAAMkB,KAAK,GAAGnC,EAAE,CAAE,WAAY,CAAC;EAE/B,MAAMoC,KAAK,GAAG9B,cAAc,CAAE;IAC7B+B,cAAc,EAAE,CAAE,IAAI,EAAE,IAAI,EAAE,KAAK;EACpC,CAAE,CAAC;EAEH,MAAMC,kBAAkB,GAAGrC,OAAO;EACjC;EACAD,EAAE,CAAE,iBAAkB,CAAC,EACvB0B,cAAc,CAACI,IAChB,CAAC;EAED,OACCS,aAAA,CAACrC,WAAW,CAAC+B,QAAQ;IACpBO,gBAAgB,EACfD,aAAA,CAACrC,WAAW,CAACuC,IAAI;MAChBN,KAAK,EAAGA,KAAO;MACfO,aAAa,EAAC,MAAM;MACpB7B,KAAK,EACJC,aAAa,GACVb,OAAO;MACP;MACAD,EAAE,CAAE,aAAc,CAAC,EACnB0B,cAAc,CAACI,IAAI,EACnBP,eACA,CAAC,GACDvB,EAAE,CAAE,SAAU,CACjB;MACD2C,OAAO,EAAGZ,YAAc;MACxBa,iBAAiB,EAAG,QAAU;MAC9BN,kBAAkB,EAAGA,kBAAoB;MACzCO,iBAAiB,EAAG5C,OAAO;MAC1B;MACAD,EAAE,CAAE,wBAAyB,CAAC,EAC9B0B,cAAc,CAACI,IAChB;IAAG,GAEHS,aAAA,CAAC1C,IAAI;MAACiD,IAAI,EAAGhD;IAAc,CAAO,CACjB,CAClB;IACDiD,SAAS,EAAG/B;EAAc,GAE1BuB,aAAA,CAAAS,QAAA,QACCT,aAAA,CAACrC,WAAW,CAAC+C,MAAM,QAClBV,aAAA,CAACrC,WAAW,CAAC+C,MAAM,CAACC,UAAU;IAACP,OAAO,EAAGlB;EAAQ,CAAE,CAAC,EACpDc,aAAA,CAACrC,WAAW,CAAC+C,MAAM,CAACE,OAAO,QACxBhB,KACyB,CACT,CAAC,EACrBI,aAAA,CAAC9C,IAAI;IAAC2D,KAAK,EAAG7C,MAAM,CAAE,6BAA6B;EAAI,GACtDgC,aAAA,CAACrC,WAAW,CAACuC,IAAI;IAChBY,kBAAkB;IAClBX,aAAa,EAAC,MAAM;IACpBP,KAAK,EAAGnC,EAAE,CAAE,SAAU,CAAG;IACzB2C,OAAO,EAAGnB,aAAa,CAAE8B,SAAU,CAAG;IACtCC,SAAS,EAAG,IAAM;IAClBC,GAAG,EAAG,SAAW;IACjBZ,iBAAiB,EAAG,QAAU;IAC9BN,kBAAkB,EAAGtC,EAAE,CAAE,mBAAoB,CAAG;IAChD6C,iBAAiB,EAAG7C,EAAE,CACrB,wCACD;EAAG,GAEHuC,aAAA,CAAC9C,IAAI,QACFqB,aAAa,KAAKwC,SAAS,IAC5Bf,aAAA,CAAC1C,IAAI;IAACiD,IAAI,EAAG/C;EAAO,CAAO,CAEvB,CACW,CAAC,EACjBW,SAAS,CAAC+C,GAAG,CAAE,CAAEC,IAAI,EAAEC,KAAK,KAAM;IACnC;IACA,IAAK,CAAEC,UAAU,CAAEF,IAAI,CAAC7B,MAAO,CAAC,EAAG;MAClC,OAAO,IAAI;IACZ;IACA,OACCU,aAAA,CAACrC,WAAW,CAACuC,IAAI;MAChBY,kBAAkB;MAClBX,aAAa,EAAC,MAAM;MACpBP,KAAK,EAAGuB,IAAI,CAAC5B,IAAM;MACnB+B,QAAQ,EAAGH,IAAI,CAAC7B,MAAQ;MACxBc,OAAO,EAAGnB,aAAa,CAAEkC,IAAI,CAAC7B,MAAO,CAAG;MACxC0B,SAAS,EAAG,IAAM;MAClBC,GAAG,EAAGG,KAAO;MACbf,iBAAiB,EAAG,QAAU;MAC9BN,kBAAkB,EACjBoB,IAAI,CAAC7B,MAAM,KAAKf,aAAa,GAC1Bb,OAAO;MACP;MACAD,EAAE,CAAE,cAAe,CAAC,EACpB0D,IAAI,CAAC5B,IACL,CAAC,GACD4B,IAAI,CAAC5B,IACR;MACDe,iBAAiB,EAAG7C,EAAE,CACrB,gCACD;IAAG,GAEHuC,aAAA,CAAC9C,IAAI,QACFiE,IAAI,CAAC7B,MAAM,KAAKN,eAAe,IAChCgB,aAAA,CAAC1C,IAAI;MAACiD,IAAI,EAAG/C;IAAO,CAAO,CAEvB,CACW,CAAC;EAErB,CAAE,CAAC,EACD,CAAEY,sBAAsB,IACzB4B,aAAA,CAAClC,WAAW;IACX8B,KAAK,EAAGnC,EAAE,CAAE,QAAS,CAAG;IACxB8D,GAAG,EAAG,CAAG;IACTC,GAAG,EAAG,GAAK;IACXC,IAAI,EAAG,CAAG;IACVnD,KAAK,EAAGC,aAAe;IACvBF,QAAQ,EAAKqD,QAAQ,IAAM;MAC1B,IACC,CAAC,KAAKL,UAAU,CAAEK,QAAS,CAAC,IAC5B,CAAEA,QAAQ,EACT;QACDrD,QAAQ,CAAE0C,SAAU,CAAC;MACtB,CAAC,MAAM;QACN1C,QAAQ,CAAEqD,QAAS,CAAC;MACrB;IACD,CAAG;IACH7B,KAAK,EAAGA;EAAO,CACf,CAEG,CACL,CACmB,CAAC;AAEzB;AAEA,eAAe3B,cAAc"}
1
+ {"version":3,"names":["View","useWindowDimensions","useNavigation","useState","Icon","chevronRight","check","__","sprintf","BottomSheet","default","getPxFromCssUnit","UnitControl","useCustomUnits","styles","DEFAULT_FONT_SIZE","FontSizePicker","fontSizes","disableCustomFontSizes","onChange","value","selectedValue","_fontSizes$find","showSubSheet","setShowSubSheet","navigation","height","width","cssUnitOptions","fontSize","selectedPxValue","onChangeValue","goBack","selectedOption","find","option","sizePx","name","openSubSheet","navigate","SubSheet","screenName","label","units","availableUnits","accessibilityLabel","createElement","navigationButton","Cell","separatorType","onPress","accessibilityRole","accessibilityHint","icon","showSheet","Fragment","NavBar","BackButton","Heading","style","customActionButton","undefined","leftAlign","key","map","item","index","parseFloat","subLabel","min","max","step","nextSize"],"sources":["@wordpress/components/src/font-size-picker/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, useWindowDimensions } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\nimport { useState } from '@wordpress/element';\nimport { Icon, chevronRight, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { BottomSheet } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { default as getPxFromCssUnit } from '../mobile/utils/get-px-from-css-unit';\nimport { default as UnitControl, useCustomUnits } from '../unit-control';\nimport styles from './style.scss';\n\nconst DEFAULT_FONT_SIZE = 16;\n\nfunction FontSizePicker( {\n\tfontSizes = [],\n\tdisableCustomFontSizes = false,\n\tonChange,\n\tvalue: selectedValue,\n} ) {\n\tconst [ showSubSheet, setShowSubSheet ] = useState( false );\n\tconst navigation = useNavigation();\n\n\tconst { height, width } = useWindowDimensions();\n\tconst cssUnitOptions = { height, width, fontSize: DEFAULT_FONT_SIZE };\n\t// We need to always convert to px units because the selected value\n\t// could be coming from the web where it could be stored as a different unit.\n\tconst selectedPxValue = getPxFromCssUnit( selectedValue, cssUnitOptions );\n\n\tconst onChangeValue = ( value ) => {\n\t\treturn () => {\n\t\t\tgoBack();\n\t\t\tonChange( value );\n\t\t};\n\t};\n\n\tconst selectedOption = fontSizes.find(\n\t\t( option ) => option.sizePx === selectedPxValue\n\t) ?? { name: 'Custom' };\n\n\tconst goBack = () => {\n\t\tsetShowSubSheet( false );\n\t\tnavigation.goBack();\n\t};\n\n\tconst openSubSheet = () => {\n\t\tnavigation.navigate( BottomSheet.SubSheet.screenName );\n\t\tsetShowSubSheet( true );\n\t};\n\tconst label = __( 'Font Size' );\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ 'px', 'em', 'rem' ],\n\t} );\n\n\tconst accessibilityLabel = sprintf(\n\t\t// translators: %1$s: Font size name e.g. Small\n\t\t__( 'Font Size, %1$s' ),\n\t\tselectedOption.name\n\t);\n\n\treturn (\n\t\t<BottomSheet.SubSheet\n\t\t\tnavigationButton={\n\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\tselectedValue\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t// translators: %1$s: Select control font size name e.g. Small, %2$s: Select control font size e.g. 12px\n\t\t\t\t\t\t\t\t\t__( '%1$s (%2$s)' ),\n\t\t\t\t\t\t\t\t\tselectedOption.name,\n\t\t\t\t\t\t\t\t\tselectedPxValue\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: __( 'Default' )\n\t\t\t\t\t}\n\t\t\t\t\tonPress={ openSubSheet }\n\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityHint={ sprintf(\n\t\t\t\t\t\t// translators: %s: Select control button label e.g. Small\n\t\t\t\t\t\t__( 'Navigates to select %s' ),\n\t\t\t\t\t\tselectedOption.name\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ chevronRight }></Icon>\n\t\t\t\t</BottomSheet.Cell>\n\t\t\t}\n\t\t\tshowSheet={ showSubSheet }\n\t\t>\n\t\t\t<>\n\t\t\t\t<BottomSheet.NavBar>\n\t\t\t\t\t<BottomSheet.NavBar.BackButton onPress={ goBack } />\n\t\t\t\t\t<BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</BottomSheet.NavBar.Heading>\n\t\t\t\t</BottomSheet.NavBar>\n\t\t\t\t<View style={ styles[ 'components-font-size-picker' ] }>\n\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\tlabel={ __( 'Default' ) }\n\t\t\t\t\t\tonPress={ onChangeValue( undefined ) }\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tkey={ 'default' }\n\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\taccessibilityLabel={ __( 'Selected: Default' ) }\n\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t'Double tap to select default font size'\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t{ selectedValue === undefined && (\n\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t{ fontSizes.map( ( item, index ) => {\n\t\t\t\t\t\t// Only display a choice that we can currenly select.\n\t\t\t\t\t\tif ( ! parseFloat( item.sizePx ) ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\t\t\tlabel={ item.name }\n\t\t\t\t\t\t\t\tsubLabel={ item.sizePx }\n\t\t\t\t\t\t\t\tonPress={ onChangeValue( item.sizePx ) }\n\t\t\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\titem.sizePx === selectedValue\n\t\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Select font size option value e.g: \"Selected: Large\".\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Selected: %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\titem.name\n\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t: item.name\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t\t\t'Double tap to select font size'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t\t\t{ item.sizePx === selectedPxValue && (\n\t\t\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 200 }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tvalue={ selectedValue }\n\t\t\t\t\t\t\tonChange={ ( nextSize ) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t0 === parseFloat( nextSize ) ||\n\t\t\t\t\t\t\t\t\t! nextSize\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonChange( nextSize );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</View>\n\t\t\t</>\n\t\t</BottomSheet.SubSheet>\n\t);\n}\n\nexport default FontSizePicker;\n"],"mappings":"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"}
@@ -23,6 +23,7 @@ import { FlexItem } from '../flex';
23
23
  import { StyledHelp, StyledLabel } from '../base-control/styles/base-control-styles';
24
24
  import { Spacer } from '../spacer';
25
25
  import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
26
+ import { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';
26
27
  const identity = value => value;
27
28
 
28
29
  /**
@@ -160,13 +161,7 @@ export function FormTokenField(props) {
160
161
  }
161
162
  function onKeyDown(event) {
162
163
  let preventDefault = false;
163
- if (event.defaultPrevented ||
164
- // Ignore keydowns from IMEs
165
- event.nativeEvent.isComposing ||
166
- // Workaround for Mac Safari where the final Enter/Backspace of an IME composition
167
- // is `isComposing=false`, even though it's technically still part of the composition.
168
- // These can only be detected by keyCode.
169
- event.keyCode === 229) {
164
+ if (event.defaultPrevented) {
170
165
  return;
171
166
  }
172
167
  switch (event.key) {
@@ -505,7 +500,7 @@ export function FormTokenField(props) {
505
500
  const matchingSuggestions = getMatchingSuggestions();
506
501
  if (!disabled) {
507
502
  tokenFieldProps = Object.assign({}, tokenFieldProps, {
508
- onKeyDown,
503
+ onKeyDown: withIgnoreIMEEvents(onKeyDown),
509
504
  onKeyPress,
510
505
  onFocus: onFocusHandler
511
506
  });
@@ -1 +1 @@
1
- {"version":3,"names":["classnames","useEffect","useRef","useState","__","_n","sprintf","useDebounce","useInstanceId","usePrevious","speak","isShallowEqual","Token","TokenInput","TokensAndInputWrapperFlex","SuggestionsList","FlexItem","StyledHelp","StyledLabel","Spacer","useDeprecated36pxDefaultSizeProp","identity","value","FormTokenField","props","autoCapitalize","autoComplete","maxLength","placeholder","label","className","suggestions","maxSuggestions","displayTransform","saveTransform","token","trim","onChange","onInputChange","onFocus","undefined","isBorderless","disabled","tokenizeOnSpace","messages","added","removed","remove","__experimentalInvalid","__experimentalRenderItem","__experimentalExpandOnFocus","__experimentalValidateInput","__experimentalShowHowTo","__next40pxDefaultSize","__experimentalAutoSelectFirstMatch","__nextHasNoMarginBottom","tokenizeOnBlur","instanceId","incompleteTokenValue","setIncompleteTokenValue","inputOffsetFromEnd","setInputOffsetFromEnd","isActive","setIsActive","isExpanded","setIsExpanded","selectedSuggestionIndex","setSelectedSuggestionIndex","selectedSuggestionScroll","setSelectedSuggestionScroll","prevSuggestions","prevValue","input","tokensAndInput","debouncedSpeak","hasFocus","focus","suggestionsDidUpdate","updateSuggestions","current","ownerDocument","activeElement","onFocusHandler","event","target","onBlur","inputHasValidValue","addNewToken","hasFocusWithin","relatedTarget","onKeyDown","preventDefault","defaultPrevented","nativeEvent","isComposing","keyCode","key","handleDeleteKey","deleteTokenBeforeInput","addCurrentToken","handleLeftArrowKey","handleUpArrowKey","handleRightArrowKey","handleDownArrowKey","deleteTokenAfterInput","handleEscapeKey","onKeyPress","handleCommaKey","onContainerTouched","onTokenClickRemove","deleteToken","onSuggestionHovered","suggestion","index","getMatchingSuggestions","indexOf","onSuggestionSelected","onInputChangeHandler","text","separator","items","split","tokenValue","length","addNewTokens","slice","_deleteToken","isInputEmpty","moveInputBeforePreviousToken","moveInputAfterNextToken","HTMLInputElement","moveInputToIndex","Math","max","prevInputOffsetFromEnd","min","getIndexOfInput","selectedSuggestion","getSelectedSuggestion","tokens","tokensToAdd","Set","map","filter","Boolean","valueContainsToken","newValue","splice","newTokens","item","getTokenValue","searchValue","_suggestions","_value","_maxSuggestions","_saveTransform","match","startsWithMatch","containsMatch","normalizedValue","includes","toLocaleLowerCase","forEach","push","concat","some","resetSelectedSuggestion","inputHasMinimumChars","matchingSuggestions","hasMatchingSuggestions","shouldExpandIfFocuses","message","renderTokensAndInput","components","renderToken","renderInput","status","termPosition","termsCount","createElement","title","onClickRemove","onMouseEnter","onMouseLeave","inputProps","ref","classes","tokenFieldProps","tabIndex","Object","assign","htmlFor","onMouseDown","onTouchStart","justify","align","gap","wrap","hasTokens","selectedIndex","scrollIntoView","onHover","onSelect","marginBottom","id"],"sources":["@wordpress/components/src/form-token-field/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { KeyboardEvent, MouseEvent, TouchEvent, FocusEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useInstanceId, usePrevious } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport Token from './token';\nimport TokenInput from './token-input';\nimport { TokensAndInputWrapperFlex } from './styles';\nimport SuggestionsList from './suggestions-list';\nimport type { FormTokenFieldProps, TokenItem } from './types';\nimport { FlexItem } from '../flex';\nimport {\n\tStyledHelp,\n\tStyledLabel,\n} from '../base-control/styles/base-control-styles';\nimport { Spacer } from '../spacer';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\n\nconst identity = ( value: string ) => value;\n\n/**\n * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,\n * or the \"to\" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.\n *\n * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).\n * Tokens are separated by the \",\" character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.\n *\n * The `value` property is handled in a manner similar to controlled form components.\n * See [Forms](http://facebook.github.io/react/docs/forms.html) in the React Documentation for more information.\n */\nexport function FormTokenField( props: FormTokenFieldProps ) {\n\tconst {\n\t\tautoCapitalize,\n\t\tautoComplete,\n\t\tmaxLength,\n\t\tplaceholder,\n\t\tlabel = __( 'Add item' ),\n\t\tclassName,\n\t\tsuggestions = [],\n\t\tmaxSuggestions = 100,\n\t\tvalue = [],\n\t\tdisplayTransform = identity,\n\t\tsaveTransform = ( token ) => token.trim(),\n\t\tonChange = () => {},\n\t\tonInputChange = () => {},\n\t\tonFocus = undefined,\n\t\tisBorderless = false,\n\t\tdisabled = false,\n\t\ttokenizeOnSpace = false,\n\t\tmessages = {\n\t\t\tadded: __( 'Item added.' ),\n\t\t\tremoved: __( 'Item removed.' ),\n\t\t\tremove: __( 'Remove item' ),\n\t\t\t__experimentalInvalid: __( 'Invalid item' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t\t__experimentalExpandOnFocus = false,\n\t\t__experimentalValidateInput = () => true,\n\t\t__experimentalShowHowTo = true,\n\t\t__next40pxDefaultSize = false,\n\t\t__experimentalAutoSelectFirstMatch = false,\n\t\t__nextHasNoMarginBottom = false,\n\t\ttokenizeOnBlur = false,\n\t} = useDeprecated36pxDefaultSizeProp< FormTokenFieldProps >( props );\n\n\tconst instanceId = useInstanceId( FormTokenField );\n\n\t// We reset to these initial values again in the onBlur\n\tconst [ incompleteTokenValue, setIncompleteTokenValue ] = useState( '' );\n\tconst [ inputOffsetFromEnd, setInputOffsetFromEnd ] = useState( 0 );\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ selectedSuggestionIndex, setSelectedSuggestionIndex ] =\n\t\tuseState( -1 );\n\tconst [ selectedSuggestionScroll, setSelectedSuggestionScroll ] =\n\t\tuseState( false );\n\n\tconst prevSuggestions = usePrevious< string[] >( suggestions );\n\tconst prevValue = usePrevious< ( string | TokenItem )[] >( value );\n\n\tconst input = useRef< HTMLInputElement >( null );\n\tconst tokensAndInput = useRef< HTMLInputElement >( null );\n\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\n\tuseEffect( () => {\n\t\t// Make sure to focus the input when the isActive state is true.\n\t\tif ( isActive && ! hasFocus() ) {\n\t\t\tfocus();\n\t\t}\n\t}, [ isActive ] );\n\n\tuseEffect( () => {\n\t\tconst suggestionsDidUpdate = ! isShallowEqual(\n\t\t\tsuggestions,\n\t\t\tprevSuggestions || []\n\t\t);\n\n\t\tif ( suggestionsDidUpdate || value !== prevValue ) {\n\t\t\tupdateSuggestions( suggestionsDidUpdate );\n\t\t}\n\n\t\t// TODO: updateSuggestions() should first be refactored so its actual deps are clearer.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ suggestions, prevSuggestions, value, prevValue ] );\n\n\tuseEffect( () => {\n\t\tupdateSuggestions();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ incompleteTokenValue ] );\n\n\tuseEffect( () => {\n\t\tupdateSuggestions();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ __experimentalAutoSelectFirstMatch ] );\n\n\tif ( disabled && isActive ) {\n\t\tsetIsActive( false );\n\t\tsetIncompleteTokenValue( '' );\n\t}\n\n\tfunction focus() {\n\t\tinput.current?.focus();\n\t}\n\n\tfunction hasFocus() {\n\t\treturn input.current === input.current?.ownerDocument.activeElement;\n\t}\n\n\tfunction onFocusHandler( event: FocusEvent ) {\n\t\t// If focus is on the input or on the container, set the isActive state to true.\n\t\tif ( hasFocus() || event.target === tokensAndInput.current ) {\n\t\t\tsetIsActive( true );\n\t\t\tsetIsExpanded( __experimentalExpandOnFocus || isExpanded );\n\t\t} else {\n\t\t\t/*\n\t\t\t * Otherwise, focus is on one of the token \"remove\" buttons and we\n\t\t\t * set the isActive state to false to prevent the input to be\n\t\t\t * re-focused, see componentDidUpdate().\n\t\t\t */\n\t\t\tsetIsActive( false );\n\t\t}\n\n\t\tif ( 'function' === typeof onFocus ) {\n\t\t\tonFocus( event );\n\t\t}\n\t}\n\n\tfunction onBlur( event: FocusEvent ) {\n\t\tif (\n\t\t\tinputHasValidValue() &&\n\t\t\t__experimentalValidateInput( incompleteTokenValue )\n\t\t) {\n\t\t\tsetIsActive( false );\n\t\t\tif ( tokenizeOnBlur && inputHasValidValue() ) {\n\t\t\t\taddNewToken( incompleteTokenValue );\n\t\t\t}\n\t\t} else {\n\t\t\t// Reset to initial state\n\t\t\tsetIncompleteTokenValue( '' );\n\t\t\tsetInputOffsetFromEnd( 0 );\n\t\t\tsetIsActive( false );\n\n\t\t\tif ( __experimentalExpandOnFocus ) {\n\t\t\t\t// If `__experimentalExpandOnFocus` is true, don't close the suggestions list when\n\t\t\t\t// the user clicks on it (`tokensAndInput` will be the element that caused the blur).\n\t\t\t\tconst hasFocusWithin =\n\t\t\t\t\tevent.relatedTarget === tokensAndInput.current;\n\t\t\t\tsetIsExpanded( hasFocusWithin );\n\t\t\t} else {\n\t\t\t\t// Else collapse the suggestion list. This will result in the suggestion list closing\n\t\t\t\t// after a suggestion has been submitted since that causes a blur.\n\t\t\t\tsetIsExpanded( false );\n\t\t\t}\n\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onKeyDown( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\n\t\tif (\n\t\t\tevent.defaultPrevented ||\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\t\tswitch ( event.key ) {\n\t\t\tcase 'Backspace':\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenBeforeInput );\n\t\t\t\tbreak;\n\t\t\tcase 'Enter':\n\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowLeft':\n\t\t\t\tpreventDefault = handleLeftArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\tpreventDefault = handleUpArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowRight':\n\t\t\t\tpreventDefault = handleRightArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\tpreventDefault = handleDownArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'Delete':\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenAfterInput );\n\t\t\t\tbreak;\n\t\t\tcase 'Space':\n\t\t\t\tif ( tokenizeOnSpace ) {\n\t\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tpreventDefault = handleEscapeKey( event );\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onKeyPress( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\n\t\tswitch ( event.key ) {\n\t\t\tcase ',':\n\t\t\t\tpreventDefault = handleCommaKey();\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onContainerTouched( event: MouseEvent | TouchEvent ) {\n\t\t// Prevent clicking/touching the tokensAndInput container from blurring\n\t\t// the input and adding the current token.\n\t\tif ( event.target === tokensAndInput.current && isActive ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onTokenClickRemove( event: { value: string } ) {\n\t\tdeleteToken( event.value );\n\t\tfocus();\n\t}\n\n\tfunction onSuggestionHovered( suggestion: string ) {\n\t\tconst index = getMatchingSuggestions().indexOf( suggestion );\n\n\t\tif ( index >= 0 ) {\n\t\t\tsetSelectedSuggestionIndex( index );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onSuggestionSelected( suggestion: string ) {\n\t\taddNewToken( suggestion );\n\t}\n\n\tfunction onInputChangeHandler( event: { value: string } ) {\n\t\tconst text = event.value;\n\t\tconst separator = tokenizeOnSpace ? /[ ,\\t]+/ : /[,\\t]+/;\n\t\tconst items = text.split( separator );\n\t\tconst tokenValue = items[ items.length - 1 ] || '';\n\n\t\tif ( items.length > 1 ) {\n\t\t\taddNewTokens( items.slice( 0, -1 ) );\n\t\t}\n\t\tsetIncompleteTokenValue( tokenValue );\n\t\tonInputChange( tokenValue );\n\t}\n\n\tfunction handleDeleteKey( _deleteToken: () => void ) {\n\t\tlet preventDefault = false;\n\t\tif ( hasFocus() && isInputEmpty() ) {\n\t\t\t_deleteToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleLeftArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputBeforePreviousToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleRightArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputAfterNextToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleUpArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index === 0\n\t\t\t\t\t? getMatchingSuggestions(\n\t\t\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\t\t\tsuggestions,\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\t\t\tsaveTransform\n\t\t\t\t\t ).length\n\t\t\t\t\t: index ) - 1\n\t\t\t);\n\t\t} );\n\t\tsetSelectedSuggestionScroll( true );\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleDownArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index + 1 ) %\n\t\t\t\tgetMatchingSuggestions(\n\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\tsuggestions,\n\t\t\t\t\tvalue,\n\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\tsaveTransform\n\t\t\t\t).length\n\t\t\t);\n\t\t} );\n\n\t\tsetSelectedSuggestionScroll( true );\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleEscapeKey( event: KeyboardEvent ) {\n\t\tif ( event.target instanceof HTMLInputElement ) {\n\t\t\tsetIncompleteTokenValue( event.target.value );\n\t\t\tsetIsExpanded( false );\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleCommaKey() {\n\t\tif ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction moveInputToIndex( index: number ) {\n\t\tsetInputOffsetFromEnd( value.length - Math.max( index, -1 ) - 1 );\n\t}\n\n\tfunction moveInputBeforePreviousToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.min( prevInputOffsetFromEnd + 1, value.length );\n\t\t} );\n\t}\n\n\tfunction moveInputAfterNextToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.max( prevInputOffsetFromEnd - 1, 0 );\n\t\t} );\n\t}\n\n\tfunction deleteTokenBeforeInput() {\n\t\tconst index = getIndexOfInput() - 1;\n\n\t\tif ( index > -1 ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t}\n\t}\n\n\tfunction deleteTokenAfterInput() {\n\t\tconst index = getIndexOfInput();\n\n\t\tif ( index < value.length ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t\t// Update input offset since it's the offset from the last token.\n\t\t\tmoveInputToIndex( index );\n\t\t}\n\t}\n\n\tfunction addCurrentToken() {\n\t\tlet preventDefault = false;\n\t\tconst selectedSuggestion = getSelectedSuggestion();\n\n\t\tif ( selectedSuggestion ) {\n\t\t\taddNewToken( selectedSuggestion );\n\t\t\tpreventDefault = true;\n\t\t} else if ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction addNewTokens( tokens: string[] ) {\n\t\tconst tokensToAdd = [\n\t\t\t...new Set(\n\t\t\t\ttokens\n\t\t\t\t\t.map( saveTransform )\n\t\t\t\t\t.filter( Boolean )\n\t\t\t\t\t.filter( ( token ) => ! valueContainsToken( token ) )\n\t\t\t),\n\t\t];\n\n\t\tif ( tokensToAdd.length > 0 ) {\n\t\t\tconst newValue = [ ...value ];\n\t\t\tnewValue.splice( getIndexOfInput(), 0, ...tokensToAdd );\n\t\t\tonChange( newValue );\n\t\t}\n\t}\n\n\tfunction addNewToken( token: string ) {\n\t\tif ( ! __experimentalValidateInput( token ) ) {\n\t\t\tspeak( messages.__experimentalInvalid, 'assertive' );\n\t\t\treturn;\n\t\t}\n\t\taddNewTokens( [ token ] );\n\t\tspeak( messages.added, 'assertive' );\n\n\t\tsetIncompleteTokenValue( '' );\n\t\tsetSelectedSuggestionIndex( -1 );\n\t\tsetSelectedSuggestionScroll( false );\n\t\tsetIsExpanded( ! __experimentalExpandOnFocus );\n\n\t\tif ( isActive && ! tokenizeOnBlur ) {\n\t\t\tfocus();\n\t\t}\n\t}\n\n\tfunction deleteToken( token: string | TokenItem ) {\n\t\tconst newTokens = value.filter( ( item ) => {\n\t\t\treturn getTokenValue( item ) !== getTokenValue( token );\n\t\t} );\n\t\tonChange( newTokens );\n\t\tspeak( messages.removed, 'assertive' );\n\t}\n\n\tfunction getTokenValue( token: { value: string } | string ) {\n\t\tif ( 'object' === typeof token ) {\n\t\t\treturn token.value;\n\t\t}\n\n\t\treturn token;\n\t}\n\n\tfunction getMatchingSuggestions(\n\t\tsearchValue = incompleteTokenValue,\n\t\t_suggestions = suggestions,\n\t\t_value = value,\n\t\t_maxSuggestions = maxSuggestions,\n\t\t_saveTransform = saveTransform\n\t) {\n\t\tlet match = _saveTransform( searchValue );\n\t\tconst startsWithMatch: string[] = [];\n\t\tconst containsMatch: string[] = [];\n\t\tconst normalizedValue = _value.map( ( item ) => {\n\t\t\tif ( typeof item === 'string' ) {\n\t\t\t\treturn item;\n\t\t\t}\n\t\t\treturn item.value;\n\t\t} );\n\n\t\tif ( match.length === 0 ) {\n\t\t\t_suggestions = _suggestions.filter(\n\t\t\t\t( suggestion ) => ! normalizedValue.includes( suggestion )\n\t\t\t);\n\t\t} else {\n\t\t\tmatch = match.toLocaleLowerCase();\n\n\t\t\t_suggestions.forEach( ( suggestion ) => {\n\t\t\t\tconst index = suggestion.toLocaleLowerCase().indexOf( match );\n\t\t\t\tif ( normalizedValue.indexOf( suggestion ) === -1 ) {\n\t\t\t\t\tif ( index === 0 ) {\n\t\t\t\t\t\tstartsWithMatch.push( suggestion );\n\t\t\t\t\t} else if ( index > 0 ) {\n\t\t\t\t\t\tcontainsMatch.push( suggestion );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\t_suggestions = startsWithMatch.concat( containsMatch );\n\t\t}\n\n\t\treturn _suggestions.slice( 0, _maxSuggestions );\n\t}\n\n\tfunction getSelectedSuggestion() {\n\t\tif ( selectedSuggestionIndex !== -1 ) {\n\t\t\treturn getMatchingSuggestions()[ selectedSuggestionIndex ];\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\tfunction valueContainsToken( token: string ) {\n\t\treturn value.some( ( item ) => {\n\t\t\treturn getTokenValue( token ) === getTokenValue( item );\n\t\t} );\n\t}\n\n\tfunction getIndexOfInput() {\n\t\treturn value.length - inputOffsetFromEnd;\n\t}\n\n\tfunction isInputEmpty() {\n\t\treturn incompleteTokenValue.length === 0;\n\t}\n\n\tfunction inputHasValidValue() {\n\t\treturn saveTransform( incompleteTokenValue ).length > 0;\n\t}\n\n\tfunction updateSuggestions( resetSelectedSuggestion = true ) {\n\t\tconst inputHasMinimumChars = incompleteTokenValue.trim().length > 1;\n\t\tconst matchingSuggestions =\n\t\t\tgetMatchingSuggestions( incompleteTokenValue );\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\n\t\tconst shouldExpandIfFocuses = hasFocus() && __experimentalExpandOnFocus;\n\t\tsetIsExpanded(\n\t\t\tshouldExpandIfFocuses ||\n\t\t\t\t( inputHasMinimumChars && hasMatchingSuggestions )\n\t\t);\n\n\t\tif ( resetSelectedSuggestion ) {\n\t\t\tif (\n\t\t\t\t__experimentalAutoSelectFirstMatch &&\n\t\t\t\tinputHasMinimumChars &&\n\t\t\t\thasMatchingSuggestions\n\t\t\t) {\n\t\t\t\tsetSelectedSuggestionIndex( 0 );\n\t\t\t\tsetSelectedSuggestionScroll( true );\n\t\t\t} else {\n\t\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\t\tsetSelectedSuggestionScroll( false );\n\t\t\t}\n\t\t}\n\n\t\tif ( inputHasMinimumChars ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tdebouncedSpeak( message, 'assertive' );\n\t\t}\n\t}\n\n\tfunction renderTokensAndInput() {\n\t\tconst components = value.map( renderToken );\n\t\tcomponents.splice( getIndexOfInput(), 0, renderInput() );\n\n\t\treturn components;\n\t}\n\n\tfunction renderToken(\n\t\ttoken: string | TokenItem,\n\t\tindex: number,\n\t\ttokens: ( string | TokenItem )[]\n\t) {\n\t\tconst _value = getTokenValue( token );\n\t\tconst status = typeof token !== 'string' ? token.status : undefined;\n\t\tconst termPosition = index + 1;\n\t\tconst termsCount = tokens.length;\n\n\t\treturn (\n\t\t\t<FlexItem key={ 'token-' + _value }>\n\t\t\t\t<Token\n\t\t\t\t\tvalue={ _value }\n\t\t\t\t\tstatus={ status }\n\t\t\t\t\ttitle={\n\t\t\t\t\t\ttypeof token !== 'string' ? token.title : undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\tonClickRemove={ onTokenClickRemove }\n\t\t\t\t\tisBorderless={\n\t\t\t\t\t\t( typeof token !== 'string' && token.isBorderless ) ||\n\t\t\t\t\t\tisBorderless\n\t\t\t\t\t}\n\t\t\t\t\tonMouseEnter={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseEnter\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tonMouseLeave={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseLeave\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={ 'error' !== status && disabled }\n\t\t\t\t\tmessages={ messages }\n\t\t\t\t\ttermsCount={ termsCount }\n\t\t\t\t\ttermPosition={ termPosition }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t);\n\t}\n\n\tfunction renderInput() {\n\t\tconst inputProps = {\n\t\t\tinstanceId,\n\t\t\tautoCapitalize,\n\t\t\tautoComplete,\n\t\t\tplaceholder: value.length === 0 ? placeholder : '',\n\t\t\tkey: 'input',\n\t\t\tdisabled,\n\t\t\tvalue: incompleteTokenValue,\n\t\t\tonBlur,\n\t\t\tisExpanded,\n\t\t\tselectedSuggestionIndex,\n\t\t};\n\n\t\treturn (\n\t\t\t<TokenInput\n\t\t\t\t{ ...inputProps }\n\t\t\t\tonChange={\n\t\t\t\t\t! ( maxLength && value.length >= maxLength )\n\t\t\t\t\t\t? onInputChangeHandler\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tref={ input }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst classes = classnames(\n\t\tclassName,\n\t\t'components-form-token-field__input-container',\n\t\t{\n\t\t\t'is-active': isActive,\n\t\t\t'is-disabled': disabled,\n\t\t}\n\t);\n\n\tlet tokenFieldProps = {\n\t\tclassName: 'components-form-token-field',\n\t\ttabIndex: -1,\n\t};\n\tconst matchingSuggestions = getMatchingSuggestions();\n\n\tif ( ! disabled ) {\n\t\ttokenFieldProps = Object.assign( {}, tokenFieldProps, {\n\t\t\tonKeyDown,\n\t\t\tonKeyPress,\n\t\t\tonFocus: onFocusHandler,\n\t\t} );\n\t}\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<div { ...tokenFieldProps }>\n\t\t\t<StyledLabel\n\t\t\t\thtmlFor={ `components-form-token-input-${ instanceId }` }\n\t\t\t\tclassName=\"components-form-token-field__label\"\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</StyledLabel>\n\t\t\t<div\n\t\t\t\tref={ tokensAndInput }\n\t\t\t\tclassName={ classes }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\tonMouseDown={ onContainerTouched }\n\t\t\t\tonTouchStart={ onContainerTouched }\n\t\t\t>\n\t\t\t\t<TokensAndInputWrapperFlex\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap={ 1 }\n\t\t\t\t\twrap={ true }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\thasTokens={ !! value.length }\n\t\t\t\t>\n\t\t\t\t\t{ renderTokensAndInput() }\n\t\t\t\t</TokensAndInputWrapperFlex>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\tmatch={ saveTransform( incompleteTokenValue ) }\n\t\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\tselectedIndex={ selectedSuggestionIndex }\n\t\t\t\t\t\tscrollIntoView={ selectedSuggestionScroll }\n\t\t\t\t\t\tonHover={ onSuggestionHovered }\n\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t__experimentalRenderItem={ __experimentalRenderItem }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ ! __nextHasNoMarginBottom && <Spacer marginBottom={ 2 } /> }\n\t\t\t{ __experimentalShowHowTo && (\n\t\t\t\t<StyledHelp\n\t\t\t\t\tid={ `components-form-token-suggestions-howto-${ instanceId }` }\n\t\t\t\t\tclassName=\"components-form-token-field__help\"\n\t\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\t>\n\t\t\t\t\t{ tokenizeOnSpace\n\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t'Separate with commas, spaces, or the Enter key.'\n\t\t\t\t\t\t )\n\t\t\t\t\t\t: __( 'Separate with commas or the Enter key.' ) }\n\t\t\t\t</StyledHelp>\n\t\t\t) }\n\t\t</div>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default FormTokenField;\n"],"mappings":"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"}
1
+ {"version":3,"names":["classnames","useEffect","useRef","useState","__","_n","sprintf","useDebounce","useInstanceId","usePrevious","speak","isShallowEqual","Token","TokenInput","TokensAndInputWrapperFlex","SuggestionsList","FlexItem","StyledHelp","StyledLabel","Spacer","useDeprecated36pxDefaultSizeProp","withIgnoreIMEEvents","identity","value","FormTokenField","props","autoCapitalize","autoComplete","maxLength","placeholder","label","className","suggestions","maxSuggestions","displayTransform","saveTransform","token","trim","onChange","onInputChange","onFocus","undefined","isBorderless","disabled","tokenizeOnSpace","messages","added","removed","remove","__experimentalInvalid","__experimentalRenderItem","__experimentalExpandOnFocus","__experimentalValidateInput","__experimentalShowHowTo","__next40pxDefaultSize","__experimentalAutoSelectFirstMatch","__nextHasNoMarginBottom","tokenizeOnBlur","instanceId","incompleteTokenValue","setIncompleteTokenValue","inputOffsetFromEnd","setInputOffsetFromEnd","isActive","setIsActive","isExpanded","setIsExpanded","selectedSuggestionIndex","setSelectedSuggestionIndex","selectedSuggestionScroll","setSelectedSuggestionScroll","prevSuggestions","prevValue","input","tokensAndInput","debouncedSpeak","hasFocus","focus","suggestionsDidUpdate","updateSuggestions","current","ownerDocument","activeElement","onFocusHandler","event","target","onBlur","inputHasValidValue","addNewToken","hasFocusWithin","relatedTarget","onKeyDown","preventDefault","defaultPrevented","key","handleDeleteKey","deleteTokenBeforeInput","addCurrentToken","handleLeftArrowKey","handleUpArrowKey","handleRightArrowKey","handleDownArrowKey","deleteTokenAfterInput","handleEscapeKey","onKeyPress","handleCommaKey","onContainerTouched","onTokenClickRemove","deleteToken","onSuggestionHovered","suggestion","index","getMatchingSuggestions","indexOf","onSuggestionSelected","onInputChangeHandler","text","separator","items","split","tokenValue","length","addNewTokens","slice","_deleteToken","isInputEmpty","moveInputBeforePreviousToken","moveInputAfterNextToken","HTMLInputElement","moveInputToIndex","Math","max","prevInputOffsetFromEnd","min","getIndexOfInput","selectedSuggestion","getSelectedSuggestion","tokens","tokensToAdd","Set","map","filter","Boolean","valueContainsToken","newValue","splice","newTokens","item","getTokenValue","searchValue","_suggestions","_value","_maxSuggestions","_saveTransform","match","startsWithMatch","containsMatch","normalizedValue","includes","toLocaleLowerCase","forEach","push","concat","some","resetSelectedSuggestion","inputHasMinimumChars","matchingSuggestions","hasMatchingSuggestions","shouldExpandIfFocuses","message","renderTokensAndInput","components","renderToken","renderInput","status","termPosition","termsCount","createElement","title","onClickRemove","onMouseEnter","onMouseLeave","inputProps","ref","classes","tokenFieldProps","tabIndex","Object","assign","htmlFor","onMouseDown","onTouchStart","justify","align","gap","wrap","hasTokens","selectedIndex","scrollIntoView","onHover","onSelect","marginBottom","id"],"sources":["@wordpress/components/src/form-token-field/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { KeyboardEvent, MouseEvent, TouchEvent, FocusEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { useDebounce, useInstanceId, usePrevious } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport isShallowEqual from '@wordpress/is-shallow-equal';\n\n/**\n * Internal dependencies\n */\nimport Token from './token';\nimport TokenInput from './token-input';\nimport { TokensAndInputWrapperFlex } from './styles';\nimport SuggestionsList from './suggestions-list';\nimport type { FormTokenFieldProps, TokenItem } from './types';\nimport { FlexItem } from '../flex';\nimport {\n\tStyledHelp,\n\tStyledLabel,\n} from '../base-control/styles/base-control-styles';\nimport { Spacer } from '../spacer';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\n\nconst identity = ( value: string ) => value;\n\n/**\n * A `FormTokenField` is a field similar to the tags and categories fields in the interim editor chrome,\n * or the \"to\" field in Mail on OS X. Tokens can be entered by typing them or selecting them from a list of suggested tokens.\n *\n * Up to one hundred suggestions that match what the user has typed so far will be shown from which the user can pick from (auto-complete).\n * Tokens are separated by the \",\" character. Suggestions can be selected with the up or down arrows and added with the tab or enter key.\n *\n * The `value` property is handled in a manner similar to controlled form components.\n * See [Forms](http://facebook.github.io/react/docs/forms.html) in the React Documentation for more information.\n */\nexport function FormTokenField( props: FormTokenFieldProps ) {\n\tconst {\n\t\tautoCapitalize,\n\t\tautoComplete,\n\t\tmaxLength,\n\t\tplaceholder,\n\t\tlabel = __( 'Add item' ),\n\t\tclassName,\n\t\tsuggestions = [],\n\t\tmaxSuggestions = 100,\n\t\tvalue = [],\n\t\tdisplayTransform = identity,\n\t\tsaveTransform = ( token ) => token.trim(),\n\t\tonChange = () => {},\n\t\tonInputChange = () => {},\n\t\tonFocus = undefined,\n\t\tisBorderless = false,\n\t\tdisabled = false,\n\t\ttokenizeOnSpace = false,\n\t\tmessages = {\n\t\t\tadded: __( 'Item added.' ),\n\t\t\tremoved: __( 'Item removed.' ),\n\t\t\tremove: __( 'Remove item' ),\n\t\t\t__experimentalInvalid: __( 'Invalid item' ),\n\t\t},\n\t\t__experimentalRenderItem,\n\t\t__experimentalExpandOnFocus = false,\n\t\t__experimentalValidateInput = () => true,\n\t\t__experimentalShowHowTo = true,\n\t\t__next40pxDefaultSize = false,\n\t\t__experimentalAutoSelectFirstMatch = false,\n\t\t__nextHasNoMarginBottom = false,\n\t\ttokenizeOnBlur = false,\n\t} = useDeprecated36pxDefaultSizeProp< FormTokenFieldProps >( props );\n\n\tconst instanceId = useInstanceId( FormTokenField );\n\n\t// We reset to these initial values again in the onBlur\n\tconst [ incompleteTokenValue, setIncompleteTokenValue ] = useState( '' );\n\tconst [ inputOffsetFromEnd, setInputOffsetFromEnd ] = useState( 0 );\n\tconst [ isActive, setIsActive ] = useState( false );\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ selectedSuggestionIndex, setSelectedSuggestionIndex ] =\n\t\tuseState( -1 );\n\tconst [ selectedSuggestionScroll, setSelectedSuggestionScroll ] =\n\t\tuseState( false );\n\n\tconst prevSuggestions = usePrevious< string[] >( suggestions );\n\tconst prevValue = usePrevious< ( string | TokenItem )[] >( value );\n\n\tconst input = useRef< HTMLInputElement >( null );\n\tconst tokensAndInput = useRef< HTMLInputElement >( null );\n\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\n\tuseEffect( () => {\n\t\t// Make sure to focus the input when the isActive state is true.\n\t\tif ( isActive && ! hasFocus() ) {\n\t\t\tfocus();\n\t\t}\n\t}, [ isActive ] );\n\n\tuseEffect( () => {\n\t\tconst suggestionsDidUpdate = ! isShallowEqual(\n\t\t\tsuggestions,\n\t\t\tprevSuggestions || []\n\t\t);\n\n\t\tif ( suggestionsDidUpdate || value !== prevValue ) {\n\t\t\tupdateSuggestions( suggestionsDidUpdate );\n\t\t}\n\n\t\t// TODO: updateSuggestions() should first be refactored so its actual deps are clearer.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ suggestions, prevSuggestions, value, prevValue ] );\n\n\tuseEffect( () => {\n\t\tupdateSuggestions();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ incompleteTokenValue ] );\n\n\tuseEffect( () => {\n\t\tupdateSuggestions();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ __experimentalAutoSelectFirstMatch ] );\n\n\tif ( disabled && isActive ) {\n\t\tsetIsActive( false );\n\t\tsetIncompleteTokenValue( '' );\n\t}\n\n\tfunction focus() {\n\t\tinput.current?.focus();\n\t}\n\n\tfunction hasFocus() {\n\t\treturn input.current === input.current?.ownerDocument.activeElement;\n\t}\n\n\tfunction onFocusHandler( event: FocusEvent ) {\n\t\t// If focus is on the input or on the container, set the isActive state to true.\n\t\tif ( hasFocus() || event.target === tokensAndInput.current ) {\n\t\t\tsetIsActive( true );\n\t\t\tsetIsExpanded( __experimentalExpandOnFocus || isExpanded );\n\t\t} else {\n\t\t\t/*\n\t\t\t * Otherwise, focus is on one of the token \"remove\" buttons and we\n\t\t\t * set the isActive state to false to prevent the input to be\n\t\t\t * re-focused, see componentDidUpdate().\n\t\t\t */\n\t\t\tsetIsActive( false );\n\t\t}\n\n\t\tif ( 'function' === typeof onFocus ) {\n\t\t\tonFocus( event );\n\t\t}\n\t}\n\n\tfunction onBlur( event: FocusEvent ) {\n\t\tif (\n\t\t\tinputHasValidValue() &&\n\t\t\t__experimentalValidateInput( incompleteTokenValue )\n\t\t) {\n\t\t\tsetIsActive( false );\n\t\t\tif ( tokenizeOnBlur && inputHasValidValue() ) {\n\t\t\t\taddNewToken( incompleteTokenValue );\n\t\t\t}\n\t\t} else {\n\t\t\t// Reset to initial state\n\t\t\tsetIncompleteTokenValue( '' );\n\t\t\tsetInputOffsetFromEnd( 0 );\n\t\t\tsetIsActive( false );\n\n\t\t\tif ( __experimentalExpandOnFocus ) {\n\t\t\t\t// If `__experimentalExpandOnFocus` is true, don't close the suggestions list when\n\t\t\t\t// the user clicks on it (`tokensAndInput` will be the element that caused the blur).\n\t\t\t\tconst hasFocusWithin =\n\t\t\t\t\tevent.relatedTarget === tokensAndInput.current;\n\t\t\t\tsetIsExpanded( hasFocusWithin );\n\t\t\t} else {\n\t\t\t\t// Else collapse the suggestion list. This will result in the suggestion list closing\n\t\t\t\t// after a suggestion has been submitted since that causes a blur.\n\t\t\t\tsetIsExpanded( false );\n\t\t\t}\n\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onKeyDown( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\t\tswitch ( event.key ) {\n\t\t\tcase 'Backspace':\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenBeforeInput );\n\t\t\t\tbreak;\n\t\t\tcase 'Enter':\n\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowLeft':\n\t\t\t\tpreventDefault = handleLeftArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\tpreventDefault = handleUpArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowRight':\n\t\t\t\tpreventDefault = handleRightArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\tpreventDefault = handleDownArrowKey();\n\t\t\t\tbreak;\n\t\t\tcase 'Delete':\n\t\t\t\tpreventDefault = handleDeleteKey( deleteTokenAfterInput );\n\t\t\t\tbreak;\n\t\t\tcase 'Space':\n\t\t\t\tif ( tokenizeOnSpace ) {\n\t\t\t\t\tpreventDefault = addCurrentToken();\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tpreventDefault = handleEscapeKey( event );\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onKeyPress( event: KeyboardEvent ) {\n\t\tlet preventDefault = false;\n\n\t\tswitch ( event.key ) {\n\t\t\tcase ',':\n\t\t\t\tpreventDefault = handleCommaKey();\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onContainerTouched( event: MouseEvent | TouchEvent ) {\n\t\t// Prevent clicking/touching the tokensAndInput container from blurring\n\t\t// the input and adding the current token.\n\t\tif ( event.target === tokensAndInput.current && isActive ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t}\n\n\tfunction onTokenClickRemove( event: { value: string } ) {\n\t\tdeleteToken( event.value );\n\t\tfocus();\n\t}\n\n\tfunction onSuggestionHovered( suggestion: string ) {\n\t\tconst index = getMatchingSuggestions().indexOf( suggestion );\n\n\t\tif ( index >= 0 ) {\n\t\t\tsetSelectedSuggestionIndex( index );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\t}\n\n\tfunction onSuggestionSelected( suggestion: string ) {\n\t\taddNewToken( suggestion );\n\t}\n\n\tfunction onInputChangeHandler( event: { value: string } ) {\n\t\tconst text = event.value;\n\t\tconst separator = tokenizeOnSpace ? /[ ,\\t]+/ : /[,\\t]+/;\n\t\tconst items = text.split( separator );\n\t\tconst tokenValue = items[ items.length - 1 ] || '';\n\n\t\tif ( items.length > 1 ) {\n\t\t\taddNewTokens( items.slice( 0, -1 ) );\n\t\t}\n\t\tsetIncompleteTokenValue( tokenValue );\n\t\tonInputChange( tokenValue );\n\t}\n\n\tfunction handleDeleteKey( _deleteToken: () => void ) {\n\t\tlet preventDefault = false;\n\t\tif ( hasFocus() && isInputEmpty() ) {\n\t\t\t_deleteToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleLeftArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputBeforePreviousToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleRightArrowKey() {\n\t\tlet preventDefault = false;\n\t\tif ( isInputEmpty() ) {\n\t\t\tmoveInputAfterNextToken();\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction handleUpArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index === 0\n\t\t\t\t\t? getMatchingSuggestions(\n\t\t\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\t\t\tsuggestions,\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\t\t\tsaveTransform\n\t\t\t\t\t ).length\n\t\t\t\t\t: index ) - 1\n\t\t\t);\n\t\t} );\n\t\tsetSelectedSuggestionScroll( true );\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleDownArrowKey() {\n\t\tsetSelectedSuggestionIndex( ( index ) => {\n\t\t\treturn (\n\t\t\t\t( index + 1 ) %\n\t\t\t\tgetMatchingSuggestions(\n\t\t\t\t\tincompleteTokenValue,\n\t\t\t\t\tsuggestions,\n\t\t\t\t\tvalue,\n\t\t\t\t\tmaxSuggestions,\n\t\t\t\t\tsaveTransform\n\t\t\t\t).length\n\t\t\t);\n\t\t} );\n\n\t\tsetSelectedSuggestionScroll( true );\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleEscapeKey( event: KeyboardEvent ) {\n\t\tif ( event.target instanceof HTMLInputElement ) {\n\t\t\tsetIncompleteTokenValue( event.target.value );\n\t\t\tsetIsExpanded( false );\n\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\tsetSelectedSuggestionScroll( false );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction handleCommaKey() {\n\t\tif ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t}\n\n\t\treturn true; // PreventDefault.\n\t}\n\n\tfunction moveInputToIndex( index: number ) {\n\t\tsetInputOffsetFromEnd( value.length - Math.max( index, -1 ) - 1 );\n\t}\n\n\tfunction moveInputBeforePreviousToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.min( prevInputOffsetFromEnd + 1, value.length );\n\t\t} );\n\t}\n\n\tfunction moveInputAfterNextToken() {\n\t\tsetInputOffsetFromEnd( ( prevInputOffsetFromEnd ) => {\n\t\t\treturn Math.max( prevInputOffsetFromEnd - 1, 0 );\n\t\t} );\n\t}\n\n\tfunction deleteTokenBeforeInput() {\n\t\tconst index = getIndexOfInput() - 1;\n\n\t\tif ( index > -1 ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t}\n\t}\n\n\tfunction deleteTokenAfterInput() {\n\t\tconst index = getIndexOfInput();\n\n\t\tif ( index < value.length ) {\n\t\t\tdeleteToken( value[ index ] );\n\t\t\t// Update input offset since it's the offset from the last token.\n\t\t\tmoveInputToIndex( index );\n\t\t}\n\t}\n\n\tfunction addCurrentToken() {\n\t\tlet preventDefault = false;\n\t\tconst selectedSuggestion = getSelectedSuggestion();\n\n\t\tif ( selectedSuggestion ) {\n\t\t\taddNewToken( selectedSuggestion );\n\t\t\tpreventDefault = true;\n\t\t} else if ( inputHasValidValue() ) {\n\t\t\taddNewToken( incompleteTokenValue );\n\t\t\tpreventDefault = true;\n\t\t}\n\n\t\treturn preventDefault;\n\t}\n\n\tfunction addNewTokens( tokens: string[] ) {\n\t\tconst tokensToAdd = [\n\t\t\t...new Set(\n\t\t\t\ttokens\n\t\t\t\t\t.map( saveTransform )\n\t\t\t\t\t.filter( Boolean )\n\t\t\t\t\t.filter( ( token ) => ! valueContainsToken( token ) )\n\t\t\t),\n\t\t];\n\n\t\tif ( tokensToAdd.length > 0 ) {\n\t\t\tconst newValue = [ ...value ];\n\t\t\tnewValue.splice( getIndexOfInput(), 0, ...tokensToAdd );\n\t\t\tonChange( newValue );\n\t\t}\n\t}\n\n\tfunction addNewToken( token: string ) {\n\t\tif ( ! __experimentalValidateInput( token ) ) {\n\t\t\tspeak( messages.__experimentalInvalid, 'assertive' );\n\t\t\treturn;\n\t\t}\n\t\taddNewTokens( [ token ] );\n\t\tspeak( messages.added, 'assertive' );\n\n\t\tsetIncompleteTokenValue( '' );\n\t\tsetSelectedSuggestionIndex( -1 );\n\t\tsetSelectedSuggestionScroll( false );\n\t\tsetIsExpanded( ! __experimentalExpandOnFocus );\n\n\t\tif ( isActive && ! tokenizeOnBlur ) {\n\t\t\tfocus();\n\t\t}\n\t}\n\n\tfunction deleteToken( token: string | TokenItem ) {\n\t\tconst newTokens = value.filter( ( item ) => {\n\t\t\treturn getTokenValue( item ) !== getTokenValue( token );\n\t\t} );\n\t\tonChange( newTokens );\n\t\tspeak( messages.removed, 'assertive' );\n\t}\n\n\tfunction getTokenValue( token: { value: string } | string ) {\n\t\tif ( 'object' === typeof token ) {\n\t\t\treturn token.value;\n\t\t}\n\n\t\treturn token;\n\t}\n\n\tfunction getMatchingSuggestions(\n\t\tsearchValue = incompleteTokenValue,\n\t\t_suggestions = suggestions,\n\t\t_value = value,\n\t\t_maxSuggestions = maxSuggestions,\n\t\t_saveTransform = saveTransform\n\t) {\n\t\tlet match = _saveTransform( searchValue );\n\t\tconst startsWithMatch: string[] = [];\n\t\tconst containsMatch: string[] = [];\n\t\tconst normalizedValue = _value.map( ( item ) => {\n\t\t\tif ( typeof item === 'string' ) {\n\t\t\t\treturn item;\n\t\t\t}\n\t\t\treturn item.value;\n\t\t} );\n\n\t\tif ( match.length === 0 ) {\n\t\t\t_suggestions = _suggestions.filter(\n\t\t\t\t( suggestion ) => ! normalizedValue.includes( suggestion )\n\t\t\t);\n\t\t} else {\n\t\t\tmatch = match.toLocaleLowerCase();\n\n\t\t\t_suggestions.forEach( ( suggestion ) => {\n\t\t\t\tconst index = suggestion.toLocaleLowerCase().indexOf( match );\n\t\t\t\tif ( normalizedValue.indexOf( suggestion ) === -1 ) {\n\t\t\t\t\tif ( index === 0 ) {\n\t\t\t\t\t\tstartsWithMatch.push( suggestion );\n\t\t\t\t\t} else if ( index > 0 ) {\n\t\t\t\t\t\tcontainsMatch.push( suggestion );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\n\t\t\t_suggestions = startsWithMatch.concat( containsMatch );\n\t\t}\n\n\t\treturn _suggestions.slice( 0, _maxSuggestions );\n\t}\n\n\tfunction getSelectedSuggestion() {\n\t\tif ( selectedSuggestionIndex !== -1 ) {\n\t\t\treturn getMatchingSuggestions()[ selectedSuggestionIndex ];\n\t\t}\n\n\t\treturn undefined;\n\t}\n\n\tfunction valueContainsToken( token: string ) {\n\t\treturn value.some( ( item ) => {\n\t\t\treturn getTokenValue( token ) === getTokenValue( item );\n\t\t} );\n\t}\n\n\tfunction getIndexOfInput() {\n\t\treturn value.length - inputOffsetFromEnd;\n\t}\n\n\tfunction isInputEmpty() {\n\t\treturn incompleteTokenValue.length === 0;\n\t}\n\n\tfunction inputHasValidValue() {\n\t\treturn saveTransform( incompleteTokenValue ).length > 0;\n\t}\n\n\tfunction updateSuggestions( resetSelectedSuggestion = true ) {\n\t\tconst inputHasMinimumChars = incompleteTokenValue.trim().length > 1;\n\t\tconst matchingSuggestions =\n\t\t\tgetMatchingSuggestions( incompleteTokenValue );\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\n\t\tconst shouldExpandIfFocuses = hasFocus() && __experimentalExpandOnFocus;\n\t\tsetIsExpanded(\n\t\t\tshouldExpandIfFocuses ||\n\t\t\t\t( inputHasMinimumChars && hasMatchingSuggestions )\n\t\t);\n\n\t\tif ( resetSelectedSuggestion ) {\n\t\t\tif (\n\t\t\t\t__experimentalAutoSelectFirstMatch &&\n\t\t\t\tinputHasMinimumChars &&\n\t\t\t\thasMatchingSuggestions\n\t\t\t) {\n\t\t\t\tsetSelectedSuggestionIndex( 0 );\n\t\t\t\tsetSelectedSuggestionScroll( true );\n\t\t\t} else {\n\t\t\t\tsetSelectedSuggestionIndex( -1 );\n\t\t\t\tsetSelectedSuggestionScroll( false );\n\t\t\t}\n\t\t}\n\n\t\tif ( inputHasMinimumChars ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tdebouncedSpeak( message, 'assertive' );\n\t\t}\n\t}\n\n\tfunction renderTokensAndInput() {\n\t\tconst components = value.map( renderToken );\n\t\tcomponents.splice( getIndexOfInput(), 0, renderInput() );\n\n\t\treturn components;\n\t}\n\n\tfunction renderToken(\n\t\ttoken: string | TokenItem,\n\t\tindex: number,\n\t\ttokens: ( string | TokenItem )[]\n\t) {\n\t\tconst _value = getTokenValue( token );\n\t\tconst status = typeof token !== 'string' ? token.status : undefined;\n\t\tconst termPosition = index + 1;\n\t\tconst termsCount = tokens.length;\n\n\t\treturn (\n\t\t\t<FlexItem key={ 'token-' + _value }>\n\t\t\t\t<Token\n\t\t\t\t\tvalue={ _value }\n\t\t\t\t\tstatus={ status }\n\t\t\t\t\ttitle={\n\t\t\t\t\t\ttypeof token !== 'string' ? token.title : undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\tonClickRemove={ onTokenClickRemove }\n\t\t\t\t\tisBorderless={\n\t\t\t\t\t\t( typeof token !== 'string' && token.isBorderless ) ||\n\t\t\t\t\t\tisBorderless\n\t\t\t\t\t}\n\t\t\t\t\tonMouseEnter={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseEnter\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tonMouseLeave={\n\t\t\t\t\t\ttypeof token !== 'string'\n\t\t\t\t\t\t\t? token.onMouseLeave\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tdisabled={ 'error' !== status && disabled }\n\t\t\t\t\tmessages={ messages }\n\t\t\t\t\ttermsCount={ termsCount }\n\t\t\t\t\ttermPosition={ termPosition }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t);\n\t}\n\n\tfunction renderInput() {\n\t\tconst inputProps = {\n\t\t\tinstanceId,\n\t\t\tautoCapitalize,\n\t\t\tautoComplete,\n\t\t\tplaceholder: value.length === 0 ? placeholder : '',\n\t\t\tkey: 'input',\n\t\t\tdisabled,\n\t\t\tvalue: incompleteTokenValue,\n\t\t\tonBlur,\n\t\t\tisExpanded,\n\t\t\tselectedSuggestionIndex,\n\t\t};\n\n\t\treturn (\n\t\t\t<TokenInput\n\t\t\t\t{ ...inputProps }\n\t\t\t\tonChange={\n\t\t\t\t\t! ( maxLength && value.length >= maxLength )\n\t\t\t\t\t\t? onInputChangeHandler\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tref={ input }\n\t\t\t/>\n\t\t);\n\t}\n\n\tconst classes = classnames(\n\t\tclassName,\n\t\t'components-form-token-field__input-container',\n\t\t{\n\t\t\t'is-active': isActive,\n\t\t\t'is-disabled': disabled,\n\t\t}\n\t);\n\n\tlet tokenFieldProps = {\n\t\tclassName: 'components-form-token-field',\n\t\ttabIndex: -1,\n\t};\n\tconst matchingSuggestions = getMatchingSuggestions();\n\n\tif ( ! disabled ) {\n\t\ttokenFieldProps = Object.assign( {}, tokenFieldProps, {\n\t\t\tonKeyDown: withIgnoreIMEEvents( onKeyDown ),\n\t\t\tonKeyPress,\n\t\t\tonFocus: onFocusHandler,\n\t\t} );\n\t}\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<div { ...tokenFieldProps }>\n\t\t\t<StyledLabel\n\t\t\t\thtmlFor={ `components-form-token-input-${ instanceId }` }\n\t\t\t\tclassName=\"components-form-token-field__label\"\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</StyledLabel>\n\t\t\t<div\n\t\t\t\tref={ tokensAndInput }\n\t\t\t\tclassName={ classes }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\tonMouseDown={ onContainerTouched }\n\t\t\t\tonTouchStart={ onContainerTouched }\n\t\t\t>\n\t\t\t\t<TokensAndInputWrapperFlex\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\talign=\"center\"\n\t\t\t\t\tgap={ 1 }\n\t\t\t\t\twrap\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\thasTokens={ !! value.length }\n\t\t\t\t>\n\t\t\t\t\t{ renderTokensAndInput() }\n\t\t\t\t</TokensAndInputWrapperFlex>\n\t\t\t\t{ isExpanded && (\n\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\tmatch={ saveTransform( incompleteTokenValue ) }\n\t\t\t\t\t\tdisplayTransform={ displayTransform }\n\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\tselectedIndex={ selectedSuggestionIndex }\n\t\t\t\t\t\tscrollIntoView={ selectedSuggestionScroll }\n\t\t\t\t\t\tonHover={ onSuggestionHovered }\n\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t__experimentalRenderItem={ __experimentalRenderItem }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ ! __nextHasNoMarginBottom && <Spacer marginBottom={ 2 } /> }\n\t\t\t{ __experimentalShowHowTo && (\n\t\t\t\t<StyledHelp\n\t\t\t\t\tid={ `components-form-token-suggestions-howto-${ instanceId }` }\n\t\t\t\t\tclassName=\"components-form-token-field__help\"\n\t\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\t>\n\t\t\t\t\t{ tokenizeOnSpace\n\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t'Separate with commas, spaces, or the Enter key.'\n\t\t\t\t\t\t )\n\t\t\t\t\t\t: __( 'Separate with commas or the Enter key.' ) }\n\t\t\t\t</StyledHelp>\n\t\t\t) }\n\t\t</div>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default FormTokenField;\n"],"mappings":"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"}
@@ -2,12 +2,10 @@ import { createElement } from "react";
2
2
  /**
3
3
  * External dependencies
4
4
  */
5
- import scrollView from 'dom-scroll-into-view';
6
5
  import classnames from 'classnames';
7
6
  /**
8
7
  * WordPress dependencies
9
8
  */
10
- import { useState } from '@wordpress/element';
11
9
  import { useRefEffect } from '@wordpress/compose';
12
10
 
13
11
  /**
@@ -29,18 +27,15 @@ export function SuggestionsList({
29
27
  instanceId,
30
28
  __experimentalRenderItem
31
29
  }) {
32
- const [scrollingIntoView, setScrollingIntoView] = useState(false);
33
30
  const listRef = useRefEffect(listNode => {
34
31
  // only have to worry about scrolling selected suggestion into view
35
32
  // when already expanded.
36
33
  let rafId;
37
34
  if (selectedIndex > -1 && scrollIntoView && listNode.children[selectedIndex]) {
38
- setScrollingIntoView(true);
39
- scrollView(listNode.children[selectedIndex], listNode, {
40
- onlyScrollIfNeeded: true
41
- });
42
- rafId = requestAnimationFrame(() => {
43
- setScrollingIntoView(false);
35
+ listNode.children[selectedIndex].scrollIntoView({
36
+ behavior: 'instant',
37
+ block: 'nearest',
38
+ inline: 'nearest'
44
39
  });
45
40
  }
46
41
  return () => {
@@ -51,9 +46,7 @@ export function SuggestionsList({
51
46
  }, [selectedIndex, scrollIntoView]);
52
47
  const handleHover = suggestion => {
53
48
  return () => {
54
- if (!scrollingIntoView) {
55
- onHover?.(suggestion);
56
- }
49
+ onHover?.(suggestion);
57
50
  };
58
51
  };
59
52
  const handleClick = suggestion => {
@@ -1 +1 @@
1
- {"version":3,"names":["scrollView","classnames","useState","useRefEffect","handleMouseDown","e","preventDefault","SuggestionsList","selectedIndex","scrollIntoView","match","onHover","onSelect","suggestions","displayTransform","instanceId","__experimentalRenderItem","scrollingIntoView","setScrollingIntoView","listRef","listNode","rafId","children","onlyScrollIfNeeded","requestAnimationFrame","undefined","cancelAnimationFrame","handleHover","suggestion","handleClick","computeSuggestionMatch","matchText","toLocaleLowerCase","length","transformedSuggestion","indexOfMatch","indexOf","suggestionBeforeMatch","substring","suggestionMatch","suggestionAfterMatch","createElement","ref","className","id","role","map","index","output","item","key","value","onMouseDown","onClick","onMouseEnter"],"sources":["@wordpress/components/src/form-token-field/suggestions-list.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport scrollView from 'dom-scroll-into-view';\nimport classnames from 'classnames';\nimport type { MouseEventHandler, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport type { SuggestionsListProps } from './types';\n\nconst handleMouseDown: MouseEventHandler = ( e ) => {\n\t// By preventing default here, we will not lose focus of <input> when clicking a suggestion.\n\te.preventDefault();\n};\n\nexport function SuggestionsList< T extends string | { value: string } >( {\n\tselectedIndex,\n\tscrollIntoView,\n\tmatch,\n\tonHover,\n\tonSelect,\n\tsuggestions = [],\n\tdisplayTransform,\n\tinstanceId,\n\t__experimentalRenderItem,\n}: SuggestionsListProps< T > ) {\n\tconst [ scrollingIntoView, setScrollingIntoView ] = useState( false );\n\n\tconst listRef = useRefEffect< HTMLUListElement >(\n\t\t( listNode ) => {\n\t\t\t// only have to worry about scrolling selected suggestion into view\n\t\t\t// when already expanded.\n\t\t\tlet rafId: number | undefined;\n\t\t\tif (\n\t\t\t\tselectedIndex > -1 &&\n\t\t\t\tscrollIntoView &&\n\t\t\t\tlistNode.children[ selectedIndex ]\n\t\t\t) {\n\t\t\t\tsetScrollingIntoView( true );\n\t\t\t\tscrollView(\n\t\t\t\t\tlistNode.children[ selectedIndex ] as HTMLLIElement,\n\t\t\t\t\tlistNode,\n\t\t\t\t\t{\n\t\t\t\t\t\tonlyScrollIfNeeded: true,\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t\trafId = requestAnimationFrame( () => {\n\t\t\t\t\tsetScrollingIntoView( false );\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tif ( rafId !== undefined ) {\n\t\t\t\t\tcancelAnimationFrame( rafId );\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\t\t[ selectedIndex, scrollIntoView ]\n\t);\n\n\tconst handleHover = ( suggestion: T ) => {\n\t\treturn () => {\n\t\t\tif ( ! scrollingIntoView ) {\n\t\t\t\tonHover?.( suggestion );\n\t\t\t}\n\t\t};\n\t};\n\n\tconst handleClick = ( suggestion: T ) => {\n\t\treturn () => {\n\t\t\tonSelect?.( suggestion );\n\t\t};\n\t};\n\n\tconst computeSuggestionMatch = ( suggestion: T ) => {\n\t\tconst matchText = displayTransform( match ).toLocaleLowerCase();\n\t\tif ( matchText.length === 0 ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst transformedSuggestion = displayTransform( suggestion );\n\t\tconst indexOfMatch = transformedSuggestion\n\t\t\t.toLocaleLowerCase()\n\t\t\t.indexOf( matchText );\n\n\t\treturn {\n\t\t\tsuggestionBeforeMatch: transformedSuggestion.substring(\n\t\t\t\t0,\n\t\t\t\tindexOfMatch\n\t\t\t),\n\t\t\tsuggestionMatch: transformedSuggestion.substring(\n\t\t\t\tindexOfMatch,\n\t\t\t\tindexOfMatch + matchText.length\n\t\t\t),\n\t\t\tsuggestionAfterMatch: transformedSuggestion.substring(\n\t\t\t\tindexOfMatch + matchText.length\n\t\t\t),\n\t\t};\n\t};\n\n\treturn (\n\t\t<ul\n\t\t\tref={ listRef }\n\t\t\tclassName=\"components-form-token-field__suggestions-list\"\n\t\t\tid={ `components-form-token-suggestions-${ instanceId }` }\n\t\t\trole=\"listbox\"\n\t\t>\n\t\t\t{ suggestions.map( ( suggestion, index ) => {\n\t\t\t\tconst matchText = computeSuggestionMatch( suggestion );\n\t\t\t\tconst className = classnames(\n\t\t\t\t\t'components-form-token-field__suggestion',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tlet output: ReactNode;\n\n\t\t\t\tif ( typeof __experimentalRenderItem === 'function' ) {\n\t\t\t\t\toutput = __experimentalRenderItem( { item: suggestion } );\n\t\t\t\t} else if ( matchText ) {\n\t\t\t\t\toutput = (\n\t\t\t\t\t\t<span aria-label={ displayTransform( suggestion ) }>\n\t\t\t\t\t\t\t{ matchText.suggestionBeforeMatch }\n\t\t\t\t\t\t\t<strong className=\"components-form-token-field__suggestion-match\">\n\t\t\t\t\t\t\t\t{ matchText.suggestionMatch }\n\t\t\t\t\t\t\t</strong>\n\t\t\t\t\t\t\t{ matchText.suggestionAfterMatch }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\toutput = displayTransform( suggestion );\n\t\t\t\t}\n\n\t\t\t\t/* eslint-disable jsx-a11y/click-events-have-key-events */\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tid={ `components-form-token-suggestions-${ instanceId }-${ index }` }\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tkey={\n\t\t\t\t\t\t\ttypeof suggestion === 'object' &&\n\t\t\t\t\t\t\t'value' in suggestion\n\t\t\t\t\t\t\t\t? suggestion?.value\n\t\t\t\t\t\t\t\t: displayTransform( suggestion )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonMouseDown={ handleMouseDown }\n\t\t\t\t\t\tonClick={ handleClick( suggestion ) }\n\t\t\t\t\t\tonMouseEnter={ handleHover( suggestion ) }\n\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ output }\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t\t/* eslint-enable jsx-a11y/click-events-have-key-events */\n\t\t\t} ) }\n\t\t</ul>\n\t);\n}\n\nexport default SuggestionsList;\n"],"mappings":"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"}
1
+ {"version":3,"names":["classnames","useRefEffect","handleMouseDown","e","preventDefault","SuggestionsList","selectedIndex","scrollIntoView","match","onHover","onSelect","suggestions","displayTransform","instanceId","__experimentalRenderItem","listRef","listNode","rafId","children","behavior","block","inline","undefined","cancelAnimationFrame","handleHover","suggestion","handleClick","computeSuggestionMatch","matchText","toLocaleLowerCase","length","transformedSuggestion","indexOfMatch","indexOf","suggestionBeforeMatch","substring","suggestionMatch","suggestionAfterMatch","createElement","ref","className","id","role","map","index","output","item","key","value","onMouseDown","onClick","onMouseEnter"],"sources":["@wordpress/components/src/form-token-field/suggestions-list.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { MouseEventHandler, ReactNode } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport type { SuggestionsListProps } from './types';\n\nconst handleMouseDown: MouseEventHandler = ( e ) => {\n\t// By preventing default here, we will not lose focus of <input> when clicking a suggestion.\n\te.preventDefault();\n};\n\nexport function SuggestionsList< T extends string | { value: string } >( {\n\tselectedIndex,\n\tscrollIntoView,\n\tmatch,\n\tonHover,\n\tonSelect,\n\tsuggestions = [],\n\tdisplayTransform,\n\tinstanceId,\n\t__experimentalRenderItem,\n}: SuggestionsListProps< T > ) {\n\tconst listRef = useRefEffect< HTMLUListElement >(\n\t\t( listNode ) => {\n\t\t\t// only have to worry about scrolling selected suggestion into view\n\t\t\t// when already expanded.\n\t\t\tlet rafId: number | undefined;\n\t\t\tif (\n\t\t\t\tselectedIndex > -1 &&\n\t\t\t\tscrollIntoView &&\n\t\t\t\tlistNode.children[ selectedIndex ]\n\t\t\t) {\n\t\t\t\tlistNode.children[ selectedIndex ].scrollIntoView( {\n\t\t\t\t\tbehavior: 'instant',\n\t\t\t\t\tblock: 'nearest',\n\t\t\t\t\tinline: 'nearest',\n\t\t\t\t} );\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tif ( rafId !== undefined ) {\n\t\t\t\t\tcancelAnimationFrame( rafId );\n\t\t\t\t}\n\t\t\t};\n\t\t},\n\t\t[ selectedIndex, scrollIntoView ]\n\t);\n\n\tconst handleHover = ( suggestion: T ) => {\n\t\treturn () => {\n\t\t\tonHover?.( suggestion );\n\t\t};\n\t};\n\n\tconst handleClick = ( suggestion: T ) => {\n\t\treturn () => {\n\t\t\tonSelect?.( suggestion );\n\t\t};\n\t};\n\n\tconst computeSuggestionMatch = ( suggestion: T ) => {\n\t\tconst matchText = displayTransform( match ).toLocaleLowerCase();\n\t\tif ( matchText.length === 0 ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tconst transformedSuggestion = displayTransform( suggestion );\n\t\tconst indexOfMatch = transformedSuggestion\n\t\t\t.toLocaleLowerCase()\n\t\t\t.indexOf( matchText );\n\n\t\treturn {\n\t\t\tsuggestionBeforeMatch: transformedSuggestion.substring(\n\t\t\t\t0,\n\t\t\t\tindexOfMatch\n\t\t\t),\n\t\t\tsuggestionMatch: transformedSuggestion.substring(\n\t\t\t\tindexOfMatch,\n\t\t\t\tindexOfMatch + matchText.length\n\t\t\t),\n\t\t\tsuggestionAfterMatch: transformedSuggestion.substring(\n\t\t\t\tindexOfMatch + matchText.length\n\t\t\t),\n\t\t};\n\t};\n\n\treturn (\n\t\t<ul\n\t\t\tref={ listRef }\n\t\t\tclassName=\"components-form-token-field__suggestions-list\"\n\t\t\tid={ `components-form-token-suggestions-${ instanceId }` }\n\t\t\trole=\"listbox\"\n\t\t>\n\t\t\t{ suggestions.map( ( suggestion, index ) => {\n\t\t\t\tconst matchText = computeSuggestionMatch( suggestion );\n\t\t\t\tconst className = classnames(\n\t\t\t\t\t'components-form-token-field__suggestion',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tlet output: ReactNode;\n\n\t\t\t\tif ( typeof __experimentalRenderItem === 'function' ) {\n\t\t\t\t\toutput = __experimentalRenderItem( { item: suggestion } );\n\t\t\t\t} else if ( matchText ) {\n\t\t\t\t\toutput = (\n\t\t\t\t\t\t<span aria-label={ displayTransform( suggestion ) }>\n\t\t\t\t\t\t\t{ matchText.suggestionBeforeMatch }\n\t\t\t\t\t\t\t<strong className=\"components-form-token-field__suggestion-match\">\n\t\t\t\t\t\t\t\t{ matchText.suggestionMatch }\n\t\t\t\t\t\t\t</strong>\n\t\t\t\t\t\t\t{ matchText.suggestionAfterMatch }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\toutput = displayTransform( suggestion );\n\t\t\t\t}\n\n\t\t\t\t/* eslint-disable jsx-a11y/click-events-have-key-events */\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tid={ `components-form-token-suggestions-${ instanceId }-${ index }` }\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tkey={\n\t\t\t\t\t\t\ttypeof suggestion === 'object' &&\n\t\t\t\t\t\t\t'value' in suggestion\n\t\t\t\t\t\t\t\t? suggestion?.value\n\t\t\t\t\t\t\t\t: displayTransform( suggestion )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonMouseDown={ handleMouseDown }\n\t\t\t\t\t\tonClick={ handleClick( suggestion ) }\n\t\t\t\t\t\tonMouseEnter={ handleHover( suggestion ) }\n\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ output }\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t\t/* eslint-enable jsx-a11y/click-events-have-key-events */\n\t\t\t} ) }\n\t\t</ul>\n\t);\n}\n\nexport default SuggestionsList;\n"],"mappings":"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"}
@@ -42,7 +42,12 @@ export function useHStack(props) {
42
42
  ...otherProps,
43
43
  gap: spacing
44
44
  };
45
- const flexProps = useFlex(propsForFlex);
45
+
46
+ // Omit `isColumn` because it's not used in HStack.
47
+ const {
48
+ isColumn,
49
+ ...flexProps
50
+ } = useFlex(propsForFlex);
46
51
  return flexProps;
47
52
  }
48
53
  //# sourceMappingURL=hook.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["hasConnectNamespace","useContextSystem","FlexItem","useFlex","getAlignmentProps","getValidChildren","useHStack","props","alignment","children","direction","spacing","otherProps","align","validChildren","clonedChildren","map","child","index","_isSpacer","childElement","_key","key","createElement","isBlock","propsForFlex","justify","gap","flexProps"],"sources":["@wordpress/components/src/h-stack/hook.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { hasConnectNamespace, useContextSystem } from '../context';\nimport { FlexItem, useFlex } from '../flex';\nimport { getAlignmentProps } from './utils';\nimport { getValidChildren } from '../utils/get-valid-children';\nimport type { Props } from './types';\n\nexport function useHStack( props: WordPressComponentProps< Props, 'div' > ) {\n\tconst {\n\t\talignment = 'edge',\n\t\tchildren,\n\t\tdirection,\n\t\tspacing = 2,\n\t\t...otherProps\n\t} = useContextSystem( props, 'HStack' );\n\n\tconst align = getAlignmentProps( alignment, direction );\n\n\tconst validChildren = getValidChildren( children );\n\tconst clonedChildren = validChildren.map( ( child, index ) => {\n\t\tconst _isSpacer = hasConnectNamespace( child, [ 'Spacer' ] );\n\n\t\tif ( _isSpacer ) {\n\t\t\tconst childElement = child as ReactElement;\n\t\t\tconst _key = childElement.key || `hstack-${ index }`;\n\n\t\t\treturn <FlexItem isBlock key={ _key } { ...childElement.props } />;\n\t\t}\n\n\t\treturn child;\n\t} );\n\n\tconst propsForFlex = {\n\t\tchildren: clonedChildren,\n\t\tdirection,\n\t\tjustify: 'center',\n\t\t...align,\n\t\t...otherProps,\n\t\tgap: spacing,\n\t};\n\n\tconst flexProps = useFlex( propsForFlex );\n\n\treturn flexProps;\n}\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;;AAEA,SAASA,mBAAmB,EAAEC,gBAAgB,QAAQ,YAAY;AAClE,SAASC,QAAQ,EAAEC,OAAO,QAAQ,SAAS;AAC3C,SAASC,iBAAiB,QAAQ,SAAS;AAC3C,SAASC,gBAAgB,QAAQ,6BAA6B;AAG9D,OAAO,SAASC,SAASA,CAAEC,KAA8C,EAAG;EAC3E,MAAM;IACLC,SAAS,GAAG,MAAM;IAClBC,QAAQ;IACRC,SAAS;IACTC,OAAO,GAAG,CAAC;IACX,GAAGC;EACJ,CAAC,GAAGX,gBAAgB,CAAEM,KAAK,EAAE,QAAS,CAAC;EAEvC,MAAMM,KAAK,GAAGT,iBAAiB,CAAEI,SAAS,EAAEE,SAAU,CAAC;EAEvD,MAAMI,aAAa,GAAGT,gBAAgB,CAAEI,QAAS,CAAC;EAClD,MAAMM,cAAc,GAAGD,aAAa,CAACE,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,KAAM;IAC7D,MAAMC,SAAS,GAAGnB,mBAAmB,CAAEiB,KAAK,EAAE,CAAE,QAAQ,CAAG,CAAC;IAE5D,IAAKE,SAAS,EAAG;MAChB,MAAMC,YAAY,GAAGH,KAAqB;MAC1C,MAAMI,IAAI,GAAGD,YAAY,CAACE,GAAG,IAAK,UAAUJ,KAAO,EAAC;MAEpD,OAAOK,aAAA,CAACrB,QAAQ;QAACsB,OAAO;QAACF,GAAG,EAAGD,IAAM;QAAA,GAAMD,YAAY,CAACb;MAAK,CAAI,CAAC;IACnE;IAEA,OAAOU,KAAK;EACb,CAAE,CAAC;EAEH,MAAMQ,YAAY,GAAG;IACpBhB,QAAQ,EAAEM,cAAc;IACxBL,SAAS;IACTgB,OAAO,EAAE,QAAQ;IACjB,GAAGb,KAAK;IACR,GAAGD,UAAU;IACbe,GAAG,EAAEhB;EACN,CAAC;EAED,MAAMiB,SAAS,GAAGzB,OAAO,CAAEsB,YAAa,CAAC;EAEzC,OAAOG,SAAS;AACjB"}
1
+ {"version":3,"names":["hasConnectNamespace","useContextSystem","FlexItem","useFlex","getAlignmentProps","getValidChildren","useHStack","props","alignment","children","direction","spacing","otherProps","align","validChildren","clonedChildren","map","child","index","_isSpacer","childElement","_key","key","createElement","isBlock","propsForFlex","justify","gap","isColumn","flexProps"],"sources":["@wordpress/components/src/h-stack/hook.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ReactElement } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { hasConnectNamespace, useContextSystem } from '../context';\nimport { FlexItem, useFlex } from '../flex';\nimport { getAlignmentProps } from './utils';\nimport { getValidChildren } from '../utils/get-valid-children';\nimport type { Props } from './types';\n\nexport function useHStack( props: WordPressComponentProps< Props, 'div' > ) {\n\tconst {\n\t\talignment = 'edge',\n\t\tchildren,\n\t\tdirection,\n\t\tspacing = 2,\n\t\t...otherProps\n\t} = useContextSystem( props, 'HStack' );\n\n\tconst align = getAlignmentProps( alignment, direction );\n\n\tconst validChildren = getValidChildren( children );\n\tconst clonedChildren = validChildren.map( ( child, index ) => {\n\t\tconst _isSpacer = hasConnectNamespace( child, [ 'Spacer' ] );\n\n\t\tif ( _isSpacer ) {\n\t\t\tconst childElement = child as ReactElement;\n\t\t\tconst _key = childElement.key || `hstack-${ index }`;\n\n\t\t\treturn <FlexItem isBlock key={ _key } { ...childElement.props } />;\n\t\t}\n\n\t\treturn child;\n\t} );\n\n\tconst propsForFlex = {\n\t\tchildren: clonedChildren,\n\t\tdirection,\n\t\tjustify: 'center',\n\t\t...align,\n\t\t...otherProps,\n\t\tgap: spacing,\n\t};\n\n\t// Omit `isColumn` because it's not used in HStack.\n\tconst { isColumn, ...flexProps } = useFlex( propsForFlex );\n\n\treturn flexProps;\n}\n"],"mappings":";AAAA;AACA;AACA;;AAGA;AACA;AACA;;AAEA,SAASA,mBAAmB,EAAEC,gBAAgB,QAAQ,YAAY;AAClE,SAASC,QAAQ,EAAEC,OAAO,QAAQ,SAAS;AAC3C,SAASC,iBAAiB,QAAQ,SAAS;AAC3C,SAASC,gBAAgB,QAAQ,6BAA6B;AAG9D,OAAO,SAASC,SAASA,CAAEC,KAA8C,EAAG;EAC3E,MAAM;IACLC,SAAS,GAAG,MAAM;IAClBC,QAAQ;IACRC,SAAS;IACTC,OAAO,GAAG,CAAC;IACX,GAAGC;EACJ,CAAC,GAAGX,gBAAgB,CAAEM,KAAK,EAAE,QAAS,CAAC;EAEvC,MAAMM,KAAK,GAAGT,iBAAiB,CAAEI,SAAS,EAAEE,SAAU,CAAC;EAEvD,MAAMI,aAAa,GAAGT,gBAAgB,CAAEI,QAAS,CAAC;EAClD,MAAMM,cAAc,GAAGD,aAAa,CAACE,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,KAAM;IAC7D,MAAMC,SAAS,GAAGnB,mBAAmB,CAAEiB,KAAK,EAAE,CAAE,QAAQ,CAAG,CAAC;IAE5D,IAAKE,SAAS,EAAG;MAChB,MAAMC,YAAY,GAAGH,KAAqB;MAC1C,MAAMI,IAAI,GAAGD,YAAY,CAACE,GAAG,IAAK,UAAUJ,KAAO,EAAC;MAEpD,OAAOK,aAAA,CAACrB,QAAQ;QAACsB,OAAO;QAACF,GAAG,EAAGD,IAAM;QAAA,GAAMD,YAAY,CAACb;MAAK,CAAI,CAAC;IACnE;IAEA,OAAOU,KAAK;EACb,CAAE,CAAC;EAEH,MAAMQ,YAAY,GAAG;IACpBhB,QAAQ,EAAEM,cAAc;IACxBL,SAAS;IACTgB,OAAO,EAAE,QAAQ;IACjB,GAAGb,KAAK;IACR,GAAGD,UAAU;IACbe,GAAG,EAAEhB;EACN,CAAC;;EAED;EACA,MAAM;IAAEiB,QAAQ;IAAE,GAAGC;EAAU,CAAC,GAAG1B,OAAO,CAAEsB,YAAa,CAAC;EAE1D,OAAOI,SAAS;AACjB"}
@@ -1 +1 @@
1
- {"version":3,"names":["TouchableOpacity","View","Text","styles","BottomSheetButton","onPress","disabled","text","color","createElement","accessible","style","flexDirection","justifyContent","buttonText"],"sources":["@wordpress/components/src/mobile/bottom-sheet/button.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { TouchableOpacity, View, Text } from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst BottomSheetButton = ( { onPress, disabled, text, color } ) => (\n\t<TouchableOpacity\n\t\taccessible={ true }\n\t\tonPress={ onPress }\n\t\tdisabled={ disabled }\n\t>\n\t\t<View style={ { flexDirection: 'row', justifyContent: 'center' } }>\n\t\t\t<Text style={ { ...styles.buttonText, color } }>{ text }</Text>\n\t\t</View>\n\t</TouchableOpacity>\n);\n\nexport default BottomSheetButton;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,gBAAgB,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;;AAE3D;AACA;AACA;AACA,OAAOC,MAAM,MAAM,eAAe;AAElC,MAAMC,iBAAiB,GAAGA,CAAE;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,IAAI;EAAEC;AAAM,CAAC,KAC7DC,aAAA,CAACT,gBAAgB;EAChBU,UAAU,EAAG,IAAM;EACnBL,OAAO,EAAGA,OAAS;EACnBC,QAAQ,EAAGA;AAAU,GAErBG,aAAA,CAACR,IAAI;EAACU,KAAK,EAAG;IAAEC,aAAa,EAAE,KAAK;IAAEC,cAAc,EAAE;EAAS;AAAG,GACjEJ,aAAA,CAACP,IAAI;EAACS,KAAK,EAAG;IAAE,GAAGR,MAAM,CAACW,UAAU;IAAEN;EAAM;AAAG,GAAGD,IAAY,CACzD,CACW,CAClB;AAED,eAAeH,iBAAiB"}
1
+ {"version":3,"names":["TouchableOpacity","View","Text","styles","BottomSheetButton","onPress","disabled","text","color","createElement","accessible","style","flexDirection","justifyContent","buttonText"],"sources":["@wordpress/components/src/mobile/bottom-sheet/button.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { TouchableOpacity, View, Text } from 'react-native';\n\n/**\n * Internal dependencies\n */\nimport styles from './styles.scss';\n\nconst BottomSheetButton = ( { onPress, disabled, text, color } ) => (\n\t<TouchableOpacity accessible onPress={ onPress } disabled={ disabled }>\n\t\t<View style={ { flexDirection: 'row', justifyContent: 'center' } }>\n\t\t\t<Text style={ { ...styles.buttonText, color } }>{ text }</Text>\n\t\t</View>\n\t</TouchableOpacity>\n);\n\nexport default BottomSheetButton;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,gBAAgB,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;;AAE3D;AACA;AACA;AACA,OAAOC,MAAM,MAAM,eAAe;AAElC,MAAMC,iBAAiB,GAAGA,CAAE;EAAEC,OAAO;EAAEC,QAAQ;EAAEC,IAAI;EAAEC;AAAM,CAAC,KAC7DC,aAAA,CAACT,gBAAgB;EAACU,UAAU;EAACL,OAAO,EAAGA,OAAS;EAACC,QAAQ,EAAGA;AAAU,GACrEG,aAAA,CAACR,IAAI;EAACU,KAAK,EAAG;IAAEC,aAAa,EAAE,KAAK;IAAEC,cAAc,EAAE;EAAS;AAAG,GACjEJ,aAAA,CAACP,IAAI;EAACS,KAAK,EAAG;IAAE,GAAGR,MAAM,CAACW,UAAU;IAAEN;EAAM;AAAG,GAAGD,IAAY,CACzD,CACW,CAClB;AAED,eAAeH,iBAAiB"}