@wordpress/components 19.1.2 → 19.2.1-next.33ec3857e2.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 (418) hide show
  1. package/CHANGELOG.md +53 -4
  2. package/README.md +0 -1
  3. package/build/angle-picker-control/index.js +2 -0
  4. package/build/angle-picker-control/index.js.map +1 -1
  5. package/build/button/index.native.js +13 -3
  6. package/build/button/index.native.js.map +1 -1
  7. package/build/checkbox-control/index.js +1 -1
  8. package/build/checkbox-control/index.js.map +1 -1
  9. package/build/clipboard-button/index.js +1 -2
  10. package/build/clipboard-button/index.js.map +1 -1
  11. package/build/color-palette/index.js +36 -9
  12. package/build/color-palette/index.js.map +1 -1
  13. package/build/color-picker/color-display.js +4 -2
  14. package/build/color-picker/color-display.js.map +1 -1
  15. package/build/color-picker/hex-input.js +3 -1
  16. package/build/color-picker/hex-input.js.map +1 -1
  17. package/build/color-picker/input-with-slider.js +3 -1
  18. package/build/color-picker/input-with-slider.js.map +1 -1
  19. package/build/confirm-dialog/component.js +103 -0
  20. package/build/confirm-dialog/component.js.map +1 -0
  21. package/build/confirm-dialog/index.js +16 -0
  22. package/build/confirm-dialog/index.js.map +1 -0
  23. package/build/confirm-dialog/types.js +6 -0
  24. package/build/confirm-dialog/types.js.map +1 -0
  25. package/build/custom-gradient-bar/constants.js +1 -6
  26. package/build/custom-gradient-bar/constants.js.map +1 -1
  27. package/build/custom-gradient-bar/control-points.js +52 -21
  28. package/build/custom-gradient-bar/control-points.js.map +1 -1
  29. package/build/custom-gradient-bar/index.js +5 -1
  30. package/build/custom-gradient-bar/index.js.map +1 -1
  31. package/build/custom-gradient-picker/index.js +4 -1
  32. package/build/custom-gradient-picker/index.js.map +1 -1
  33. package/build/date-time/date.js +63 -86
  34. package/build/date-time/date.js.map +1 -1
  35. package/build/date-time/utils.js +32 -0
  36. package/build/date-time/utils.js.map +1 -0
  37. package/build/divider/component.js +8 -7
  38. package/build/divider/component.js.map +1 -1
  39. package/build/divider/styles.js +38 -13
  40. package/build/divider/styles.js.map +1 -1
  41. package/build/drop-zone/index.js +14 -6
  42. package/build/drop-zone/index.js.map +1 -1
  43. package/build/drop-zone/provider.js +1 -0
  44. package/build/drop-zone/provider.js.map +1 -1
  45. package/build/flyout/styles.js +2 -2
  46. package/build/flyout/styles.js.map +1 -1
  47. package/build/focusable-iframe/index.js +1 -0
  48. package/build/focusable-iframe/index.js.map +1 -1
  49. package/build/font-size-picker/index.js +10 -9
  50. package/build/font-size-picker/index.js.map +1 -1
  51. package/build/font-size-picker/utils.js +28 -17
  52. package/build/font-size-picker/utils.js.map +1 -1
  53. package/build/gradient-picker/index.js +3 -1
  54. package/build/gradient-picker/index.js.map +1 -1
  55. package/build/higher-order/with-focus-outside/index.js +2 -0
  56. package/build/higher-order/with-focus-outside/index.js.map +1 -1
  57. package/build/index.js +8 -0
  58. package/build/index.js.map +1 -1
  59. package/build/input-control/styles/input-control-styles.js +44 -32
  60. package/build/input-control/styles/input-control-styles.js.map +1 -1
  61. package/build/mobile/bottom-sheet/link-suggestion-item-cell.native.js +10 -3
  62. package/build/mobile/bottom-sheet/link-suggestion-item-cell.native.js.map +1 -1
  63. package/build/mobile/color-settings/index.native.js +4 -2
  64. package/build/mobile/color-settings/index.native.js.map +1 -1
  65. package/build/mobile/color-settings/palette.screen.native.js +7 -6
  66. package/build/mobile/color-settings/palette.screen.native.js.map +1 -1
  67. package/build/mobile/global-styles-context/utils.native.js +1 -1
  68. package/build/mobile/global-styles-context/utils.native.js.map +1 -1
  69. package/build/mobile/gridicons/index.native.js +3 -1
  70. package/build/mobile/gridicons/index.native.js.map +1 -1
  71. package/build/mobile/link-picker/index.native.js +45 -4
  72. package/build/mobile/link-picker/index.native.js.map +1 -1
  73. package/build/mobile/link-settings/index.native.js +10 -0
  74. package/build/mobile/link-settings/index.native.js.map +1 -1
  75. package/build/modal/aria-helper.js +2 -0
  76. package/build/modal/aria-helper.js.map +1 -1
  77. package/build/modal/index.js +17 -8
  78. package/build/modal/index.js.map +1 -1
  79. package/build/palette-edit/index.js +13 -11
  80. package/build/palette-edit/index.js.map +1 -1
  81. package/build/select-control/styles/select-control-styles.js +33 -9
  82. package/build/select-control/styles/select-control-styles.js.map +1 -1
  83. package/build/style-provider/index.js +2 -0
  84. package/build/style-provider/index.js.map +1 -1
  85. package/build/toggle-group-control/toggle-group-control/component.js +7 -2
  86. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  87. package/build/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js +25 -14
  88. package/build/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js.map +1 -1
  89. package/build/toggle-group-control/toggle-group-control-option/styles.js +8 -8
  90. package/build/toggle-group-control/toggle-group-control-option/styles.js.map +1 -1
  91. package/build/tools-panel/styles.js +12 -10
  92. package/build/tools-panel/styles.js.map +1 -1
  93. package/build/tools-panel/tools-panel/component.js +6 -8
  94. package/build/tools-panel/tools-panel/component.js.map +1 -1
  95. package/build/tools-panel/tools-panel/hook.js +48 -17
  96. package/build/tools-panel/tools-panel/hook.js.map +1 -1
  97. package/build/tools-panel/tools-panel-item/hook.js +5 -1
  98. package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
  99. package/build/unit-control/styles/unit-control-styles.js +23 -41
  100. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  101. package/build/z-stack/component.js.map +1 -1
  102. package/build/z-stack/styles.js +10 -8
  103. package/build/z-stack/styles.js.map +1 -1
  104. package/build-module/angle-picker-control/index.js +2 -0
  105. package/build-module/angle-picker-control/index.js.map +1 -1
  106. package/build-module/button/index.native.js +13 -3
  107. package/build-module/button/index.native.js.map +1 -1
  108. package/build-module/checkbox-control/index.js +1 -1
  109. package/build-module/checkbox-control/index.js.map +1 -1
  110. package/build-module/clipboard-button/index.js +1 -2
  111. package/build-module/clipboard-button/index.js.map +1 -1
  112. package/build-module/color-palette/index.js +34 -10
  113. package/build-module/color-palette/index.js.map +1 -1
  114. package/build-module/color-picker/color-display.js +3 -2
  115. package/build-module/color-picker/color-display.js.map +1 -1
  116. package/build-module/color-picker/hex-input.js +2 -1
  117. package/build-module/color-picker/hex-input.js.map +1 -1
  118. package/build-module/color-picker/input-with-slider.js +2 -1
  119. package/build-module/color-picker/input-with-slider.js.map +1 -1
  120. package/build-module/confirm-dialog/component.js +84 -0
  121. package/build-module/confirm-dialog/component.js.map +1 -0
  122. package/build-module/confirm-dialog/index.js +6 -0
  123. package/build-module/confirm-dialog/index.js.map +1 -0
  124. package/build-module/confirm-dialog/types.js +2 -0
  125. package/build-module/confirm-dialog/types.js.map +1 -0
  126. package/build-module/custom-gradient-bar/constants.js +0 -4
  127. package/build-module/custom-gradient-bar/constants.js.map +1 -1
  128. package/build-module/custom-gradient-bar/control-points.js +54 -23
  129. package/build-module/custom-gradient-bar/control-points.js.map +1 -1
  130. package/build-module/custom-gradient-bar/index.js +5 -1
  131. package/build-module/custom-gradient-bar/index.js.map +1 -1
  132. package/build-module/custom-gradient-picker/index.js +4 -1
  133. package/build-module/custom-gradient-picker/index.js.map +1 -1
  134. package/build-module/date-time/date.js +63 -87
  135. package/build-module/date-time/date.js.map +1 -1
  136. package/build-module/date-time/utils.js +20 -0
  137. package/build-module/date-time/utils.js.map +1 -0
  138. package/build-module/divider/component.js +8 -7
  139. package/build-module/divider/component.js.map +1 -1
  140. package/build-module/divider/styles.js +37 -13
  141. package/build-module/divider/styles.js.map +1 -1
  142. package/build-module/drop-zone/index.js +14 -6
  143. package/build-module/drop-zone/index.js.map +1 -1
  144. package/build-module/drop-zone/provider.js +1 -0
  145. package/build-module/drop-zone/provider.js.map +1 -1
  146. package/build-module/flyout/styles.js +2 -2
  147. package/build-module/flyout/styles.js.map +1 -1
  148. package/build-module/focusable-iframe/index.js +1 -0
  149. package/build-module/focusable-iframe/index.js.map +1 -1
  150. package/build-module/font-size-picker/index.js +10 -9
  151. package/build-module/font-size-picker/index.js.map +1 -1
  152. package/build-module/font-size-picker/utils.js +28 -17
  153. package/build-module/font-size-picker/utils.js.map +1 -1
  154. package/build-module/gradient-picker/index.js +3 -1
  155. package/build-module/gradient-picker/index.js.map +1 -1
  156. package/build-module/higher-order/with-focus-outside/index.js +1 -0
  157. package/build-module/higher-order/with-focus-outside/index.js.map +1 -1
  158. package/build-module/index.js +1 -0
  159. package/build-module/index.js.map +1 -1
  160. package/build-module/input-control/styles/input-control-styles.js +44 -32
  161. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  162. package/build-module/mobile/bottom-sheet/link-suggestion-item-cell.native.js +10 -4
  163. package/build-module/mobile/bottom-sheet/link-suggestion-item-cell.native.js.map +1 -1
  164. package/build-module/mobile/color-settings/index.native.js +4 -2
  165. package/build-module/mobile/color-settings/index.native.js.map +1 -1
  166. package/build-module/mobile/color-settings/palette.screen.native.js +7 -6
  167. package/build-module/mobile/color-settings/palette.screen.native.js.map +1 -1
  168. package/build-module/mobile/global-styles-context/utils.native.js +1 -1
  169. package/build-module/mobile/global-styles-context/utils.native.js.map +1 -1
  170. package/build-module/mobile/gridicons/index.native.js +1 -0
  171. package/build-module/mobile/gridicons/index.native.js.map +1 -1
  172. package/build-module/mobile/link-picker/index.native.js +50 -8
  173. package/build-module/mobile/link-picker/index.native.js.map +1 -1
  174. package/build-module/mobile/link-settings/index.native.js +10 -0
  175. package/build-module/mobile/link-settings/index.native.js.map +1 -1
  176. package/build-module/modal/aria-helper.js +2 -0
  177. package/build-module/modal/aria-helper.js.map +1 -1
  178. package/build-module/modal/index.js +15 -8
  179. package/build-module/modal/index.js.map +1 -1
  180. package/build-module/palette-edit/index.js +13 -11
  181. package/build-module/palette-edit/index.js.map +1 -1
  182. package/build-module/select-control/styles/select-control-styles.js +33 -9
  183. package/build-module/select-control/styles/select-control-styles.js.map +1 -1
  184. package/build-module/style-provider/index.js +1 -0
  185. package/build-module/style-provider/index.js.map +1 -1
  186. package/build-module/toggle-group-control/toggle-group-control/component.js +8 -3
  187. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  188. package/build-module/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js +25 -14
  189. package/build-module/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js.map +1 -1
  190. package/build-module/toggle-group-control/toggle-group-control-option/styles.js +8 -8
  191. package/build-module/toggle-group-control/toggle-group-control-option/styles.js.map +1 -1
  192. package/build-module/tools-panel/styles.js +12 -11
  193. package/build-module/tools-panel/styles.js.map +1 -1
  194. package/build-module/tools-panel/tools-panel/component.js +5 -8
  195. package/build-module/tools-panel/tools-panel/component.js.map +1 -1
  196. package/build-module/tools-panel/tools-panel/hook.js +48 -17
  197. package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
  198. package/build-module/tools-panel/tools-panel-item/hook.js +5 -1
  199. package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
  200. package/build-module/unit-control/styles/unit-control-styles.js +23 -41
  201. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  202. package/build-module/z-stack/component.js.map +1 -1
  203. package/build-module/z-stack/styles.js +13 -8
  204. package/build-module/z-stack/styles.js.map +1 -1
  205. package/build-style/style-rtl.css +34 -12
  206. package/build-style/style.css +34 -12
  207. package/build-types/base-field/hook.d.ts +16 -16
  208. package/build-types/card/card/hook.d.ts +16 -16
  209. package/build-types/card/card-body/hook.d.ts +16 -16
  210. package/build-types/card/card-divider/hook.d.ts +18 -18
  211. package/build-types/card/card-footer/hook.d.ts +17 -17
  212. package/build-types/card/card-header/hook.d.ts +16 -16
  213. package/build-types/card/card-media/hook.d.ts +16 -16
  214. package/build-types/divider/component.d.ts +8 -7
  215. package/build-types/divider/component.d.ts.map +1 -1
  216. package/build-types/divider/styles.d.ts +2 -2
  217. package/build-types/divider/styles.d.ts.map +1 -1
  218. package/build-types/divider/types.d.ts +5 -5
  219. package/build-types/divider/types.d.ts.map +1 -1
  220. package/build-types/elevation/hook.d.ts +15 -15
  221. package/build-types/flex/flex/hook.d.ts +16 -16
  222. package/build-types/flex/flex-block/hook.d.ts +16 -16
  223. package/build-types/flex/flex-item/hook.d.ts +16 -16
  224. package/build-types/flyout/flyout/hook.d.ts +17 -17
  225. package/build-types/flyout/styles.d.ts +7 -9
  226. package/build-types/flyout/styles.d.ts.map +1 -1
  227. package/build-types/grid/hook.d.ts +16 -16
  228. package/build-types/h-stack/hook.d.ts +16 -16
  229. package/build-types/heading/hook.d.ts +16 -16
  230. package/build-types/input-control/index.d.ts +1 -1
  231. package/build-types/input-control/index.d.ts.map +1 -1
  232. package/build-types/input-control/input-field.d.ts +1 -1
  233. package/build-types/input-control/input-field.d.ts.map +1 -1
  234. package/build-types/input-control/styles/input-control-styles.d.ts +1 -2
  235. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  236. package/build-types/input-control/types.d.ts +2 -1
  237. package/build-types/input-control/types.d.ts.map +1 -1
  238. package/build-types/item-group/item/hook.d.ts +16 -16
  239. package/build-types/item-group/item-group/hook.d.ts +16 -16
  240. package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
  241. package/build-types/scrollable/hook.d.ts +16 -16
  242. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  243. package/build-types/select-control/types.d.ts +1 -1
  244. package/build-types/select-control/types.d.ts.map +1 -1
  245. package/build-types/spacer/hook.d.ts +16 -16
  246. package/build-types/surface/hook.d.ts +16 -16
  247. package/build-types/text/hook.d.ts +16 -16
  248. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  249. package/build-types/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.d.ts.map +1 -1
  250. package/build-types/toggle-group-control/toggle-group-control-option/styles.d.ts.map +1 -1
  251. package/build-types/tools-panel/styles.d.ts.map +1 -1
  252. package/build-types/tools-panel/tools-panel/component.d.ts.map +1 -1
  253. package/build-types/tools-panel/tools-panel/hook.d.ts +16 -16
  254. package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
  255. package/build-types/tools-panel/tools-panel-header/hook.d.ts +16 -16
  256. package/build-types/tools-panel/tools-panel-item/hook.d.ts +16 -16
  257. package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
  258. package/build-types/tools-panel/types.d.ts +2 -1
  259. package/build-types/tools-panel/types.d.ts.map +1 -1
  260. package/build-types/truncate/hook.d.ts +16 -16
  261. package/build-types/ui/control-group/hook.d.ts +18 -18
  262. package/build-types/ui/control-label/hook.d.ts +16 -16
  263. package/build-types/ui/form-group/form-group.d.ts +4 -4
  264. package/build-types/ui/form-group/use-form-group.d.ts +55 -55
  265. package/build-types/unit-control/index.d.ts +1 -1
  266. package/build-types/unit-control/index.d.ts.map +1 -1
  267. package/build-types/unit-control/styles/unit-control-styles.d.ts +1 -0
  268. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  269. package/build-types/unit-control/types.d.ts +2 -2
  270. package/build-types/unit-control/types.d.ts.map +1 -1
  271. package/build-types/v-stack/hook.d.ts +16 -16
  272. package/build-types/z-stack/component.d.ts +1 -1
  273. package/build-types/z-stack/styles.d.ts.map +1 -1
  274. package/package.json +21 -23
  275. package/src/alignment-matrix-control/stories/index.js +1 -1
  276. package/src/angle-picker-control/index.js +2 -0
  277. package/src/base-control/stories/index.js +1 -1
  278. package/src/button/index.native.js +15 -1
  279. package/src/button/stories/index.js +1 -1
  280. package/src/button/style.scss +14 -0
  281. package/src/card/card/README.md +3 -3
  282. package/src/card/stories/index.js +1 -1
  283. package/src/card/test/__snapshots__/index.js.snap +6 -6
  284. package/src/checkbox-control/index.js +1 -1
  285. package/src/checkbox-control/stories/index.js +1 -1
  286. package/src/clipboard-button/index.js +1 -2
  287. package/src/color-indicator/stories/index.js +1 -1
  288. package/src/color-indicator/style.scss +5 -8
  289. package/src/color-palette/index.js +37 -9
  290. package/src/color-palette/stories/index.js +1 -1
  291. package/src/color-palette/style.scss +10 -1
  292. package/src/color-palette/test/__snapshots__/index.js.snap +30 -21
  293. package/src/color-picker/color-display.tsx +3 -2
  294. package/src/color-picker/hex-input.tsx +2 -1
  295. package/src/color-picker/input-with-slider.tsx +2 -1
  296. package/src/color-picker/stories/index.js +1 -1
  297. package/src/combobox-control/README.md +2 -2
  298. package/src/confirm-dialog/README.md +128 -0
  299. package/src/confirm-dialog/component.tsx +114 -0
  300. package/src/confirm-dialog/index.tsx +6 -0
  301. package/src/confirm-dialog/stories/index.js +120 -0
  302. package/src/confirm-dialog/test/index.js +302 -0
  303. package/src/confirm-dialog/types.ts +26 -0
  304. package/src/custom-gradient-bar/constants.js +0 -5
  305. package/src/custom-gradient-bar/control-points.js +40 -9
  306. package/src/custom-gradient-bar/index.js +8 -0
  307. package/src/custom-gradient-picker/index.js +9 -1
  308. package/src/custom-gradient-picker/style.scss +0 -4
  309. package/src/date-time/README.md +7 -0
  310. package/src/date-time/date.js +67 -84
  311. package/src/date-time/stories/index.js +1 -1
  312. package/src/date-time/stories/time.js +1 -1
  313. package/src/date-time/test/date.js +3 -29
  314. package/src/date-time/test/utils.js +32 -0
  315. package/src/date-time/utils.js +18 -0
  316. package/src/dimension-control/README.md +1 -1
  317. package/src/divider/README.md +33 -5
  318. package/src/divider/component.tsx +8 -7
  319. package/src/divider/stories/index.js +43 -17
  320. package/src/divider/styles.ts +53 -16
  321. package/src/divider/test/__snapshots__/index.js.snap +11 -11
  322. package/src/divider/test/index.js +4 -4
  323. package/src/divider/types.ts +5 -5
  324. package/src/drop-zone/index.js +14 -6
  325. package/src/drop-zone/provider.js +1 -0
  326. package/src/dropdown-menu/stories/index.js +1 -1
  327. package/src/duotone-picker/README.md +1 -1
  328. package/src/elevation/stories/index.js +1 -1
  329. package/src/external-link/stories/index.js +1 -1
  330. package/src/flyout/styles.ts +4 -2
  331. package/src/focusable-iframe/index.js +1 -0
  332. package/src/font-size-picker/index.js +27 -13
  333. package/src/font-size-picker/stories/index.js +63 -1
  334. package/src/font-size-picker/test/index.js +87 -0
  335. package/src/font-size-picker/test/util.js +74 -0
  336. package/src/font-size-picker/utils.js +31 -17
  337. package/src/form-token-field/stories/index.js +1 -1
  338. package/src/gradient-picker/index.js +4 -0
  339. package/src/gradient-picker/stories/index.js +1 -1
  340. package/src/grid/stories/index.js +1 -1
  341. package/src/guide/stories/index.js +1 -1
  342. package/src/higher-order/with-focus-outside/index.js +2 -0
  343. package/src/icon/stories/index.js +1 -1
  344. package/src/index.js +1 -0
  345. package/src/input-control/stories/index.js +2 -1
  346. package/src/input-control/styles/input-control-styles.tsx +16 -6
  347. package/src/input-control/types.ts +3 -1
  348. package/src/item-group/stories/index.js +84 -2
  349. package/src/menu-item/README.md +2 -2
  350. package/src/mobile/bottom-sheet/link-suggestion-item-cell.native.js +6 -2
  351. package/src/mobile/color-settings/index.native.js +2 -0
  352. package/src/mobile/color-settings/palette.screen.native.js +8 -5
  353. package/src/mobile/color-settings/style.native.scss +1 -1
  354. package/src/mobile/global-styles-context/utils.native.js +1 -1
  355. package/src/mobile/gridicons/index.native.js +3 -3
  356. package/src/mobile/inserter-button/style.native.scss +1 -0
  357. package/src/mobile/link-picker/index.native.js +41 -7
  358. package/src/mobile/link-settings/index.native.js +11 -0
  359. package/src/mobile/link-settings/test/edit.native.js +432 -0
  360. package/src/modal/README.md +10 -0
  361. package/src/modal/aria-helper.js +2 -0
  362. package/src/modal/index.js +72 -55
  363. package/src/modal/stories/index.js +6 -1
  364. package/src/modal/style.scss +9 -0
  365. package/src/modal/test/index.js +11 -0
  366. package/src/navigation/README.md +0 -9
  367. package/src/notice/stories/index.js +1 -1
  368. package/src/number-control/stories/index.js +1 -1
  369. package/src/palette-edit/index.js +15 -16
  370. package/src/palette-edit/style.scss +5 -0
  371. package/src/panel/stories/index.js +1 -1
  372. package/src/placeholder/stories/index.js +1 -1
  373. package/src/popover/stories/index.js +1 -1
  374. package/src/query-controls/README.md +138 -6
  375. package/src/radio-group/README.md +4 -1
  376. package/src/range-control/stories/index.js +1 -1
  377. package/src/resizable-box/stories/index.js +1 -1
  378. package/src/scrollable/stories/index.js +1 -1
  379. package/src/search-control/stories/index.js +1 -1
  380. package/src/select-control/stories/index.js +2 -1
  381. package/src/select-control/styles/select-control-styles.ts +25 -2
  382. package/src/select-control/types.ts +1 -1
  383. package/src/slot-fill/stories/index.js +1 -1
  384. package/src/snackbar/stories/index.js +1 -1
  385. package/src/spacer/stories/index.js +1 -1
  386. package/src/style-provider/index.js +2 -0
  387. package/src/surface/stories/index.js +1 -1
  388. package/src/tab-panel/stories/index.js +1 -1
  389. package/src/text-control/stories/index.js +1 -1
  390. package/src/text-highlight/stories/index.js +1 -1
  391. package/src/textarea-control/stories/index.js +1 -1
  392. package/src/tip/stories/index.js +1 -1
  393. package/src/toggle-control/stories/index.js +1 -1
  394. package/src/toggle-group-control/stories/index.js +1 -1
  395. package/src/toggle-group-control/toggle-group-control/component.tsx +7 -2
  396. package/src/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.tsx +24 -9
  397. package/src/toggle-group-control/toggle-group-control-option/styles.ts +3 -0
  398. package/src/toolbar-button/stories/index.js +1 -1
  399. package/src/tools-panel/stories/index.js +237 -0
  400. package/src/tools-panel/styles.ts +41 -1
  401. package/src/tools-panel/test/index.js +234 -1
  402. package/src/tools-panel/tools-panel/README.md +9 -0
  403. package/src/tools-panel/tools-panel/component.tsx +2 -5
  404. package/src/tools-panel/tools-panel/hook.ts +50 -18
  405. package/src/tools-panel/tools-panel-item/hook.ts +5 -1
  406. package/src/tools-panel/types.ts +5 -1
  407. package/src/tooltip/stories/index.js +1 -1
  408. package/src/tree-select/stories/index.js +1 -1
  409. package/src/truncate/stories/index.js +1 -1
  410. package/src/unit-control/stories/index.js +19 -1
  411. package/src/unit-control/styles/unit-control-styles.ts +33 -46
  412. package/src/unit-control/types.ts +5 -2
  413. package/src/z-stack/README.md +1 -1
  414. package/src/z-stack/component.tsx +1 -1
  415. package/src/z-stack/stories/index.js +1 -1
  416. package/src/z-stack/styles.ts +7 -2
  417. package/tsconfig.json +6 -2
  418. package/tsconfig.tsbuildinfo +1 -1
@@ -17,6 +17,8 @@ var _DayPickerSingleDateController = _interopRequireDefault(require("react-dates
17
17
 
18
18
  var _i18n = require("@wordpress/i18n");
19
19
 
20
+ var _utils = require("./utils");
21
+
20
22
  /**
21
23
  * External dependencies
22
24
  */
@@ -27,6 +29,10 @@ var _i18n = require("@wordpress/i18n");
27
29
  * WordPress dependencies
28
30
  */
29
31
 
32
+ /**
33
+ * Internal dependencies
34
+ */
35
+
30
36
  /**
31
37
  * Module Constants
32
38
  */
@@ -77,20 +83,20 @@ function DatePickerDay(_ref) {
77
83
  }, day.format('D'));
78
84
  }
79
85
 
80
- class DatePicker extends _element.Component {
81
- constructor() {
82
- super(...arguments);
83
- this.onChangeMoment = this.onChangeMoment.bind(this);
84
- this.nodeRef = (0, _element.createRef)();
85
- this.onMonthPreviewedHandler = this.onMonthPreviewedHandler.bind(this);
86
- }
87
-
88
- onMonthPreviewedHandler(newMonthDate) {
89
- var _this$props$onMonthPr, _this$props;
90
-
91
- (_this$props$onMonthPr = (_this$props = this.props).onMonthPreviewed) === null || _this$props$onMonthPr === void 0 ? void 0 : _this$props$onMonthPr.call(_this$props, newMonthDate.toISOString());
92
- this.keepFocusInside();
93
- }
86
+ function DatePicker(_ref2) {
87
+ let {
88
+ currentDate,
89
+ onChange,
90
+ events,
91
+ isInvalidDate,
92
+ onMonthPreviewed
93
+ } = _ref2;
94
+ const nodeRef = (0, _element.useRef)();
95
+
96
+ const onMonthPreviewedHandler = newMonthDate => {
97
+ onMonthPreviewed === null || onMonthPreviewed === void 0 ? void 0 : onMonthPreviewed(newMonthDate.toISOString());
98
+ keepFocusInside();
99
+ };
94
100
  /*
95
101
  * Todo: We should remove this function ASAP.
96
102
  * It is kept because focus is lost when we click on the previous and next month buttons.
@@ -99,21 +105,21 @@ class DatePicker extends _element.Component {
99
105
  */
100
106
 
101
107
 
102
- keepFocusInside() {
103
- if (!this.nodeRef.current) {
108
+ const keepFocusInside = () => {
109
+ if (!nodeRef.current) {
104
110
  return;
105
111
  }
106
112
 
107
113
  const {
108
114
  ownerDocument
109
- } = this.nodeRef.current;
115
+ } = nodeRef.current;
110
116
  const {
111
117
  activeElement
112
118
  } = ownerDocument; // If focus was lost.
113
119
 
114
- if (!activeElement || !this.nodeRef.current.contains(ownerDocument.activeElement)) {
120
+ if (!activeElement || !nodeRef.current.contains(ownerDocument.activeElement)) {
115
121
  // Retrieve the focus region div.
116
- const focusRegion = this.nodeRef.current.querySelector('.DayPicker_focusRegion');
122
+ const focusRegion = nodeRef.current.querySelector('.DayPicker_focusRegion');
117
123
 
118
124
  if (!focusRegion) {
119
125
  return;
@@ -122,14 +128,10 @@ class DatePicker extends _element.Component {
122
128
 
123
129
  focusRegion.focus();
124
130
  }
125
- }
126
-
127
- onChangeMoment(newDate) {
128
- const {
129
- currentDate,
130
- onChange
131
- } = this.props; // If currentDate is null, use now as momentTime to designate hours, minutes, seconds.
131
+ };
132
132
 
133
+ const onChangeMoment = newDate => {
134
+ // If currentDate is null, use now as momentTime to designate hours, minutes, seconds.
133
135
  const momentDate = currentDate ? (0, _moment.default)(currentDate) : (0, _moment.default)();
134
136
  const momentTime = {
135
137
  hours: momentDate.hours(),
@@ -138,71 +140,46 @@ class DatePicker extends _element.Component {
138
140
  };
139
141
  onChange(newDate.set(momentTime).format(TIMEZONELESS_FORMAT)); // Keep focus on the date picker.
140
142
 
141
- this.keepFocusInside();
142
- }
143
- /**
144
- * Create a Moment object from a date string. With no currentDate supplied, default to a Moment
145
- * object representing now. If a null value is passed, return a null value.
146
- *
147
- * @param {?string} currentDate Date representing the currently selected date or null to signify no selection.
148
- * @return {?moment.Moment} Moment object for selected date or null.
149
- */
143
+ keepFocusInside();
144
+ };
150
145
 
151
-
152
- getMomentDate(currentDate) {
153
- if (null === currentDate) {
154
- return null;
155
- }
156
-
157
- return currentDate ? (0, _moment.default)(currentDate) : (0, _moment.default)();
158
- }
159
-
160
- getEventsPerDay(day) {
161
- var _this$props$events;
162
-
163
- if (!((_this$props$events = this.props.events) !== null && _this$props$events !== void 0 && _this$props$events.length)) {
146
+ const getEventsPerDay = day => {
147
+ if (!(events !== null && events !== void 0 && events.length)) {
164
148
  return [];
165
149
  }
166
150
 
167
- return this.props.events.filter(eventDay => day.isSame(eventDay.date, 'day'));
168
- }
169
-
170
- render() {
171
- const {
172
- currentDate,
173
- isInvalidDate
174
- } = this.props;
175
- const momentDate = this.getMomentDate(currentDate);
176
- return (0, _element.createElement)("div", {
177
- className: "components-datetime__date",
178
- ref: this.nodeRef
179
- }, (0, _element.createElement)(_DayPickerSingleDateController.default, {
180
- date: momentDate,
181
- daySize: 30,
182
- focused: true,
183
- hideKeyboardShortcutsPanel: true // This is a hack to force the calendar to update on month or year change
184
- // https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665
185
- ,
186
- key: `datepicker-controller-${momentDate ? momentDate.format('MM-YYYY') : 'null'}`,
187
- noBorder: true,
188
- numberOfMonths: 1,
189
- onDateChange: this.onChangeMoment,
190
- transitionDuration: 0,
191
- weekDayFormat: "ddd",
192
- dayAriaLabelFormat: ARIAL_LABEL_TIME_FORMAT,
193
- isRTL: (0, _i18n.isRTL)(),
194
- isOutsideRange: date => {
195
- return isInvalidDate && isInvalidDate(date.toDate());
196
- },
197
- onPrevMonthClick: this.onMonthPreviewedHandler,
198
- onNextMonthClick: this.onMonthPreviewedHandler,
199
- renderDayContents: day => (0, _element.createElement)(DatePickerDay, {
200
- day: day,
201
- events: this.getEventsPerDay(day)
202
- })
203
- }));
204
- }
151
+ return events.filter(eventDay => day.isSame(eventDay.date, 'day'));
152
+ };
205
153
 
154
+ const momentDate = (0, _utils.getMomentDate)(currentDate);
155
+ return (0, _element.createElement)("div", {
156
+ className: "components-datetime__date",
157
+ ref: nodeRef
158
+ }, (0, _element.createElement)(_DayPickerSingleDateController.default, {
159
+ date: momentDate,
160
+ daySize: 30,
161
+ focused: true,
162
+ hideKeyboardShortcutsPanel: true // This is a hack to force the calendar to update on month or year change
163
+ // https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665
164
+ ,
165
+ key: `datepicker-controller-${momentDate ? momentDate.format('MM-YYYY') : 'null'}`,
166
+ noBorder: true,
167
+ numberOfMonths: 1,
168
+ onDateChange: onChangeMoment,
169
+ transitionDuration: 0,
170
+ weekDayFormat: "ddd",
171
+ dayAriaLabelFormat: ARIAL_LABEL_TIME_FORMAT,
172
+ isRTL: (0, _i18n.isRTL)(),
173
+ isOutsideRange: date => {
174
+ return isInvalidDate && isInvalidDate(date.toDate());
175
+ },
176
+ onPrevMonthClick: onMonthPreviewedHandler,
177
+ onNextMonthClick: onMonthPreviewedHandler,
178
+ renderDayContents: day => (0, _element.createElement)(DatePickerDay, {
179
+ day: day,
180
+ events: getEventsPerDay(day)
181
+ })
182
+ }));
206
183
  }
207
184
 
208
185
  var _default = DatePicker;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/date-time/date.js"],"names":["TIMEZONELESS_FORMAT","ARIAL_LABEL_TIME_FORMAT","DatePickerDay","day","events","ref","current","parentNode","dayAriaLabel","format","length","setAttribute","dayWithEventsDescription","DatePicker","Component","constructor","arguments","onChangeMoment","bind","nodeRef","onMonthPreviewedHandler","newMonthDate","props","onMonthPreviewed","toISOString","keepFocusInside","ownerDocument","activeElement","contains","focusRegion","querySelector","focus","newDate","currentDate","onChange","momentDate","momentTime","hours","minutes","seconds","set","getMomentDate","getEventsPerDay","filter","eventDay","isSame","date","render","isInvalidDate","toDate"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport moment from 'moment';\nimport classnames from 'classnames';\n\n// react-dates doesn't tree-shake correctly, so we import from the individual\n// component here, to avoid including too much of the library\nimport DayPickerSingleDateController from 'react-dates/lib/components/DayPickerSingleDateController';\n\n/**\n * WordPress dependencies\n */\nimport { Component, createRef, useEffect, useRef } from '@wordpress/element';\nimport { isRTL, _n, sprintf } from '@wordpress/i18n';\n\n/**\n * Module Constants\n */\nconst TIMEZONELESS_FORMAT = 'YYYY-MM-DDTHH:mm:ss';\nconst ARIAL_LABEL_TIME_FORMAT = 'dddd, LL';\n\nfunction DatePickerDay( { day, events = [] } ) {\n\tconst ref = useRef();\n\n\t/*\n\t * a11y hack to make the `There is/are n events` string\n\t * available speaking for readers,\n\t * re-defining the aria-label attribute.\n\t * This attribute is handled by the react-dates component.\n\t */\n\tuseEffect( () => {\n\t\t// Bail when no parent node.\n\t\tif ( ! ref?.current?.parentNode ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { parentNode } = ref.current;\n\t\tconst dayAriaLabel = moment( day ).format( ARIAL_LABEL_TIME_FORMAT );\n\n\t\tif ( ! events.length ) {\n\t\t\t// Set aria-label without event description.\n\t\t\tparentNode.setAttribute( 'aria-label', dayAriaLabel );\n\t\t\treturn;\n\t\t}\n\n\t\tconst dayWithEventsDescription = sprintf(\n\t\t\t// translators: 1: Calendar day format, 2: Calendar event number.\n\t\t\t_n(\n\t\t\t\t'%1$s. There is %2$d event.',\n\t\t\t\t'%1$s. There are %2$d events.',\n\t\t\t\tevents.length\n\t\t\t),\n\t\t\tdayAriaLabel,\n\t\t\tevents.length\n\t\t);\n\n\t\tparentNode.setAttribute( 'aria-label', dayWithEventsDescription );\n\t}, [ events.length ] );\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ classnames( 'components-datetime__date__day', {\n\t\t\t\t'has-events': events?.length,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ day.format( 'D' ) }\n\t\t</div>\n\t);\n}\n\nclass DatePicker extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\n\t\tthis.onChangeMoment = this.onChangeMoment.bind( this );\n\t\tthis.nodeRef = createRef();\n\t\tthis.onMonthPreviewedHandler = this.onMonthPreviewedHandler.bind(\n\t\t\tthis\n\t\t);\n\t}\n\n\tonMonthPreviewedHandler( newMonthDate ) {\n\t\tthis.props.onMonthPreviewed?.( newMonthDate.toISOString() );\n\t\tthis.keepFocusInside();\n\t}\n\n\t/*\n\t * Todo: We should remove this function ASAP.\n\t * It is kept because focus is lost when we click on the previous and next month buttons.\n\t * This focus loss closes the date picker popover.\n\t * Ideally we should add an upstream commit on react-dates to fix this issue.\n\t */\n\tkeepFocusInside() {\n\t\tif ( ! this.nodeRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = this.nodeRef.current;\n\t\tconst { activeElement } = ownerDocument;\n\n\t\t// If focus was lost.\n\t\tif (\n\t\t\t! activeElement ||\n\t\t\t! this.nodeRef.current.contains( ownerDocument.activeElement )\n\t\t) {\n\t\t\t// Retrieve the focus region div.\n\t\t\tconst focusRegion = this.nodeRef.current.querySelector(\n\t\t\t\t'.DayPicker_focusRegion'\n\t\t\t);\n\t\t\tif ( ! focusRegion ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// Keep the focus on focus region.\n\t\t\tfocusRegion.focus();\n\t\t}\n\t}\n\n\tonChangeMoment( newDate ) {\n\t\tconst { currentDate, onChange } = this.props;\n\n\t\t// If currentDate is null, use now as momentTime to designate hours, minutes, seconds.\n\t\tconst momentDate = currentDate ? moment( currentDate ) : moment();\n\t\tconst momentTime = {\n\t\t\thours: momentDate.hours(),\n\t\t\tminutes: momentDate.minutes(),\n\t\t\tseconds: 0,\n\t\t};\n\n\t\tonChange( newDate.set( momentTime ).format( TIMEZONELESS_FORMAT ) );\n\n\t\t// Keep focus on the date picker.\n\t\tthis.keepFocusInside();\n\t}\n\n\t/**\n\t * Create a Moment object from a date string. With no currentDate supplied, default to a Moment\n\t * object representing now. If a null value is passed, return a null value.\n\t *\n\t * @param {?string} currentDate Date representing the currently selected date or null to signify no selection.\n\t * @return {?moment.Moment} Moment object for selected date or null.\n\t */\n\tgetMomentDate( currentDate ) {\n\t\tif ( null === currentDate ) {\n\t\t\treturn null;\n\t\t}\n\t\treturn currentDate ? moment( currentDate ) : moment();\n\t}\n\n\tgetEventsPerDay( day ) {\n\t\tif ( ! this.props.events?.length ) {\n\t\t\treturn [];\n\t\t}\n\n\t\treturn this.props.events.filter( ( eventDay ) =>\n\t\t\tday.isSame( eventDay.date, 'day' )\n\t\t);\n\t}\n\n\trender() {\n\t\tconst { currentDate, isInvalidDate } = this.props;\n\t\tconst momentDate = this.getMomentDate( currentDate );\n\n\t\treturn (\n\t\t\t<div className=\"components-datetime__date\" ref={ this.nodeRef }>\n\t\t\t\t<DayPickerSingleDateController\n\t\t\t\t\tdate={ momentDate }\n\t\t\t\t\tdaySize={ 30 }\n\t\t\t\t\tfocused\n\t\t\t\t\thideKeyboardShortcutsPanel\n\t\t\t\t\t// This is a hack to force the calendar to update on month or year change\n\t\t\t\t\t// https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665\n\t\t\t\t\tkey={ `datepicker-controller-${\n\t\t\t\t\t\tmomentDate ? momentDate.format( 'MM-YYYY' ) : 'null'\n\t\t\t\t\t}` }\n\t\t\t\t\tnoBorder\n\t\t\t\t\tnumberOfMonths={ 1 }\n\t\t\t\t\tonDateChange={ this.onChangeMoment }\n\t\t\t\t\ttransitionDuration={ 0 }\n\t\t\t\t\tweekDayFormat=\"ddd\"\n\t\t\t\t\tdayAriaLabelFormat={ ARIAL_LABEL_TIME_FORMAT }\n\t\t\t\t\tisRTL={ isRTL() }\n\t\t\t\t\tisOutsideRange={ ( date ) => {\n\t\t\t\t\t\treturn isInvalidDate && isInvalidDate( date.toDate() );\n\t\t\t\t\t} }\n\t\t\t\t\tonPrevMonthClick={ this.onMonthPreviewedHandler }\n\t\t\t\t\tonNextMonthClick={ this.onMonthPreviewedHandler }\n\t\t\t\t\trenderDayContents={ ( day ) => (\n\t\t\t\t\t\t<DatePickerDay\n\t\t\t\t\t\t\tday={ day }\n\t\t\t\t\t\t\tevents={ this.getEventsPerDay( day ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n}\n\nexport default DatePicker;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/date-time/date.js"],"names":["TIMEZONELESS_FORMAT","ARIAL_LABEL_TIME_FORMAT","DatePickerDay","day","events","ref","current","parentNode","dayAriaLabel","format","length","setAttribute","dayWithEventsDescription","DatePicker","currentDate","onChange","isInvalidDate","onMonthPreviewed","nodeRef","onMonthPreviewedHandler","newMonthDate","toISOString","keepFocusInside","ownerDocument","activeElement","contains","focusRegion","querySelector","focus","onChangeMoment","newDate","momentDate","momentTime","hours","minutes","seconds","set","getEventsPerDay","filter","eventDay","isSame","date","toDate"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport moment from 'moment';\nimport classnames from 'classnames';\n\n// react-dates doesn't tree-shake correctly, so we import from the individual\n// component here, to avoid including too much of the library\nimport DayPickerSingleDateController from 'react-dates/lib/components/DayPickerSingleDateController';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { isRTL, _n, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { getMomentDate } from './utils';\n\n/**\n * Module Constants\n */\nconst TIMEZONELESS_FORMAT = 'YYYY-MM-DDTHH:mm:ss';\nconst ARIAL_LABEL_TIME_FORMAT = 'dddd, LL';\n\nfunction DatePickerDay( { day, events = [] } ) {\n\tconst ref = useRef();\n\n\t/*\n\t * a11y hack to make the `There is/are n events` string\n\t * available speaking for readers,\n\t * re-defining the aria-label attribute.\n\t * This attribute is handled by the react-dates component.\n\t */\n\tuseEffect( () => {\n\t\t// Bail when no parent node.\n\t\tif ( ! ref?.current?.parentNode ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { parentNode } = ref.current;\n\t\tconst dayAriaLabel = moment( day ).format( ARIAL_LABEL_TIME_FORMAT );\n\n\t\tif ( ! events.length ) {\n\t\t\t// Set aria-label without event description.\n\t\t\tparentNode.setAttribute( 'aria-label', dayAriaLabel );\n\t\t\treturn;\n\t\t}\n\n\t\tconst dayWithEventsDescription = sprintf(\n\t\t\t// translators: 1: Calendar day format, 2: Calendar event number.\n\t\t\t_n(\n\t\t\t\t'%1$s. There is %2$d event.',\n\t\t\t\t'%1$s. There are %2$d events.',\n\t\t\t\tevents.length\n\t\t\t),\n\t\t\tdayAriaLabel,\n\t\t\tevents.length\n\t\t);\n\n\t\tparentNode.setAttribute( 'aria-label', dayWithEventsDescription );\n\t}, [ events.length ] );\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ classnames( 'components-datetime__date__day', {\n\t\t\t\t'has-events': events?.length,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ day.format( 'D' ) }\n\t\t</div>\n\t);\n}\n\nfunction DatePicker( {\n\tcurrentDate,\n\tonChange,\n\tevents,\n\tisInvalidDate,\n\tonMonthPreviewed,\n} ) {\n\tconst nodeRef = useRef();\n\tconst onMonthPreviewedHandler = ( newMonthDate ) => {\n\t\tonMonthPreviewed?.( newMonthDate.toISOString() );\n\t\tkeepFocusInside();\n\t};\n\n\t/*\n\t * Todo: We should remove this function ASAP.\n\t * It is kept because focus is lost when we click on the previous and next month buttons.\n\t * This focus loss closes the date picker popover.\n\t * Ideally we should add an upstream commit on react-dates to fix this issue.\n\t */\n\tconst keepFocusInside = () => {\n\t\tif ( ! nodeRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = nodeRef.current;\n\t\tconst { activeElement } = ownerDocument;\n\n\t\t// If focus was lost.\n\t\tif (\n\t\t\t! activeElement ||\n\t\t\t! nodeRef.current.contains( ownerDocument.activeElement )\n\t\t) {\n\t\t\t// Retrieve the focus region div.\n\t\t\tconst focusRegion = nodeRef.current.querySelector(\n\t\t\t\t'.DayPicker_focusRegion'\n\t\t\t);\n\t\t\tif ( ! focusRegion ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// Keep the focus on focus region.\n\t\t\tfocusRegion.focus();\n\t\t}\n\t};\n\n\tconst onChangeMoment = ( newDate ) => {\n\t\t// If currentDate is null, use now as momentTime to designate hours, minutes, seconds.\n\t\tconst momentDate = currentDate ? moment( currentDate ) : moment();\n\t\tconst momentTime = {\n\t\t\thours: momentDate.hours(),\n\t\t\tminutes: momentDate.minutes(),\n\t\t\tseconds: 0,\n\t\t};\n\n\t\tonChange( newDate.set( momentTime ).format( TIMEZONELESS_FORMAT ) );\n\n\t\t// Keep focus on the date picker.\n\t\tkeepFocusInside();\n\t};\n\n\tconst getEventsPerDay = ( day ) => {\n\t\tif ( ! events?.length ) {\n\t\t\treturn [];\n\t\t}\n\n\t\treturn events.filter( ( eventDay ) =>\n\t\t\tday.isSame( eventDay.date, 'day' )\n\t\t);\n\t};\n\n\tconst momentDate = getMomentDate( currentDate );\n\n\treturn (\n\t\t<div className=\"components-datetime__date\" ref={ nodeRef }>\n\t\t\t<DayPickerSingleDateController\n\t\t\t\tdate={ momentDate }\n\t\t\t\tdaySize={ 30 }\n\t\t\t\tfocused\n\t\t\t\thideKeyboardShortcutsPanel\n\t\t\t\t// This is a hack to force the calendar to update on month or year change\n\t\t\t\t// https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665\n\t\t\t\tkey={ `datepicker-controller-${\n\t\t\t\t\tmomentDate ? momentDate.format( 'MM-YYYY' ) : 'null'\n\t\t\t\t}` }\n\t\t\t\tnoBorder\n\t\t\t\tnumberOfMonths={ 1 }\n\t\t\t\tonDateChange={ onChangeMoment }\n\t\t\t\ttransitionDuration={ 0 }\n\t\t\t\tweekDayFormat=\"ddd\"\n\t\t\t\tdayAriaLabelFormat={ ARIAL_LABEL_TIME_FORMAT }\n\t\t\t\tisRTL={ isRTL() }\n\t\t\t\tisOutsideRange={ ( date ) => {\n\t\t\t\t\treturn isInvalidDate && isInvalidDate( date.toDate() );\n\t\t\t\t} }\n\t\t\t\tonPrevMonthClick={ onMonthPreviewedHandler }\n\t\t\t\tonNextMonthClick={ onMonthPreviewedHandler }\n\t\t\t\trenderDayContents={ ( day ) => (\n\t\t\t\t\t<DatePickerDay\n\t\t\t\t\t\tday={ day }\n\t\t\t\t\t\tevents={ getEventsPerDay( day ) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default DatePicker;\n"]}
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.getMomentDate = void 0;
9
+
10
+ var _moment = _interopRequireDefault(require("moment"));
11
+
12
+ /**
13
+ * External dependencies
14
+ */
15
+
16
+ /**
17
+ * Create a Moment object from a date string. With no date supplied, default to a Moment
18
+ * object representing now. If a null value is passed, return a null value.
19
+ *
20
+ * @param {?string} date Date representing the currently selected date or null to signify no selection.
21
+ * @return {?moment.Moment} Moment object for selected date or null.
22
+ */
23
+ const getMomentDate = date => {
24
+ if (null === date) {
25
+ return null;
26
+ }
27
+
28
+ return date ? (0, _moment.default)(date) : (0, _moment.default)();
29
+ };
30
+
31
+ exports.getMomentDate = getMomentDate;
32
+ //# sourceMappingURL=utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["@wordpress/components/src/date-time/utils.js"],"names":["getMomentDate","date"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,aAAa,GAAKC,IAAF,IAAY;AACxC,MAAK,SAASA,IAAd,EAAqB;AACpB,WAAO,IAAP;AACA;;AACD,SAAOA,IAAI,GAAG,qBAAQA,IAAR,CAAH,GAAoB,sBAA/B;AACA,CALM","sourcesContent":["/**\n * External dependencies\n */\nimport moment from 'moment';\n\n/**\n * Create a Moment object from a date string. With no date supplied, default to a Moment\n * object representing now. If a null value is passed, return a null value.\n *\n * @param {?string} date Date representing the currently selected date or null to signify no selection.\n * @return {?moment.Moment} Moment object for selected date or null.\n */\nexport const getMomentDate = ( date ) => {\n\tif ( null === date ) {\n\t\treturn null;\n\t}\n\treturn date ? moment( date ) : moment();\n};\n"]}
@@ -39,17 +39,18 @@ function Divider(props, forwardedRef) {
39
39
  * @example
40
40
  * ```js
41
41
  * import {
42
- * __experimentalDivider as Divider,
43
- * __experimentalText as Text }
44
- * from `@wordpress/components`;
42
+ * __experimentalDivider as Divider,
43
+ * __experimentalText as Text,
44
+ * __experimentalVStack as VStack,
45
+ * } from `@wordpress/components`;
45
46
  *
46
47
  * function Example() {
47
48
  * return (
48
- * <ListGroup>
49
- * <FormGroup>...</FormGroup>
49
+ * <VStack spacing={4}>
50
+ * <Text>Some text here</Text>
50
51
  * <Divider />
51
- * <FormGroup>...</FormGroup>
52
- * </ListGroup>
52
+ * <Text>Some more text here</Text>
53
+ * </VStack>
53
54
  * );
54
55
  * }
55
56
  * ```
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/divider/component.tsx"],"names":["Divider","props","forwardedRef","contextProps","DividerView","ConnectedDivider"],"mappings":";;;;;;;;;;;;;AAIA;;AAOA;;AAKA;;AAhBA;AACA;AACA;AACA;;AAKA;AACA;AACA;AASA,SAASA,OAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,YAAY,GAAG,+BAAkBF,KAAlB,EAAyB,SAAzB,CAArB;AAEA,SACC,4BAAC,iBAAD;AACC,IAAA,EAAE,EAAGG;AADN,KAEMD,YAFN;AAGC,IAAA,GAAG,EAAGD;AAHP,KADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMG,gBAAgB,GAAG,6BAAgBL,OAAhB,EAAyB,SAAzB,CAAzB;eAEeK,gB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport { Separator } from 'reakit';\n// eslint-disable-next-line no-restricted-imports\nimport type { Ref } from 'react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { DividerView } from './styles';\nimport type { Props } from './types';\n\nfunction Divider(\n\tprops: WordPressComponentProps< Props, 'hr', false >,\n\tforwardedRef: Ref< any >\n) {\n\tconst contextProps = useContextSystem( props, 'Divider' );\n\n\treturn (\n\t\t<Separator\n\t\t\tas={ DividerView }\n\t\t\t{ ...contextProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n}\n\n/**\n * `Divider` is a layout component that separates groups of related content.\n *\n * @example\n * ```js\n * import {\n * __experimentalDivider as Divider,\n * __experimentalText as Text }\n * from `@wordpress/components`;\n *\n * function Example() {\n * \treturn (\n * \t\t<ListGroup>\n * \t\t\t<FormGroup>...</FormGroup>\n * \t\t\t<Divider />\n * \t\t\t<FormGroup>...</FormGroup>\n * \t\t</ListGroup>\n * \t);\n * }\n * ```\n */\nconst ConnectedDivider = contextConnect( Divider, 'Divider' );\n\nexport default ConnectedDivider;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/divider/component.tsx"],"names":["Divider","props","forwardedRef","contextProps","DividerView","ConnectedDivider"],"mappings":";;;;;;;;;;;;;AAIA;;AAOA;;AAKA;;AAhBA;AACA;AACA;AACA;;AAKA;AACA;AACA;AASA,SAASA,OAAT,CACCC,KADD,EAECC,YAFD,EAGE;AACD,QAAMC,YAAY,GAAG,+BAAkBF,KAAlB,EAAyB,SAAzB,CAArB;AAEA,SACC,4BAAC,iBAAD;AACC,IAAA,EAAE,EAAGG;AADN,KAEMD,YAFN;AAGC,IAAA,GAAG,EAAGD;AAHP,KADD;AAOA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMG,gBAAgB,GAAG,6BAAgBL,OAAhB,EAAyB,SAAzB,CAAzB;eAEeK,gB","sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport { Separator } from 'reakit';\n// eslint-disable-next-line no-restricted-imports\nimport type { Ref } from 'react';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../ui/context';\nimport { DividerView } from './styles';\nimport type { Props } from './types';\n\nfunction Divider(\n\tprops: WordPressComponentProps< Props, 'hr', false >,\n\tforwardedRef: Ref< any >\n) {\n\tconst contextProps = useContextSystem( props, 'Divider' );\n\n\treturn (\n\t\t<Separator\n\t\t\tas={ DividerView }\n\t\t\t{ ...contextProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n}\n\n/**\n * `Divider` is a layout component that separates groups of related content.\n *\n * @example\n * ```js\n * import {\n * \t\t__experimentalDivider as Divider,\n * \t\t__experimentalText as Text,\n * \t\t__experimentalVStack as VStack,\n * } from `@wordpress/components`;\n *\n * function Example() {\n * \treturn (\n * \t\t<VStack spacing={4}>\n * \t\t\t<Text>Some text here</Text>\n * \t\t\t<Divider />\n * \t\t\t<Text>Some more text here</Text>\n * \t\t</VStack>\n * \t);\n * }\n * ```\n */\nconst ConnectedDivider = contextConnect( Divider, 'Divider' );\n\nexport default ConnectedDivider;\n"]}
@@ -13,7 +13,7 @@ var _react = require("@emotion/react");
13
13
 
14
14
  var _space = require("../ui/utils/space");
15
15
 
16
- var _configValues = _interopRequireDefault(require("../utils/config-values"));
16
+ var _utils = require("../utils");
17
17
 
18
18
  /**
19
19
  * External dependencies
@@ -22,24 +22,49 @@ var _configValues = _interopRequireDefault(require("../utils/config-values"));
22
22
  /**
23
23
  * Internal dependencies
24
24
  */
25
+ const MARGIN_DIRECTIONS = {
26
+ vertical: {
27
+ start: 'marginLeft',
28
+ end: 'marginRight'
29
+ },
30
+ horizontal: {
31
+ start: 'marginTop',
32
+ end: 'marginBottom'
33
+ }
34
+ }; // Renders the correct margins given the Divider's `orientation` and the writing direction.
35
+ // When both the generic `margin` and the specific `marginStart|marginEnd` props are defined,
36
+ // the latter will take priority.
37
+
25
38
  const renderMargin = _ref => {
26
39
  let {
40
+ 'aria-orientation': orientation = 'horizontal',
27
41
  margin,
28
- marginTop,
29
- marginBottom
42
+ marginStart,
43
+ marginEnd
30
44
  } = _ref;
45
+ return /*#__PURE__*/(0, _react.css)((0, _utils.rtl)({
46
+ [MARGIN_DIRECTIONS[orientation].start]: (0, _space.space)(marginStart !== null && marginStart !== void 0 ? marginStart : margin),
47
+ [MARGIN_DIRECTIONS[orientation].end]: (0, _space.space)(marginEnd !== null && marginEnd !== void 0 ? marginEnd : margin)
48
+ })(), process.env.NODE_ENV === "production" ? "" : ";label:renderMargin;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0NDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyQm9yZGVyIH1cblx0JHsgcmVuZGVyU2l6ZSB9XG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */");
49
+ };
31
50
 
32
- if (typeof margin !== 'undefined') {
33
- return /*#__PURE__*/(0, _react.css)({
34
- marginBottom: (0, _space.space)(margin),
35
- marginTop: (0, _space.space)(margin)
36
- }, process.env.NODE_ENV === "production" ? "" : ";label:renderMargin;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZVMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9kaXZpZGVyL3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi91aS91dGlscy9zcGFjZSc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuaW1wb3J0IHR5cGUgeyBPd25Qcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHsgbWFyZ2luLCBtYXJnaW5Ub3AsIG1hcmdpbkJvdHRvbSB9OiBPd25Qcm9wcyApID0+IHtcblx0aWYgKCB0eXBlb2YgbWFyZ2luICE9PSAndW5kZWZpbmVkJyApIHtcblx0XHRyZXR1cm4gY3NzKCB7XG5cdFx0XHRtYXJnaW5Cb3R0b206IHNwYWNlKCBtYXJnaW4gKSxcblx0XHRcdG1hcmdpblRvcDogc3BhY2UoIG1hcmdpbiApLFxuXHRcdH0gKTtcblx0fVxuXG5cdHJldHVybiBjc3MoIHtcblx0XHRtYXJnaW5Ub3A6IHNwYWNlKCBtYXJnaW5Ub3AgKSxcblx0XHRtYXJnaW5Cb3R0b206IHNwYWNlKCBtYXJnaW5Cb3R0b20gKSxcblx0fSApO1xufTtcblxuZXhwb3J0IGNvbnN0IERpdmlkZXJWaWV3ID0gc3R5bGVkLmhyPCBPd25Qcm9wcyA+YFxuXHRib3JkZXItY29sb3I6ICR7IENPTkZJRy5jb2xvckRpdmlkZXIgfTtcblx0Ym9yZGVyLXdpZHRoOiAwIDAgMXB4IDA7XG5cdGhlaWdodDogMDtcblx0bWFyZ2luOiAwO1xuXHR3aWR0aDogYXV0bztcblxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */");
37
- }
51
+ const renderBorder = _ref2 => {
52
+ let {
53
+ 'aria-orientation': orientation = 'horizontal'
54
+ } = _ref2;
55
+ return /*#__PURE__*/(0, _react.css)({
56
+ [orientation === 'vertical' ? 'borderRight' : 'borderBottom']: '1px solid currentColor'
57
+ }, process.env.NODE_ENV === "production" ? "" : ";label:renderBorder;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0RRIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyQm9yZGVyIH1cblx0JHsgcmVuZGVyU2l6ZSB9XG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */");
58
+ };
38
59
 
60
+ const renderSize = _ref3 => {
61
+ let {
62
+ 'aria-orientation': orientation = 'horizontal'
63
+ } = _ref3;
39
64
  return /*#__PURE__*/(0, _react.css)({
40
- marginTop: (0, _space.space)(marginTop),
41
- marginBottom: (0, _space.space)(marginBottom)
42
- }, process.env.NODE_ENV === "production" ? "" : ";label:renderMargin;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBcUJRIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IENPTkZJRyBmcm9tICcuLi91dGlscy9jb25maWctdmFsdWVzJztcbmltcG9ydCB0eXBlIHsgT3duUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgcmVuZGVyTWFyZ2luID0gKCB7IG1hcmdpbiwgbWFyZ2luVG9wLCBtYXJnaW5Cb3R0b20gfTogT3duUHJvcHMgKSA9PiB7XG5cdGlmICggdHlwZW9mIG1hcmdpbiAhPT0gJ3VuZGVmaW5lZCcgKSB7XG5cdFx0cmV0dXJuIGNzcygge1xuXHRcdFx0bWFyZ2luQm90dG9tOiBzcGFjZSggbWFyZ2luICksXG5cdFx0XHRtYXJnaW5Ub3A6IHNwYWNlKCBtYXJnaW4gKSxcblx0XHR9ICk7XG5cdH1cblxuXHRyZXR1cm4gY3NzKCB7XG5cdFx0bWFyZ2luVG9wOiBzcGFjZSggbWFyZ2luVG9wICksXG5cdFx0bWFyZ2luQm90dG9tOiBzcGFjZSggbWFyZ2luQm90dG9tICksXG5cdH0gKTtcbn07XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgT3duUHJvcHMgPmBcblx0Ym9yZGVyLWNvbG9yOiAkeyBDT05GSUcuY29sb3JEaXZpZGVyIH07XG5cdGJvcmRlci13aWR0aDogMCAwIDFweCAwO1xuXHRoZWlnaHQ6IDA7XG5cdG1hcmdpbjogMDtcblx0d2lkdGg6IGF1dG87XG5cblx0JHsgcmVuZGVyTWFyZ2luIH1cbmA7XG4iXX0= */");
65
+ height: orientation === 'vertical' ? 'auto' : 0,
66
+ width: orientation === 'vertical' ? 0 : 'auto'
67
+ }, process.env.NODE_ENV === "production" ? "" : ";label:renderSize;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNERDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyQm9yZGVyIH1cblx0JHsgcmVuZGVyU2l6ZSB9XG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */");
43
68
  };
44
69
 
45
70
  const DividerView = (0, _base.default)("hr", process.env.NODE_ENV === "production" ? {
@@ -47,6 +72,6 @@ const DividerView = (0, _base.default)("hr", process.env.NODE_ENV === "productio
47
72
  } : {
48
73
  target: "e19on6iw0",
49
74
  label: "DividerView"
50
- })("border-color:", _configValues.default.colorDivider, ";border-width:0 0 1px 0;height:0;margin:0;width:auto;", renderMargin, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMkJnRCIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2RpdmlkZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5pbXBvcnQgdHlwZSB7IE93blByb3BzIH0gZnJvbSAnLi90eXBlcyc7XG5cbmNvbnN0IHJlbmRlck1hcmdpbiA9ICggeyBtYXJnaW4sIG1hcmdpblRvcCwgbWFyZ2luQm90dG9tIH06IE93blByb3BzICkgPT4ge1xuXHRpZiAoIHR5cGVvZiBtYXJnaW4gIT09ICd1bmRlZmluZWQnICkge1xuXHRcdHJldHVybiBjc3MoIHtcblx0XHRcdG1hcmdpbkJvdHRvbTogc3BhY2UoIG1hcmdpbiApLFxuXHRcdFx0bWFyZ2luVG9wOiBzcGFjZSggbWFyZ2luICksXG5cdFx0fSApO1xuXHR9XG5cblx0cmV0dXJuIGNzcygge1xuXHRcdG1hcmdpblRvcDogc3BhY2UoIG1hcmdpblRvcCApLFxuXHRcdG1hcmdpbkJvdHRvbTogc3BhY2UoIG1hcmdpbkJvdHRvbSApLFxuXHR9ICk7XG59O1xuXG5leHBvcnQgY29uc3QgRGl2aWRlclZpZXcgPSBzdHlsZWQuaHI8IE93blByb3BzID5gXG5cdGJvcmRlci1jb2xvcjogJHsgQ09ORklHLmNvbG9yRGl2aWRlciB9O1xuXHRib3JkZXItd2lkdGg6IDAgMCAxcHggMDtcblx0aGVpZ2h0OiAwO1xuXHRtYXJnaW46IDA7XG5cdHdpZHRoOiBhdXRvO1xuXG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */"));
75
+ })("border:0;margin:0;", renderBorder, " ", renderSize, " ", renderMargin, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUU2QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2RpdmlkZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCB7IHJ0bCB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHsgUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgTUFSR0lOX0RJUkVDVElPTlM6IFJlY29yZDxcblx0Tm9uTnVsbGFibGU8IFByb3BzWyAnb3JpZW50YXRpb24nIF0gPixcblx0UmVjb3JkPCAnc3RhcnQnIHwgJ2VuZCcsIHN0cmluZyA+XG4+ID0ge1xuXHR2ZXJ0aWNhbDoge1xuXHRcdHN0YXJ0OiAnbWFyZ2luTGVmdCcsXG5cdFx0ZW5kOiAnbWFyZ2luUmlnaHQnLFxuXHR9LFxuXHRob3Jpem9udGFsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5Ub3AnLFxuXHRcdGVuZDogJ21hcmdpbkJvdHRvbScsXG5cdH0sXG59O1xuXG4vLyBSZW5kZXJzIHRoZSBjb3JyZWN0IG1hcmdpbnMgZ2l2ZW4gdGhlIERpdmlkZXIncyBgb3JpZW50YXRpb25gIGFuZCB0aGUgd3JpdGluZyBkaXJlY3Rpb24uXG4vLyBXaGVuIGJvdGggdGhlIGdlbmVyaWMgYG1hcmdpbmAgYW5kIHRoZSBzcGVjaWZpYyBgbWFyZ2luU3RhcnR8bWFyZ2luRW5kYCBwcm9wcyBhcmUgZGVmaW5lZCxcbi8vIHRoZSBsYXR0ZXIgd2lsbCB0YWtlIHByaW9yaXR5LlxuY29uc3QgcmVuZGVyTWFyZ2luID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG5cdG1hcmdpbixcblx0bWFyZ2luU3RhcnQsXG5cdG1hcmdpbkVuZCxcbn06IFByb3BzICkgPT5cblx0Y3NzKFxuXHRcdHJ0bCgge1xuXHRcdFx0WyBNQVJHSU5fRElSRUNUSU9OU1sgb3JpZW50YXRpb24gXS5zdGFydCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luU3RhcnQgPz8gbWFyZ2luXG5cdFx0XHQpLFxuXHRcdFx0WyBNQVJHSU5fRElSRUNUSU9OU1sgb3JpZW50YXRpb24gXS5lbmQgXTogc3BhY2UoXG5cdFx0XHRcdG1hcmdpbkVuZCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0fSApKClcblx0KTtcblxuY29uc3QgcmVuZGVyQm9yZGVyID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIGNzcygge1xuXHRcdFsgb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCdcblx0XHRcdD8gJ2JvcmRlclJpZ2h0J1xuXHRcdFx0OiAnYm9yZGVyQm90dG9tJyBdOiAnMXB4IHNvbGlkIGN1cnJlbnRDb2xvcicsXG5cdH0gKTtcbn07XG5cbmNvbnN0IHJlbmRlclNpemUgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT5cblx0Y3NzKCB7XG5cdFx0aGVpZ2h0OiBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/ICdhdXRvJyA6IDAsXG5cdFx0d2lkdGg6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gMCA6ICdhdXRvJyxcblx0fSApO1xuXG5leHBvcnQgY29uc3QgRGl2aWRlclZpZXcgPSBzdHlsZWQuaHI8IFByb3BzID5gXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXG5cdCR7IHJlbmRlckJvcmRlciB9XG5cdCR7IHJlbmRlclNpemUgfVxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */"));
51
76
  exports.DividerView = DividerView;
52
77
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/divider/styles.ts"],"names":["renderMargin","margin","marginTop","marginBottom","DividerView","CONFIG","colorDivider"],"mappings":";;;;;;;;;;;AAIA;;AAKA;;AACA;;AAVA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,YAAY,GAAG,QAAqD;AAAA,MAAnD;AAAEC,IAAAA,MAAF;AAAUC,IAAAA,SAAV;AAAqBC,IAAAA;AAArB,GAAmD;;AACzE,MAAK,OAAOF,MAAP,KAAkB,WAAvB,EAAqC;AACpC,wBAAO,gBAAK;AACXE,MAAAA,YAAY,EAAE,kBAAOF,MAAP,CADH;AAEXC,MAAAA,SAAS,EAAE,kBAAOD,MAAP;AAFA,KAAL,s+CAAP;AAIA;;AAED,sBAAO,gBAAK;AACXC,IAAAA,SAAS,EAAE,kBAAOA,SAAP,CADA;AAEXC,IAAAA,YAAY,EAAE,kBAAOA,YAAP;AAFH,GAAL,s+CAAP;AAIA,CAZD;;AAcO,MAAMC,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,oBACNC,sBAAOC,YADD,2DAOpBN,YAPoB,y6CAAjB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport CONFIG from '../utils/config-values';\nimport type { OwnProps } from './types';\n\nconst renderMargin = ( { margin, marginTop, marginBottom }: OwnProps ) => {\n\tif ( typeof margin !== 'undefined' ) {\n\t\treturn css( {\n\t\t\tmarginBottom: space( margin ),\n\t\t\tmarginTop: space( margin ),\n\t\t} );\n\t}\n\n\treturn css( {\n\t\tmarginTop: space( marginTop ),\n\t\tmarginBottom: space( marginBottom ),\n\t} );\n};\n\nexport const DividerView = styled.hr< OwnProps >`\n\tborder-color: ${ CONFIG.colorDivider };\n\tborder-width: 0 0 1px 0;\n\theight: 0;\n\tmargin: 0;\n\twidth: auto;\n\n\t${ renderMargin }\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/divider/styles.ts"],"names":["MARGIN_DIRECTIONS","vertical","start","end","horizontal","renderMargin","orientation","margin","marginStart","marginEnd","renderBorder","renderSize","height","width","DividerView"],"mappings":";;;;;;;;;;;AAIA;;AAKA;;AACA;;AAVA;AACA;AACA;;AAIA;AACA;AACA;AAKA,MAAMA,iBAGL,GAAG;AACHC,EAAAA,QAAQ,EAAE;AACTC,IAAAA,KAAK,EAAE,YADE;AAETC,IAAAA,GAAG,EAAE;AAFI,GADP;AAKHC,EAAAA,UAAU,EAAE;AACXF,IAAAA,KAAK,EAAE,WADI;AAEXC,IAAAA,GAAG,EAAE;AAFM;AALT,CAHJ,C,CAcA;AACA;AACA;;AACA,MAAME,YAAY,GAAG;AAAA,MAAE;AACtB,wBAAoBC,WAAW,GAAG,YADZ;AAEtBC,IAAAA,MAFsB;AAGtBC,IAAAA,WAHsB;AAItBC,IAAAA;AAJsB,GAAF;AAAA,sBAMpB,gBACC,gBAAK;AACJ,KAAET,iBAAiB,CAAEM,WAAF,CAAjB,CAAiCJ,KAAnC,GAA4C,kBAC3CM,WAD2C,aAC3CA,WAD2C,cAC3CA,WAD2C,GAC5BD,MAD4B,CADxC;AAIJ,KAAEP,iBAAiB,CAAEM,WAAF,CAAjB,CAAiCH,GAAnC,GAA0C,kBACzCM,SADyC,aACzCA,SADyC,cACzCA,SADyC,GAC5BF,MAD4B;AAJtC,GAAL,GADD,kqFANoB;AAAA,CAArB;;AAiBA,MAAMG,YAAY,GAAG,SAEP;AAAA,MAFS;AACtB,wBAAoBJ,WAAW,GAAG;AADZ,GAET;AACb,sBAAO,gBAAK;AACX,KAAEA,WAAW,KAAK,UAAhB,GACC,aADD,GAEC,cAFH,GAEqB;AAHV,GAAL,kqFAAP;AAKA,CARD;;AAUA,MAAMK,UAAU,GAAG;AAAA,MAAE;AACpB,wBAAoBL,WAAW,GAAG;AADd,GAAF;AAAA,sBAGlB,gBAAK;AACJM,IAAAA,MAAM,EAAEN,WAAW,KAAK,UAAhB,GAA6B,MAA7B,GAAsC,CAD1C;AAEJO,IAAAA,KAAK,EAAEP,WAAW,KAAK,UAAhB,GAA6B,CAA7B,GAAiC;AAFpC,GAAL,gqFAHkB;AAAA,CAAnB;;AAQO,MAAMQ,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,yBAIpBJ,YAJoB,OAKpBC,UALoB,OAMpBN,YANoB,ymFAAjB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { rtl } from '../utils';\nimport type { Props } from './types';\n\nconst MARGIN_DIRECTIONS: Record<\n\tNonNullable< Props[ 'orientation' ] >,\n\tRecord< 'start' | 'end', string >\n> = {\n\tvertical: {\n\t\tstart: 'marginLeft',\n\t\tend: 'marginRight',\n\t},\n\thorizontal: {\n\t\tstart: 'marginTop',\n\t\tend: 'marginBottom',\n\t},\n};\n\n// Renders the correct margins given the Divider's `orientation` and the writing direction.\n// When both the generic `margin` and the specific `marginStart|marginEnd` props are defined,\n// the latter will take priority.\nconst renderMargin = ( {\n\t'aria-orientation': orientation = 'horizontal',\n\tmargin,\n\tmarginStart,\n\tmarginEnd,\n}: Props ) =>\n\tcss(\n\t\trtl( {\n\t\t\t[ MARGIN_DIRECTIONS[ orientation ].start ]: space(\n\t\t\t\tmarginStart ?? margin\n\t\t\t),\n\t\t\t[ MARGIN_DIRECTIONS[ orientation ].end ]: space(\n\t\t\t\tmarginEnd ?? margin\n\t\t\t),\n\t\t} )()\n\t);\n\nconst renderBorder = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) => {\n\treturn css( {\n\t\t[ orientation === 'vertical'\n\t\t\t? 'borderRight'\n\t\t\t: 'borderBottom' ]: '1px solid currentColor',\n\t} );\n};\n\nconst renderSize = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) =>\n\tcss( {\n\t\theight: orientation === 'vertical' ? 'auto' : 0,\n\t\twidth: orientation === 'vertical' ? 0 : 'auto',\n\t} );\n\nexport const DividerView = styled.hr< Props >`\n\tborder: 0;\n\tmargin: 0;\n\n\t${ renderBorder }\n\t${ renderSize }\n\t${ renderMargin }\n`;\n"]}
@@ -49,11 +49,15 @@ function DropZoneComponent(_ref) {
49
49
  onDrop(event) {
50
50
  const files = (0, _dom.getFilesFromDataTransfer)(event.dataTransfer);
51
51
  const html = event.dataTransfer.getData('text/html');
52
+ /**
53
+ * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
54
+ * The order of the checks is important to recognise the HTML drop.
55
+ */
52
56
 
53
- if (files.length && onFilesDrop) {
54
- onFilesDrop(files);
55
- } else if (html && onHTMLDrop) {
57
+ if (html && onHTMLDrop) {
56
58
  onHTMLDrop(html);
59
+ } else if (files.length && onFilesDrop) {
60
+ onFilesDrop(files);
57
61
  } else if (onDrop) {
58
62
  onDrop(event);
59
63
  }
@@ -62,13 +66,17 @@ function DropZoneComponent(_ref) {
62
66
  onDragStart(event) {
63
67
  setIsDraggingOverDocument(true);
64
68
  let _type = 'default';
69
+ /**
70
+ * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
71
+ * The order of the checks is important to recognise the HTML drop.
72
+ */
65
73
 
66
- if ( // Check for the types because sometimes the files themselves
74
+ if ((0, _lodash.includes)(event.dataTransfer.types, 'text/html')) {
75
+ _type = 'html';
76
+ } else if ( // Check for the types because sometimes the files themselves
67
77
  // are only available on drop.
68
78
  (0, _lodash.includes)(event.dataTransfer.types, 'Files') || (0, _dom.getFilesFromDataTransfer)(event.dataTransfer).length > 0) {
69
79
  _type = 'file';
70
- } else if ((0, _lodash.includes)(event.dataTransfer.types, 'text/html')) {
71
- _type = 'html';
72
80
  }
73
81
 
74
82
  setType(_type);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/drop-zone/index.js"],"names":["DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","isDraggingOverDocument","setIsDraggingOverDocument","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","event","files","dataTransfer","html","getData","length","onDragStart","_type","types","onDragEnd","onDragEnter","onDragLeave","disableMotion","children","backdrop","hidden","scaleY","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","upload","classes"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { includes } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\n\nexport default function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n} ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] = useState();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] = useState();\n\tconst [ type, setType ] = useState();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = getFilesFromDataTransfer( event.dataTransfer );\n\t\t\tconst html = event.dataTransfer.getData( 'text/html' );\n\n\t\t\tif ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type = 'default';\n\n\t\t\tif (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tincludes( event.dataTransfer.types, 'Files' ) ||\n\t\t\t\tgetFilesFromDataTransfer( event.dataTransfer ).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t} else if ( includes( event.dataTransfer.types, 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType();\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\n\tconst backdrop = {\n\t\thidden: { scaleY: 0, opacity: 0 },\n\t\tshow: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0.1,\n\t\t\t\tdelayChildren: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.75 },\n\t\tshow: { opacity: 1, scale: 1 },\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument || isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) ||\n\t\t\t\t( type === 'html' && onHTMLDrop ) ||\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/drop-zone/index.js"],"names":["DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","isDraggingOverDocument","setIsDraggingOverDocument","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","event","files","dataTransfer","html","getData","length","onDragStart","_type","types","onDragEnd","onDragEnter","onDragLeave","disableMotion","children","backdrop","hidden","scaleY","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","upload","classes"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { includes } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\n\nexport default function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n} ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] = useState();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] = useState();\n\tconst [ type, setType ] = useState();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = getFilesFromDataTransfer( event.dataTransfer );\n\t\t\tconst html = event.dataTransfer.getData( 'text/html' );\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type = 'default';\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( includes( event.dataTransfer.types, 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tincludes( event.dataTransfer.types, 'Files' ) ||\n\t\t\t\tgetFilesFromDataTransfer( event.dataTransfer ).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType();\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\n\tconst backdrop = {\n\t\thidden: { scaleY: 0, opacity: 0 },\n\t\tshow: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0.1,\n\t\t\t\tdelayChildren: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.75 },\n\t\tshow: { opacity: 1, scale: 1 },\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument || isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) ||\n\t\t\t\t( type === 'html' && onHTMLDrop ) ||\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"]}
@@ -17,6 +17,7 @@ function DropZoneProvider(_ref) {
17
17
  children
18
18
  } = _ref;
19
19
  (0, _deprecated.default)('wp.components.DropZoneProvider', {
20
+ since: '5.8',
20
21
  hint: 'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.'
21
22
  });
22
23
  return children;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/drop-zone/provider.js"],"names":["DropZoneProvider","children","hint"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,gBAAT,OAA0C;AAAA,MAAf;AAAEC,IAAAA;AAAF,GAAe;AACxD,2BAAY,gCAAZ,EAA8C;AAC7CC,IAAAA,IAAI,EACH;AAF4C,GAA9C;AAIA,SAAOD,QAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\n\nexport default function DropZoneProvider( { children } ) {\n\tdeprecated( 'wp.components.DropZoneProvider', {\n\t\thint:\n\t\t\t'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.',\n\t} );\n\treturn children;\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/drop-zone/provider.js"],"names":["DropZoneProvider","children","since","hint"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,gBAAT,OAA0C;AAAA,MAAf;AAAEC,IAAAA;AAAF,GAAe;AACxD,2BAAY,gCAAZ,EAA8C;AAC7CC,IAAAA,KAAK,EAAE,KADsC;AAE7CC,IAAAA,IAAI,EACH;AAH4C,GAA9C;AAKA,SAAOF,QAAP;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\n\nexport default function DropZoneProvider( { children } ) {\n\tdeprecated( 'wp.components.DropZoneProvider', {\n\t\tsince: '5.8',\n\t\thint:\n\t\t\t'wp.component.DropZone no longer needs a provider. wp.components.DropZoneProvider is safe to remove from your code.',\n\t} );\n\treturn children;\n}\n"]}
@@ -34,13 +34,13 @@ const FlyoutContentView = ( /*#__PURE__*/0, _base.default)(_reakit.Popover, proc
34
34
  } : {
35
35
  target: "e1vtu5161",
36
36
  label: "FlyoutContentView"
37
- })("z-index:", ZIndex.Flyout, ";box-sizing:border-box;opacity:0;outline:none;position:relative;transform-origin:center center;transition:opacity ", _configValues.default.transitionDurationFastest, " linear;width:100%;&[data-enter]{opacity:1;}&::before,&::after{display:none;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFjd0QiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9mbHlvdXQvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIG5vLXJlc3RyaWN0ZWQtaW1wb3J0c1xuaW1wb3J0IHsgUG9wb3ZlciBhcyBSZWFraXRQb3BvdmVyIH0gZnJvbSAncmVha2l0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgQ2FyZCwgQ2FyZEJvZHkgfSBmcm9tICcuLi9jYXJkJztcbmltcG9ydCAqIGFzIFpJbmRleCBmcm9tICcuLi91dGlscy96LWluZGV4JztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5cbmV4cG9ydCBjb25zdCBGbHlvdXRDb250ZW50VmlldyA9IHN0eWxlZCggUmVha2l0UG9wb3ZlciApYFxuXHR6LWluZGV4OiAkeyBaSW5kZXguRmx5b3V0IH07XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdG9wYWNpdHk6IDA7XG5cdG91dGxpbmU6IG5vbmU7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0dHJhbnNmb3JtLW9yaWdpbjogY2VudGVyIGNlbnRlcjtcblx0dHJhbnNpdGlvbjogb3BhY2l0eSAkeyBDT05GSUcudHJhbnNpdGlvbkR1cmF0aW9uRmFzdGVzdCB9IGxpbmVhcjtcblx0d2lkdGg6IDEwMCU7XG5cblx0JltkYXRhLWVudGVyXSB7XG5cdFx0b3BhY2l0eTogMTtcblx0fVxuXG5cdCY6OmJlZm9yZSxcblx0Jjo6YWZ0ZXIge1xuXHRcdGRpc3BsYXk6IG5vbmU7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDYXJkVmlldyA9IHN0eWxlZCggQ2FyZCApYFxuXHQkeyBDYXJkQm9keS5zZWxlY3RvciB9IHtcblx0XHRtYXgtaGVpZ2h0OiA4MHZoO1xuXHR9XG5gO1xuIl19 */"));
37
+ })("z-index:", ZIndex.Flyout, ";box-sizing:border-box;opacity:0;outline:none;position:relative;transform-origin:center center;transition:opacity ", _configValues.default.transitionDurationFastest, " linear;width:100%;&[data-enter]{opacity:1;}&::before,&::after{display:none;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnQjJCIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQsIHsgU3R5bGVkQ29tcG9uZW50IH0gZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBuby1yZXN0cmljdGVkLWltcG9ydHNcbmltcG9ydCB7IFBvcG92ZXIgYXMgUmVha2l0UG9wb3ZlciB9IGZyb20gJ3JlYWtpdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENhcmQsIENhcmRCb2R5IH0gZnJvbSAnLi4vY2FyZCc7XG5pbXBvcnQgKiBhcyBaSW5kZXggZnJvbSAnLi4vdXRpbHMvei1pbmRleCc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5leHBvcnQgY29uc3QgRmx5b3V0Q29udGVudFZpZXc6IFN0eWxlZENvbXBvbmVudDxcblx0UmVhY3QuQ29tcG9uZW50UHJvcHNXaXRob3V0UmVmPCB0eXBlb2YgUmVha2l0UG9wb3ZlciA+XG4+ID0gc3R5bGVkKCBSZWFraXRQb3BvdmVyIClgXG5cdHotaW5kZXg6ICR7IFpJbmRleC5GbHlvdXQgfTtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0b3BhY2l0eTogMDtcblx0b3V0bGluZTogbm9uZTtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHR0cmFuc2Zvcm0tb3JpZ2luOiBjZW50ZXIgY2VudGVyO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5ICR7IENPTkZJRy50cmFuc2l0aW9uRHVyYXRpb25GYXN0ZXN0IH0gbGluZWFyO1xuXHR3aWR0aDogMTAwJTtcblxuXHQmW2RhdGEtZW50ZXJdIHtcblx0XHRvcGFjaXR5OiAxO1xuXHR9XG5cblx0Jjo6YmVmb3JlLFxuXHQmOjphZnRlciB7XG5cdFx0ZGlzcGxheTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENhcmRWaWV3ID0gc3R5bGVkKCBDYXJkIClgXG5cdCR7IENhcmRCb2R5LnNlbGVjdG9yIH0ge1xuXHRcdG1heC1oZWlnaHQ6IDgwdmg7XG5cdH1cbmA7XG4iXX0= */"));
38
38
  exports.FlyoutContentView = FlyoutContentView;
39
39
  const CardView = ( /*#__PURE__*/0, _base.default)(_card.Card, process.env.NODE_ENV === "production" ? {
40
40
  target: "e1vtu5160"
41
41
  } : {
42
42
  target: "e1vtu5160",
43
43
  label: "CardView"
44
- })(_card.CardBody.selector, "{max-height:80vh;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQ3NDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBuby1yZXN0cmljdGVkLWltcG9ydHNcbmltcG9ydCB7IFBvcG92ZXIgYXMgUmVha2l0UG9wb3ZlciB9IGZyb20gJ3JlYWtpdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENhcmQsIENhcmRCb2R5IH0gZnJvbSAnLi4vY2FyZCc7XG5pbXBvcnQgKiBhcyBaSW5kZXggZnJvbSAnLi4vdXRpbHMvei1pbmRleCc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5leHBvcnQgY29uc3QgRmx5b3V0Q29udGVudFZpZXcgPSBzdHlsZWQoIFJlYWtpdFBvcG92ZXIgKWBcblx0ei1pbmRleDogJHsgWkluZGV4LkZseW91dCB9O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRvcGFjaXR5OiAwO1xuXHRvdXRsaW5lOiBub25lO1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdHRyYW5zZm9ybS1vcmlnaW46IGNlbnRlciBjZW50ZXI7XG5cdHRyYW5zaXRpb246IG9wYWNpdHkgJHsgQ09ORklHLnRyYW5zaXRpb25EdXJhdGlvbkZhc3Rlc3QgfSBsaW5lYXI7XG5cdHdpZHRoOiAxMDAlO1xuXG5cdCZbZGF0YS1lbnRlcl0ge1xuXHRcdG9wYWNpdHk6IDE7XG5cdH1cblxuXHQmOjpiZWZvcmUsXG5cdCY6OmFmdGVyIHtcblx0XHRkaXNwbGF5OiBub25lO1xuXHR9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2FyZFZpZXcgPSBzdHlsZWQoIENhcmQgKWBcblx0JHsgQ2FyZEJvZHkuc2VsZWN0b3IgfSB7XG5cdFx0bWF4LWhlaWdodDogODB2aDtcblx0fVxuYDtcbiJdfQ== */"));
44
+ })(_card.CardBody.selector, "{max-height:80vh;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQ3NDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZmx5b3V0L3N0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQsIHsgU3R5bGVkQ29tcG9uZW50IH0gZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbi8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBuby1yZXN0cmljdGVkLWltcG9ydHNcbmltcG9ydCB7IFBvcG92ZXIgYXMgUmVha2l0UG9wb3ZlciB9IGZyb20gJ3JlYWtpdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENhcmQsIENhcmRCb2R5IH0gZnJvbSAnLi4vY2FyZCc7XG5pbXBvcnQgKiBhcyBaSW5kZXggZnJvbSAnLi4vdXRpbHMvei1pbmRleCc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5leHBvcnQgY29uc3QgRmx5b3V0Q29udGVudFZpZXc6IFN0eWxlZENvbXBvbmVudDxcblx0UmVhY3QuQ29tcG9uZW50UHJvcHNXaXRob3V0UmVmPCB0eXBlb2YgUmVha2l0UG9wb3ZlciA+XG4+ID0gc3R5bGVkKCBSZWFraXRQb3BvdmVyIClgXG5cdHotaW5kZXg6ICR7IFpJbmRleC5GbHlvdXQgfTtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0b3BhY2l0eTogMDtcblx0b3V0bGluZTogbm9uZTtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHR0cmFuc2Zvcm0tb3JpZ2luOiBjZW50ZXIgY2VudGVyO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5ICR7IENPTkZJRy50cmFuc2l0aW9uRHVyYXRpb25GYXN0ZXN0IH0gbGluZWFyO1xuXHR3aWR0aDogMTAwJTtcblxuXHQmW2RhdGEtZW50ZXJdIHtcblx0XHRvcGFjaXR5OiAxO1xuXHR9XG5cblx0Jjo6YmVmb3JlLFxuXHQmOjphZnRlciB7XG5cdFx0ZGlzcGxheTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENhcmRWaWV3ID0gc3R5bGVkKCBDYXJkIClgXG5cdCR7IENhcmRCb2R5LnNlbGVjdG9yIH0ge1xuXHRcdG1heC1oZWlnaHQ6IDgwdmg7XG5cdH1cbmA7XG4iXX0= */"));
45
45
  exports.CardView = CardView;
46
46
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/flyout/styles.ts"],"names":["FlyoutContentView","ReakitPopover","ZIndex","Flyout","CONFIG","transitionDurationFastest","CardView","Card","CardBody","selector"],"mappings":";;;;;;;;;;;AAKA;;AAKA;;AACA;;AACA;;;;;;AAZA;AACA;AACA;AAEA;;AAGA;AACA;AACA;AAKO,MAAMA,iBAAiB,GAAG,iCAAQC,eAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,aACjBC,MAAM,CAACC,MADU,wHAONC,sBAAOC,yBAPD,iiDAAvB;;AAoBA,MAAMC,QAAQ,GAAG,iCAAQC,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACjBC,eAASC,QADQ,0+CAAd","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n// eslint-disable-next-line no-restricted-imports\nimport { Popover as ReakitPopover } from 'reakit';\n\n/**\n * Internal dependencies\n */\nimport { Card, CardBody } from '../card';\nimport * as ZIndex from '../utils/z-index';\nimport CONFIG from '../utils/config-values';\n\nexport const FlyoutContentView = styled( ReakitPopover )`\n\tz-index: ${ ZIndex.Flyout };\n\tbox-sizing: border-box;\n\topacity: 0;\n\toutline: none;\n\tposition: relative;\n\ttransform-origin: center center;\n\ttransition: opacity ${ CONFIG.transitionDurationFastest } linear;\n\twidth: 100%;\n\n\t&[data-enter] {\n\t\topacity: 1;\n\t}\n\n\t&::before,\n\t&::after {\n\t\tdisplay: none;\n\t}\n`;\n\nexport const CardView = styled( Card )`\n\t${ CardBody.selector } {\n\t\tmax-height: 80vh;\n\t}\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/flyout/styles.ts"],"names":["FlyoutContentView","ReakitPopover","ZIndex","Flyout","CONFIG","transitionDurationFastest","CardView","Card","CardBody","selector"],"mappings":";;;;;;;;;;;AAKA;;AAKA;;AACA;;AACA;;;;;;AAZA;AACA;AACA;AAEA;;AAGA;AACA;AACA;AAKO,MAAMA,iBAEZ,GAAG,iCAAQC,eAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,aACYC,MAAM,CAACC,MADnB,wHAOuBC,sBAAOC,yBAP9B,yqDAFM;;AAsBA,MAAMC,QAAQ,GAAG,iCAAQC,UAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACjBC,eAASC,QADQ,8mDAAd","sourcesContent":["/**\n * External dependencies\n */\nimport styled, { StyledComponent } from '@emotion/styled';\n// eslint-disable-next-line no-restricted-imports\nimport { Popover as ReakitPopover } from 'reakit';\n\n/**\n * Internal dependencies\n */\nimport { Card, CardBody } from '../card';\nimport * as ZIndex from '../utils/z-index';\nimport CONFIG from '../utils/config-values';\n\nexport const FlyoutContentView: StyledComponent<\n\tReact.ComponentPropsWithoutRef< typeof ReakitPopover >\n> = styled( ReakitPopover )`\n\tz-index: ${ ZIndex.Flyout };\n\tbox-sizing: border-box;\n\topacity: 0;\n\toutline: none;\n\tposition: relative;\n\ttransform-origin: center center;\n\ttransition: opacity ${ CONFIG.transitionDurationFastest } linear;\n\twidth: 100%;\n\n\t&[data-enter] {\n\t\topacity: 1;\n\t}\n\n\t&::before,\n\t&::after {\n\t\tdisplay: none;\n\t}\n`;\n\nexport const CardView = styled( Card )`\n\t${ CardBody.selector } {\n\t\tmax-height: 80vh;\n\t}\n`;\n"]}
@@ -25,6 +25,7 @@ function FocusableIframe(_ref) {
25
25
  } = _ref;
26
26
  const ref = (0, _compose.useMergeRefs)([iframeRef, (0, _compose.useFocusableIframe)()]);
27
27
  (0, _deprecated.default)('wp.components.FocusableIframe', {
28
+ since: '5.9',
28
29
  alternative: 'wp.compose.useFocusableIframe'
29
30
  }); // Disable reason: The rendered iframe is a pass-through component,
30
31
  // assigning props inherited from the rendering parent. It's the