@wordpress/components 21.2.0 → 21.3.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 (302) hide show
  1. package/CHANGELOG.md +35 -3
  2. package/CONTRIBUTING.md +20 -0
  3. package/build/border-box-control/border-box-control/component.js +2 -0
  4. package/build/border-box-control/border-box-control/component.js.map +1 -1
  5. package/build/border-box-control/border-box-control/hook.js +4 -1
  6. package/build/border-box-control/border-box-control/hook.js.map +1 -1
  7. package/build/border-control/border-control/component.js +2 -0
  8. package/build/border-control/border-control/component.js.map +1 -1
  9. package/build/disabled/index.js +6 -26
  10. package/build/disabled/index.js.map +1 -1
  11. package/build/font-size-picker/index.js +1 -1
  12. package/build/font-size-picker/index.js.map +1 -1
  13. package/build/font-size-picker/styles.js +5 -13
  14. package/build/font-size-picker/styles.js.map +1 -1
  15. package/build/font-size-picker/utils.js +1 -1
  16. package/build/font-size-picker/utils.js.map +1 -1
  17. package/build/form-token-field/suggestions-list.js +5 -5
  18. package/build/form-token-field/suggestions-list.js.map +1 -1
  19. package/build/higher-order/with-fallback-styles/index.js +1 -1
  20. package/build/higher-order/with-fallback-styles/index.js.map +1 -1
  21. package/build/index.js +8 -6
  22. package/build/index.js.map +1 -1
  23. package/build/modal/aria-helper.js +2 -3
  24. package/build/modal/aria-helper.js.map +1 -1
  25. package/build/modal/index.js +42 -11
  26. package/build/modal/index.js.map +1 -1
  27. package/build/modal/types.js +6 -0
  28. package/build/modal/types.js.map +1 -0
  29. package/build/navigator/index.js +8 -8
  30. package/build/navigator/index.js.map +1 -1
  31. package/build/navigator/navigator-back-button/component.js +5 -4
  32. package/build/navigator/navigator-back-button/component.js.map +1 -1
  33. package/build/navigator/navigator-back-button/index.js +1 -1
  34. package/build/navigator/navigator-back-button/index.js.map +1 -1
  35. package/build/navigator/navigator-button/component.js +5 -4
  36. package/build/navigator/navigator-button/component.js.map +1 -1
  37. package/build/navigator/navigator-button/index.js +1 -1
  38. package/build/navigator/navigator-button/index.js.map +1 -1
  39. package/build/navigator/navigator-provider/component.js +10 -7
  40. package/build/navigator/navigator-provider/component.js.map +1 -1
  41. package/build/navigator/navigator-provider/index.js +1 -1
  42. package/build/navigator/navigator-provider/index.js.map +1 -1
  43. package/build/navigator/navigator-screen/component.js +24 -27
  44. package/build/navigator/navigator-screen/component.js.map +1 -1
  45. package/build/navigator/navigator-screen/index.js +1 -1
  46. package/build/navigator/navigator-screen/index.js.map +1 -1
  47. package/build/sandbox/index.js +55 -59
  48. package/build/sandbox/index.js.map +1 -1
  49. package/build/sandbox/index.native.js +63 -62
  50. package/build/sandbox/index.native.js.map +1 -1
  51. package/build/slot-fill/bubbles-virtually/slot-fill-provider.js +1 -1
  52. package/build/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -1
  53. package/build/tab-panel/index.js +4 -4
  54. package/build/tab-panel/index.js.map +1 -1
  55. package/build/theme/index.js +62 -0
  56. package/build/theme/index.js.map +1 -0
  57. package/build/theme/styles.js +33 -0
  58. package/build/theme/styles.js.map +1 -0
  59. package/build/theme/types.js +6 -0
  60. package/build/theme/types.js.map +1 -0
  61. package/build/tools-panel/tools-panel/hook.js +3 -3
  62. package/build/tools-panel/tools-panel/hook.js.map +1 -1
  63. package/build/tools-panel/tools-panel-item/hook.js +6 -6
  64. package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
  65. package/build/tooltip/index.js +4 -1
  66. package/build/tooltip/index.js.map +1 -1
  67. package/build/tooltip/index.native.js +17 -4
  68. package/build/tooltip/index.native.js.map +1 -1
  69. package/build-module/border-box-control/border-box-control/component.js +2 -0
  70. package/build-module/border-box-control/border-box-control/component.js.map +1 -1
  71. package/build-module/border-box-control/border-box-control/hook.js +4 -1
  72. package/build-module/border-box-control/border-box-control/hook.js.map +1 -1
  73. package/build-module/border-control/border-control/component.js +2 -0
  74. package/build-module/border-control/border-control/component.js.map +1 -1
  75. package/build-module/disabled/index.js +7 -26
  76. package/build-module/disabled/index.js.map +1 -1
  77. package/build-module/font-size-picker/index.js +1 -1
  78. package/build-module/font-size-picker/index.js.map +1 -1
  79. package/build-module/font-size-picker/styles.js +5 -13
  80. package/build-module/font-size-picker/styles.js.map +1 -1
  81. package/build-module/font-size-picker/utils.js +1 -1
  82. package/build-module/font-size-picker/utils.js.map +1 -1
  83. package/build-module/form-token-field/suggestions-list.js +5 -5
  84. package/build-module/form-token-field/suggestions-list.js.map +1 -1
  85. package/build-module/higher-order/with-fallback-styles/index.js +2 -2
  86. package/build-module/higher-order/with-fallback-styles/index.js.map +1 -1
  87. package/build-module/index.js +2 -1
  88. package/build-module/index.js.map +1 -1
  89. package/build-module/modal/aria-helper.js +2 -3
  90. package/build-module/modal/aria-helper.js.map +1 -1
  91. package/build-module/modal/index.js +44 -12
  92. package/build-module/modal/index.js.map +1 -1
  93. package/build-module/modal/types.js +2 -0
  94. package/build-module/modal/types.js.map +1 -0
  95. package/build-module/navigator/index.js +4 -4
  96. package/build-module/navigator/index.js.map +1 -1
  97. package/build-module/navigator/navigator-back-button/component.js +3 -3
  98. package/build-module/navigator/navigator-back-button/component.js.map +1 -1
  99. package/build-module/navigator/navigator-back-button/index.js +1 -1
  100. package/build-module/navigator/navigator-back-button/index.js.map +1 -1
  101. package/build-module/navigator/navigator-button/component.js +3 -3
  102. package/build-module/navigator/navigator-button/component.js.map +1 -1
  103. package/build-module/navigator/navigator-button/index.js +1 -1
  104. package/build-module/navigator/navigator-button/index.js.map +1 -1
  105. package/build-module/navigator/navigator-provider/component.js +8 -6
  106. package/build-module/navigator/navigator-provider/component.js.map +1 -1
  107. package/build-module/navigator/navigator-provider/index.js +1 -1
  108. package/build-module/navigator/navigator-provider/index.js.map +1 -1
  109. package/build-module/navigator/navigator-screen/component.js +12 -26
  110. package/build-module/navigator/navigator-screen/component.js.map +1 -1
  111. package/build-module/navigator/navigator-screen/index.js +1 -1
  112. package/build-module/navigator/navigator-screen/index.js.map +1 -1
  113. package/build-module/sandbox/index.js +56 -59
  114. package/build-module/sandbox/index.js.map +1 -1
  115. package/build-module/sandbox/index.native.js +54 -52
  116. package/build-module/sandbox/index.native.js.map +1 -1
  117. package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js +1 -1
  118. package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -1
  119. package/build-module/tab-panel/index.js +4 -4
  120. package/build-module/tab-panel/index.js.map +1 -1
  121. package/build-module/theme/index.js +52 -0
  122. package/build-module/theme/index.js.map +1 -0
  123. package/build-module/theme/styles.js +25 -0
  124. package/build-module/theme/styles.js.map +1 -0
  125. package/build-module/theme/types.js +2 -0
  126. package/build-module/theme/types.js.map +1 -0
  127. package/build-module/tools-panel/tools-panel/hook.js +3 -3
  128. package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
  129. package/build-module/tools-panel/tools-panel-item/hook.js +6 -6
  130. package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
  131. package/build-module/tooltip/index.js +4 -1
  132. package/build-module/tooltip/index.js.map +1 -1
  133. package/build-module/tooltip/index.native.js +17 -4
  134. package/build-module/tooltip/index.native.js.map +1 -1
  135. package/build-style/style-rtl.css +26 -22
  136. package/build-style/style.css +26 -22
  137. package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
  138. package/build-types/border-box-control/border-box-control/hook.d.ts +1 -0
  139. package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
  140. package/build-types/border-control/border-control/component.d.ts +1 -0
  141. package/build-types/border-control/border-control/component.d.ts.map +1 -1
  142. package/build-types/border-control/border-control/hook.d.ts +1 -0
  143. package/build-types/border-control/border-control/hook.d.ts.map +1 -1
  144. package/build-types/border-control/stories/index.d.ts +6 -0
  145. package/build-types/border-control/stories/index.d.ts.map +1 -1
  146. package/build-types/border-control/types.d.ts +4 -0
  147. package/build-types/border-control/types.d.ts.map +1 -1
  148. package/build-types/confirm-dialog/types.d.ts +5 -1
  149. package/build-types/confirm-dialog/types.d.ts.map +1 -1
  150. package/build-types/disabled/index.d.ts.map +1 -1
  151. package/build-types/font-size-picker/styles.d.ts.map +1 -1
  152. package/build-types/modal/aria-helper.d.ts +4 -4
  153. package/build-types/modal/aria-helper.d.ts.map +1 -1
  154. package/build-types/modal/index.d.ts +35 -2
  155. package/build-types/modal/index.d.ts.map +1 -1
  156. package/build-types/modal/stories/index.d.ts +9 -0
  157. package/build-types/modal/stories/index.d.ts.map +1 -0
  158. package/build-types/modal/test/aria-helper.d.ts +2 -0
  159. package/build-types/modal/test/aria-helper.d.ts.map +1 -0
  160. package/build-types/modal/test/index.d.ts +2 -0
  161. package/build-types/modal/test/index.d.ts.map +1 -0
  162. package/build-types/modal/types.d.ts +134 -0
  163. package/build-types/modal/types.d.ts.map +1 -0
  164. package/build-types/navigator/index.d.ts +4 -4
  165. package/build-types/navigator/index.d.ts.map +1 -1
  166. package/build-types/navigator/navigator-back-button/component.d.ts +4 -2
  167. package/build-types/navigator/navigator-back-button/component.d.ts.map +1 -1
  168. package/build-types/navigator/navigator-back-button/hook.d.ts +1 -0
  169. package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -1
  170. package/build-types/navigator/navigator-back-button/index.d.ts +1 -1
  171. package/build-types/navigator/navigator-back-button/index.d.ts.map +1 -1
  172. package/build-types/navigator/navigator-button/component.d.ts +4 -2
  173. package/build-types/navigator/navigator-button/component.d.ts.map +1 -1
  174. package/build-types/navigator/navigator-button/hook.d.ts +1 -0
  175. package/build-types/navigator/navigator-button/hook.d.ts.map +1 -1
  176. package/build-types/navigator/navigator-button/index.d.ts +1 -1
  177. package/build-types/navigator/navigator-button/index.d.ts.map +1 -1
  178. package/build-types/navigator/navigator-provider/component.d.ts +2 -2
  179. package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
  180. package/build-types/navigator/navigator-provider/index.d.ts +1 -1
  181. package/build-types/navigator/navigator-provider/index.d.ts.map +1 -1
  182. package/build-types/navigator/navigator-screen/component.d.ts +2 -2
  183. package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
  184. package/build-types/navigator/navigator-screen/index.d.ts +1 -1
  185. package/build-types/navigator/navigator-screen/index.d.ts.map +1 -1
  186. package/build-types/navigator/stories/index.d.ts +9 -0
  187. package/build-types/navigator/stories/index.d.ts.map +1 -0
  188. package/build-types/navigator/test/index.d.ts +2 -0
  189. package/build-types/navigator/test/index.d.ts.map +1 -0
  190. package/build-types/navigator/types.d.ts +4 -1
  191. package/build-types/navigator/types.d.ts.map +1 -1
  192. package/build-types/slot-fill/bubbles-virtually/slot-fill-provider.d.ts.map +1 -1
  193. package/build-types/tab-panel/index.d.ts.map +1 -1
  194. package/build-types/theme/index.d.ts +31 -0
  195. package/build-types/theme/index.d.ts.map +1 -0
  196. package/build-types/theme/stories/index.d.ts +13 -0
  197. package/build-types/theme/stories/index.d.ts.map +1 -0
  198. package/build-types/theme/styles.d.ts +10 -0
  199. package/build-types/theme/styles.d.ts.map +1 -0
  200. package/build-types/theme/test/index.d.ts +2 -0
  201. package/build-types/theme/test/index.d.ts.map +1 -0
  202. package/build-types/theme/types.d.ts +21 -0
  203. package/build-types/theme/types.d.ts.map +1 -0
  204. package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
  205. package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
  206. package/build-types/tooltip/index.d.ts.map +1 -1
  207. package/package.json +17 -17
  208. package/src/base-field/test/index.js +4 -6
  209. package/src/border-box-control/border-box-control/component.tsx +2 -0
  210. package/src/border-box-control/border-box-control/hook.ts +4 -0
  211. package/src/border-box-control/test/index.js +7 -2
  212. package/src/border-control/border-control/README.md +6 -0
  213. package/src/border-control/border-control/component.tsx +2 -0
  214. package/src/border-control/types.ts +4 -0
  215. package/src/button/style.scss +25 -25
  216. package/src/button/test/index.js +3 -5
  217. package/src/combobox-control/test/index.js +1 -1
  218. package/src/confirm-dialog/types.ts +6 -0
  219. package/src/date-time/time/test/index.tsx +2 -6
  220. package/src/disabled/index.tsx +11 -33
  221. package/src/disabled/test/index.tsx +14 -82
  222. package/src/dropdown/test/index.js +4 -3
  223. package/src/font-size-picker/index.tsx +1 -1
  224. package/src/font-size-picker/styles.ts +3 -1
  225. package/src/font-size-picker/test/index.tsx +2 -2
  226. package/src/font-size-picker/test/utils.ts +5 -5
  227. package/src/font-size-picker/utils.ts +1 -1
  228. package/src/form-file-upload/test/index.tsx +1 -1
  229. package/src/form-token-field/suggestions-list.tsx +5 -5
  230. package/src/higher-order/with-fallback-styles/index.js +6 -2
  231. package/src/higher-order/with-focus-outside/test/index.js +44 -45
  232. package/src/higher-order/with-focus-return/test/index.js +34 -30
  233. package/src/higher-order/with-notices/test/index.js +1 -1
  234. package/src/index.js +2 -1
  235. package/src/input-control/test/index.js +2 -2
  236. package/src/item-group/test/index.js +2 -2
  237. package/src/menu-item/test/index.js +0 -3
  238. package/src/mobile/bottom-sheet/test/range-cell.native.js +16 -14
  239. package/src/modal/README.md +53 -54
  240. package/src/modal/{aria-helper.js → aria-helper.ts} +5 -7
  241. package/src/modal/{index.js → index.tsx} +48 -12
  242. package/src/modal/stories/{index.js → index.tsx} +47 -42
  243. package/src/modal/test/{aria-helper.js → aria-helper.ts} +0 -0
  244. package/src/modal/test/{index.js → index.tsx} +13 -3
  245. package/src/modal/types.ts +144 -0
  246. package/src/navigation/test/index.js +1 -1
  247. package/src/navigator/index.ts +4 -4
  248. package/src/navigator/navigator-back-button/component.tsx +4 -4
  249. package/src/navigator/navigator-back-button/index.ts +1 -1
  250. package/src/navigator/navigator-button/component.tsx +4 -4
  251. package/src/navigator/navigator-button/index.ts +1 -1
  252. package/src/navigator/navigator-provider/component.tsx +6 -4
  253. package/src/navigator/navigator-provider/index.ts +1 -1
  254. package/src/navigator/navigator-screen/component.tsx +20 -26
  255. package/src/navigator/navigator-screen/index.ts +1 -1
  256. package/src/navigator/stories/index.tsx +210 -0
  257. package/src/navigator/test/index.tsx +509 -0
  258. package/src/navigator/types.ts +2 -0
  259. package/src/notice/test/__snapshots__/index.js.snap +39 -38
  260. package/src/notice/test/index.js +15 -36
  261. package/src/notice/test/list.js +6 -14
  262. package/src/number-control/test/index.js +3 -2
  263. package/src/panel/test/body.js +2 -2
  264. package/src/placeholder/style.scss +5 -0
  265. package/src/sandbox/index.js +62 -47
  266. package/src/sandbox/index.native.js +72 -52
  267. package/src/sandbox/test/index.js +7 -10
  268. package/src/shortcut/test/index.tsx +1 -1
  269. package/src/slot-fill/bubbles-virtually/slot-fill-provider.js +5 -3
  270. package/src/style.scss +4 -0
  271. package/src/tab-panel/index.tsx +4 -7
  272. package/src/text-highlight/test/index.tsx +1 -3
  273. package/src/theme/README.md +34 -0
  274. package/src/theme/index.tsx +51 -0
  275. package/src/theme/stories/index.tsx +47 -0
  276. package/src/theme/styles.ts +28 -0
  277. package/src/theme/test/index.tsx +101 -0
  278. package/src/theme/types.ts +21 -0
  279. package/src/toolbar/test/index.js +2 -2
  280. package/src/toolbar-group/test/index.js +6 -10
  281. package/src/tools-panel/test/index.js +4 -6
  282. package/src/tools-panel/tools-panel/hook.ts +2 -9
  283. package/src/tools-panel/tools-panel-item/hook.ts +17 -3
  284. package/src/tooltip/index.js +3 -0
  285. package/src/tooltip/index.native.js +15 -0
  286. package/src/tooltip/test/index.native.js +1 -2
  287. package/src/tree-grid/test/__snapshots__/cell.js.snap +1 -3
  288. package/src/tree-grid/test/__snapshots__/roving-tab-index-item.js.snap +17 -15
  289. package/src/tree-grid/test/__snapshots__/row.js.snap +25 -21
  290. package/src/tree-grid/test/cell.js +4 -4
  291. package/src/tree-grid/test/roving-tab-index-item.js +8 -8
  292. package/src/tree-grid/test/roving-tab-index.js +3 -3
  293. package/src/tree-grid/test/row.js +20 -16
  294. package/src/truncate/test/index.tsx +4 -4
  295. package/src/ui/shortcut/test/index.js +2 -1
  296. package/src/ui/spinner/test/index.js +14 -13
  297. package/src/ui/tooltip/test/index.js +16 -14
  298. package/src/utils/theme-variables.scss +8 -0
  299. package/src/visually-hidden/README.md +4 -0
  300. package/tsconfig.tsbuildinfo +1 -1
  301. package/src/navigator/stories/index.js +0 -194
  302. package/src/navigator/test/index.js +0 -472
@@ -55,8 +55,8 @@ function useToolsPanelItem(props) {
55
55
  __experimentalFirstVisibleItemClass,
56
56
  __experimentalLastVisibleItemClass
57
57
  } = (0, _context.useToolsPanelContext)();
58
- const hasValueCallback = (0, _element.useCallback)(hasValue, [panelId]);
59
- const resetAllFilterCallback = (0, _element.useCallback)(resetAllFilter, [panelId]);
58
+ const hasValueCallback = (0, _element.useCallback)(hasValue, [panelId, hasValue]);
59
+ const resetAllFilterCallback = (0, _element.useCallback)(resetAllFilter, [panelId, resetAllFilter]);
60
60
  const previousPanelId = (0, _compose.usePrevious)(currentPanelId);
61
61
  const hasMatchingPanel = currentPanelId === panelId || currentPanelId === null; // Registering the panel item allows the panel to include it in its
62
62
  // automatically generated menu and determine its initial checked status.
@@ -77,7 +77,7 @@ function useToolsPanelItem(props) {
77
77
  deregisterPanelItem(label);
78
78
  }
79
79
  };
80
- }, [currentPanelId, hasMatchingPanel, isShownByDefault, label, hasValueCallback, panelId, previousPanelId, resetAllFilterCallback]);
80
+ }, [currentPanelId, hasMatchingPanel, isShownByDefault, label, hasValueCallback, panelId, previousPanelId, resetAllFilterCallback, registerPanelItem, deregisterPanelItem]);
81
81
  const isValueSet = hasValue();
82
82
  const wasValueSet = (0, _compose.usePrevious)(isValueSet); // If this item represents a default control it will need to notify the
83
83
  // panel when a custom value has been set.
@@ -86,7 +86,7 @@ function useToolsPanelItem(props) {
86
86
  if (isShownByDefault && isValueSet && !wasValueSet) {
87
87
  flagItemCustomization(label);
88
88
  }
89
- }, [isValueSet, wasValueSet, isShownByDefault, label]); // Note: `label` is used as a key when building menu item state in
89
+ }, [isValueSet, wasValueSet, isShownByDefault, label, flagItemCustomization]); // Note: `label` is used as a key when building menu item state in
90
90
  // `ToolsPanel`.
91
91
 
92
92
  const menuGroup = isShownByDefault ? 'default' : 'optional';
@@ -106,7 +106,7 @@ function useToolsPanelItem(props) {
106
106
  if (!isMenuItemChecked && wasMenuItemChecked) {
107
107
  onDeselect === null || onDeselect === void 0 ? void 0 : onDeselect();
108
108
  }
109
- }, [hasMatchingPanel, isMenuItemChecked, isResetting, isValueSet, wasMenuItemChecked]); // The item is shown if it is a default control regardless of whether it
109
+ }, [hasMatchingPanel, isMenuItemChecked, isResetting, isValueSet, wasMenuItemChecked, onSelect, onDeselect]); // The item is shown if it is a default control regardless of whether it
110
110
  // has a value. Optional items are shown when they are checked or have
111
111
  // a value.
112
112
 
@@ -117,7 +117,7 @@ function useToolsPanelItem(props) {
117
117
  const firstItemStyle = firstDisplayedItem === label && __experimentalFirstVisibleItemClass;
118
118
  const lastItemStyle = lastDisplayedItem === label && __experimentalLastVisibleItemClass;
119
119
  return cx(styles.ToolsPanelItem, placeholderStyle, className, firstItemStyle, lastItemStyle);
120
- }, [isShown, shouldRenderPlaceholder, className, cx, firstDisplayedItem, lastDisplayedItem, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]);
120
+ }, [isShown, shouldRenderPlaceholder, className, cx, firstDisplayedItem, lastDisplayedItem, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass, label]);
121
121
  return { ...otherProps,
122
122
  isShown,
123
123
  shouldRenderPlaceholder,
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-item/hook.ts"],"names":["useToolsPanelItem","props","className","hasValue","isShownByDefault","label","panelId","resetAllFilter","onDeselect","onSelect","otherProps","currentPanelId","menuItems","registerPanelItem","deregisterPanelItem","flagItemCustomization","isResetting","shouldRenderPlaceholderItems","shouldRenderPlaceholder","firstDisplayedItem","lastDisplayedItem","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","isValueSet","wasValueSet","menuGroup","isMenuItemChecked","wasMenuItemChecked","isShown","undefined","cx","classes","placeholderStyle","styles","ToolsPanelItemPlaceholder","firstItemStyle","lastItemStyle","ToolsPanelItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious } from '@wordpress/compose';\nimport { useCallback, useEffect, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelItemProps } from '../types';\n\nexport function useToolsPanelItem(\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\thasValue,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\tpanelId,\n\t\tresetAllFilter,\n\t\tonDeselect,\n\t\tonSelect,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanelItem' );\n\n\tconst {\n\t\tpanelId: currentPanelId,\n\t\tmenuItems,\n\t\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t\tflagItemCustomization,\n\t\tisResetting,\n\t\tshouldRenderPlaceholderItems: shouldRenderPlaceholder,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t} = useToolsPanelContext();\n\n\tconst hasValueCallback = useCallback( hasValue, [ panelId ] );\n\tconst resetAllFilterCallback = useCallback( resetAllFilter, [ panelId ] );\n\tconst previousPanelId = usePrevious( currentPanelId );\n\n\tconst hasMatchingPanel =\n\t\tcurrentPanelId === panelId || currentPanelId === null;\n\n\t// Registering the panel item allows the panel to include it in its\n\t// automatically generated menu and determine its initial checked status.\n\tuseEffect( () => {\n\t\tif ( hasMatchingPanel && previousPanelId !== null ) {\n\t\t\tregisterPanelItem( {\n\t\t\t\thasValue: hasValueCallback,\n\t\t\t\tisShownByDefault,\n\t\t\t\tlabel,\n\t\t\t\tresetAllFilter: resetAllFilterCallback,\n\t\t\t\tpanelId,\n\t\t\t} );\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (\n\t\t\t\t( previousPanelId === null && !! currentPanelId ) ||\n\t\t\t\tcurrentPanelId === panelId\n\t\t\t) {\n\t\t\t\tderegisterPanelItem( label );\n\t\t\t}\n\t\t};\n\t}, [\n\t\tcurrentPanelId,\n\t\thasMatchingPanel,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\thasValueCallback,\n\t\tpanelId,\n\t\tpreviousPanelId,\n\t\tresetAllFilterCallback,\n\t] );\n\n\tconst isValueSet = hasValue();\n\tconst wasValueSet = usePrevious( isValueSet );\n\n\t// If this item represents a default control it will need to notify the\n\t// panel when a custom value has been set.\n\tuseEffect( () => {\n\t\tif ( isShownByDefault && isValueSet && ! wasValueSet ) {\n\t\t\tflagItemCustomization( label );\n\t\t}\n\t}, [ isValueSet, wasValueSet, isShownByDefault, label ] );\n\n\t// Note: `label` is used as a key when building menu item state in\n\t// `ToolsPanel`.\n\tconst menuGroup = isShownByDefault ? 'default' : 'optional';\n\tconst isMenuItemChecked = menuItems?.[ menuGroup ]?.[ label ];\n\tconst wasMenuItemChecked = usePrevious( isMenuItemChecked );\n\n\t// Determine if the panel item's corresponding menu is being toggled and\n\t// trigger appropriate callback if it is.\n\tuseEffect( () => {\n\t\tif ( isResetting || ! hasMatchingPanel ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isMenuItemChecked && ! isValueSet && ! wasMenuItemChecked ) {\n\t\t\tonSelect?.();\n\t\t}\n\n\t\tif ( ! isMenuItemChecked && wasMenuItemChecked ) {\n\t\t\tonDeselect?.();\n\t\t}\n\t}, [\n\t\thasMatchingPanel,\n\t\tisMenuItemChecked,\n\t\tisResetting,\n\t\tisValueSet,\n\t\twasMenuItemChecked,\n\t] );\n\n\t// The item is shown if it is a default control regardless of whether it\n\t// has a value. Optional items are shown when they are checked or have\n\t// a value.\n\tconst isShown = isShownByDefault\n\t\t? menuItems?.[ menuGroup ]?.[ label ] !== undefined\n\t\t: isMenuItemChecked;\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\tconst placeholderStyle =\n\t\t\tshouldRenderPlaceholder &&\n\t\t\t! isShown &&\n\t\t\tstyles.ToolsPanelItemPlaceholder;\n\t\tconst firstItemStyle =\n\t\t\tfirstDisplayedItem === label && __experimentalFirstVisibleItemClass;\n\t\tconst lastItemStyle =\n\t\t\tlastDisplayedItem === label && __experimentalLastVisibleItemClass;\n\t\treturn cx(\n\t\t\tstyles.ToolsPanelItem,\n\t\t\tplaceholderStyle,\n\t\t\tclassName,\n\t\t\tfirstItemStyle,\n\t\t\tlastItemStyle\n\t\t);\n\t}, [\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName,\n\t\tcx,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t] );\n\n\treturn {\n\t\t...otherProps,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName: classes,\n\t};\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-item/hook.ts"],"names":["useToolsPanelItem","props","className","hasValue","isShownByDefault","label","panelId","resetAllFilter","onDeselect","onSelect","otherProps","currentPanelId","menuItems","registerPanelItem","deregisterPanelItem","flagItemCustomization","isResetting","shouldRenderPlaceholderItems","shouldRenderPlaceholder","firstDisplayedItem","lastDisplayedItem","__experimentalFirstVisibleItemClass","__experimentalLastVisibleItemClass","hasValueCallback","resetAllFilterCallback","previousPanelId","hasMatchingPanel","isValueSet","wasValueSet","menuGroup","isMenuItemChecked","wasMenuItemChecked","isShown","undefined","cx","classes","placeholderStyle","styles","ToolsPanelItemPlaceholder","firstItemStyle","lastItemStyle","ToolsPanelItem"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious } from '@wordpress/compose';\nimport { useCallback, useEffect, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { useToolsPanelContext } from '../context';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\nimport type { ToolsPanelItemProps } from '../types';\n\nexport function useToolsPanelItem(\n\tprops: WordPressComponentProps< ToolsPanelItemProps, 'div' >\n) {\n\tconst {\n\t\tclassName,\n\t\thasValue,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\tpanelId,\n\t\tresetAllFilter,\n\t\tonDeselect,\n\t\tonSelect,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToolsPanelItem' );\n\n\tconst {\n\t\tpanelId: currentPanelId,\n\t\tmenuItems,\n\t\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t\tflagItemCustomization,\n\t\tisResetting,\n\t\tshouldRenderPlaceholderItems: shouldRenderPlaceholder,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t} = useToolsPanelContext();\n\n\tconst hasValueCallback = useCallback( hasValue, [ panelId, hasValue ] );\n\tconst resetAllFilterCallback = useCallback( resetAllFilter, [\n\t\tpanelId,\n\t\tresetAllFilter,\n\t] );\n\tconst previousPanelId = usePrevious( currentPanelId );\n\n\tconst hasMatchingPanel =\n\t\tcurrentPanelId === panelId || currentPanelId === null;\n\n\t// Registering the panel item allows the panel to include it in its\n\t// automatically generated menu and determine its initial checked status.\n\tuseEffect( () => {\n\t\tif ( hasMatchingPanel && previousPanelId !== null ) {\n\t\t\tregisterPanelItem( {\n\t\t\t\thasValue: hasValueCallback,\n\t\t\t\tisShownByDefault,\n\t\t\t\tlabel,\n\t\t\t\tresetAllFilter: resetAllFilterCallback,\n\t\t\t\tpanelId,\n\t\t\t} );\n\t\t}\n\n\t\treturn () => {\n\t\t\tif (\n\t\t\t\t( previousPanelId === null && !! currentPanelId ) ||\n\t\t\t\tcurrentPanelId === panelId\n\t\t\t) {\n\t\t\t\tderegisterPanelItem( label );\n\t\t\t}\n\t\t};\n\t}, [\n\t\tcurrentPanelId,\n\t\thasMatchingPanel,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\thasValueCallback,\n\t\tpanelId,\n\t\tpreviousPanelId,\n\t\tresetAllFilterCallback,\n\t\tregisterPanelItem,\n\t\tderegisterPanelItem,\n\t] );\n\n\tconst isValueSet = hasValue();\n\tconst wasValueSet = usePrevious( isValueSet );\n\n\t// If this item represents a default control it will need to notify the\n\t// panel when a custom value has been set.\n\tuseEffect( () => {\n\t\tif ( isShownByDefault && isValueSet && ! wasValueSet ) {\n\t\t\tflagItemCustomization( label );\n\t\t}\n\t}, [\n\t\tisValueSet,\n\t\twasValueSet,\n\t\tisShownByDefault,\n\t\tlabel,\n\t\tflagItemCustomization,\n\t] );\n\n\t// Note: `label` is used as a key when building menu item state in\n\t// `ToolsPanel`.\n\tconst menuGroup = isShownByDefault ? 'default' : 'optional';\n\tconst isMenuItemChecked = menuItems?.[ menuGroup ]?.[ label ];\n\tconst wasMenuItemChecked = usePrevious( isMenuItemChecked );\n\n\t// Determine if the panel item's corresponding menu is being toggled and\n\t// trigger appropriate callback if it is.\n\tuseEffect( () => {\n\t\tif ( isResetting || ! hasMatchingPanel ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isMenuItemChecked && ! isValueSet && ! wasMenuItemChecked ) {\n\t\t\tonSelect?.();\n\t\t}\n\n\t\tif ( ! isMenuItemChecked && wasMenuItemChecked ) {\n\t\t\tonDeselect?.();\n\t\t}\n\t}, [\n\t\thasMatchingPanel,\n\t\tisMenuItemChecked,\n\t\tisResetting,\n\t\tisValueSet,\n\t\twasMenuItemChecked,\n\t\tonSelect,\n\t\tonDeselect,\n\t] );\n\n\t// The item is shown if it is a default control regardless of whether it\n\t// has a value. Optional items are shown when they are checked or have\n\t// a value.\n\tconst isShown = isShownByDefault\n\t\t? menuItems?.[ menuGroup ]?.[ label ] !== undefined\n\t\t: isMenuItemChecked;\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\tconst placeholderStyle =\n\t\t\tshouldRenderPlaceholder &&\n\t\t\t! isShown &&\n\t\t\tstyles.ToolsPanelItemPlaceholder;\n\t\tconst firstItemStyle =\n\t\t\tfirstDisplayedItem === label && __experimentalFirstVisibleItemClass;\n\t\tconst lastItemStyle =\n\t\t\tlastDisplayedItem === label && __experimentalLastVisibleItemClass;\n\t\treturn cx(\n\t\t\tstyles.ToolsPanelItem,\n\t\t\tplaceholderStyle,\n\t\t\tclassName,\n\t\t\tfirstItemStyle,\n\t\t\tlastItemStyle\n\t\t);\n\t}, [\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName,\n\t\tcx,\n\t\tfirstDisplayedItem,\n\t\tlastDisplayedItem,\n\t\t__experimentalFirstVisibleItemClass,\n\t\t__experimentalLastVisibleItemClass,\n\t\tlabel,\n\t] );\n\n\treturn {\n\t\t...otherProps,\n\t\tisShown,\n\t\tshouldRenderPlaceholder,\n\t\tclassName: classes,\n\t};\n}\n"]}
@@ -227,7 +227,10 @@ function Tooltip(props) {
227
227
  const clearOnUnmount = () => {
228
228
  delayedSetIsOver.cancel();
229
229
  document.removeEventListener('mouseup', cancelIsMouseDown);
230
- };
230
+ }; // Ignore reason: updating the deps array here could cause unexpected changes in behavior.
231
+ // Deferring until a more detailed investigation/refactor can be performed.
232
+ // eslint-disable-next-line react-hooks/exhaustive-deps
233
+
231
234
 
232
235
  (0, _element.useEffect)(() => clearOnUnmount, []);
233
236
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/tooltip/index.js"],"names":["TOOLTIP_DELAY","eventCatcher","getDisabledElement","eventHandlers","child","childrenWithPopover","mergedRefs","children","ref","getRegularElement","addPopoverToGrandchildren","anchor","grandchildren","isOver","offset","position","shortcut","text","emitToChild","eventName","event","Children","count","only","props","disabled","Tooltip","delay","isMouseDown","setIsMouseDown","setIsOver","delayedSetIsOver","popoverAnchor","setPopoverAnchor","existingChildRef","toArray","mergedChildRefs","createMouseDown","target","tagName","document","addEventListener","cancelIsMouseDown","createMouseUp","removeEventListener","createMouseEvent","type","createToggleIsOver","isDelayed","currentTarget","cancel","_isOver","includes","clearOnUnmount","process","env","NODE_ENV","console","error","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","onMouseDown","getElementWithPopover","popoverData"],"mappings":"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","sourcesContent":["// @ts-nocheck\n\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tcloneElement,\n\tconcatChildren,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport { useDebounce, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport Shortcut from '../shortcut';\n\n/**\n * Time over children to wait before showing tooltip\n *\n * @type {number}\n */\nexport const TOOLTIP_DELAY = 700;\n\nconst eventCatcher = <div className=\"event-catcher\" />;\n\nconst getDisabledElement = ( {\n\teventHandlers,\n\tchild,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement(\n\t\t<span className=\"disabled-element-wrapper\">\n\t\t\t{ cloneElement( eventCatcher, eventHandlers ) }\n\t\t\t{ cloneElement( child, {\n\t\t\t\tchildren: childrenWithPopover,\n\t\t\t\tref: mergedRefs,\n\t\t\t} ) }\n\t\t</span>,\n\t\t{ ...eventHandlers }\n\t);\n};\n\nconst getRegularElement = ( {\n\tchild,\n\teventHandlers,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement( child, {\n\t\t...eventHandlers,\n\t\tchildren: childrenWithPopover,\n\t\tref: mergedRefs,\n\t} );\n};\n\nconst addPopoverToGrandchildren = ( {\n\tanchor,\n\tgrandchildren,\n\tisOver,\n\toffset,\n\tposition,\n\tshortcut,\n\ttext,\n} ) =>\n\tconcatChildren(\n\t\tgrandchildren,\n\t\tisOver && (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tposition={ position }\n\t\t\t\tclassName=\"components-tooltip\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tanimate={ false }\n\t\t\t\toffset={ offset }\n\t\t\t\tanchor={ anchor }\n\t\t\t\tshift\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-tooltip__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t</Popover>\n\t\t)\n\t);\n\nconst emitToChild = ( children, eventName, event ) => {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn;\n\t}\n\n\tconst child = Children.only( children );\n\n\t// If the underlying element is disabled, do not emit the event.\n\tif ( child.props.disabled ) {\n\t\treturn;\n\t}\n\n\tif ( typeof child.props[ eventName ] === 'function' ) {\n\t\tchild.props[ eventName ]( event );\n\t}\n};\n\nfunction Tooltip( props ) {\n\tconst {\n\t\tchildren,\n\t\tposition = 'bottom middle',\n\t\ttext,\n\t\tshortcut,\n\t\tdelay = TOOLTIP_DELAY,\n\t} = props;\n\t/**\n\t * Whether a mouse is currently pressed, used in determining whether\n\t * to handle a focus event as displaying the tooltip immediately.\n\t *\n\t * @type {boolean}\n\t */\n\tconst [ isMouseDown, setIsMouseDown ] = useState( false );\n\tconst [ isOver, setIsOver ] = useState( false );\n\tconst delayedSetIsOver = useDebounce( setIsOver, delay );\n\t// Using internal state (instead of a ref) for the popover anchor to make sure\n\t// that the component re-renders when the anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\n\t// Create a reference to the Tooltip's child, to be passed to the Popover\n\t// so that the Tooltip can be correctly positioned. Also, merge with the\n\t// existing ref for the first child, so that its ref is preserved.\n\tconst existingChildRef = Children.toArray( children )[ 0 ]?.ref;\n\tconst mergedChildRefs = useMergeRefs( [\n\t\tsetPopoverAnchor,\n\t\texistingChildRef,\n\t] );\n\n\tconst createMouseDown = ( event ) => {\n\t\t// In firefox, the mouse down event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Preserve original child callback behavior.\n\t\temitToChild( children, 'onMouseDown', event );\n\n\t\t// On mouse down, the next `mouseup` should revert the value of the\n\t\t// instance property and remove its own event handler. The bind is\n\t\t// made on the document since the `mouseup` might not occur within\n\t\t// the bounds of the element.\n\t\tdocument.addEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( true );\n\t};\n\n\tconst createMouseUp = ( event ) => {\n\t\t// In firefox, the mouse up event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\temitToChild( children, 'onMouseUp', event );\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( false );\n\t};\n\n\tconst createMouseEvent = ( type ) => {\n\t\tif ( type === 'mouseUp' ) return createMouseUp;\n\t\tif ( type === 'mouseDown' ) return createMouseDown;\n\t};\n\n\t/**\n\t * Prebound `isInMouseDown` handler, created as a constant reference to\n\t * assure ability to remove in component unmount.\n\t *\n\t * @type {Function}\n\t */\n\tconst cancelIsMouseDown = createMouseEvent( 'mouseUp' );\n\n\tconst createToggleIsOver = ( eventName, isDelayed ) => {\n\t\treturn ( event ) => {\n\t\t\t// Preserve original child callback behavior.\n\t\t\temitToChild( children, eventName, event );\n\n\t\t\t// Mouse events behave unreliably in React for disabled elements,\n\t\t\t// firing on mouseenter but not mouseleave. Further, the default\n\t\t\t// behavior for disabled elements in some browsers is to ignore\n\t\t\t// mouse events. Don't bother trying to handle them.\n\t\t\t//\n\t\t\t// See: https://github.com/facebook/react/issues/4251\n\t\t\tif ( event.currentTarget.disabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// A focus event will occur as a result of a mouse click, but it\n\t\t\t// should be disambiguated between interacting with the button and\n\t\t\t// using an explicit focus shift as a cue to display the tooltip.\n\t\t\tif ( 'focus' === event.type && isMouseDown ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Needed in case unsetting is over while delayed set pending, i.e.\n\t\t\t// quickly blur/mouseleave before delayedSetIsOver is called.\n\t\t\tdelayedSetIsOver.cancel();\n\n\t\t\tconst _isOver = [ 'focus', 'mouseenter' ].includes( event.type );\n\t\t\tif ( _isOver === isOver ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( isDelayed ) {\n\t\t\t\tdelayedSetIsOver( _isOver );\n\t\t\t} else {\n\t\t\t\tsetIsOver( _isOver );\n\t\t\t}\n\t\t};\n\t};\n\tconst clearOnUnmount = () => {\n\t\tdelayedSetIsOver.cancel();\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t};\n\n\tuseEffect( () => clearOnUnmount, [] );\n\n\tif ( Children.count( children ) !== 1 ) {\n\t\tif ( 'development' === process.env.NODE_ENV ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error(\n\t\t\t\t'Tooltip should be called with only a single child element.'\n\t\t\t);\n\t\t}\n\n\t\treturn children;\n\t}\n\n\tconst eventHandlers = {\n\t\tonMouseEnter: createToggleIsOver( 'onMouseEnter', true ),\n\t\tonMouseLeave: createToggleIsOver( 'onMouseLeave' ),\n\t\tonClick: createToggleIsOver( 'onClick' ),\n\t\tonFocus: createToggleIsOver( 'onFocus' ),\n\t\tonBlur: createToggleIsOver( 'onBlur' ),\n\t\tonMouseDown: createMouseEvent( 'mouseDown' ),\n\t};\n\n\tconst child = Children.only( children );\n\tconst { children: grandchildren, disabled } = child.props;\n\tconst getElementWithPopover = disabled\n\t\t? getDisabledElement\n\t\t: getRegularElement;\n\n\tconst popoverData = {\n\t\tanchor: popoverAnchor,\n\t\tisOver,\n\t\toffset: 4,\n\t\tposition,\n\t\tshortcut,\n\t\ttext,\n\t};\n\tconst childrenWithPopover = addPopoverToGrandchildren( {\n\t\tgrandchildren,\n\t\t...popoverData,\n\t} );\n\n\treturn getElementWithPopover( {\n\t\tchild,\n\t\teventHandlers,\n\t\tchildrenWithPopover,\n\t\tmergedRefs: mergedChildRefs,\n\t} );\n}\n\nexport default Tooltip;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/tooltip/index.js"],"names":["TOOLTIP_DELAY","eventCatcher","getDisabledElement","eventHandlers","child","childrenWithPopover","mergedRefs","children","ref","getRegularElement","addPopoverToGrandchildren","anchor","grandchildren","isOver","offset","position","shortcut","text","emitToChild","eventName","event","Children","count","only","props","disabled","Tooltip","delay","isMouseDown","setIsMouseDown","setIsOver","delayedSetIsOver","popoverAnchor","setPopoverAnchor","existingChildRef","toArray","mergedChildRefs","createMouseDown","target","tagName","document","addEventListener","cancelIsMouseDown","createMouseUp","removeEventListener","createMouseEvent","type","createToggleIsOver","isDelayed","currentTarget","cancel","_isOver","includes","clearOnUnmount","process","env","NODE_ENV","console","error","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","onMouseDown","getElementWithPopover","popoverData"],"mappings":"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","sourcesContent":["// @ts-nocheck\n\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tcloneElement,\n\tconcatChildren,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport { useDebounce, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport Shortcut from '../shortcut';\n\n/**\n * Time over children to wait before showing tooltip\n *\n * @type {number}\n */\nexport const TOOLTIP_DELAY = 700;\n\nconst eventCatcher = <div className=\"event-catcher\" />;\n\nconst getDisabledElement = ( {\n\teventHandlers,\n\tchild,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement(\n\t\t<span className=\"disabled-element-wrapper\">\n\t\t\t{ cloneElement( eventCatcher, eventHandlers ) }\n\t\t\t{ cloneElement( child, {\n\t\t\t\tchildren: childrenWithPopover,\n\t\t\t\tref: mergedRefs,\n\t\t\t} ) }\n\t\t</span>,\n\t\t{ ...eventHandlers }\n\t);\n};\n\nconst getRegularElement = ( {\n\tchild,\n\teventHandlers,\n\tchildrenWithPopover,\n\tmergedRefs,\n} ) => {\n\treturn cloneElement( child, {\n\t\t...eventHandlers,\n\t\tchildren: childrenWithPopover,\n\t\tref: mergedRefs,\n\t} );\n};\n\nconst addPopoverToGrandchildren = ( {\n\tanchor,\n\tgrandchildren,\n\tisOver,\n\toffset,\n\tposition,\n\tshortcut,\n\ttext,\n} ) =>\n\tconcatChildren(\n\t\tgrandchildren,\n\t\tisOver && (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tposition={ position }\n\t\t\t\tclassName=\"components-tooltip\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tanimate={ false }\n\t\t\t\toffset={ offset }\n\t\t\t\tanchor={ anchor }\n\t\t\t\tshift\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-tooltip__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t</Popover>\n\t\t)\n\t);\n\nconst emitToChild = ( children, eventName, event ) => {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn;\n\t}\n\n\tconst child = Children.only( children );\n\n\t// If the underlying element is disabled, do not emit the event.\n\tif ( child.props.disabled ) {\n\t\treturn;\n\t}\n\n\tif ( typeof child.props[ eventName ] === 'function' ) {\n\t\tchild.props[ eventName ]( event );\n\t}\n};\n\nfunction Tooltip( props ) {\n\tconst {\n\t\tchildren,\n\t\tposition = 'bottom middle',\n\t\ttext,\n\t\tshortcut,\n\t\tdelay = TOOLTIP_DELAY,\n\t} = props;\n\t/**\n\t * Whether a mouse is currently pressed, used in determining whether\n\t * to handle a focus event as displaying the tooltip immediately.\n\t *\n\t * @type {boolean}\n\t */\n\tconst [ isMouseDown, setIsMouseDown ] = useState( false );\n\tconst [ isOver, setIsOver ] = useState( false );\n\tconst delayedSetIsOver = useDebounce( setIsOver, delay );\n\t// Using internal state (instead of a ref) for the popover anchor to make sure\n\t// that the component re-renders when the anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\n\t// Create a reference to the Tooltip's child, to be passed to the Popover\n\t// so that the Tooltip can be correctly positioned. Also, merge with the\n\t// existing ref for the first child, so that its ref is preserved.\n\tconst existingChildRef = Children.toArray( children )[ 0 ]?.ref;\n\tconst mergedChildRefs = useMergeRefs( [\n\t\tsetPopoverAnchor,\n\t\texistingChildRef,\n\t] );\n\n\tconst createMouseDown = ( event ) => {\n\t\t// In firefox, the mouse down event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Preserve original child callback behavior.\n\t\temitToChild( children, 'onMouseDown', event );\n\n\t\t// On mouse down, the next `mouseup` should revert the value of the\n\t\t// instance property and remove its own event handler. The bind is\n\t\t// made on the document since the `mouseup` might not occur within\n\t\t// the bounds of the element.\n\t\tdocument.addEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( true );\n\t};\n\n\tconst createMouseUp = ( event ) => {\n\t\t// In firefox, the mouse up event is also fired when the select\n\t\t// list is chosen.\n\t\t// Cancel further processing because re-rendering of child components\n\t\t// causes onChange to be triggered with the old value.\n\t\t// See https://github.com/WordPress/gutenberg/pull/42483\n\t\tif ( event.target.tagName === 'OPTION' ) {\n\t\t\treturn;\n\t\t}\n\n\t\temitToChild( children, 'onMouseUp', event );\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( false );\n\t};\n\n\tconst createMouseEvent = ( type ) => {\n\t\tif ( type === 'mouseUp' ) return createMouseUp;\n\t\tif ( type === 'mouseDown' ) return createMouseDown;\n\t};\n\n\t/**\n\t * Prebound `isInMouseDown` handler, created as a constant reference to\n\t * assure ability to remove in component unmount.\n\t *\n\t * @type {Function}\n\t */\n\tconst cancelIsMouseDown = createMouseEvent( 'mouseUp' );\n\n\tconst createToggleIsOver = ( eventName, isDelayed ) => {\n\t\treturn ( event ) => {\n\t\t\t// Preserve original child callback behavior.\n\t\t\temitToChild( children, eventName, event );\n\n\t\t\t// Mouse events behave unreliably in React for disabled elements,\n\t\t\t// firing on mouseenter but not mouseleave. Further, the default\n\t\t\t// behavior for disabled elements in some browsers is to ignore\n\t\t\t// mouse events. Don't bother trying to handle them.\n\t\t\t//\n\t\t\t// See: https://github.com/facebook/react/issues/4251\n\t\t\tif ( event.currentTarget.disabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// A focus event will occur as a result of a mouse click, but it\n\t\t\t// should be disambiguated between interacting with the button and\n\t\t\t// using an explicit focus shift as a cue to display the tooltip.\n\t\t\tif ( 'focus' === event.type && isMouseDown ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Needed in case unsetting is over while delayed set pending, i.e.\n\t\t\t// quickly blur/mouseleave before delayedSetIsOver is called.\n\t\t\tdelayedSetIsOver.cancel();\n\n\t\t\tconst _isOver = [ 'focus', 'mouseenter' ].includes( event.type );\n\t\t\tif ( _isOver === isOver ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( isDelayed ) {\n\t\t\t\tdelayedSetIsOver( _isOver );\n\t\t\t} else {\n\t\t\t\tsetIsOver( _isOver );\n\t\t\t}\n\t\t};\n\t};\n\tconst clearOnUnmount = () => {\n\t\tdelayedSetIsOver.cancel();\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t};\n\n\t// Ignore reason: updating the deps array here could cause unexpected changes in behavior.\n\t// Deferring until a more detailed investigation/refactor can be performed.\n\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\tuseEffect( () => clearOnUnmount, [] );\n\n\tif ( Children.count( children ) !== 1 ) {\n\t\tif ( 'development' === process.env.NODE_ENV ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error(\n\t\t\t\t'Tooltip should be called with only a single child element.'\n\t\t\t);\n\t\t}\n\n\t\treturn children;\n\t}\n\n\tconst eventHandlers = {\n\t\tonMouseEnter: createToggleIsOver( 'onMouseEnter', true ),\n\t\tonMouseLeave: createToggleIsOver( 'onMouseLeave' ),\n\t\tonClick: createToggleIsOver( 'onClick' ),\n\t\tonFocus: createToggleIsOver( 'onFocus' ),\n\t\tonBlur: createToggleIsOver( 'onBlur' ),\n\t\tonMouseDown: createMouseEvent( 'mouseDown' ),\n\t};\n\n\tconst child = Children.only( children );\n\tconst { children: grandchildren, disabled } = child.props;\n\tconst getElementWithPopover = disabled\n\t\t? getDisabledElement\n\t\t: getRegularElement;\n\n\tconst popoverData = {\n\t\tanchor: popoverAnchor,\n\t\tisOver,\n\t\toffset: 4,\n\t\tposition,\n\t\tshortcut,\n\t\ttext,\n\t};\n\tconst childrenWithPopover = addPopoverToGrandchildren( {\n\t\tgrandchildren,\n\t\t...popoverData,\n\t} );\n\n\treturn getElementWithPopover( {\n\t\tchild,\n\t\teventHandlers,\n\t\tchildrenWithPopover,\n\t\tmergedRefs: mergedChildRefs,\n\t} );\n}\n\nexport default Tooltip;\n"]}
@@ -62,7 +62,9 @@ const useKeyboardVisibility = () => {
62
62
  return () => {
63
63
  showListener.remove();
64
64
  hideListener.remove();
65
- };
65
+ }; // Disable reason: deferring this refactor to the native team.
66
+ // see https://github.com/WordPress/gutenberg/pull/41166
67
+ // eslint-disable-next-line react-hooks/exhaustive-deps
66
68
  }, []);
67
69
  return keyboardVisible;
68
70
  };
@@ -106,7 +108,9 @@ const Tooltip = _ref => {
106
108
  });
107
109
  }
108
110
 
109
- return () => onHandleScreenTouch(null);
111
+ return () => onHandleScreenTouch(null); // Disable reason: deferring this refactor to the native team.
112
+ // see https://github.com/WordPress/gutenberg/pull/41166
113
+ // eslint-disable-next-line react-hooks/exhaustive-deps
110
114
  }, [visible]); // Manage visibility animation.
111
115
 
112
116
  (0, _element.useEffect)(() => {
@@ -115,7 +119,10 @@ const Tooltip = _ref => {
115
119
  previousVisible && previousVisible !== visible) {
116
120
  setAnimating(true);
117
121
  startAnimation();
118
- }
122
+ } // Disable reason: deferring this refactor to the native team.
123
+ // see https://github.com/WordPress/gutenberg/pull/41166
124
+ // eslint-disable-next-line react-hooks/exhaustive-deps
125
+
119
126
  }, [visible]); // Manage tooltip visibility and position in relation to keyboard.
120
127
 
121
128
  (0, _element.useEffect)(() => {
@@ -132,7 +139,10 @@ const Tooltip = _ref => {
132
139
  if (typeof previousVisible !== 'undefined' && !keyboardVisible) {
133
140
  setAnimating(true);
134
141
  setVisible(false);
135
- }
142
+ } // Disable reason: deferring this refactor to the native team.
143
+ // see https://github.com/WordPress/gutenberg/pull/41166
144
+ // eslint-disable-next-line react-hooks/exhaustive-deps
145
+
136
146
  }, [visible, keyboardVisible]); // Manage tooltip position during keyboard frame changes.
137
147
 
138
148
  (0, _element.useEffect)(() => {
@@ -250,6 +260,9 @@ const TooltipSlot = _ref3 => {
250
260
  handleScreenTouch();
251
261
  setHandleScreenTouch(null);
252
262
  }; // Memoize context value to avoid unnecessary rerenders of the Provider's children
263
+ // Disable reason: deferring this refactor to the native team.
264
+ // see https://github.com/WordPress/gutenberg/pull/41166
265
+ // eslint-disable-next-line react-hooks/exhaustive-deps
253
266
 
254
267
 
255
268
  const value = (0, _element.useMemo)(() => ({
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/tooltip/index.native.js"],"names":["RIGHT_ALIGN_ARROW_OFFSET","TOOLTIP_VERTICAL_OFFSET","TooltipContext","onHandleScreenTouch","Fill","Slot","useKeyboardVisibility","keyboardVisible","setKeyboardVisible","previousKeyboardVisible","showListener","Keyboard","addListener","keyboardHideEvent","Platform","select","android","ios","hideListener","remove","Tooltip","children","position","text","visible","initialVisible","referenceElementRef","animationValue","Animated","Value","current","horizontalPosition","split","setVisible","animating","setAnimating","hidden","previousVisible","referenceLayout","setReferenceLayout","height","width","x","y","tooltipLayout","setTooltipLayout","startAnimation","getReferenceElementPosition","frameListener","timing","toValue","duration","useNativeDriver","delay","easing","Easing","out","quad","start","tooltipStyles","styles","tooltip","left","Math","floor","top","tooltipBoxStyles","tooltip__box","elevation","opacity","shadowColor","tooltip__shadow","color","shadowOffset","shadowOpacity","shadowRadius","transform","translateY","interpolate","inputRange","outputRange","arrowStyles","tooltip__arrow","requestAnimationFrame","measure","_x","_y","pageX","pageY","getTooltipLayout","nativeEvent","layout","ref","onLayout","tooltip__text","TooltipSlot","rest","handleScreenTouch","setHandleScreenTouch","callback","handleTouchStart","value","undefined","StyleSheet","absoluteFill"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tAnimated,\n\tEasing,\n\tKeyboard,\n\tPlatform,\n\tStyleSheet,\n\tText,\n\tView,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcloneElement,\n\tcreateContext,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { usePrevious } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { createSlotFill } from '../slot-fill';\nimport styles from './style.scss';\n\nconst RIGHT_ALIGN_ARROW_OFFSET = 16;\nconst TOOLTIP_VERTICAL_OFFSET = 2;\n\nconst TooltipContext = createContext( {\n\tonHandleScreenTouch: () => {},\n} );\nconst { Fill, Slot } = createSlotFill( 'Tooltip' );\n\nconst useKeyboardVisibility = () => {\n\tconst [ keyboardVisible, setKeyboardVisible ] = useState( false );\n\tconst previousKeyboardVisible = usePrevious( keyboardVisible );\n\n\tuseEffect( () => {\n\t\tconst showListener = Keyboard.addListener( 'keyboardDidShow', () => {\n\t\t\tif ( previousKeyboardVisible !== true ) {\n\t\t\t\tsetKeyboardVisible( true );\n\t\t\t}\n\t\t} );\n\t\tconst keyboardHideEvent = Platform.select( {\n\t\t\tandroid: 'keyboardDidHide',\n\t\t\tios: 'keyboardWillHide',\n\t\t} );\n\t\tconst hideListener = Keyboard.addListener( keyboardHideEvent, () => {\n\t\t\tif ( previousKeyboardVisible !== false ) {\n\t\t\t\tsetKeyboardVisible( false );\n\t\t\t}\n\t\t} );\n\t\treturn () => {\n\t\t\tshowListener.remove();\n\t\t\thideListener.remove();\n\t\t};\n\t}, [] );\n\n\treturn keyboardVisible;\n};\n\nconst Tooltip = ( {\n\tchildren,\n\tposition = 'top',\n\ttext,\n\tvisible: initialVisible = false,\n} ) => {\n\tconst referenceElementRef = useRef( null );\n\tconst animationValue = useRef( new Animated.Value( 0 ) ).current;\n\tconst [ , horizontalPosition = 'center' ] = position.split( ' ' );\n\tconst [ visible, setVisible ] = useState( initialVisible );\n\tconst [ animating, setAnimating ] = useState( false );\n\tconst hidden = ! visible && ! animating;\n\tconst previousVisible = usePrevious( visible );\n\tconst [ referenceLayout, setReferenceLayout ] = useState( {\n\t\theight: 0,\n\t\twidth: 0,\n\t\tx: 0,\n\t\ty: 0,\n\t} );\n\tconst [ tooltipLayout, setTooltipLayout ] = useState( {\n\t\theight: 0,\n\t\twidth: 0,\n\t} );\n\tconst { onHandleScreenTouch } = useContext( TooltipContext );\n\tconst keyboardVisible = useKeyboardVisibility();\n\n\t// Register callback to dismiss the tooltip whenever the screen is touched.\n\tuseEffect( () => {\n\t\tif ( visible ) {\n\t\t\tonHandleScreenTouch( () => {\n\t\t\t\tsetAnimating( true );\n\t\t\t\tsetVisible( false );\n\t\t\t} );\n\t\t}\n\t\treturn () => onHandleScreenTouch( null );\n\t}, [ visible ] );\n\n\t// Manage visibility animation.\n\tuseEffect( () => {\n\t\tif (\n\t\t\t// Initial render and visibility enabled, animate show.\n\t\t\t( typeof previousVisible === 'undefined' && visible ) ||\n\t\t\t// Previously visible, animate hide\n\t\t\t( previousVisible && previousVisible !== visible )\n\t\t) {\n\t\t\tsetAnimating( true );\n\t\t\tstartAnimation();\n\t\t}\n\t}, [ visible ] );\n\n\t// Manage tooltip visibility and position in relation to keyboard.\n\tuseEffect( () => {\n\t\tif ( ! visible ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Update tooltip position if keyboard is visible.\n\t\tif ( keyboardVisible ) {\n\t\t\tgetReferenceElementPosition();\n\t\t}\n\n\t\t// Hide tooltip if keyboard hides\n\t\tif ( typeof previousVisible !== 'undefined' && ! keyboardVisible ) {\n\t\t\tsetAnimating( true );\n\t\t\tsetVisible( false );\n\t\t}\n\t}, [ visible, keyboardVisible ] );\n\n\t// Manage tooltip position during keyboard frame changes.\n\tuseEffect( () => {\n\t\tconst frameListener = Keyboard.addListener(\n\t\t\t'keyboardWillChangeFrame',\n\t\t\t() => {\n\t\t\t\tif ( visible ) {\n\t\t\t\t\tgetReferenceElementPosition();\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\n\t\treturn () => {\n\t\t\tframeListener.remove();\n\t\t};\n\t}, [ visible ] );\n\n\tconst startAnimation = () => {\n\t\tAnimated.timing( animationValue, {\n\t\t\ttoValue: visible ? 1 : 0,\n\t\t\tduration: visible ? 300 : 150,\n\t\t\tuseNativeDriver: true,\n\t\t\tdelay: visible ? 500 : 0,\n\t\t\teasing: Easing.out( Easing.quad ),\n\t\t} ).start( () => {\n\t\t\tsetAnimating( false );\n\t\t} );\n\t};\n\n\tconst tooltipStyles = [\n\t\tstyles.tooltip,\n\t\t{\n\t\t\tleft:\n\t\t\t\treferenceLayout.x +\n\t\t\t\tMath.floor( referenceLayout.width / 2 ) -\n\t\t\t\t( horizontalPosition === 'right'\n\t\t\t\t\t? RIGHT_ALIGN_ARROW_OFFSET\n\t\t\t\t\t: Math.floor( tooltipLayout.width / 2 ) ),\n\t\t\ttop:\n\t\t\t\treferenceLayout.y -\n\t\t\t\ttooltipLayout.height -\n\t\t\t\tTOOLTIP_VERTICAL_OFFSET,\n\t\t},\n\t];\n\tconst tooltipBoxStyles = [\n\t\tstyles.tooltip__box,\n\t\thorizontalPosition === 'right' && styles[ 'tooltip--rightAlign' ],\n\t\t{\n\t\t\televation: 2,\n\t\t\topacity: animationValue,\n\t\t\tshadowColor: styles.tooltip__shadow?.color,\n\t\t\tshadowOffset: { height: 2, width: 0 },\n\t\t\tshadowOpacity: 0.25,\n\t\t\tshadowRadius: 2,\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: animationValue.interpolate( {\n\t\t\t\t\t\tinputRange: [ 0, 1 ],\n\t\t\t\t\t\toutputRange: [ visible ? 4 : -8, -8 ],\n\t\t\t\t\t} ),\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t];\n\tconst arrowStyles = [\n\t\tstyles.tooltip__arrow,\n\t\thorizontalPosition === 'right' &&\n\t\t\tstyles[ 'tooltip__arrow--rightAlign' ],\n\t];\n\n\tconst getReferenceElementPosition = () => {\n\t\t// rAF allows render to complete before calculating layout\n\t\t// eslint-disable-next-line no-undef\n\t\trequestAnimationFrame( () => {\n\t\t\tif ( ! referenceElementRef.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\treferenceElementRef.current.measure(\n\t\t\t\t( _x, _y, width, height, pageX, pageY ) => {\n\t\t\t\t\tsetReferenceLayout( {\n\t\t\t\t\t\theight,\n\t\t\t\t\t\twidth,\n\t\t\t\t\t\tx: pageX,\n\t\t\t\t\t\ty: pageY,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t);\n\t\t} );\n\t};\n\tconst getTooltipLayout = ( { nativeEvent } ) => {\n\t\tconst { height, width } = nativeEvent.layout;\n\t\tsetTooltipLayout( { height, width } );\n\t};\n\n\tif ( hidden ) {\n\t\treturn children;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ cloneElement( children, {\n\t\t\t\tref: referenceElementRef,\n\t\t\t\tonLayout: getReferenceElementPosition,\n\t\t\t} ) }\n\t\t\t<Fill>\n\t\t\t\t<View onLayout={ getTooltipLayout } style={ tooltipStyles }>\n\t\t\t\t\t<Animated.View style={ tooltipBoxStyles }>\n\t\t\t\t\t\t<Text style={ styles.tooltip__text }>{ text }</Text>\n\t\t\t\t\t\t<View style={ arrowStyles } />\n\t\t\t\t\t</Animated.View>\n\t\t\t\t</View>\n\t\t\t</Fill>\n\t\t</>\n\t);\n};\n\nconst TooltipSlot = ( { children, ...rest } ) => {\n\tconst [ handleScreenTouch, setHandleScreenTouch ] = useState( null );\n\tconst onHandleScreenTouch = ( callback ) => {\n\t\t// Must use function to set state below as `callback` is a function itself.\n\t\tsetHandleScreenTouch( () => callback );\n\t};\n\tconst handleTouchStart = () => {\n\t\thandleScreenTouch();\n\t\tsetHandleScreenTouch( null );\n\t};\n\t// Memoize context value to avoid unnecessary rerenders of the Provider's children\n\tconst value = useMemo( () => ( { onHandleScreenTouch } ) );\n\n\treturn (\n\t\t<TooltipContext.Provider value={ value }>\n\t\t\t<View\n\t\t\t\tonTouchStart={\n\t\t\t\t\ttypeof handleScreenTouch === 'function'\n\t\t\t\t\t\t? handleTouchStart\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tpointerEvents=\"box-none\"\n\t\t\t\tstyle={ StyleSheet.absoluteFill }\n\t\t\t\ttestID=\"tooltip-overlay\"\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t\t<Slot { ...rest } />\n\t\t\t</View>\n\t\t</TooltipContext.Provider>\n\t);\n};\n\nTooltip.Slot = TooltipSlot;\n\nexport default Tooltip;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/tooltip/index.native.js"],"names":["RIGHT_ALIGN_ARROW_OFFSET","TOOLTIP_VERTICAL_OFFSET","TooltipContext","onHandleScreenTouch","Fill","Slot","useKeyboardVisibility","keyboardVisible","setKeyboardVisible","previousKeyboardVisible","showListener","Keyboard","addListener","keyboardHideEvent","Platform","select","android","ios","hideListener","remove","Tooltip","children","position","text","visible","initialVisible","referenceElementRef","animationValue","Animated","Value","current","horizontalPosition","split","setVisible","animating","setAnimating","hidden","previousVisible","referenceLayout","setReferenceLayout","height","width","x","y","tooltipLayout","setTooltipLayout","startAnimation","getReferenceElementPosition","frameListener","timing","toValue","duration","useNativeDriver","delay","easing","Easing","out","quad","start","tooltipStyles","styles","tooltip","left","Math","floor","top","tooltipBoxStyles","tooltip__box","elevation","opacity","shadowColor","tooltip__shadow","color","shadowOffset","shadowOpacity","shadowRadius","transform","translateY","interpolate","inputRange","outputRange","arrowStyles","tooltip__arrow","requestAnimationFrame","measure","_x","_y","pageX","pageY","getTooltipLayout","nativeEvent","layout","ref","onLayout","tooltip__text","TooltipSlot","rest","handleScreenTouch","setHandleScreenTouch","callback","handleTouchStart","value","undefined","StyleSheet","absoluteFill"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tAnimated,\n\tEasing,\n\tKeyboard,\n\tPlatform,\n\tStyleSheet,\n\tText,\n\tView,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcloneElement,\n\tcreateContext,\n\tuseContext,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\nimport { usePrevious } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { createSlotFill } from '../slot-fill';\nimport styles from './style.scss';\n\nconst RIGHT_ALIGN_ARROW_OFFSET = 16;\nconst TOOLTIP_VERTICAL_OFFSET = 2;\n\nconst TooltipContext = createContext( {\n\tonHandleScreenTouch: () => {},\n} );\nconst { Fill, Slot } = createSlotFill( 'Tooltip' );\n\nconst useKeyboardVisibility = () => {\n\tconst [ keyboardVisible, setKeyboardVisible ] = useState( false );\n\tconst previousKeyboardVisible = usePrevious( keyboardVisible );\n\n\tuseEffect( () => {\n\t\tconst showListener = Keyboard.addListener( 'keyboardDidShow', () => {\n\t\t\tif ( previousKeyboardVisible !== true ) {\n\t\t\t\tsetKeyboardVisible( true );\n\t\t\t}\n\t\t} );\n\t\tconst keyboardHideEvent = Platform.select( {\n\t\t\tandroid: 'keyboardDidHide',\n\t\t\tios: 'keyboardWillHide',\n\t\t} );\n\t\tconst hideListener = Keyboard.addListener( keyboardHideEvent, () => {\n\t\t\tif ( previousKeyboardVisible !== false ) {\n\t\t\t\tsetKeyboardVisible( false );\n\t\t\t}\n\t\t} );\n\t\treturn () => {\n\t\t\tshowListener.remove();\n\t\t\thideListener.remove();\n\t\t};\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\treturn keyboardVisible;\n};\n\nconst Tooltip = ( {\n\tchildren,\n\tposition = 'top',\n\ttext,\n\tvisible: initialVisible = false,\n} ) => {\n\tconst referenceElementRef = useRef( null );\n\tconst animationValue = useRef( new Animated.Value( 0 ) ).current;\n\tconst [ , horizontalPosition = 'center' ] = position.split( ' ' );\n\tconst [ visible, setVisible ] = useState( initialVisible );\n\tconst [ animating, setAnimating ] = useState( false );\n\tconst hidden = ! visible && ! animating;\n\tconst previousVisible = usePrevious( visible );\n\tconst [ referenceLayout, setReferenceLayout ] = useState( {\n\t\theight: 0,\n\t\twidth: 0,\n\t\tx: 0,\n\t\ty: 0,\n\t} );\n\tconst [ tooltipLayout, setTooltipLayout ] = useState( {\n\t\theight: 0,\n\t\twidth: 0,\n\t} );\n\tconst { onHandleScreenTouch } = useContext( TooltipContext );\n\tconst keyboardVisible = useKeyboardVisibility();\n\n\t// Register callback to dismiss the tooltip whenever the screen is touched.\n\tuseEffect( () => {\n\t\tif ( visible ) {\n\t\t\tonHandleScreenTouch( () => {\n\t\t\t\tsetAnimating( true );\n\t\t\t\tsetVisible( false );\n\t\t\t} );\n\t\t}\n\t\treturn () => onHandleScreenTouch( null );\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ visible ] );\n\n\t// Manage visibility animation.\n\tuseEffect( () => {\n\t\tif (\n\t\t\t// Initial render and visibility enabled, animate show.\n\t\t\t( typeof previousVisible === 'undefined' && visible ) ||\n\t\t\t// Previously visible, animate hide\n\t\t\t( previousVisible && previousVisible !== visible )\n\t\t) {\n\t\t\tsetAnimating( true );\n\t\t\tstartAnimation();\n\t\t}\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ visible ] );\n\n\t// Manage tooltip visibility and position in relation to keyboard.\n\tuseEffect( () => {\n\t\tif ( ! visible ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Update tooltip position if keyboard is visible.\n\t\tif ( keyboardVisible ) {\n\t\t\tgetReferenceElementPosition();\n\t\t}\n\n\t\t// Hide tooltip if keyboard hides\n\t\tif ( typeof previousVisible !== 'undefined' && ! keyboardVisible ) {\n\t\t\tsetAnimating( true );\n\t\t\tsetVisible( false );\n\t\t}\n\t\t// Disable reason: deferring this refactor to the native team.\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ visible, keyboardVisible ] );\n\n\t// Manage tooltip position during keyboard frame changes.\n\tuseEffect( () => {\n\t\tconst frameListener = Keyboard.addListener(\n\t\t\t'keyboardWillChangeFrame',\n\t\t\t() => {\n\t\t\t\tif ( visible ) {\n\t\t\t\t\tgetReferenceElementPosition();\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\n\t\treturn () => {\n\t\t\tframeListener.remove();\n\t\t};\n\t}, [ visible ] );\n\n\tconst startAnimation = () => {\n\t\tAnimated.timing( animationValue, {\n\t\t\ttoValue: visible ? 1 : 0,\n\t\t\tduration: visible ? 300 : 150,\n\t\t\tuseNativeDriver: true,\n\t\t\tdelay: visible ? 500 : 0,\n\t\t\teasing: Easing.out( Easing.quad ),\n\t\t} ).start( () => {\n\t\t\tsetAnimating( false );\n\t\t} );\n\t};\n\n\tconst tooltipStyles = [\n\t\tstyles.tooltip,\n\t\t{\n\t\t\tleft:\n\t\t\t\treferenceLayout.x +\n\t\t\t\tMath.floor( referenceLayout.width / 2 ) -\n\t\t\t\t( horizontalPosition === 'right'\n\t\t\t\t\t? RIGHT_ALIGN_ARROW_OFFSET\n\t\t\t\t\t: Math.floor( tooltipLayout.width / 2 ) ),\n\t\t\ttop:\n\t\t\t\treferenceLayout.y -\n\t\t\t\ttooltipLayout.height -\n\t\t\t\tTOOLTIP_VERTICAL_OFFSET,\n\t\t},\n\t];\n\tconst tooltipBoxStyles = [\n\t\tstyles.tooltip__box,\n\t\thorizontalPosition === 'right' && styles[ 'tooltip--rightAlign' ],\n\t\t{\n\t\t\televation: 2,\n\t\t\topacity: animationValue,\n\t\t\tshadowColor: styles.tooltip__shadow?.color,\n\t\t\tshadowOffset: { height: 2, width: 0 },\n\t\t\tshadowOpacity: 0.25,\n\t\t\tshadowRadius: 2,\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: animationValue.interpolate( {\n\t\t\t\t\t\tinputRange: [ 0, 1 ],\n\t\t\t\t\t\toutputRange: [ visible ? 4 : -8, -8 ],\n\t\t\t\t\t} ),\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t];\n\tconst arrowStyles = [\n\t\tstyles.tooltip__arrow,\n\t\thorizontalPosition === 'right' &&\n\t\t\tstyles[ 'tooltip__arrow--rightAlign' ],\n\t];\n\n\tconst getReferenceElementPosition = () => {\n\t\t// rAF allows render to complete before calculating layout\n\t\t// eslint-disable-next-line no-undef\n\t\trequestAnimationFrame( () => {\n\t\t\tif ( ! referenceElementRef.current ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\treferenceElementRef.current.measure(\n\t\t\t\t( _x, _y, width, height, pageX, pageY ) => {\n\t\t\t\t\tsetReferenceLayout( {\n\t\t\t\t\t\theight,\n\t\t\t\t\t\twidth,\n\t\t\t\t\t\tx: pageX,\n\t\t\t\t\t\ty: pageY,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t);\n\t\t} );\n\t};\n\tconst getTooltipLayout = ( { nativeEvent } ) => {\n\t\tconst { height, width } = nativeEvent.layout;\n\t\tsetTooltipLayout( { height, width } );\n\t};\n\n\tif ( hidden ) {\n\t\treturn children;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{ cloneElement( children, {\n\t\t\t\tref: referenceElementRef,\n\t\t\t\tonLayout: getReferenceElementPosition,\n\t\t\t} ) }\n\t\t\t<Fill>\n\t\t\t\t<View onLayout={ getTooltipLayout } style={ tooltipStyles }>\n\t\t\t\t\t<Animated.View style={ tooltipBoxStyles }>\n\t\t\t\t\t\t<Text style={ styles.tooltip__text }>{ text }</Text>\n\t\t\t\t\t\t<View style={ arrowStyles } />\n\t\t\t\t\t</Animated.View>\n\t\t\t\t</View>\n\t\t\t</Fill>\n\t\t</>\n\t);\n};\n\nconst TooltipSlot = ( { children, ...rest } ) => {\n\tconst [ handleScreenTouch, setHandleScreenTouch ] = useState( null );\n\tconst onHandleScreenTouch = ( callback ) => {\n\t\t// Must use function to set state below as `callback` is a function itself.\n\t\tsetHandleScreenTouch( () => callback );\n\t};\n\tconst handleTouchStart = () => {\n\t\thandleScreenTouch();\n\t\tsetHandleScreenTouch( null );\n\t};\n\t// Memoize context value to avoid unnecessary rerenders of the Provider's children\n\t// Disable reason: deferring this refactor to the native team.\n\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\tconst value = useMemo( () => ( { onHandleScreenTouch } ) );\n\n\treturn (\n\t\t<TooltipContext.Provider value={ value }>\n\t\t\t<View\n\t\t\t\tonTouchStart={\n\t\t\t\t\ttypeof handleScreenTouch === 'function'\n\t\t\t\t\t\t? handleTouchStart\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\tpointerEvents=\"box-none\"\n\t\t\t\tstyle={ StyleSheet.absoluteFill }\n\t\t\t\ttestID=\"tooltip-overlay\"\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t\t<Slot { ...rest } />\n\t\t\t</View>\n\t\t</TooltipContext.Provider>\n\t);\n};\n\nTooltip.Slot = TooltipSlot;\n\nexport default Tooltip;\n"]}
@@ -41,6 +41,7 @@ const BorderBoxControl = (props, forwardedRef) => {
41
41
  className,
42
42
  colors,
43
43
  disableCustomColors,
44
+ disableUnits,
44
45
  enableAlpha,
45
46
  enableStyle,
46
47
  hasMixedBorders,
@@ -85,6 +86,7 @@ const BorderBoxControl = (props, forwardedRef) => {
85
86
  }, isLinked ? createElement(BorderControl, {
86
87
  className: linkedControlClassName,
87
88
  colors: colors,
89
+ disableUnits: disableUnits,
88
90
  disableCustomColors: disableCustomColors,
89
91
  enableAlpha: enableAlpha,
90
92
  enableStyle: enableStyle,
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control/component.tsx"],"names":["__","useMemo","useState","useMergeRefs","BorderBoxControlLinkedButton","BorderBoxControlSplitControls","BorderControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderBoxControl","BorderLabel","props","label","hideLabelFromVision","BorderBoxControl","forwardedRef","className","colors","disableCustomColors","enableAlpha","enableStyle","hasMixedBorders","isLinked","linkedControlClassName","linkedValue","onLinkedChange","onSplitChange","popoverPlacement","popoverOffset","splitValue","toggleLinked","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","__next36pxDefaultSize","otherProps","popoverAnchor","setPopoverAnchor","popoverProps","placement","offset","anchor","shift","undefined","mergedRef","ConnectedBorderBoxControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BorderBoxControlLinkedButton from '../border-box-control-linked-button';\nimport BorderBoxControlSplitControls from '../border-box-control-split-controls';\nimport { BorderControl } from '../../border-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderBoxControl } from './hook';\n\nimport type { BorderBoxControlProps } from '../types';\nimport type {\n\tLabelProps,\n\tBorderControlProps,\n} from '../../border-control/types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel>{ label }</StyledLabel>\n\t);\n};\n\nconst BorderBoxControl = (\n\tprops: WordPressComponentProps< BorderBoxControlProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tclassName,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thasMixedBorders,\n\t\thideLabelFromVision,\n\t\tisLinked,\n\t\tlabel,\n\t\tlinkedControlClassName,\n\t\tlinkedValue,\n\t\tonLinkedChange,\n\t\tonSplitChange,\n\t\tpopoverPlacement,\n\t\tpopoverOffset,\n\t\tsplitValue,\n\t\ttoggleLinked,\n\t\t__experimentalHasMultipleOrigins,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next36pxDefaultSize = false,\n\t\t...otherProps\n\t} = useBorderBoxControl( props );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState< Element | null >(\n\t\tnull\n\t);\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps: BorderControlProps[ '__unstablePopoverProps' ] =\n\t\tuseMemo(\n\t\t\t() =>\n\t\t\t\tpopoverPlacement\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tplacement: popoverPlacement,\n\t\t\t\t\t\t\toffset: popoverOffset,\n\t\t\t\t\t\t\tanchor: popoverAnchor,\n\t\t\t\t\t\t\tshift: true,\n\t\t\t\t\t }\n\t\t\t\t\t: undefined,\n\t\t\t[ popoverPlacement, popoverOffset, popoverAnchor ]\n\t\t);\n\n\tconst mergedRef = useMergeRefs( [ setPopoverAnchor, forwardedRef ] );\n\n\treturn (\n\t\t<View className={ className } { ...otherProps } ref={ mergedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack alignment={ 'start' } expanded={ true } spacing={ 0 }>\n\t\t\t\t{ isLinked ? (\n\t\t\t\t\t<BorderControl\n\t\t\t\t\t\tclassName={ linkedControlClassName }\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onLinkedChange }\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\thasMixedBorders ? __( 'Mixed' ) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\t\t\tshouldSanitizeBorder={ false } // This component will handle that.\n\t\t\t\t\t\tvalue={ linkedValue }\n\t\t\t\t\t\twithSlider={ true }\n\t\t\t\t\t\twidth={ '110px' }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BorderBoxControlSplitControls\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onSplitChange }\n\t\t\t\t\t\tpopoverPlacement={ popoverPlacement }\n\t\t\t\t\t\tpopoverOffset={ popoverOffset }\n\t\t\t\t\t\tvalue={ splitValue }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<BorderBoxControlLinkedButton\n\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\nconst ConnectedBorderBoxControl = contextConnect(\n\tBorderBoxControl,\n\t'BorderBoxControl'\n);\n\nexport default ConnectedBorderBoxControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control/component.tsx"],"names":["__","useMemo","useState","useMergeRefs","BorderBoxControlLinkedButton","BorderBoxControlSplitControls","BorderControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderBoxControl","BorderLabel","props","label","hideLabelFromVision","BorderBoxControl","forwardedRef","className","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","hasMixedBorders","isLinked","linkedControlClassName","linkedValue","onLinkedChange","onSplitChange","popoverPlacement","popoverOffset","splitValue","toggleLinked","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","__next36pxDefaultSize","otherProps","popoverAnchor","setPopoverAnchor","popoverProps","placement","offset","anchor","shift","undefined","mergedRef","ConnectedBorderBoxControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BorderBoxControlLinkedButton from '../border-box-control-linked-button';\nimport BorderBoxControlSplitControls from '../border-box-control-split-controls';\nimport { BorderControl } from '../../border-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderBoxControl } from './hook';\n\nimport type { BorderBoxControlProps } from '../types';\nimport type {\n\tLabelProps,\n\tBorderControlProps,\n} from '../../border-control/types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel>{ label }</StyledLabel>\n\t);\n};\n\nconst BorderBoxControl = (\n\tprops: WordPressComponentProps< BorderBoxControlProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tclassName,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thasMixedBorders,\n\t\thideLabelFromVision,\n\t\tisLinked,\n\t\tlabel,\n\t\tlinkedControlClassName,\n\t\tlinkedValue,\n\t\tonLinkedChange,\n\t\tonSplitChange,\n\t\tpopoverPlacement,\n\t\tpopoverOffset,\n\t\tsplitValue,\n\t\ttoggleLinked,\n\t\t__experimentalHasMultipleOrigins,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next36pxDefaultSize = false,\n\t\t...otherProps\n\t} = useBorderBoxControl( props );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState< Element | null >(\n\t\tnull\n\t);\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps: BorderControlProps[ '__unstablePopoverProps' ] =\n\t\tuseMemo(\n\t\t\t() =>\n\t\t\t\tpopoverPlacement\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tplacement: popoverPlacement,\n\t\t\t\t\t\t\toffset: popoverOffset,\n\t\t\t\t\t\t\tanchor: popoverAnchor,\n\t\t\t\t\t\t\tshift: true,\n\t\t\t\t\t }\n\t\t\t\t\t: undefined,\n\t\t\t[ popoverPlacement, popoverOffset, popoverAnchor ]\n\t\t);\n\n\tconst mergedRef = useMergeRefs( [ setPopoverAnchor, forwardedRef ] );\n\n\treturn (\n\t\t<View className={ className } { ...otherProps } ref={ mergedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack alignment={ 'start' } expanded={ true } spacing={ 0 }>\n\t\t\t\t{ isLinked ? (\n\t\t\t\t\t<BorderControl\n\t\t\t\t\t\tclassName={ linkedControlClassName }\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onLinkedChange }\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\thasMixedBorders ? __( 'Mixed' ) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\t\t\tshouldSanitizeBorder={ false } // This component will handle that.\n\t\t\t\t\t\tvalue={ linkedValue }\n\t\t\t\t\t\twithSlider={ true }\n\t\t\t\t\t\twidth={ '110px' }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BorderBoxControlSplitControls\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onSplitChange }\n\t\t\t\t\t\tpopoverPlacement={ popoverPlacement }\n\t\t\t\t\t\tpopoverOffset={ popoverOffset }\n\t\t\t\t\t\tvalue={ splitValue }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<BorderBoxControlLinkedButton\n\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\nconst ConnectedBorderBoxControl = contextConnect(\n\tBorderBoxControl,\n\t'BorderBoxControl'\n);\n\nexport default ConnectedBorderBoxControl;\n"]}
@@ -20,7 +20,9 @@ export function useBorderBoxControl(props) {
20
20
  const mixedBorders = hasMixedBorders(value);
21
21
  const splitBorders = hasSplitBorders(value);
22
22
  const linkedValue = splitBorders ? getCommonBorder(value) : value;
23
- const splitValue = splitBorders ? value : getSplitBorders(value);
23
+ const splitValue = splitBorders ? value : getSplitBorders(value); // If no numeric width value is set, the unit select will be disabled.
24
+
25
+ const hasWidthValue = !isNaN(parseFloat(`${linkedValue === null || linkedValue === void 0 ? void 0 : linkedValue.width}`));
24
26
  const [isLinked, setIsLinked] = useState(!mixedBorders);
25
27
 
26
28
  const toggleLinked = () => setIsLinked(!isLinked);
@@ -84,6 +86,7 @@ export function useBorderBoxControl(props) {
84
86
  }, [cx]);
85
87
  return { ...otherProps,
86
88
  className: classes,
89
+ disableUnits: mixedBorders && !hasWidthValue,
87
90
  hasMixedBorders: mixedBorders,
88
91
  isLinked,
89
92
  linkedControlClassName,
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control/hook.ts"],"names":["useMemo","useState","styles","getBorderDiff","getCommonBorder","getSplitBorders","hasMixedBorders","hasSplitBorders","isCompleteBorder","isEmptyBorder","useContextSystem","useCx","useBorderBoxControl","props","className","onChange","value","otherProps","mixedBorders","splitBorders","linkedValue","splitValue","isLinked","setIsLinked","toggleLinked","onLinkedChange","newBorder","undefined","changes","updatedBorders","top","right","bottom","left","filteredResult","onSplitChange","side","cx","classes","BorderBoxControl","linkedControlClassName","LinkedBorderControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport {\n\tgetBorderDiff,\n\tgetCommonBorder,\n\tgetSplitBorders,\n\thasMixedBorders,\n\thasSplitBorders,\n\tisCompleteBorder,\n\tisEmptyBorder,\n} from '../utils';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nimport type { Border } from '../../border-control/types';\nimport type { Borders, BorderSide, BorderBoxControlProps } from '../types';\n\nexport function useBorderBoxControl(\n\tprops: WordPressComponentProps< BorderBoxControlProps, 'div' >\n) {\n\tconst { className, onChange, value, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'BorderBoxControl'\n\t);\n\n\tconst mixedBorders = hasMixedBorders( value );\n\tconst splitBorders = hasSplitBorders( value );\n\n\tconst linkedValue = splitBorders\n\t\t? getCommonBorder( value as Borders | undefined )\n\t\t: ( value as Border );\n\n\tconst splitValue = splitBorders\n\t\t? ( value as Borders )\n\t\t: getSplitBorders( value as Border | undefined );\n\n\tconst [ isLinked, setIsLinked ] = useState( ! mixedBorders );\n\tconst toggleLinked = () => setIsLinked( ! isLinked );\n\n\tconst onLinkedChange = ( newBorder?: Border ) => {\n\t\tif ( ! newBorder ) {\n\t\t\treturn onChange( undefined );\n\t\t}\n\n\t\t// If we have all props defined on the new border apply it.\n\t\tif ( ! mixedBorders || isCompleteBorder( newBorder ) ) {\n\t\t\treturn onChange(\n\t\t\t\tisEmptyBorder( newBorder ) ? undefined : newBorder\n\t\t\t);\n\t\t}\n\n\t\t// If we had mixed borders we might have had some shared border props\n\t\t// that we need to maintain. For example; we could have mixed borders\n\t\t// with all the same color but different widths. Then from the linked\n\t\t// control we change the color. We should keep the separate widths.\n\t\tconst changes = getBorderDiff(\n\t\t\tlinkedValue as Border,\n\t\t\tnewBorder as Border\n\t\t);\n\t\tconst updatedBorders = {\n\t\t\ttop: { ...( value as Borders )?.top, ...changes },\n\t\t\tright: { ...( value as Borders )?.right, ...changes },\n\t\t\tbottom: { ...( value as Borders )?.bottom, ...changes },\n\t\t\tleft: { ...( value as Borders )?.left, ...changes },\n\t\t};\n\n\t\tif ( hasMixedBorders( updatedBorders ) ) {\n\t\t\treturn onChange( updatedBorders );\n\t\t}\n\n\t\tconst filteredResult = isEmptyBorder( updatedBorders.top )\n\t\t\t? undefined\n\t\t\t: updatedBorders.top;\n\n\t\tonChange( filteredResult );\n\t};\n\n\tconst onSplitChange = (\n\t\tnewBorder: Border | undefined,\n\t\tside: BorderSide\n\t) => {\n\t\tconst updatedBorders = { ...splitValue, [ side ]: newBorder };\n\n\t\tif ( hasMixedBorders( updatedBorders ) ) {\n\t\t\tonChange( updatedBorders );\n\t\t} else {\n\t\t\tonChange( newBorder );\n\t\t}\n\t};\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.BorderBoxControl, className );\n\t}, [ cx, className ] );\n\n\tconst linkedControlClassName = useMemo( () => {\n\t\treturn cx( styles.LinkedBorderControl );\n\t}, [ cx ] );\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\thasMixedBorders: mixedBorders,\n\t\tisLinked,\n\t\tlinkedControlClassName,\n\t\tonLinkedChange,\n\t\tonSplitChange,\n\t\ttoggleLinked,\n\t\tlinkedValue,\n\t\tsplitValue,\n\t};\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control/hook.ts"],"names":["useMemo","useState","styles","getBorderDiff","getCommonBorder","getSplitBorders","hasMixedBorders","hasSplitBorders","isCompleteBorder","isEmptyBorder","useContextSystem","useCx","useBorderBoxControl","props","className","onChange","value","otherProps","mixedBorders","splitBorders","linkedValue","splitValue","hasWidthValue","isNaN","parseFloat","width","isLinked","setIsLinked","toggleLinked","onLinkedChange","newBorder","undefined","changes","updatedBorders","top","right","bottom","left","filteredResult","onSplitChange","side","cx","classes","BorderBoxControl","linkedControlClassName","LinkedBorderControl","disableUnits"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport {\n\tgetBorderDiff,\n\tgetCommonBorder,\n\tgetSplitBorders,\n\thasMixedBorders,\n\thasSplitBorders,\n\tisCompleteBorder,\n\tisEmptyBorder,\n} from '../utils';\nimport { useContextSystem, WordPressComponentProps } from '../../ui/context';\nimport { useCx } from '../../utils/hooks/use-cx';\n\nimport type { Border } from '../../border-control/types';\nimport type { Borders, BorderSide, BorderBoxControlProps } from '../types';\n\nexport function useBorderBoxControl(\n\tprops: WordPressComponentProps< BorderBoxControlProps, 'div' >\n) {\n\tconst { className, onChange, value, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'BorderBoxControl'\n\t);\n\n\tconst mixedBorders = hasMixedBorders( value );\n\tconst splitBorders = hasSplitBorders( value );\n\n\tconst linkedValue = splitBorders\n\t\t? getCommonBorder( value as Borders | undefined )\n\t\t: ( value as Border );\n\n\tconst splitValue = splitBorders\n\t\t? ( value as Borders )\n\t\t: getSplitBorders( value as Border | undefined );\n\n\t// If no numeric width value is set, the unit select will be disabled.\n\tconst hasWidthValue = ! isNaN( parseFloat( `${ linkedValue?.width }` ) );\n\n\tconst [ isLinked, setIsLinked ] = useState( ! mixedBorders );\n\tconst toggleLinked = () => setIsLinked( ! isLinked );\n\n\tconst onLinkedChange = ( newBorder?: Border ) => {\n\t\tif ( ! newBorder ) {\n\t\t\treturn onChange( undefined );\n\t\t}\n\n\t\t// If we have all props defined on the new border apply it.\n\t\tif ( ! mixedBorders || isCompleteBorder( newBorder ) ) {\n\t\t\treturn onChange(\n\t\t\t\tisEmptyBorder( newBorder ) ? undefined : newBorder\n\t\t\t);\n\t\t}\n\n\t\t// If we had mixed borders we might have had some shared border props\n\t\t// that we need to maintain. For example; we could have mixed borders\n\t\t// with all the same color but different widths. Then from the linked\n\t\t// control we change the color. We should keep the separate widths.\n\t\tconst changes = getBorderDiff(\n\t\t\tlinkedValue as Border,\n\t\t\tnewBorder as Border\n\t\t);\n\t\tconst updatedBorders = {\n\t\t\ttop: { ...( value as Borders )?.top, ...changes },\n\t\t\tright: { ...( value as Borders )?.right, ...changes },\n\t\t\tbottom: { ...( value as Borders )?.bottom, ...changes },\n\t\t\tleft: { ...( value as Borders )?.left, ...changes },\n\t\t};\n\n\t\tif ( hasMixedBorders( updatedBorders ) ) {\n\t\t\treturn onChange( updatedBorders );\n\t\t}\n\n\t\tconst filteredResult = isEmptyBorder( updatedBorders.top )\n\t\t\t? undefined\n\t\t\t: updatedBorders.top;\n\n\t\tonChange( filteredResult );\n\t};\n\n\tconst onSplitChange = (\n\t\tnewBorder: Border | undefined,\n\t\tside: BorderSide\n\t) => {\n\t\tconst updatedBorders = { ...splitValue, [ side ]: newBorder };\n\n\t\tif ( hasMixedBorders( updatedBorders ) ) {\n\t\t\tonChange( updatedBorders );\n\t\t} else {\n\t\t\tonChange( newBorder );\n\t\t}\n\t};\n\n\tconst cx = useCx();\n\tconst classes = useMemo( () => {\n\t\treturn cx( styles.BorderBoxControl, className );\n\t}, [ cx, className ] );\n\n\tconst linkedControlClassName = useMemo( () => {\n\t\treturn cx( styles.LinkedBorderControl );\n\t}, [ cx ] );\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tdisableUnits: mixedBorders && ! hasWidthValue,\n\t\thasMixedBorders: mixedBorders,\n\t\tisLinked,\n\t\tlinkedControlClassName,\n\t\tonLinkedChange,\n\t\tonSplitChange,\n\t\ttoggleLinked,\n\t\tlinkedValue,\n\t\tsplitValue,\n\t};\n}\n"]}
@@ -40,6 +40,7 @@ const UnconnectedBorderControl = (props, forwardedRef) => {
40
40
  const {
41
41
  colors,
42
42
  disableCustomColors,
43
+ disableUnits,
43
44
  enableAlpha,
44
45
  enableStyle = true,
45
46
  hideLabelFromVision,
@@ -94,6 +95,7 @@ const UnconnectedBorderControl = (props, forwardedRef) => {
94
95
  onChange: onWidthChange,
95
96
  value: (border === null || border === void 0 ? void 0 : border.width) || '',
96
97
  placeholder: placeholder,
98
+ disableUnits: disableUnits,
97
99
  __unstableInputWidth: inputWidth
98
100
  }), withSlider && createElement(RangeControl, {
99
101
  label: __('Border width'),
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/border-control/border-control/component.tsx"],"names":["__","BorderControlDropdown","UnitControl","RangeControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderControl","BorderLabel","props","label","hideLabelFromVision","UnconnectedBorderControl","forwardedRef","colors","disableCustomColors","enableAlpha","enableStyle","innerWrapperClassName","inputWidth","onBorderChange","onSliderChange","onWidthChange","placeholder","__unstablePopoverProps","previousStyleSelection","showDropdownHeader","sliderClassName","value","border","widthUnit","widthValue","withSlider","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","__next36pxDefaultSize","otherProps","width","includes","undefined","BorderControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlDropdown from '../border-control-dropdown';\nimport UnitControl from '../../unit-control';\nimport RangeControl from '../../range-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderControl } from './hook';\n\nimport type { BorderControlProps, LabelProps } from '../types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"legend\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel as=\"legend\">{ label }</StyledLabel>\n\t);\n};\n\nconst UnconnectedBorderControl = (\n\tprops: WordPressComponentProps< BorderControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle = true,\n\t\thideLabelFromVision,\n\t\tinnerWrapperClassName,\n\t\tinputWidth,\n\t\tlabel,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tplaceholder,\n\t\t__unstablePopoverProps,\n\t\tpreviousStyleSelection,\n\t\tshowDropdownHeader,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\twithSlider,\n\t\t__experimentalHasMultipleOrigins,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next36pxDefaultSize,\n\t\t...otherProps\n\t} = useBorderControl( props );\n\n\treturn (\n\t\t<View as=\"fieldset\" { ...otherProps } ref={ forwardedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack spacing={ 3 } className={ innerWrapperClassName }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tprefix={\n\t\t\t\t\t\t<BorderControlDropdown\n\t\t\t\t\t\t\tborder={ border }\n\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t__unstablePopoverProps={ __unstablePopoverProps }\n\t\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\t\tpreviousStyleSelection={ previousStyleSelection }\n\t\t\t\t\t\t\tshowDropdownHeader={ showDropdownHeader }\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ onWidthChange }\n\t\t\t\t\tvalue={ border?.width || '' }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t\t__unstableInputWidth={ inputWidth }\n\t\t\t\t/>\n\t\t\t\t{ withSlider && (\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tclassName={ sliderClassName }\n\t\t\t\t\t\tinitialPosition={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ onSliderChange }\n\t\t\t\t\t\tstep={ [ 'px', '%' ].includes( widthUnit ) ? 1 : 0.1 }\n\t\t\t\t\t\tvalue={ widthValue || undefined }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderControl` brings together internal sub-components which allow users to\n * set the various properties of a border. The first sub-component, a\n * `BorderDropdown` contains options representing border color and style. The\n * border width is controlled via a `UnitControl` and an optional `RangeControl`.\n *\n * Border radius is not covered by this control as it may be desired separate to\n * color, style, and width. For example, the border radius may be absorbed under\n * a \"shape\" abstraction.\n *\n * ```jsx\n * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderControl = () => {\n * \tconst [ border, setBorder ] = useState();\n * \tconst onChange = ( newBorder ) => setBorder( newBorder );\n *\n * \treturn (\n * \t\t<BorderControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Border' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ border }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderControl = contextConnect(\n\tUnconnectedBorderControl,\n\t'BorderControl'\n);\n\nexport default BorderControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/border-control/border-control/component.tsx"],"names":["__","BorderControlDropdown","UnitControl","RangeControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderControl","BorderLabel","props","label","hideLabelFromVision","UnconnectedBorderControl","forwardedRef","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","innerWrapperClassName","inputWidth","onBorderChange","onSliderChange","onWidthChange","placeholder","__unstablePopoverProps","previousStyleSelection","showDropdownHeader","sliderClassName","value","border","widthUnit","widthValue","withSlider","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","__next36pxDefaultSize","otherProps","width","includes","undefined","BorderControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BorderControlDropdown from '../border-control-dropdown';\nimport UnitControl from '../../unit-control';\nimport RangeControl from '../../range-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderControl } from './hook';\n\nimport type { BorderControlProps, LabelProps } from '../types';\n\nconst BorderLabel = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"legend\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel as=\"legend\">{ label }</StyledLabel>\n\t);\n};\n\nconst UnconnectedBorderControl = (\n\tprops: WordPressComponentProps< BorderControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle = true,\n\t\thideLabelFromVision,\n\t\tinnerWrapperClassName,\n\t\tinputWidth,\n\t\tlabel,\n\t\tonBorderChange,\n\t\tonSliderChange,\n\t\tonWidthChange,\n\t\tplaceholder,\n\t\t__unstablePopoverProps,\n\t\tpreviousStyleSelection,\n\t\tshowDropdownHeader,\n\t\tsliderClassName,\n\t\tvalue: border,\n\t\twidthUnit,\n\t\twidthValue,\n\t\twithSlider,\n\t\t__experimentalHasMultipleOrigins,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next36pxDefaultSize,\n\t\t...otherProps\n\t} = useBorderControl( props );\n\n\treturn (\n\t\t<View as=\"fieldset\" { ...otherProps } ref={ forwardedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack spacing={ 3 } className={ innerWrapperClassName }>\n\t\t\t\t<UnitControl\n\t\t\t\t\tprefix={\n\t\t\t\t\t\t<BorderControlDropdown\n\t\t\t\t\t\t\tborder={ border }\n\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t__unstablePopoverProps={ __unstablePopoverProps }\n\t\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\t\tonChange={ onBorderChange }\n\t\t\t\t\t\t\tpreviousStyleSelection={ previousStyleSelection }\n\t\t\t\t\t\t\tshowDropdownHeader={ showDropdownHeader }\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t\t/>\n\t\t\t\t\t}\n\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ onWidthChange }\n\t\t\t\t\tvalue={ border?.width || '' }\n\t\t\t\t\tplaceholder={ placeholder }\n\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t__unstableInputWidth={ inputWidth }\n\t\t\t\t/>\n\t\t\t\t{ withSlider && (\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Border width' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\tclassName={ sliderClassName }\n\t\t\t\t\t\tinitialPosition={ 0 }\n\t\t\t\t\t\tmax={ 100 }\n\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\tonChange={ onSliderChange }\n\t\t\t\t\t\tstep={ [ 'px', '%' ].includes( widthUnit ) ? 1 : 0.1 }\n\t\t\t\t\t\tvalue={ widthValue || undefined }\n\t\t\t\t\t\twithInputField={ false }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderControl` brings together internal sub-components which allow users to\n * set the various properties of a border. The first sub-component, a\n * `BorderDropdown` contains options representing border color and style. The\n * border width is controlled via a `UnitControl` and an optional `RangeControl`.\n *\n * Border radius is not covered by this control as it may be desired separate to\n * color, style, and width. For example, the border radius may be absorbed under\n * a \"shape\" abstraction.\n *\n * ```jsx\n * import { __experimentalBorderControl as BorderControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderControl = () => {\n * \tconst [ border, setBorder ] = useState();\n * \tconst onChange = ( newBorder ) => setBorder( newBorder );\n *\n * \treturn (\n * \t\t<BorderControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Border' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ border }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderControl = contextConnect(\n\tUnconnectedBorderControl,\n\t'BorderControl'\n);\n\nexport default BorderControl;\n"]}
@@ -1,15 +1,10 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import { createElement } from "@wordpress/element";
3
3
 
4
- /**
5
- * External dependencies
6
- */
7
-
8
4
  /**
9
5
  * WordPress dependencies
10
6
  */
11
- import { useDisabled } from '@wordpress/compose';
12
- import { createContext, forwardRef } from '@wordpress/element';
7
+ import { createContext } from '@wordpress/element';
13
8
  /**
14
9
  * Internal dependencies
15
10
  */
@@ -20,14 +15,7 @@ const Context = createContext(false);
20
15
  const {
21
16
  Consumer,
22
17
  Provider
23
- } = Context; // Extracting this ContentWrapper component in order to make it more explicit
24
- // the same 'ContentWrapper' component is needed so that React can reconcile
25
- // the dom correctly when switching between disabled/non-disabled (instead
26
- // of thrashing the previous DOM and therefore losing the form fields values).
27
-
28
- const ContentWrapper = forwardRef((props, ref) => createElement("div", _extends({}, props, {
29
- ref: ref
30
- })));
18
+ } = Context;
31
19
  /**
32
20
  * `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.
33
21
  *
@@ -66,20 +54,13 @@ function Disabled(_ref) {
66
54
  isDisabled = true,
67
55
  ...props
68
56
  } = _ref;
69
- const ref = useDisabled();
70
57
  const cx = useCx();
71
-
72
- if (!isDisabled) {
73
- return createElement(Provider, {
74
- value: false
75
- }, createElement(ContentWrapper, null, children));
76
- }
77
-
78
58
  return createElement(Provider, {
79
- value: true
80
- }, createElement(ContentWrapper, _extends({
81
- ref: ref,
82
- className: cx(disabledStyles, className, 'components-disabled')
59
+ value: isDisabled
60
+ }, createElement("div", _extends({
61
+ // @ts-ignore Reason: inert is a recent HTML attribute
62
+ inert: isDisabled ? 'true' : undefined,
63
+ className: isDisabled ? cx(disabledStyles, className, 'components-disabled') : undefined
83
64
  }, props), children));
84
65
  }
85
66
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/disabled/index.tsx"],"names":["useDisabled","createContext","forwardRef","disabledStyles","useCx","Context","Consumer","Provider","ContentWrapper","props","ref","Disabled","className","children","isDisabled","cx"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AACA,SAASC,aAAT,EAAwBC,UAAxB,QAA0C,oBAA1C;AAEA;AACA;AACA;;AACA,SAASC,cAAT,QAA+B,0BAA/B;AAGA,SAASC,KAAT,QAAsB,UAAtB;AAEA,MAAMC,OAAO,GAAGJ,aAAa,CAAa,KAAb,CAA7B;AACA,MAAM;AAAEK,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,IAAyBF,OAA/B,C,CAEA;AACA;AACA;AACA;;AACA,MAAMG,cAAc,GAAGN,UAAU,CAG9B,CAAEO,KAAF,EAASC,GAAT,KAAkB,kCAAUD,KAAV;AAAkB,EAAA,GAAG,EAAGC;AAAxB,GAHY,CAAjC;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,QAAT,OAKqD;AAAA,MALlC;AAClBC,IAAAA,SADkB;AAElBC,IAAAA,QAFkB;AAGlBC,IAAAA,UAAU,GAAG,IAHK;AAIlB,OAAGL;AAJe,GAKkC;AACpD,QAAMC,GAAG,GAAGV,WAAW,EAAvB;AACA,QAAMe,EAAE,GAAGX,KAAK,EAAhB;;AACA,MAAK,CAAEU,UAAP,EAAoB;AACnB,WACC,cAAC,QAAD;AAAU,MAAA,KAAK,EAAG;AAAlB,OACC,cAAC,cAAD,QAAkBD,QAAlB,CADD,CADD;AAKA;;AAED,SACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KACC,cAAC,cAAD;AACC,IAAA,GAAG,EAAGH,GADP;AAEC,IAAA,SAAS,EAAGK,EAAE,CACbZ,cADa,EAEbS,SAFa,EAGb,qBAHa;AAFf,KAOMH,KAPN,GASGI,QATH,CADD,CADD;AAeA;;AAEDF,QAAQ,CAACN,OAAT,GAAmBA,OAAnB;AACAM,QAAQ,CAACL,QAAT,GAAoBA,QAApB;AAEA,eAAeK,QAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { HTMLProps } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useDisabled } from '@wordpress/compose';\nimport { createContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { disabledStyles } from './styles/disabled-styles';\nimport type { DisabledProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\nimport { useCx } from '../utils';\n\nconst Context = createContext< boolean >( false );\nconst { Consumer, Provider } = Context;\n\n// Extracting this ContentWrapper component in order to make it more explicit\n// the same 'ContentWrapper' component is needed so that React can reconcile\n// the dom correctly when switching between disabled/non-disabled (instead\n// of thrashing the previous DOM and therefore losing the form fields values).\nconst ContentWrapper = forwardRef<\n\tHTMLDivElement,\n\tHTMLProps< HTMLDivElement >\n>( ( props, ref ) => <div { ...props } ref={ ref } /> );\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n * \tlet input = <TextControl label=\"Input\" onChange={ () => {} } />;\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled( {\n\tclassName,\n\tchildren,\n\tisDisabled = true,\n\t...props\n}: WordPressComponentProps< DisabledProps, 'div' > ) {\n\tconst ref = useDisabled();\n\tconst cx = useCx();\n\tif ( ! isDisabled ) {\n\t\treturn (\n\t\t\t<Provider value={ false }>\n\t\t\t\t<ContentWrapper>{ children }</ContentWrapper>\n\t\t\t</Provider>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Provider value={ true }>\n\t\t\t<ContentWrapper\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ cx(\n\t\t\t\t\tdisabledStyles,\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-disabled'\n\t\t\t\t) }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</ContentWrapper>\n\t\t</Provider>\n\t);\n}\n\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\n\nexport default Disabled;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/disabled/index.tsx"],"names":["createContext","disabledStyles","useCx","Context","Consumer","Provider","Disabled","className","children","isDisabled","props","cx","undefined"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AAEA;AACA;AACA;;AACA,SAASC,cAAT,QAA+B,0BAA/B;AAGA,SAASC,KAAT,QAAsB,UAAtB;AAEA,MAAMC,OAAO,GAAGH,aAAa,CAAa,KAAb,CAA7B;AACA,MAAM;AAAEI,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,IAAyBF,OAA/B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASG,QAAT,OAKqD;AAAA,MALlC;AAClBC,IAAAA,SADkB;AAElBC,IAAAA,QAFkB;AAGlBC,IAAAA,UAAU,GAAG,IAHK;AAIlB,OAAGC;AAJe,GAKkC;AACpD,QAAMC,EAAE,GAAGT,KAAK,EAAhB;AAEA,SACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAGO;AAAlB,KACC;AACC;AACA,IAAA,KAAK,EAAGA,UAAU,GAAG,MAAH,GAAYG,SAF/B;AAGC,IAAA,SAAS,EACRH,UAAU,GACPE,EAAE,CAAEV,cAAF,EAAkBM,SAAlB,EAA6B,qBAA7B,CADK,GAEPK;AANL,KAQMF,KARN,GAUGF,QAVH,CADD,CADD;AAgBA;;AAEDF,QAAQ,CAACH,OAAT,GAAmBA,OAAnB;AACAG,QAAQ,CAACF,QAAT,GAAoBA,QAApB;AAEA,eAAeE,QAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { disabledStyles } from './styles/disabled-styles';\nimport type { DisabledProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\nimport { useCx } from '../utils';\n\nconst Context = createContext< boolean >( false );\nconst { Consumer, Provider } = Context;\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n * \tlet input = <TextControl label=\"Input\" onChange={ () => {} } />;\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled( {\n\tclassName,\n\tchildren,\n\tisDisabled = true,\n\t...props\n}: WordPressComponentProps< DisabledProps, 'div' > ) {\n\tconst cx = useCx();\n\n\treturn (\n\t\t<Provider value={ isDisabled }>\n\t\t\t<div\n\t\t\t\t// @ts-ignore Reason: inert is a recent HTML attribute\n\t\t\t\tinert={ isDisabled ? 'true' : undefined }\n\t\t\t\tclassName={\n\t\t\t\t\tisDisabled\n\t\t\t\t\t\t? cx( disabledStyles, className, 'components-disabled' )\n\t\t\t\t\t\t: undefined\n\t\t\t\t}\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</Provider>\n\t);\n}\n\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\n\nexport default Disabled;\n"]}