@wordpress/components 23.4.0 → 23.6.0

package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js

@@ -10,7 +10,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Internal dependencies
  */
 import { Text } from '../../../text';
-import { COLORS } from '../../../utils';
+import { font, COLORS } from '../../../utils';
 export const Root = _styled("div", process.env.NODE_ENV === "production" ? {
   target: "e1wq7y4k3"
 } : {
@@ -22,7 +22,7 @@ export const Root = _styled("div", process.env.NODE_ENV === "production" ? {
 } : {
   name: "1cd7zoc",
   styles: "bottom:0;box-sizing:border-box;left:0;pointer-events:none;position:absolute;right:0;top:0",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVc4QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3Jlc2l6YWJsZS1ib3gvcmVzaXplLXRvb2x0aXAvc3R5bGVzL3Jlc2l6ZS10b29sdGlwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgVGV4dCB9IGZyb20gJy4uLy4uLy4uL3RleHQnO1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSAnLi4vLi4vLi4vdXRpbHMnO1xuXG5leHBvcnQgY29uc3QgUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvdHRvbTogMDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0bGVmdDogMDtcblx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0cmlnaHQ6IDA7XG5cdHRvcDogMDtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGlubGluZS1mbGV4O1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblx0b3BhY2l0eTogMDtcblx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdHRyYW5zaXRpb246IG9wYWNpdHkgMTIwbXMgbGluZWFyO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRvb2x0aXAgPSBzdHlsZWQuZGl2YFxuXHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRmb250LXNpemU6IDEycHg7XG5cdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0cGFkZGluZzogNHB4IDhweDtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuYDtcblxuLy8gVE9ETzogUmVzb2x2ZSBuZWVkIHRvIHVzZSAmJiYgdG8gaW5jcmVhc2Ugc3BlY2lmaWNpdHlcbi8vIGh0dHBzOi8vZ2l0aHViLmNvbS9Xb3JkUHJlc3MvZ3V0ZW5iZXJnL2lzc3Vlcy8xODQ4M1xuXG5leHBvcnQgY29uc3QgTGFiZWxUZXh0ID0gc3R5bGVkKCBUZXh0IClgXG5cdCYmJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy51aS50ZXh0RGFyayB9O1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHRcdGZvbnQtc2l6ZTogMTNweDtcblx0XHRsaW5lLWhlaWdodDogMS40O1xuXHRcdHdoaXRlLXNwYWNlOiBub3dyYXA7XG5cdH1cbmA7XG4iXX0= */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVc4QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3Jlc2l6YWJsZS1ib3gvcmVzaXplLXRvb2x0aXAvc3R5bGVzL3Jlc2l6ZS10b29sdGlwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgVGV4dCB9IGZyb20gJy4uLy4uLy4uL3RleHQnO1xuaW1wb3J0IHsgZm9udCwgQ09MT1JTIH0gZnJvbSAnLi4vLi4vLi4vdXRpbHMnO1xuXG5leHBvcnQgY29uc3QgUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvdHRvbTogMDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0bGVmdDogMDtcblx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0cmlnaHQ6IDA7XG5cdHRvcDogMDtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGFsaWduLWl0ZW1zOiBjZW50ZXI7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGlubGluZS1mbGV4O1xuXHRqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcblx0b3BhY2l0eTogMDtcblx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdHRyYW5zaXRpb246IG9wYWNpdHkgMTIwbXMgbGluZWFyO1xuYDtcblxuZXhwb3J0IGNvbnN0IFRvb2x0aXAgPSBzdHlsZWQuZGl2YFxuXHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRmb250LWZhbWlseTogJHsgZm9udCggJ2RlZmF1bHQuZm9udEZhbWlseScgKSB9O1xuXHRmb250LXNpemU6IDEycHg7XG5cdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0cGFkZGluZzogNHB4IDhweDtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuYDtcblxuLy8gVE9ETzogUmVzb2x2ZSBuZWVkIHRvIHVzZSAmJiYgdG8gaW5jcmVhc2Ugc3BlY2lmaWNpdHlcbi8vIGh0dHBzOi8vZ2l0aHViLmNvbS9Xb3JkUHJlc3MvZ3V0ZW5iZXJnL2lzc3Vlcy8xODQ4M1xuXG5leHBvcnQgY29uc3QgTGFiZWxUZXh0ID0gc3R5bGVkKCBUZXh0IClgXG5cdCYmJiB7XG5cdFx0Y29sb3I6ICR7IENPTE9SUy51aS50ZXh0RGFyayB9O1xuXHRcdGRpc3BsYXk6IGJsb2NrO1xuXHRcdGZvbnQtc2l6ZTogMTNweDtcblx0XHRsaW5lLWhlaWdodDogMS40O1xuXHRcdHdoaXRlLXNwYWNlOiBub3dyYXA7XG5cdH1cbmA7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 export const TooltipWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
@@ -36,7 +36,7 @@ export const TooltipWrapper = _styled("div", process.env.NODE_ENV === "productio
 } : {
   name: "ajymcs",
   styles: "align-items:center;box-sizing:border-box;display:inline-flex;justify-content:center;opacity:0;pointer-events:none;transition:opacity 120ms linear",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFCd0MiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9yZXNpemFibGUtYm94L3Jlc2l6ZS10b29sdGlwL3N0eWxlcy9yZXNpemUtdG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi8uLi8uLi90ZXh0JztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uLy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGxlZnQ6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVG9vbHRpcFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBpbmxpbmUtZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdG9wYWNpdHk6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmdyYXlbIDkwMCBdIH07XG5cdGJvcmRlci1yYWRpdXM6IDJweDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Zm9udC1zaXplOiAxMnB4O1xuXHRjb2xvcjogJHsgQ09MT1JTLnVpLnRleHREYXJrIH07XG5cdHBhZGRpbmc6IDRweCA4cHg7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcbmA7XG5cbi8vIFRPRE86IFJlc29sdmUgbmVlZCB0byB1c2UgJiYmIHRvIGluY3JlYXNlIHNwZWNpZmljaXR5XG4vLyBodHRwczovL2dpdGh1Yi5jb20vV29yZFByZXNzL2d1dGVuYmVyZy9pc3N1ZXMvMTg0ODNcblxuZXhwb3J0IGNvbnN0IExhYmVsVGV4dCA9IHN0eWxlZCggVGV4dCApYFxuXHQmJiYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0bGluZS1oZWlnaHQ6IDEuNDtcblx0XHR3aGl0ZS1zcGFjZTogbm93cmFwO1xuXHR9XG5gO1xuIl19 */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXFCd0MiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9yZXNpemFibGUtYm94L3Jlc2l6ZS10b29sdGlwL3N0eWxlcy9yZXNpemUtdG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi8uLi8uLi90ZXh0JztcbmltcG9ydCB7IGZvbnQsIENPTE9SUyB9IGZyb20gJy4uLy4uLy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGxlZnQ6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVG9vbHRpcFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBpbmxpbmUtZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdG9wYWNpdHk6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmdyYXlbIDkwMCBdIH07XG5cdGJvcmRlci1yYWRpdXM6IDJweDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Zm9udC1mYW1pbHk6ICR7IGZvbnQoICdkZWZhdWx0LmZvbnRGYW1pbHknICkgfTtcblx0Zm9udC1zaXplOiAxMnB4O1xuXHRjb2xvcjogJHsgQ09MT1JTLnVpLnRleHREYXJrIH07XG5cdHBhZGRpbmc6IDRweCA4cHg7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcbmA7XG5cbi8vIFRPRE86IFJlc29sdmUgbmVlZCB0byB1c2UgJiYmIHRvIGluY3JlYXNlIHNwZWNpZmljaXR5XG4vLyBodHRwczovL2dpdGh1Yi5jb20vV29yZFByZXNzL2d1dGVuYmVyZy9pc3N1ZXMvMTg0ODNcblxuZXhwb3J0IGNvbnN0IExhYmVsVGV4dCA9IHN0eWxlZCggVGV4dCApYFxuXHQmJiYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0bGluZS1oZWlnaHQ6IDEuNDtcblx0XHR3aGl0ZS1zcGFjZTogbm93cmFwO1xuXHR9XG5gO1xuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 export const Tooltip = _styled("div", process.env.NODE_ENV === "production" ? {
@@ -44,7 +44,7 @@ export const Tooltip = _styled("div", process.env.NODE_ENV === "production" ? {
 } : {
   target: "e1wq7y4k1",
   label: "Tooltip"
-})("background:", COLORS.gray[900], ";border-radius:2px;box-sizing:border-box;font-size:12px;color:", COLORS.ui.textDark, ";padding:4px 8px;position:relative;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStCaUMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9yZXNpemFibGUtYm94L3Jlc2l6ZS10b29sdGlwL3N0eWxlcy9yZXNpemUtdG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi8uLi8uLi90ZXh0JztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uLy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGxlZnQ6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVG9vbHRpcFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBpbmxpbmUtZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdG9wYWNpdHk6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmdyYXlbIDkwMCBdIH07XG5cdGJvcmRlci1yYWRpdXM6IDJweDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Zm9udC1zaXplOiAxMnB4O1xuXHRjb2xvcjogJHsgQ09MT1JTLnVpLnRleHREYXJrIH07XG5cdHBhZGRpbmc6IDRweCA4cHg7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcbmA7XG5cbi8vIFRPRE86IFJlc29sdmUgbmVlZCB0byB1c2UgJiYmIHRvIGluY3JlYXNlIHNwZWNpZmljaXR5XG4vLyBodHRwczovL2dpdGh1Yi5jb20vV29yZFByZXNzL2d1dGVuYmVyZy9pc3N1ZXMvMTg0ODNcblxuZXhwb3J0IGNvbnN0IExhYmVsVGV4dCA9IHN0eWxlZCggVGV4dCApYFxuXHQmJiYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0bGluZS1oZWlnaHQ6IDEuNDtcblx0XHR3aGl0ZS1zcGFjZTogbm93cmFwO1xuXHR9XG5gO1xuIl19 */")); // TODO: Resolve need to use &&& to increase specificity
+})("background:", COLORS.gray[900], ";border-radius:2px;box-sizing:border-box;font-family:", font('default.fontFamily'), ";font-size:12px;color:", COLORS.ui.textDark, ";padding:4px 8px;position:relative;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStCaUMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9yZXNpemFibGUtYm94L3Jlc2l6ZS10b29sdGlwL3N0eWxlcy9yZXNpemUtdG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi8uLi8uLi90ZXh0JztcbmltcG9ydCB7IGZvbnQsIENPTE9SUyB9IGZyb20gJy4uLy4uLy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGxlZnQ6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVG9vbHRpcFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBpbmxpbmUtZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdG9wYWNpdHk6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmdyYXlbIDkwMCBdIH07XG5cdGJvcmRlci1yYWRpdXM6IDJweDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Zm9udC1mYW1pbHk6ICR7IGZvbnQoICdkZWZhdWx0LmZvbnRGYW1pbHknICkgfTtcblx0Zm9udC1zaXplOiAxMnB4O1xuXHRjb2xvcjogJHsgQ09MT1JTLnVpLnRleHREYXJrIH07XG5cdHBhZGRpbmc6IDRweCA4cHg7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcbmA7XG5cbi8vIFRPRE86IFJlc29sdmUgbmVlZCB0byB1c2UgJiYmIHRvIGluY3JlYXNlIHNwZWNpZmljaXR5XG4vLyBodHRwczovL2dpdGh1Yi5jb20vV29yZFByZXNzL2d1dGVuYmVyZy9pc3N1ZXMvMTg0ODNcblxuZXhwb3J0IGNvbnN0IExhYmVsVGV4dCA9IHN0eWxlZCggVGV4dCApYFxuXHQmJiYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0bGluZS1oZWlnaHQ6IDEuNDtcblx0XHR3aGl0ZS1zcGFjZTogbm93cmFwO1xuXHR9XG5gO1xuIl19 */")); // TODO: Resolve need to use &&& to increase specificity
 // https://github.com/WordPress/gutenberg/issues/18483
 
 export const LabelText = /*#__PURE__*/_styled(Text, process.env.NODE_ENV === "production" ? {
@@ -52,5 +52,5 @@ export const LabelText = /*#__PURE__*/_styled(Text, process.env.NODE_ENV === "pr
 } : {
   target: "e1wq7y4k0",
   label: "LabelText"
-})("&&&{color:", COLORS.ui.textDark, ";display:block;font-size:13px;line-height:1.4;white-space:nowrap;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTRDdUMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9yZXNpemFibGUtYm94L3Jlc2l6ZS10b29sdGlwL3N0eWxlcy9yZXNpemUtdG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi8uLi8uLi90ZXh0JztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uLy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGxlZnQ6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVG9vbHRpcFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBpbmxpbmUtZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdG9wYWNpdHk6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmdyYXlbIDkwMCBdIH07XG5cdGJvcmRlci1yYWRpdXM6IDJweDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Zm9udC1zaXplOiAxMnB4O1xuXHRjb2xvcjogJHsgQ09MT1JTLnVpLnRleHREYXJrIH07XG5cdHBhZGRpbmc6IDRweCA4cHg7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcbmA7XG5cbi8vIFRPRE86IFJlc29sdmUgbmVlZCB0byB1c2UgJiYmIHRvIGluY3JlYXNlIHNwZWNpZmljaXR5XG4vLyBodHRwczovL2dpdGh1Yi5jb20vV29yZFByZXNzL2d1dGVuYmVyZy9pc3N1ZXMvMTg0ODNcblxuZXhwb3J0IGNvbnN0IExhYmVsVGV4dCA9IHN0eWxlZCggVGV4dCApYFxuXHQmJiYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0bGluZS1oZWlnaHQ6IDEuNDtcblx0XHR3aGl0ZS1zcGFjZTogbm93cmFwO1xuXHR9XG5gO1xuIl19 */"));
+})("&&&{color:", COLORS.ui.textDark, ";display:block;font-size:13px;line-height:1.4;white-space:nowrap;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvcmVzaXphYmxlLWJveC9yZXNpemUtdG9vbHRpcC9zdHlsZXMvcmVzaXplLXRvb2x0aXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZDdUMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9yZXNpemFibGUtYm94L3Jlc2l6ZS10b29sdGlwL3N0eWxlcy9yZXNpemUtdG9vbHRpcC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IFRleHQgfSBmcm9tICcuLi8uLi8uLi90ZXh0JztcbmltcG9ydCB7IGZvbnQsIENPTE9SUyB9IGZyb20gJy4uLy4uLy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGxlZnQ6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgVG9vbHRpcFdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRhbGlnbi1pdGVtczogY2VudGVyO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBpbmxpbmUtZmxleDtcblx0anVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG5cdG9wYWNpdHk6IDA7XG5cdHBvaW50ZXItZXZlbnRzOiBub25lO1xuXHR0cmFuc2l0aW9uOiBvcGFjaXR5IDEyMG1zIGxpbmVhcjtcbmA7XG5cbmV4cG9ydCBjb25zdCBUb29sdGlwID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmdyYXlbIDkwMCBdIH07XG5cdGJvcmRlci1yYWRpdXM6IDJweDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Zm9udC1mYW1pbHk6ICR7IGZvbnQoICdkZWZhdWx0LmZvbnRGYW1pbHknICkgfTtcblx0Zm9udC1zaXplOiAxMnB4O1xuXHRjb2xvcjogJHsgQ09MT1JTLnVpLnRleHREYXJrIH07XG5cdHBhZGRpbmc6IDRweCA4cHg7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcbmA7XG5cbi8vIFRPRE86IFJlc29sdmUgbmVlZCB0byB1c2UgJiYmIHRvIGluY3JlYXNlIHNwZWNpZmljaXR5XG4vLyBodHRwczovL2dpdGh1Yi5jb20vV29yZFByZXNzL2d1dGVuYmVyZy9pc3N1ZXMvMTg0ODNcblxuZXhwb3J0IGNvbnN0IExhYmVsVGV4dCA9IHN0eWxlZCggVGV4dCApYFxuXHQmJiYge1xuXHRcdGNvbG9yOiAkeyBDT0xPUlMudWkudGV4dERhcmsgfTtcblx0XHRkaXNwbGF5OiBibG9jaztcblx0XHRmb250LXNpemU6IDEzcHg7XG5cdFx0bGluZS1oZWlnaHQ6IDEuNDtcblx0XHR3aGl0ZS1zcGFjZTogbm93cmFwO1xuXHR9XG5gO1xuIl19 */"));
 //# sourceMappingURL=resize-tooltip.styles.js.map

package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/resizable-box/resize-tooltip/styles/resize-tooltip.styles.ts"],"names":["Text","COLORS","Root","TooltipWrapper","Tooltip","gray","ui","textDark","LabelText"],"mappings":";;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,eAArB;AACA,SAASC,MAAT,QAAuB,gBAAvB;AAEA,OAAO,MAAMC,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAV;AAUP,OAAO,MAAMC,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAApB;AAUP,OAAO,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,kBACJH,MAAM,CAACI,IAAP,CAAa,GAAb,CADI,oEAKTJ,MAAM,CAACK,EAAP,CAAUC,QALD,29DAAb,C,CAUP;AACA;;AAEA,OAAO,MAAMC,SAAS,GAAG,qBAAQR,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,eAEVC,MAAM,CAACK,EAAP,CAAUC,QAFA,0/DAAf","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { Text } from '../../../text';\nimport { COLORS } from '../../../utils';\n\nexport const Root = styled.div`\n\tbottom: 0;\n\tbox-sizing: border-box;\n\tleft: 0;\n\tpointer-events: none;\n\tposition: absolute;\n\tright: 0;\n\ttop: 0;\n`;\n\nexport const TooltipWrapper = styled.div`\n\talign-items: center;\n\tbox-sizing: border-box;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\topacity: 0;\n\tpointer-events: none;\n\ttransition: opacity 120ms linear;\n`;\n\nexport const Tooltip = styled.div`\n\tbackground: ${ COLORS.gray[ 900 ] };\n\tborder-radius: 2px;\n\tbox-sizing: border-box;\n\tfont-size: 12px;\n\tcolor: ${ COLORS.ui.textDark };\n\tpadding: 4px 8px;\n\tposition: relative;\n`;\n\n// TODO: Resolve need to use &&& to increase specificity\n// https://github.com/WordPress/gutenberg/issues/18483\n\nexport const LabelText = styled( Text )`\n\t&&& {\n\t\tcolor: ${ COLORS.ui.textDark };\n\t\tdisplay: block;\n\t\tfont-size: 13px;\n\t\tline-height: 1.4;\n\t\twhite-space: nowrap;\n\t}\n`;\n"]}
+{"version":3,"sources":["@wordpress/components/src/resizable-box/resize-tooltip/styles/resize-tooltip.styles.ts"],"names":["Text","font","COLORS","Root","TooltipWrapper","Tooltip","gray","ui","textDark","LabelText"],"mappings":";;;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,eAArB;AACA,SAASC,IAAT,EAAeC,MAAf,QAA6B,gBAA7B;AAEA,OAAO,MAAMC,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAV;AAUP,OAAO,MAAMC,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAApB;AAUP,OAAO,MAAMC,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,kBACJH,MAAM,CAACI,IAAP,CAAa,GAAb,CADI,2DAIHL,IAAI,CAAE,oBAAF,CAJD,4BAMTC,MAAM,CAACK,EAAP,CAAUC,QAND,uiEAAb,C,CAWP;AACA;;AAEA,OAAO,MAAMC,SAAS,GAAG,qBAAQT,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,eAEVE,MAAM,CAACK,EAAP,CAAUC,QAFA,skEAAf","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { Text } from '../../../text';\nimport { font, COLORS } from '../../../utils';\n\nexport const Root = styled.div`\n\tbottom: 0;\n\tbox-sizing: border-box;\n\tleft: 0;\n\tpointer-events: none;\n\tposition: absolute;\n\tright: 0;\n\ttop: 0;\n`;\n\nexport const TooltipWrapper = styled.div`\n\talign-items: center;\n\tbox-sizing: border-box;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\topacity: 0;\n\tpointer-events: none;\n\ttransition: opacity 120ms linear;\n`;\n\nexport const Tooltip = styled.div`\n\tbackground: ${ COLORS.gray[ 900 ] };\n\tborder-radius: 2px;\n\tbox-sizing: border-box;\n\tfont-family: ${ font( 'default.fontFamily' ) };\n\tfont-size: 12px;\n\tcolor: ${ COLORS.ui.textDark };\n\tpadding: 4px 8px;\n\tposition: relative;\n`;\n\n// TODO: Resolve need to use &&& to increase specificity\n// https://github.com/WordPress/gutenberg/issues/18483\n\nexport const LabelText = styled( Text )`\n\t&&& {\n\t\tcolor: ${ COLORS.ui.textDark };\n\t\tdisplay: block;\n\t\tfont-size: 13px;\n\t\tline-height: 1.4;\n\t\twhite-space: nowrap;\n\t}\n`;\n"]}

package/build-module/responsive-wrapper/index.js

@@ -9,7 +9,6 @@ import classnames from 'classnames';
  */
 
 import { cloneElement, Children } from '@wordpress/element';
-import { useResizeObserver } from '@wordpress/compose';
 /**
  * Internal dependencies
  */
@@ -37,25 +36,26 @@ function ResponsiveWrapper(_ref) {
     children,
     isInline = false
   } = _ref;
-  const [containerResizeListener, {
-    width: containerWidth
-  }] = useResizeObserver();
 
   if (Children.count(children) !== 1) {
     return null;
   }
 
-  const imageStyle = {
-    paddingBottom: naturalWidth < (containerWidth !== null && containerWidth !== void 0 ? containerWidth : 0) ? naturalHeight : naturalHeight / naturalWidth * 100 + '%'
-  };
   const TagName = isInline ? 'span' : 'div';
+  let aspectRatio;
+
+  if (naturalWidth && naturalHeight) {
+    aspectRatio = `${naturalWidth} / ${naturalHeight}`;
+  }
+
   return createElement(TagName, {
     className: "components-responsive-wrapper"
-  }, containerResizeListener, createElement(TagName, {
-    style: imageStyle
-  }), cloneElement(children, {
-    className: classnames('components-responsive-wrapper__content', children.props.className)
-  }));
+  }, createElement("div", null, cloneElement(children, {
+    className: classnames('components-responsive-wrapper__content', children.props.className),
+    style: { ...children.props.style,
+      aspectRatio
+    }
+  })));
 }
 
 export default ResponsiveWrapper;

package/build-module/responsive-wrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/responsive-wrapper/index.tsx"],"names":["classnames","cloneElement","Children","useResizeObserver","ResponsiveWrapper","naturalWidth","naturalHeight","children","isInline","containerResizeListener","width","containerWidth","count","imageStyle","paddingBottom","TagName","className","props"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,YAAT,EAAuBC,QAAvB,QAAuC,oBAAvC;AACA,SAASC,iBAAT,QAAkC,oBAAlC;AAEA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,iBAAT,OAK4B;AAAA,MALA;AAC3BC,IAAAA,YAD2B;AAE3BC,IAAAA,aAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA,QAAQ,GAAG;AAJgB,GAKA;AAC3B,QAAM,CAAEC,uBAAF,EAA2B;AAAEC,IAAAA,KAAK,EAAEC;AAAT,GAA3B,IACLR,iBAAiB,EADlB;;AAEA,MAAKD,QAAQ,CAACU,KAAT,CAAgBL,QAAhB,MAA+B,CAApC,EAAwC;AACvC,WAAO,IAAP;AACA;;AACD,QAAMM,UAAU,GAAG;AAClBC,IAAAA,aAAa,EACZT,YAAY,IAAKM,cAAL,aAAKA,cAAL,cAAKA,cAAL,GAAuB,CAAvB,CAAZ,GACGL,aADH,GAEKA,aAAa,GAAGD,YAAlB,GAAmC,GAAnC,GAAyC;AAJ3B,GAAnB;AAMA,QAAMU,OAAO,GAAGP,QAAQ,GAAG,MAAH,GAAY,KAApC;AACA,SACC,cAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KACGC,uBADH,EAEC,cAAC,OAAD;AAAS,IAAA,KAAK,EAAGI;AAAjB,IAFD,EAGGZ,YAAY,CAAEM,QAAF,EAAY;AACzBS,IAAAA,SAAS,EAAEhB,UAAU,CACpB,wCADoB,EAEpBO,QAAQ,CAACU,KAAT,CAAeD,SAFK;AADI,GAAZ,CAHf,CADD;AAYA;;AAED,eAAeZ,iBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, Children } from '@wordpress/element';\nimport { useResizeObserver } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport type { ResponsiveWrapperProps } from './types';\n\n/**\n * A wrapper component that maintains its aspect ratio when resized.\n *\n * ```jsx\n * import { ResponsiveWrapper } from '@wordpress/components';\n *\n * const MyResponsiveWrapper = () => (\n * \t<ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>\n * \t\t<img\n * \t\t\tsrc=\"https://s.w.org/style/images/about/WordPress-logotype-standard.png\"\n * \t\t\talt=\"WordPress\"\n * \t\t/>\n * \t</ResponsiveWrapper>\n * );\n * ```\n */\nfunction ResponsiveWrapper( {\n\tnaturalWidth,\n\tnaturalHeight,\n\tchildren,\n\tisInline = false,\n}: ResponsiveWrapperProps ) {\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn null;\n\t}\n\tconst imageStyle = {\n\t\tpaddingBottom:\n\t\t\tnaturalWidth < ( containerWidth ?? 0 )\n\t\t\t\t? naturalHeight\n\t\t\t\t: ( naturalHeight / naturalWidth ) * 100 + '%',\n\t};\n\tconst TagName = isInline ? 'span' : 'div';\n\treturn (\n\t\t<TagName className=\"components-responsive-wrapper\">\n\t\t\t{ containerResizeListener }\n\t\t\t<TagName style={ imageStyle } />\n\t\t\t{ cloneElement( children, {\n\t\t\t\tclassName: classnames(\n\t\t\t\t\t'components-responsive-wrapper__content',\n\t\t\t\t\tchildren.props.className\n\t\t\t\t),\n\t\t\t} ) }\n\t\t</TagName>\n\t);\n}\n\nexport default ResponsiveWrapper;\n"]}
+{"version":3,"sources":["@wordpress/components/src/responsive-wrapper/index.tsx"],"names":["classnames","cloneElement","Children","ResponsiveWrapper","naturalWidth","naturalHeight","children","isInline","count","TagName","aspectRatio","className","props","style"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,YAAT,EAAuBC,QAAvB,QAAuC,oBAAvC;AAEA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,iBAAT,OAK4B;AAAA,MALA;AAC3BC,IAAAA,YAD2B;AAE3BC,IAAAA,aAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA,QAAQ,GAAG;AAJgB,GAKA;;AAC3B,MAAKL,QAAQ,CAACM,KAAT,CAAgBF,QAAhB,MAA+B,CAApC,EAAwC;AACvC,WAAO,IAAP;AACA;;AAED,QAAMG,OAAO,GAAGF,QAAQ,GAAG,MAAH,GAAY,KAApC;AACA,MAAIG,WAAJ;;AACA,MAAKN,YAAY,IAAIC,aAArB,EAAqC;AACpCK,IAAAA,WAAW,GAAI,GAAGN,YAAc,MAAMC,aAAe,EAArD;AACA;;AAED,SACC,cAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KACC,2BACGJ,YAAY,CAAEK,QAAF,EAAY;AACzBK,IAAAA,SAAS,EAAEX,UAAU,CACpB,wCADoB,EAEpBM,QAAQ,CAACM,KAAT,CAAeD,SAFK,CADI;AAKzBE,IAAAA,KAAK,EAAE,EACN,GAAGP,QAAQ,CAACM,KAAT,CAAeC,KADZ;AAENH,MAAAA;AAFM;AALkB,GAAZ,CADf,CADD,CADD;AAgBA;;AAED,eAAeP,iBAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, Children } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { ResponsiveWrapperProps } from './types';\n\n/**\n * A wrapper component that maintains its aspect ratio when resized.\n *\n * ```jsx\n * import { ResponsiveWrapper } from '@wordpress/components';\n *\n * const MyResponsiveWrapper = () => (\n * \t<ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>\n * \t\t<img\n * \t\t\tsrc=\"https://s.w.org/style/images/about/WordPress-logotype-standard.png\"\n * \t\t\talt=\"WordPress\"\n * \t\t/>\n * \t</ResponsiveWrapper>\n * );\n * ```\n */\nfunction ResponsiveWrapper( {\n\tnaturalWidth,\n\tnaturalHeight,\n\tchildren,\n\tisInline = false,\n}: ResponsiveWrapperProps ) {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn null;\n\t}\n\n\tconst TagName = isInline ? 'span' : 'div';\n\tlet aspectRatio;\n\tif ( naturalWidth && naturalHeight ) {\n\t\taspectRatio = `${ naturalWidth } / ${ naturalHeight }`;\n\t}\n\n\treturn (\n\t\t<TagName className=\"components-responsive-wrapper\">\n\t\t\t<div>\n\t\t\t\t{ cloneElement( children, {\n\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t'components-responsive-wrapper__content',\n\t\t\t\t\t\tchildren.props.className\n\t\t\t\t\t),\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\t...children.props.style,\n\t\t\t\t\t\taspectRatio,\n\t\t\t\t\t},\n\t\t\t\t} ) }\n\t\t\t</div>\n\t\t</TagName>\n\t);\n}\n\nexport default ResponsiveWrapper;\n"]}

package/build-module/select-control/index.js

@@ -5,10 +5,10 @@ import { createElement } from "@wordpress/element";
  * External dependencies
  */
 import classNames from 'classnames';
-
 /**
  * WordPress dependencies
  */
+
 import { useInstanceId } from '@wordpress/compose';
 import { useState, forwardRef } from '@wordpress/element';
 /**
@@ -28,8 +28,8 @@ function useUniqueId(idProp) {
   return idProp || id;
 }
 
-function UnforwardedSelectControl(_ref, ref) {
-  let {
+function UnforwardedSelectControl(props, ref) {
+  const {
     className,
     disabled = false,
     help,
@@ -38,7 +38,7 @@ function UnforwardedSelectControl(_ref, ref) {
     label,
     multiple = false,
     onBlur = noop,
-    onChange = noop,
+    onChange,
     onFocus = noop,
     options = [],
     size = 'default',
@@ -49,8 +49,8 @@ function UnforwardedSelectControl(_ref, ref) {
     suffix,
     __next36pxDefaultSize = false,
     __nextHasNoMarginBottom = false,
-    ...props
-  } = _ref;
+    ...restProps
+  } = props;
   const [isFocused, setIsFocused] = useState(false);
   const id = useUniqueId(idProp);
   const helpId = help ? `${id}__help` : undefined; // Disable reason: A select with an onchange throws a warning.
@@ -68,31 +68,35 @@ function UnforwardedSelectControl(_ref, ref) {
   };
 
   const handleOnChange = event => {
-    if (multiple) {
-      const selectedOptions = Array.from(event.target.options).filter(_ref2 => {
+    var _props$onChange2;
+
+    if (props.multiple) {
+      var _props$onChange;
+
+      const selectedOptions = Array.from(event.target.options).filter(_ref => {
         let {
           selected
-        } = _ref2;
+        } = _ref;
         return selected;
       });
-      const newValues = selectedOptions.map(_ref3 => {
+      const newValues = selectedOptions.map(_ref2 => {
         let {
           value
-        } = _ref3;
+        } = _ref2;
         return value;
       });
-      onChange(newValues);
+      (_props$onChange = props.onChange) === null || _props$onChange === void 0 ? void 0 : _props$onChange.call(props, newValues, {
+        event
+      });
       return;
     }
 
-    onChange(event.target.value, {
+    (_props$onChange2 = props.onChange) === null || _props$onChange2 === void 0 ? void 0 : _props$onChange2.call(props, event.target.value, {
       event
     });
   };
 
   const classes = classNames('components-select-control', className);
-  /* eslint-disable jsx-a11y/no-onchange */
-
   return createElement(BaseControl, {
     help: help,
     id: id,
@@ -109,7 +113,7 @@ function UnforwardedSelectControl(_ref, ref) {
     prefix: prefix,
     labelPosition: labelPosition,
     __next36pxDefaultSize: __next36pxDefaultSize
-  }, createElement(Select, _extends({}, props, {
+  }, createElement(Select, _extends({}, restProps, {
     __next36pxDefaultSize: __next36pxDefaultSize,
     "aria-describedby": helpId,
     className: "components-select-control__input",
@@ -130,7 +134,6 @@ function UnforwardedSelectControl(_ref, ref) {
       disabled: option.disabled
     }, option.label);
   }))));
-  /* eslint-enable jsx-a11y/no-onchange */
 }
 /**
  * `SelectControl` allows users to select from a single or multiple option menu.

package/build-module/select-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/select-control/index.tsx"],"names":["classNames","useInstanceId","useState","forwardRef","BaseControl","InputBase","Select","SelectControlChevronDown","noop","useUniqueId","idProp","instanceId","SelectControl","id","UnforwardedSelectControl","ref","className","disabled","help","hideLabelFromVision","label","multiple","onBlur","onChange","onFocus","options","size","value","valueProp","labelPosition","children","prefix","suffix","__next36pxDefaultSize","__nextHasNoMarginBottom","props","isFocused","setIsFocused","helpId","undefined","length","handleOnBlur","event","handleOnFocus","handleOnChange","selectedOptions","Array","from","target","filter","selected","newValues","map","classes","option","index","key"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\nimport type { ChangeEvent, FocusEvent, ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport InputBase from '../input-control/input-base';\nimport { Select } from './styles/select-control-styles';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { SelectControlProps } from './types';\nimport SelectControlChevronDown from './chevron-down';\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( SelectControl );\n\tconst id = `inspector-select-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nfunction UnforwardedSelectControl(\n\t{\n\t\tclassName,\n\t\tdisabled = false,\n\t\thelp,\n\t\thideLabelFromVision,\n\t\tid: idProp,\n\t\tlabel,\n\t\tmultiple = false,\n\t\tonBlur = noop,\n\t\tonChange = noop,\n\t\tonFocus = noop,\n\t\toptions = [],\n\t\tsize = 'default',\n\t\tvalue: valueProp,\n\t\tlabelPosition = 'top',\n\t\tchildren,\n\t\tprefix,\n\t\tsuffix,\n\t\t__next36pxDefaultSize = false,\n\t\t__nextHasNoMarginBottom = false,\n\t\t...props\n\t}: WordPressComponentProps< SelectControlProps, 'select', false >,\n\tref: ForwardedRef< HTMLSelectElement >\n) {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\tconst id = useUniqueId( idProp );\n\tconst helpId = help ? `${ id }__help` : undefined;\n\n\t// Disable reason: A select with an onchange throws a warning.\n\tif ( ! options?.length && ! children ) return null;\n\n\tconst handleOnBlur = ( event: FocusEvent< HTMLSelectElement > ) => {\n\t\tonBlur( event );\n\t\tsetIsFocused( false );\n\t};\n\n\tconst handleOnFocus = ( event: FocusEvent< HTMLSelectElement > ) => {\n\t\tonFocus( event );\n\t\tsetIsFocused( true );\n\t};\n\n\tconst handleOnChange = ( event: ChangeEvent< HTMLSelectElement > ) => {\n\t\tif ( multiple ) {\n\t\t\tconst selectedOptions = Array.from( event.target.options ).filter(\n\t\t\t\t( { selected } ) => selected\n\t\t\t);\n\t\t\tconst newValues = selectedOptions.map( ( { value } ) => value );\n\t\t\tonChange( newValues );\n\t\t\treturn;\n\t\t}\n\n\t\tonChange( event.target.value, { event } );\n\t};\n\n\tconst classes = classNames( 'components-select-control', className );\n\n\t/* eslint-disable jsx-a11y/no-onchange */\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\tid={ id }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t>\n\t\t\t<InputBase\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tid={ id }\n\t\t\t\tisFocused={ isFocused }\n\t\t\t\tlabel={ label }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={\n\t\t\t\t\tsuffix || ( ! multiple && <SelectControlChevronDown /> )\n\t\t\t\t}\n\t\t\t\tprefix={ prefix }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t>\n\t\t\t\t<Select\n\t\t\t\t\t{ ...props }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\taria-describedby={ helpId }\n\t\t\t\t\tclassName=\"components-select-control__input\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\t\tonChange={ handleOnChange }\n\t\t\t\t\tonFocus={ handleOnFocus }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\tvalue={ valueProp }\n\t\t\t\t>\n\t\t\t\t\t{ children ||\n\t\t\t\t\t\toptions.map( ( option, index ) => {\n\t\t\t\t\t\t\tconst key =\n\t\t\t\t\t\t\t\toption.id ||\n\t\t\t\t\t\t\t\t`${ option.label }-${ option.value }-${ index }`;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\t\t\t\tdisabled={ option.disabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t</Select>\n\t\t\t</InputBase>\n\t\t</BaseControl>\n\t);\n\t/* eslint-enable jsx-a11y/no-onchange */\n}\n\n/**\n * `SelectControl` allows users to select from a single or multiple option menu.\n * It functions as a wrapper around the browser's native `<select>` element.\n *\n * @example\n * import { SelectControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MySelectControl = () => {\n *   const [ size, setSize ] = useState( '50%' );\n *\n *   return (\n *     <SelectControl\n *       label=\"Size\"\n *       value={ size }\n *       options={ [\n *         { label: 'Big', value: '100%' },\n *         { label: 'Medium', value: '50%' },\n *         { label: 'Small', value: '25%' },\n *       ] }\n *       onChange={ setSize }\n *     />\n *   );\n * };\n */\nexport const SelectControl = forwardRef( UnforwardedSelectControl );\n\nexport default SelectControl;\n"]}
+{"version":3,"sources":["@wordpress/components/src/select-control/index.tsx"],"names":["classNames","useInstanceId","useState","forwardRef","BaseControl","InputBase","Select","SelectControlChevronDown","noop","useUniqueId","idProp","instanceId","SelectControl","id","UnforwardedSelectControl","props","ref","className","disabled","help","hideLabelFromVision","label","multiple","onBlur","onChange","onFocus","options","size","value","valueProp","labelPosition","children","prefix","suffix","__next36pxDefaultSize","__nextHasNoMarginBottom","restProps","isFocused","setIsFocused","helpId","undefined","length","handleOnBlur","event","handleOnFocus","handleOnChange","selectedOptions","Array","from","target","filter","selected","newValues","map","classes","option","index","key"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport InputBase from '../input-control/input-base';\nimport { Select } from './styles/select-control-styles';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { SelectControlProps } from './types';\nimport SelectControlChevronDown from './chevron-down';\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( SelectControl );\n\tconst id = `inspector-select-control-${ instanceId }`;\n\n\treturn idProp || id;\n}\n\nfunction UnforwardedSelectControl(\n\tprops: WordPressComponentProps< SelectControlProps, 'select', false >,\n\tref: React.ForwardedRef< HTMLSelectElement >\n) {\n\tconst {\n\t\tclassName,\n\t\tdisabled = false,\n\t\thelp,\n\t\thideLabelFromVision,\n\t\tid: idProp,\n\t\tlabel,\n\t\tmultiple = false,\n\t\tonBlur = noop,\n\t\tonChange,\n\t\tonFocus = noop,\n\t\toptions = [],\n\t\tsize = 'default',\n\t\tvalue: valueProp,\n\t\tlabelPosition = 'top',\n\t\tchildren,\n\t\tprefix,\n\t\tsuffix,\n\t\t__next36pxDefaultSize = false,\n\t\t__nextHasNoMarginBottom = false,\n\t\t...restProps\n\t} = props;\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\tconst id = useUniqueId( idProp );\n\tconst helpId = help ? `${ id }__help` : undefined;\n\n\t// Disable reason: A select with an onchange throws a warning.\n\tif ( ! options?.length && ! children ) return null;\n\n\tconst handleOnBlur = ( event: React.FocusEvent< HTMLSelectElement > ) => {\n\t\tonBlur( event );\n\t\tsetIsFocused( false );\n\t};\n\n\tconst handleOnFocus = ( event: React.FocusEvent< HTMLSelectElement > ) => {\n\t\tonFocus( event );\n\t\tsetIsFocused( true );\n\t};\n\n\tconst handleOnChange = (\n\t\tevent: React.ChangeEvent< HTMLSelectElement >\n\t) => {\n\t\tif ( props.multiple ) {\n\t\t\tconst selectedOptions = Array.from( event.target.options ).filter(\n\t\t\t\t( { selected } ) => selected\n\t\t\t);\n\t\t\tconst newValues = selectedOptions.map( ( { value } ) => value );\n\t\t\tprops.onChange?.( newValues, { event } );\n\t\t\treturn;\n\t\t}\n\n\t\tprops.onChange?.( event.target.value, { event } );\n\t};\n\n\tconst classes = classNames( 'components-select-control', className );\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ help }\n\t\t\tid={ id }\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t>\n\t\t\t<InputBase\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tid={ id }\n\t\t\t\tisFocused={ isFocused }\n\t\t\t\tlabel={ label }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={\n\t\t\t\t\tsuffix || ( ! multiple && <SelectControlChevronDown /> )\n\t\t\t\t}\n\t\t\t\tprefix={ prefix }\n\t\t\t\tlabelPosition={ labelPosition }\n\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t>\n\t\t\t\t<Select\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\taria-describedby={ helpId }\n\t\t\t\t\tclassName=\"components-select-control__input\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tmultiple={ multiple }\n\t\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\t\tonChange={ handleOnChange }\n\t\t\t\t\tonFocus={ handleOnFocus }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\tvalue={ valueProp }\n\t\t\t\t>\n\t\t\t\t\t{ children ||\n\t\t\t\t\t\toptions.map( ( option, index ) => {\n\t\t\t\t\t\t\tconst key =\n\t\t\t\t\t\t\t\toption.id ||\n\t\t\t\t\t\t\t\t`${ option.label }-${ option.value }-${ index }`;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\tvalue={ option.value }\n\t\t\t\t\t\t\t\t\tdisabled={ option.disabled }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t</Select>\n\t\t\t</InputBase>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `SelectControl` allows users to select from a single or multiple option menu.\n * It functions as a wrapper around the browser's native `<select>` element.\n *\n * @example\n * import { SelectControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MySelectControl = () => {\n *   const [ size, setSize ] = useState( '50%' );\n *\n *   return (\n *     <SelectControl\n *       label=\"Size\"\n *       value={ size }\n *       options={ [\n *         { label: 'Big', value: '100%' },\n *         { label: 'Medium', value: '50%' },\n *         { label: 'Small', value: '25%' },\n *       ] }\n *       onChange={ setSize }\n *     />\n *   );\n * };\n */\nexport const SelectControl = forwardRef( UnforwardedSelectControl );\n\nexport default SelectControl;\n"]}

package/build-module/toolbar/toolbar-button/index.js

@@ -1,15 +1,14 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import { createElement } from "@wordpress/element";
-// @ts-nocheck
 
 /**
  * External dependencies
  */
 import classnames from 'classnames';
+
 /**
  * WordPress dependencies
  */
-
 import { useContext, forwardRef } from '@wordpress/element';
 /**
  * Internal dependencies
@@ -20,15 +19,15 @@ import ToolbarItem from '../toolbar-item';
 import ToolbarContext from '../toolbar-context';
 import ToolbarButtonContainer from './toolbar-button-container';
 
-function ToolbarButton(_ref, ref) {
+function UnforwardedToolbarButton(_ref, ref) {
   let {
-    containerClassName,
+    children,
     className,
+    containerClassName,
     extraProps,
-    children,
-    title,
     isActive,
     isDisabled,
+    title,
     ...props
   } = _ref;
   const accessibleToolbarState = useContext(ToolbarContext);
@@ -43,7 +42,7 @@ function ToolbarButton(_ref, ref) {
       shortcut: props.shortcut,
       "data-subscript": props.subscript,
       onClick: event => {
-        event.stopPropagation();
+        event.stopPropagation(); // TODO: Possible bug; maybe use onClick instead of props.onClick.
 
         if (props.onClick) {
           props.onClick(event);
@@ -63,12 +62,36 @@ function ToolbarButton(_ref, ref) {
     className: classnames('components-toolbar-button', className)
   }, extraProps, props, {
     ref: ref
-  }), toolbarItemProps => createElement(Button, _extends({
+  }), // @ts-expect-error
+  toolbarItemProps => createElement(Button, _extends({
     label: title,
     isPressed: isActive,
     disabled: isDisabled
   }, toolbarItemProps), children));
 }
+/**
+ * ToolbarButton can be used to add actions to a toolbar, usually inside a Toolbar
+ * or ToolbarGroup when used to create general interfaces.
+ *
+ * ```jsx
+ * import { Toolbar, ToolbarButton } from '@wordpress/components';
+ * import { edit } from '@wordpress/icons';
+ *
+ * function MyToolbar() {
+ *   return (
+ *		<Toolbar label="Options">
+ *			<ToolbarButton
+ *				icon={ edit }
+ *				label="Edit"
+ *				onClick={ () => alert( 'Editing' ) }
+ *			/>
+ *		</Toolbar>
+ *   );
+ * }
+ * ```
+ */
+
 
-export default forwardRef(ToolbarButton);
+export const ToolbarButton = forwardRef(UnforwardedToolbarButton);
+export default ToolbarButton;
 //# sourceMappingURL=index.js.map

package/build-module/toolbar/toolbar-button/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/index.js"],"names":["classnames","useContext","forwardRef","Button","ToolbarItem","ToolbarContext","ToolbarButtonContainer","ToolbarButton","ref","containerClassName","className","extraProps","children","title","isActive","isDisabled","props","accessibleToolbarState","icon","shortcut","subscript","event","stopPropagation","onClick","toolbarItemProps"],"mappings":";;AAAA;;AAEA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AACA;AACA;AACA;;AACA,SAASC,UAAT,EAAqBC,UAArB,QAAuC,oBAAvC;AACA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,sBAAP,MAAmC,4BAAnC;;AAEA,SAASC,aAAT,OAWCC,GAXD,EAYE;AAAA,MAXD;AACCC,IAAAA,kBADD;AAECC,IAAAA,SAFD;AAGCC,IAAAA,UAHD;AAICC,IAAAA,QAJD;AAKCC,IAAAA,KALD;AAMCC,IAAAA,QAND;AAOCC,IAAAA,UAPD;AAQC,OAAGC;AARJ,GAWC;AACD,QAAMC,sBAAsB,GAAGhB,UAAU,CAAEI,cAAF,CAAzC;;AAEA,MAAK,CAAEY,sBAAP,EAAgC;AAC/B,WACC,cAAC,sBAAD;AAAwB,MAAA,SAAS,EAAGR;AAApC,OACC,cAAC,MAAD;AACC,MAAA,GAAG,EAAGD,GADP;AAEC,MAAA,IAAI,EAAGQ,KAAK,CAACE,IAFd;AAGC,MAAA,KAAK,EAAGL,KAHT;AAIC,MAAA,QAAQ,EAAGG,KAAK,CAACG,QAJlB;AAKC,wBAAiBH,KAAK,CAACI,SALxB;AAMC,MAAA,OAAO,EAAKC,KAAF,IAAa;AACtBA,QAAAA,KAAK,CAACC,eAAN;;AACA,YAAKN,KAAK,CAACO,OAAX,EAAqB;AACpBP,UAAAA,KAAK,CAACO,OAAN,CAAeF,KAAf;AACA;AACD,OAXF;AAYC,MAAA,SAAS,EAAGrB,UAAU,CACrB,6BADqB,EAErBU,SAFqB,CAZvB;AAgBC,MAAA,SAAS,EAAGI,QAhBb;AAiBC,MAAA,QAAQ,EAAGC,UAjBZ;AAkBC;AAlBD,OAmBMJ,UAnBN,EAoBMK,KApBN,GAsBGJ,QAtBH,CADD,CADD;AA4BA,GAhCA,CAkCD;AACA;AACA;;;AACA,SACC,cAAC,WAAD;AACC,IAAA,SAAS,EAAGZ,UAAU,CAAE,2BAAF,EAA+BU,SAA/B;AADvB,KAEMC,UAFN,EAGMK,KAHN;AAIC,IAAA,GAAG,EAAGR;AAJP,MAMKgB,gBAAF,IACD,cAAC,MAAD;AACC,IAAA,KAAK,EAAGX,KADT;AAEC,IAAA,SAAS,EAAGC,QAFb;AAGC,IAAA,QAAQ,EAAGC;AAHZ,KAIMS,gBAJN,GAMGZ,QANH,CAPF,CADD;AAmBA;;AAED,eAAeV,UAAU,CAAEK,aAAF,CAAzB","sourcesContent":["// @ts-nocheck\n\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\n/**\n * WordPress dependencies\n */\nimport { useContext, forwardRef } from '@wordpress/element';\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarButtonContainer from './toolbar-button-container';\n\nfunction ToolbarButton(\n\t{\n\t\tcontainerClassName,\n\t\tclassName,\n\t\textraProps,\n\t\tchildren,\n\t\ttitle,\n\t\tisActive,\n\t\tisDisabled,\n\t\t...props\n\t},\n\tref\n) {\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ! accessibleToolbarState ) {\n\t\treturn (\n\t\t\t<ToolbarButtonContainer className={ containerClassName }>\n\t\t\t\t<Button\n\t\t\t\t\tref={ ref }\n\t\t\t\t\ticon={ props.icon }\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tshortcut={ props.shortcut }\n\t\t\t\t\tdata-subscript={ props.subscript }\n\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tif ( props.onClick ) {\n\t\t\t\t\t\t\tprops.onClick( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-toolbar__control',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tdata-toolbar-item\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t</ToolbarButtonContainer>\n\t\t);\n\t}\n\n\t// ToobarItem will pass all props to the render prop child, which will pass\n\t// all props to Button. This means that ToolbarButton has the same API as\n\t// Button.\n\treturn (\n\t\t<ToolbarItem\n\t\t\tclassName={ classnames( 'components-toolbar-button', className ) }\n\t\t\t{ ...extraProps }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{ ( toolbarItemProps ) => (\n\t\t\t\t<Button\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t{ ...toolbarItemProps }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</ToolbarItem>\n\t);\n}\n\nexport default forwardRef( ToolbarButton );\n"]}
+{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/index.tsx"],"names":["classnames","useContext","forwardRef","Button","ToolbarItem","ToolbarContext","ToolbarButtonContainer","UnforwardedToolbarButton","ref","children","className","containerClassName","extraProps","isActive","isDisabled","title","props","accessibleToolbarState","icon","shortcut","subscript","event","stopPropagation","onClick","toolbarItemProps","ToolbarButton"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;;AAGA;AACA;AACA;AACA,SAASC,UAAT,EAAqBC,UAArB,QAAuC,oBAAvC;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AACA,OAAOC,cAAP,MAA2B,oBAA3B;AACA,OAAOC,sBAAP,MAAmC,4BAAnC;;AAKA,SAASC,wBAAT,OAWCC,GAXD,EAYE;AAAA,MAXD;AACCC,IAAAA,QADD;AAECC,IAAAA,SAFD;AAGCC,IAAAA,kBAHD;AAICC,IAAAA,UAJD;AAKCC,IAAAA,QALD;AAMCC,IAAAA,UAND;AAOCC,IAAAA,KAPD;AAQC,OAAGC;AARJ,GAWC;AACD,QAAMC,sBAAsB,GAAGhB,UAAU,CAAEI,cAAF,CAAzC;;AAEA,MAAK,CAAEY,sBAAP,EAAgC;AAC/B,WACC,cAAC,sBAAD;AAAwB,MAAA,SAAS,EAAGN;AAApC,OACC,cAAC,MAAD;AACC,MAAA,GAAG,EAAGH,GADP;AAEC,MAAA,IAAI,EAAGQ,KAAK,CAACE,IAFd;AAGC,MAAA,KAAK,EAAGH,KAHT;AAIC,MAAA,QAAQ,EAAGC,KAAK,CAACG,QAJlB;AAKC,wBAAiBH,KAAK,CAACI,SALxB;AAMC,MAAA,OAAO,EACNC,KADS,IAKL;AACJA,QAAAA,KAAK,CAACC,eAAN,GADI,CAEJ;;AACA,YAAKN,KAAK,CAACO,OAAX,EAAqB;AACpBP,UAAAA,KAAK,CAACO,OAAN,CAAeF,KAAf;AACA;AACD,OAjBF;AAkBC,MAAA,SAAS,EAAGrB,UAAU,CACrB,6BADqB,EAErBU,SAFqB,CAlBvB;AAsBC,MAAA,SAAS,EAAGG,QAtBb;AAuBC,MAAA,QAAQ,EAAGC,UAvBZ;AAwBC;AAxBD,OAyBMF,UAzBN,EA0BMI,KA1BN,GA4BGP,QA5BH,CADD,CADD;AAkCA,GAtCA,CAwCD;AACA;AACA;;;AACA,SACC,cAAC,WAAD;AACC,IAAA,SAAS,EAAGT,UAAU,CAAE,2BAAF,EAA+BU,SAA/B;AADvB,KAEME,UAFN,EAGMI,KAHN;AAIC,IAAA,GAAG,EAAGR;AAJP,MAOE;AACEgB,EAAAA,gBAAF,IACC,cAAC,MAAD;AACC,IAAA,KAAK,EAAGT,KADT;AAEC,IAAA,SAAS,EAAGF,QAFb;AAGC,IAAA,QAAQ,EAAGC;AAHZ,KAIMU,gBAJN,GAMGf,QANH,CATH,CADD;AAsBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAMgB,aAAa,GAAGvB,UAAU,CAAEK,wBAAF,CAAhC;AACP,eAAekB,aAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport ToolbarItem from '../toolbar-item';\nimport ToolbarContext from '../toolbar-context';\nimport ToolbarButtonContainer from './toolbar-button-container';\nimport type { ToolbarButtonProps } from './types';\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type React from 'react';\n\nfunction UnforwardedToolbarButton(\n\t{\n\t\tchildren,\n\t\tclassName,\n\t\tcontainerClassName,\n\t\textraProps,\n\t\tisActive,\n\t\tisDisabled,\n\t\ttitle,\n\t\t...props\n\t}: WordPressComponentProps< ToolbarButtonProps, typeof Button, false >,\n\tref: ForwardedRef< any >\n) {\n\tconst accessibleToolbarState = useContext( ToolbarContext );\n\n\tif ( ! accessibleToolbarState ) {\n\t\treturn (\n\t\t\t<ToolbarButtonContainer className={ containerClassName }>\n\t\t\t\t<Button\n\t\t\t\t\tref={ ref }\n\t\t\t\t\ticon={ props.icon }\n\t\t\t\t\tlabel={ title }\n\t\t\t\t\tshortcut={ props.shortcut }\n\t\t\t\t\tdata-subscript={ props.subscript }\n\t\t\t\t\tonClick={ (\n\t\t\t\t\t\tevent: React.MouseEvent<\n\t\t\t\t\t\t\tHTMLButtonElement & HTMLAnchorElement,\n\t\t\t\t\t\t\tMouseEvent\n\t\t\t\t\t\t>\n\t\t\t\t\t) => {\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t// TODO: Possible bug; maybe use onClick instead of props.onClick.\n\t\t\t\t\t\tif ( props.onClick ) {\n\t\t\t\t\t\t\tprops.onClick( event );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-toolbar__control',\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tdata-toolbar-item\n\t\t\t\t\t{ ...extraProps }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ children }\n\t\t\t\t</Button>\n\t\t\t</ToolbarButtonContainer>\n\t\t);\n\t}\n\n\t// ToobarItem will pass all props to the render prop child, which will pass\n\t// all props to Button. This means that ToolbarButton has the same API as\n\t// Button.\n\treturn (\n\t\t<ToolbarItem\n\t\t\tclassName={ classnames( 'components-toolbar-button', className ) }\n\t\t\t{ ...extraProps }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t>\n\t\t\t{\n\t\t\t\t// @ts-expect-error\n\t\t\t\t( toolbarItemProps ) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tlabel={ title }\n\t\t\t\t\t\tisPressed={ isActive }\n\t\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\t\t{ ...toolbarItemProps }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</Button>\n\t\t\t\t)\n\t\t\t}\n\t\t</ToolbarItem>\n\t);\n}\n\n/**\n * ToolbarButton can be used to add actions to a toolbar, usually inside a Toolbar\n * or ToolbarGroup when used to create general interfaces.\n *\n * ```jsx\n * import { Toolbar, ToolbarButton } from '@wordpress/components';\n * import { edit } from '@wordpress/icons';\n *\n * function MyToolbar() {\n *   return (\n *\t\t<Toolbar label=\"Options\">\n *\t\t\t<ToolbarButton\n *\t\t\t\ticon={ edit }\n *\t\t\t\tlabel=\"Edit\"\n *\t\t\t\tonClick={ () => alert( 'Editing' ) }\n *\t\t\t/>\n *\t\t</Toolbar>\n *   );\n * }\n * ```\n */\nexport const ToolbarButton = forwardRef( UnforwardedToolbarButton );\nexport default ToolbarButton;\n"]}

package/build-module/toolbar/toolbar-button/toolbar-button-container.js

@@ -1,9 +1,17 @@
 import { createElement } from "@wordpress/element";
 
-// @ts-nocheck
-const ToolbarButtonContainer = props => createElement("div", {
-  className: props.className
-}, props.children);
+/**
+ * Internal dependencies
+ */
+const ToolbarButtonContainer = _ref => {
+  let {
+    children,
+    className
+  } = _ref;
+  return createElement("div", {
+    className: className
+  }, children);
+};
 
 export default ToolbarButtonContainer;
 //# sourceMappingURL=toolbar-button-container.js.map

package/build-module/toolbar/toolbar-button/toolbar-button-container.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/toolbar-button-container.js"],"names":["ToolbarButtonContainer","props","className","children"],"mappings":";;AAAA;AAEA,MAAMA,sBAAsB,GAAKC,KAAF,IAC9B;AAAK,EAAA,SAAS,EAAGA,KAAK,CAACC;AAAvB,GAAqCD,KAAK,CAACE,QAA3C,CADD;;AAGA,eAAeH,sBAAf","sourcesContent":["// @ts-nocheck\n\nconst ToolbarButtonContainer = ( props ) => (\n\t<div className={ props.className }>{ props.children }</div>\n);\nexport default ToolbarButtonContainer;\n"]}
+{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-button/toolbar-button-container.tsx"],"names":["ToolbarButtonContainer","children","className"],"mappings":";;AAAA;AACA;AACA;AAGA,MAAMA,sBAAsB,GAAG;AAAA,MAAE;AAChCC,IAAAA,QADgC;AAEhCC,IAAAA;AAFgC,GAAF;AAAA,SAI9B;AAAK,IAAA,SAAS,EAAGA;AAAjB,KAA+BD,QAA/B,CAJ8B;AAAA,CAA/B;;AAOA,eAAeD,sBAAf","sourcesContent":["/**\n * Internal dependencies\n */\nimport type { ToolbarButtonContainerProps } from './types';\n\nconst ToolbarButtonContainer = ( {\n\tchildren,\n\tclassName,\n}: ToolbarButtonContainerProps ) => (\n\t<div className={ className }>{ children }</div>\n);\n\nexport default ToolbarButtonContainer;\n"]}

package/build-module/toolbar/toolbar-button/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/build-module/toolbar/toolbar-button/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/build-module/toolbar/toolbar-context/index.js

@@ -1,9 +1,11 @@
-// @ts-nocheck
+/**
+ * External dependencies
+ */
 
 /**
  * WordPress dependencies
  */
 import { createContext } from '@wordpress/element';
-const ToolbarContext = createContext();
+const ToolbarContext = createContext(undefined);
 export default ToolbarContext;
 //# sourceMappingURL=index.js.map

package/build-module/toolbar/toolbar-context/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-context/index.js"],"names":["createContext","ToolbarContext"],"mappings":"AAAA;;AAEA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AAEA,MAAMC,cAAc,GAAGD,aAAa,EAApC;AAEA,eAAeC,cAAf","sourcesContent":["// @ts-nocheck\n\n/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nconst ToolbarContext = createContext();\n\nexport default ToolbarContext;\n"]}
+{"version":3,"sources":["@wordpress/components/src/toolbar/toolbar-context/index.ts"],"names":["createContext","ToolbarContext","undefined"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AAEA,MAAMC,cAAc,GAAGD,aAAa,CACnCE,SADmC,CAApC;AAIA,eAAeD,cAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ToolbarStateReturn } from 'reakit/Toolbar';\n\n/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nconst ToolbarContext = createContext< ToolbarStateReturn | undefined >(\n\tundefined\n);\n\nexport default ToolbarContext;\n"]}

package/build-module/tools-panel/context.js

@@ -19,6 +19,8 @@ export const ToolsPanelContext = createContext({
   registerPanelItem: noop,
   deregisterPanelItem: noop,
   flagItemCustomization: noop,
+  registerResetAllFilter: noop,
+  deregisterResetAllFilter: noop,
   areAllOptionalControlsHidden: true
 });
 export const useToolsPanelContext = () => useContext(ToolsPanelContext);

package/build-module/tools-panel/context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/tools-panel/context.ts"],"names":["createContext","useContext","noop","undefined","ToolsPanelContext","menuItems","default","optional","hasMenuItems","isResetting","shouldRenderPlaceholderItems","registerPanelItem","deregisterPanelItem","flagItemCustomization","areAllOptionalControlsHidden","useToolsPanelContext"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,oBAA1C;AAEA;AACA;AACA;;AAGA,MAAMC,IAAI,GAAG,MAAMC,SAAnB;;AAEA,OAAO,MAAMC,iBAAiB,GAAGJ,aAAa,CAA2B;AACxEK,EAAAA,SAAS,EAAE;AAAEC,IAAAA,OAAO,EAAE,EAAX;AAAeC,IAAAA,QAAQ,EAAE;AAAzB,GAD6D;AAExEC,EAAAA,YAAY,EAAE,KAF0D;AAGxEC,EAAAA,WAAW,EAAE,KAH2D;AAIxEC,EAAAA,4BAA4B,EAAE,KAJ0C;AAKxEC,EAAAA,iBAAiB,EAAET,IALqD;AAMxEU,EAAAA,mBAAmB,EAAEV,IANmD;AAOxEW,EAAAA,qBAAqB,EAAEX,IAPiD;AAQxEY,EAAAA,4BAA4B,EAAE;AAR0C,CAA3B,CAAvC;AAWP,OAAO,MAAMC,oBAAoB,GAAG,MACnCd,UAAU,CAA2BG,iBAA3B,CADJ","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { ToolsPanelContext as ToolsPanelContextType } from './types';\n\nconst noop = () => undefined;\n\nexport const ToolsPanelContext = createContext< ToolsPanelContextType >( {\n\tmenuItems: { default: {}, optional: {} },\n\thasMenuItems: false,\n\tisResetting: false,\n\tshouldRenderPlaceholderItems: false,\n\tregisterPanelItem: noop,\n\tderegisterPanelItem: noop,\n\tflagItemCustomization: noop,\n\tareAllOptionalControlsHidden: true,\n} );\n\nexport const useToolsPanelContext = () =>\n\tuseContext< ToolsPanelContextType >( ToolsPanelContext );\n"]}
+{"version":3,"sources":["@wordpress/components/src/tools-panel/context.ts"],"names":["createContext","useContext","noop","undefined","ToolsPanelContext","menuItems","default","optional","hasMenuItems","isResetting","shouldRenderPlaceholderItems","registerPanelItem","deregisterPanelItem","flagItemCustomization","registerResetAllFilter","deregisterResetAllFilter","areAllOptionalControlsHidden","useToolsPanelContext"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,aAAT,EAAwBC,UAAxB,QAA0C,oBAA1C;AAEA;AACA;AACA;;AAGA,MAAMC,IAAI,GAAG,MAAMC,SAAnB;;AAEA,OAAO,MAAMC,iBAAiB,GAAGJ,aAAa,CAA2B;AACxEK,EAAAA,SAAS,EAAE;AAAEC,IAAAA,OAAO,EAAE,EAAX;AAAeC,IAAAA,QAAQ,EAAE;AAAzB,GAD6D;AAExEC,EAAAA,YAAY,EAAE,KAF0D;AAGxEC,EAAAA,WAAW,EAAE,KAH2D;AAIxEC,EAAAA,4BAA4B,EAAE,KAJ0C;AAKxEC,EAAAA,iBAAiB,EAAET,IALqD;AAMxEU,EAAAA,mBAAmB,EAAEV,IANmD;AAOxEW,EAAAA,qBAAqB,EAAEX,IAPiD;AAQxEY,EAAAA,sBAAsB,EAAEZ,IARgD;AASxEa,EAAAA,wBAAwB,EAAEb,IAT8C;AAUxEc,EAAAA,4BAA4B,EAAE;AAV0C,CAA3B,CAAvC;AAaP,OAAO,MAAMC,oBAAoB,GAAG,MACnChB,UAAU,CAA2BG,iBAA3B,CADJ","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { ToolsPanelContext as ToolsPanelContextType } from './types';\n\nconst noop = () => undefined;\n\nexport const ToolsPanelContext = createContext< ToolsPanelContextType >( {\n\tmenuItems: { default: {}, optional: {} },\n\thasMenuItems: false,\n\tisResetting: false,\n\tshouldRenderPlaceholderItems: false,\n\tregisterPanelItem: noop,\n\tderegisterPanelItem: noop,\n\tflagItemCustomization: noop,\n\tregisterResetAllFilter: noop,\n\tderegisterResetAllFilter: noop,\n\tareAllOptionalControlsHidden: true,\n} );\n\nexport const useToolsPanelContext = () =>\n\tuseContext< ToolsPanelContextType >( ToolsPanelContext );\n"]}

package/build-module/tools-panel/tools-panel/hook.js

@@ -67,6 +67,7 @@ export function useToolsPanel(props) {
   }, [wasResetting]); // Allow panel items to register themselves.
 
   const [panelItems, setPanelItems] = useState([]);
+  const [resetAllFilters, setResetAllFilters] = useState([]);
   const registerPanelItem = useCallback(item => {
     setPanelItems(items => {
       const newItems = [...items]; // If an item with this label has already been registered, remove it
@@ -99,7 +100,17 @@ export function useToolsPanel(props) {
 
       return newItems;
     });
-  }, [setPanelItems]); // Manage and share display state of menu items representing child controls.
+  }, [setPanelItems]);
+  const registerResetAllFilter = useCallback(newFilter => {
+    setResetAllFilters(filters => {
+      return [...filters, newFilter];
+    });
+  }, [setResetAllFilters]);
+  const deregisterResetAllFilter = useCallback(filterToRemove => {
+    setResetAllFilters(filters => {
+      return filters.filter(filter => filter !== filterToRemove);
+    });
+  }, [setResetAllFilters]); // Manage and share display state of menu items representing child controls.
 
   const [menuItems, setMenuItems] = useState({
     default: {},
@@ -171,15 +182,8 @@ export function useToolsPanel(props) {
 
   const resetAllItems = useCallback(() => {
     if (typeof resetAll === 'function') {
-      isResetting.current = true; // Collect available reset filters from panel items.
-
-      const filters = [];
-      panelItems.forEach(item => {
-        if (item.resetAllFilter) {
-          filters.push(item.resetAllFilter);
-        }
-      });
-      resetAll(filters);
+      isResetting.current = true;
+      resetAll(resetAllFilters);
     } // Turn off display of all non-default items.
 
 
@@ -188,7 +192,7 @@ export function useToolsPanel(props) {
       shouldReset: true
     });
     setMenuItems(resetMenuItems);
-  }, [panelItems, resetAll, setMenuItems]); // Assist ItemGroup styling when there are potentially hidden placeholder
+  }, [panelItems, resetAllFilters, resetAll, setMenuItems]); // Assist ItemGroup styling when there are potentially hidden placeholder
   // items by identifying first & last items that are toggled on for display.
 
   const getFirstVisibleItemLabel = items => {
@@ -202,6 +206,7 @@ export function useToolsPanel(props) {
   const panelContext = useMemo(() => ({
     areAllOptionalControlsHidden,
     deregisterPanelItem,
+    deregisterResetAllFilter,
     firstDisplayedItem,
     flagItemCustomization,
     hasMenuItems: !!panelItems.length,
@@ -210,10 +215,11 @@ export function useToolsPanel(props) {
     menuItems,
     panelId,
     registerPanelItem,
+    registerResetAllFilter,
     shouldRenderPlaceholderItems,
     __experimentalFirstVisibleItemClass,
     __experimentalLastVisibleItemClass
-  }), [areAllOptionalControlsHidden, deregisterPanelItem, firstDisplayedItem, flagItemCustomization, lastDisplayedItem, menuItems, panelId, panelItems, registerPanelItem, shouldRenderPlaceholderItems, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]);
+  }), [areAllOptionalControlsHidden, deregisterPanelItem, deregisterResetAllFilter, firstDisplayedItem, flagItemCustomization, lastDisplayedItem, menuItems, panelId, panelItems, registerResetAllFilter, registerPanelItem, shouldRenderPlaceholderItems, __experimentalFirstVisibleItemClass, __experimentalLastVisibleItemClass]);
   return { ...otherProps,
     headingLevel,
     panelContext,