@wordpress/components 19.2.1-next.33ec3857e2.0 → 19.4.0

package/build/card/card/component.js

@@ -60,7 +60,7 @@ function Card(props, forwardedRef) {
   const cx = (0, _useCx.useCx)();
   const elevationClassName = (0, _element.useMemo)(() => cx( /*#__PURE__*/(0, _react.css)({
     borderRadius: elevationBorderRadius
-  }, process.env.NODE_ENV === "production" ? "" : ";label:elevationClassName;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY2FyZC9jYXJkL2NvbXBvbmVudC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1Q1kiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9jYXJkL2NhcmQvY29tcG9uZW50LmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNvbnRleHRDb25uZWN0LCBDb250ZXh0U3lzdGVtUHJvdmlkZXIgfSBmcm9tICcuLi8uLi91aS9jb250ZXh0JztcbmltcG9ydCB7IEVsZXZhdGlvbiB9IGZyb20gJy4uLy4uL2VsZXZhdGlvbic7XG5pbXBvcnQgeyBWaWV3IH0gZnJvbSAnLi4vLi4vdmlldyc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi4vc3R5bGVzJztcbmltcG9ydCB7IHVzZUNhcmQgfSBmcm9tICcuL2hvb2snO1xuaW1wb3J0IENPTkZJRyBmcm9tICcuLi8uLi91dGlscy9jb25maWctdmFsdWVzJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcblxuLyoqXG4gKiBAcGFyYW0ge2ltcG9ydCgnLi4vLi4vdWkvY29udGV4dCcpLldvcmRQcmVzc0NvbXBvbmVudFByb3BzPGltcG9ydCgnLi4vdHlwZXMnKS5Qcm9wcywgJ2Rpdic+fSBwcm9wc1xuICogQHBhcmFtIHtpbXBvcnQoJ3JlYWN0JykuUmVmPGFueT59ICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZm9yd2FyZGVkUmVmXG4gKi9cbmZ1bmN0aW9uIENhcmQoIHByb3BzLCBmb3J3YXJkZWRSZWYgKSB7XG5cdGNvbnN0IHtcblx0XHRjaGlsZHJlbixcblx0XHRlbGV2YXRpb24sXG5cdFx0aXNCb3JkZXJsZXNzLFxuXHRcdGlzUm91bmRlZCxcblx0XHRzaXplLFxuXHRcdC4uLm90aGVyUHJvcHNcblx0fSA9IHVzZUNhcmQoIHByb3BzICk7XG5cdGNvbnN0IGVsZXZhdGlvbkJvcmRlclJhZGl1cyA9IGlzUm91bmRlZCA/IENPTkZJRy5jYXJkQm9yZGVyUmFkaXVzIDogMDtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgZWxldmF0aW9uQ2xhc3NOYW1lID0gdXNlTWVtbyhcblx0XHQoKSA9PiBjeCggY3NzKCB7IGJvcmRlclJhZGl1czogZWxldmF0aW9uQm9yZGVyUmFkaXVzIH0gKSApLFxuXHRcdFsgZWxldmF0aW9uQm9yZGVyUmFkaXVzIF1cblx0KTtcblxuXHRjb25zdCBjb250ZXh0UHJvdmlkZXJWYWx1ZSA9IHVzZU1lbW8oICgpID0+IHtcblx0XHRjb25zdCBjb250ZXh0UHJvcHMgPSB7XG5cdFx0XHRzaXplLFxuXHRcdFx0aXNCb3JkZXJsZXNzLFxuXHRcdH07XG5cdFx0cmV0dXJuIHtcblx0XHRcdENhcmRCb2R5OiBjb250ZXh0UHJvcHMsXG5cdFx0XHRDYXJkSGVhZGVyOiBjb250ZXh0UHJvcHMsXG5cdFx0XHRDYXJkRm9vdGVyOiBjb250ZXh0UHJvcHMsXG5cdFx0fTtcblx0fSwgWyBpc0JvcmRlcmxlc3MsIHNpemUgXSApO1xuXG5cdHJldHVybiAoXG5cdFx0PENvbnRleHRTeXN0ZW1Qcm92aWRlciB2YWx1ZT17IGNvbnRleHRQcm92aWRlclZhbHVlIH0+XG5cdFx0XHQ8VmlldyB7IC4uLm90aGVyUHJvcHMgfSByZWY9eyBmb3J3YXJkZWRSZWYgfT5cblx0XHRcdFx0PFZpZXcgY2xhc3NOYW1lPXsgY3goIHN0eWxlcy5Db250ZW50ICkgfT57IGNoaWxkcmVuIH08L1ZpZXc+XG5cdFx0XHRcdDxFbGV2YXRpb25cblx0XHRcdFx0XHRjbGFzc05hbWU9eyBlbGV2YXRpb25DbGFzc05hbWUgfVxuXHRcdFx0XHRcdGlzSW50ZXJhY3RpdmU9eyBmYWxzZSB9XG5cdFx0XHRcdFx0dmFsdWU9eyBlbGV2YXRpb24gPyAxIDogMCB9XG5cdFx0XHRcdC8+XG5cdFx0XHRcdDxFbGV2YXRpb25cblx0XHRcdFx0XHRjbGFzc05hbWU9eyBlbGV2YXRpb25DbGFzc05hbWUgfVxuXHRcdFx0XHRcdGlzSW50ZXJhY3RpdmU9eyBmYWxzZSB9XG5cdFx0XHRcdFx0dmFsdWU9eyBlbGV2YXRpb24gfVxuXHRcdFx0XHQvPlxuXHRcdFx0PC9WaWV3PlxuXHRcdDwvQ29udGV4dFN5c3RlbVByb3ZpZGVyPlxuXHQpO1xufVxuXG4vKipcbiAqIGBDYXJkYCBwcm92aWRlcyBhIGZsZXhpYmxlIGFuZCBleHRlbnNpYmxlIGNvbnRlbnQgY29udGFpbmVyLlxuICogYENhcmRgIGFsc28gcHJvdmlkZXMgYSBjb252ZW5pZW50IHNldCBvZiBzdWItY29tcG9uZW50cyBzdWNoIGFzIGBDYXJkQm9keWAsXG4gKiBgQ2FyZEhlYWRlcmAsIGBDYXJkRm9vdGVyYCwgYW5kIG1vcmUuXG4gKlxuICogQGV4YW1wbGVcbiAqIGBgYGpzeFxuICogaW1wb3J0IHtcbiAqICAgQ2FyZCxcbiAqICAgQ2FyZEhlYWRlcixcbiAqICAgQ2FyZEJvZHksXG4gKiAgIENhcmRGb290ZXIsXG4gKiAgIFRleHQsXG4gKiAgIEhlYWRpbmcsXG4gKiB9IGZyb20gYEB3b3JkcHJlc3MvY29tcG9uZW50c2A7XG4gKlxuICogZnVuY3Rpb24gRXhhbXBsZSgpIHtcbiAqICAgcmV0dXJuIChcbiAqICAgICA8Q2FyZD5cbiAqICAgICAgIDxDYXJkSGVhZGVyPlxuICogICAgICAgICA8SGVhZGluZyBzaXplPXsgNCB9PkNhcmQgVGl0bGU8L0hlYWRpbmc+XG4gKiAgICAgICA8L0NhcmRIZWFkZXI+XG4gKiAgICAgICA8Q2FyZEJvZHk+XG4gKiAgICAgICAgIDxUZXh0PkNhcmQgQ29udGVudDwvVGV4dD5cbiAqICAgICAgIDwvQ2FyZEJvZHk+XG4gKiAgICAgICA8Q2FyZEZvb3Rlcj5cbiAqICAgICAgICAgPFRleHQ+Q2FyZCBGb290ZXI8L1RleHQ+XG4gKiAgICAgICA8L0NhcmRGb290ZXI+XG4gKiAgICAgPC9DYXJkPlxuICogICApO1xuICogfVxuICogYGBgXG4gKi9cbmNvbnN0IENvbm5lY3RlZENhcmQgPSBjb250ZXh0Q29ubmVjdCggQ2FyZCwgJ0NhcmQnICk7XG5cbmV4cG9ydCBkZWZhdWx0IENvbm5lY3RlZENhcmQ7XG4iXX0= */")), [elevationBorderRadius]);
+  }, process.env.NODE_ENV === "production" ? "" : ";label:elevationClassName;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY2FyZC9jYXJkL2NvbXBvbmVudC5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1Q1kiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9jYXJkL2NhcmQvY29tcG9uZW50LmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIFdvcmRQcmVzcyBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgdXNlTWVtbyB9IGZyb20gJ0B3b3JkcHJlc3MvZWxlbWVudCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNvbnRleHRDb25uZWN0LCBDb250ZXh0U3lzdGVtUHJvdmlkZXIgfSBmcm9tICcuLi8uLi91aS9jb250ZXh0JztcbmltcG9ydCB7IEVsZXZhdGlvbiB9IGZyb20gJy4uLy4uL2VsZXZhdGlvbic7XG5pbXBvcnQgeyBWaWV3IH0gZnJvbSAnLi4vLi4vdmlldyc7XG5pbXBvcnQgKiBhcyBzdHlsZXMgZnJvbSAnLi4vc3R5bGVzJztcbmltcG9ydCB7IHVzZUNhcmQgfSBmcm9tICcuL2hvb2snO1xuaW1wb3J0IENPTkZJRyBmcm9tICcuLi8uLi91dGlscy9jb25maWctdmFsdWVzJztcbmltcG9ydCB7IHVzZUN4IH0gZnJvbSAnLi4vLi4vdXRpbHMvaG9va3MvdXNlLWN4JztcblxuLyoqXG4gKiBAcGFyYW0ge2ltcG9ydCgnLi4vLi4vdWkvY29udGV4dCcpLldvcmRQcmVzc0NvbXBvbmVudFByb3BzPGltcG9ydCgnLi4vdHlwZXMnKS5Qcm9wcywgJ2Rpdic+fSBwcm9wc1xuICogQHBhcmFtIHtpbXBvcnQoJ3JlYWN0JykuUmVmPGFueT59ICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZm9yd2FyZGVkUmVmXG4gKi9cbmZ1bmN0aW9uIENhcmQoIHByb3BzLCBmb3J3YXJkZWRSZWYgKSB7XG5cdGNvbnN0IHtcblx0XHRjaGlsZHJlbixcblx0XHRlbGV2YXRpb24sXG5cdFx0aXNCb3JkZXJsZXNzLFxuXHRcdGlzUm91bmRlZCxcblx0XHRzaXplLFxuXHRcdC4uLm90aGVyUHJvcHNcblx0fSA9IHVzZUNhcmQoIHByb3BzICk7XG5cdGNvbnN0IGVsZXZhdGlvbkJvcmRlclJhZGl1cyA9IGlzUm91bmRlZCA/IENPTkZJRy5jYXJkQm9yZGVyUmFkaXVzIDogMDtcblxuXHRjb25zdCBjeCA9IHVzZUN4KCk7XG5cblx0Y29uc3QgZWxldmF0aW9uQ2xhc3NOYW1lID0gdXNlTWVtbyhcblx0XHQoKSA9PiBjeCggY3NzKCB7IGJvcmRlclJhZGl1czogZWxldmF0aW9uQm9yZGVyUmFkaXVzIH0gKSApLFxuXHRcdFsgY3gsIGVsZXZhdGlvbkJvcmRlclJhZGl1cyBdXG5cdCk7XG5cblx0Y29uc3QgY29udGV4dFByb3ZpZGVyVmFsdWUgPSB1c2VNZW1vKCAoKSA9PiB7XG5cdFx0Y29uc3QgY29udGV4dFByb3BzID0ge1xuXHRcdFx0c2l6ZSxcblx0XHRcdGlzQm9yZGVybGVzcyxcblx0XHR9O1xuXHRcdHJldHVybiB7XG5cdFx0XHRDYXJkQm9keTogY29udGV4dFByb3BzLFxuXHRcdFx0Q2FyZEhlYWRlcjogY29udGV4dFByb3BzLFxuXHRcdFx0Q2FyZEZvb3RlcjogY29udGV4dFByb3BzLFxuXHRcdH07XG5cdH0sIFsgaXNCb3JkZXJsZXNzLCBzaXplIF0gKTtcblxuXHRyZXR1cm4gKFxuXHRcdDxDb250ZXh0U3lzdGVtUHJvdmlkZXIgdmFsdWU9eyBjb250ZXh0UHJvdmlkZXJWYWx1ZSB9PlxuXHRcdFx0PFZpZXcgeyAuLi5vdGhlclByb3BzIH0gcmVmPXsgZm9yd2FyZGVkUmVmIH0+XG5cdFx0XHRcdDxWaWV3IGNsYXNzTmFtZT17IGN4KCBzdHlsZXMuQ29udGVudCApIH0+eyBjaGlsZHJlbiB9PC9WaWV3PlxuXHRcdFx0XHQ8RWxldmF0aW9uXG5cdFx0XHRcdFx0Y2xhc3NOYW1lPXsgZWxldmF0aW9uQ2xhc3NOYW1lIH1cblx0XHRcdFx0XHRpc0ludGVyYWN0aXZlPXsgZmFsc2UgfVxuXHRcdFx0XHRcdHZhbHVlPXsgZWxldmF0aW9uID8gMSA6IDAgfVxuXHRcdFx0XHQvPlxuXHRcdFx0XHQ8RWxldmF0aW9uXG5cdFx0XHRcdFx0Y2xhc3NOYW1lPXsgZWxldmF0aW9uQ2xhc3NOYW1lIH1cblx0XHRcdFx0XHRpc0ludGVyYWN0aXZlPXsgZmFsc2UgfVxuXHRcdFx0XHRcdHZhbHVlPXsgZWxldmF0aW9uIH1cblx0XHRcdFx0Lz5cblx0XHRcdDwvVmlldz5cblx0XHQ8L0NvbnRleHRTeXN0ZW1Qcm92aWRlcj5cblx0KTtcbn1cblxuLyoqXG4gKiBgQ2FyZGAgcHJvdmlkZXMgYSBmbGV4aWJsZSBhbmQgZXh0ZW5zaWJsZSBjb250ZW50IGNvbnRhaW5lci5cbiAqIGBDYXJkYCBhbHNvIHByb3ZpZGVzIGEgY29udmVuaWVudCBzZXQgb2Ygc3ViLWNvbXBvbmVudHMgc3VjaCBhcyBgQ2FyZEJvZHlgLFxuICogYENhcmRIZWFkZXJgLCBgQ2FyZEZvb3RlcmAsIGFuZCBtb3JlLlxuICpcbiAqIEBleGFtcGxlXG4gKiBgYGBqc3hcbiAqIGltcG9ydCB7XG4gKiAgIENhcmQsXG4gKiAgIENhcmRIZWFkZXIsXG4gKiAgIENhcmRCb2R5LFxuICogICBDYXJkRm9vdGVyLFxuICogICBUZXh0LFxuICogICBIZWFkaW5nLFxuICogfSBmcm9tIGBAd29yZHByZXNzL2NvbXBvbmVudHNgO1xuICpcbiAqIGZ1bmN0aW9uIEV4YW1wbGUoKSB7XG4gKiAgIHJldHVybiAoXG4gKiAgICAgPENhcmQ+XG4gKiAgICAgICA8Q2FyZEhlYWRlcj5cbiAqICAgICAgICAgPEhlYWRpbmcgc2l6ZT17IDQgfT5DYXJkIFRpdGxlPC9IZWFkaW5nPlxuICogICAgICAgPC9DYXJkSGVhZGVyPlxuICogICAgICAgPENhcmRCb2R5PlxuICogICAgICAgICA8VGV4dD5DYXJkIENvbnRlbnQ8L1RleHQ+XG4gKiAgICAgICA8L0NhcmRCb2R5PlxuICogICAgICAgPENhcmRGb290ZXI+XG4gKiAgICAgICAgIDxUZXh0PkNhcmQgRm9vdGVyPC9UZXh0PlxuICogICAgICAgPC9DYXJkRm9vdGVyPlxuICogICAgIDwvQ2FyZD5cbiAqICAgKTtcbiAqIH1cbiAqIGBgYFxuICovXG5jb25zdCBDb25uZWN0ZWRDYXJkID0gY29udGV4dENvbm5lY3QoIENhcmQsICdDYXJkJyApO1xuXG5leHBvcnQgZGVmYXVsdCBDb25uZWN0ZWRDYXJkO1xuIl19 */")), [cx, elevationBorderRadius]);
   const contextProviderValue = (0, _element.useMemo)(() => {
     const contextProps = {
       size,

package/build/card/card/component.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card/component.js"],"names":["Card","props","forwardedRef","children","elevation","isBorderless","isRounded","size","otherProps","elevationBorderRadius","CONFIG","cardBorderRadius","cx","elevationClassName","borderRadius","contextProviderValue","contextProps","CardBody","CardHeader","CardFooter","styles","Content","ConnectedCard"],"mappings":";;;;;;;;;AAQA;;;;AALA;;AAUA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAnBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA,SAASA,IAAT,CAAeC,KAAf,EAAsBC,YAAtB,EAAqC;AACpC,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,YAHK;AAILC,IAAAA,SAJK;AAKLC,IAAAA,IALK;AAML,OAAGC;AANE,MAOF,mBAASP,KAAT,CAPJ;AAQA,QAAMQ,qBAAqB,GAAGH,SAAS,GAAGI,sBAAOC,gBAAV,GAA6B,CAApE;AAEA,QAAMC,EAAE,GAAG,mBAAX;AAEA,QAAMC,kBAAkB,GAAG,sBAC1B,MAAMD,EAAE,eAAE,gBAAK;AAAEE,IAAAA,YAAY,EAAEL;AAAhB,GAAL,glIAAF,CADkB,EAE1B,CAAEA,qBAAF,CAF0B,CAA3B;AAKA,QAAMM,oBAAoB,GAAG,sBAAS,MAAM;AAC3C,UAAMC,YAAY,GAAG;AACpBT,MAAAA,IADoB;AAEpBF,MAAAA;AAFoB,KAArB;AAIA,WAAO;AACNY,MAAAA,QAAQ,EAAED,YADJ;AAENE,MAAAA,UAAU,EAAEF,YAFN;AAGNG,MAAAA,UAAU,EAAEH;AAHN,KAAP;AAKA,GAV4B,EAU1B,CAAEX,YAAF,EAAgBE,IAAhB,CAV0B,CAA7B;AAYA,SACC,4BAAC,8BAAD;AAAuB,IAAA,KAAK,EAAGQ;AAA/B,KACC,4BAAC,UAAD,6BAAWP,UAAX;AAAwB,IAAA,GAAG,EAAGN;AAA9B,MACC,4BAAC,UAAD;AAAM,IAAA,SAAS,EAAGU,EAAE,CAAEQ,MAAM,CAACC,OAAT;AAApB,KAA2ClB,QAA3C,CADD,EAEC,4BAAC,oBAAD;AACC,IAAA,SAAS,EAAGU,kBADb;AAEC,IAAA,aAAa,EAAG,KAFjB;AAGC,IAAA,KAAK,EAAGT,SAAS,GAAG,CAAH,GAAO;AAHzB,IAFD,EAOC,4BAAC,oBAAD;AACC,IAAA,SAAS,EAAGS,kBADb;AAEC,IAAA,aAAa,EAAG,KAFjB;AAGC,IAAA,KAAK,EAAGT;AAHT,IAPD,CADD,CADD;AAiBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMkB,aAAa,GAAG,6BAAgBtB,IAAhB,EAAsB,MAAtB,CAAtB;eAEesB,a","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, ContextSystemProvider } from '../../ui/context';\nimport { Elevation } from '../../elevation';\nimport { View } from '../../view';\nimport * as styles from '../styles';\nimport { useCard } from './hook';\nimport CONFIG from '../../utils/config-values';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} props\n * @param {import('react').Ref<any>}                                                            forwardedRef\n */\nfunction Card( props, forwardedRef ) {\n\tconst {\n\t\tchildren,\n\t\televation,\n\t\tisBorderless,\n\t\tisRounded,\n\t\tsize,\n\t\t...otherProps\n\t} = useCard( props );\n\tconst elevationBorderRadius = isRounded ? CONFIG.cardBorderRadius : 0;\n\n\tconst cx = useCx();\n\n\tconst elevationClassName = useMemo(\n\t\t() => cx( css( { borderRadius: elevationBorderRadius } ) ),\n\t\t[ elevationBorderRadius ]\n\t);\n\n\tconst contextProviderValue = useMemo( () => {\n\t\tconst contextProps = {\n\t\t\tsize,\n\t\t\tisBorderless,\n\t\t};\n\t\treturn {\n\t\t\tCardBody: contextProps,\n\t\t\tCardHeader: contextProps,\n\t\t\tCardFooter: contextProps,\n\t\t};\n\t}, [ isBorderless, size ] );\n\n\treturn (\n\t\t<ContextSystemProvider value={ contextProviderValue }>\n\t\t\t<View { ...otherProps } ref={ forwardedRef }>\n\t\t\t\t<View className={ cx( styles.Content ) }>{ children }</View>\n\t\t\t\t<Elevation\n\t\t\t\t\tclassName={ elevationClassName }\n\t\t\t\t\tisInteractive={ false }\n\t\t\t\t\tvalue={ elevation ? 1 : 0 }\n\t\t\t\t/>\n\t\t\t\t<Elevation\n\t\t\t\t\tclassName={ elevationClassName }\n\t\t\t\t\tisInteractive={ false }\n\t\t\t\t\tvalue={ elevation }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</ContextSystemProvider>\n\t);\n}\n\n/**\n * `Card` provides a flexible and extensible content container.\n * `Card` also provides a convenient set of sub-components such as `CardBody`,\n * `CardHeader`, `CardFooter`, and more.\n *\n * @example\n * ```jsx\n * import {\n *   Card,\n *   CardHeader,\n *   CardBody,\n *   CardFooter,\n *   Text,\n *   Heading,\n * } from `@wordpress/components`;\n *\n * function Example() {\n *   return (\n *     <Card>\n *       <CardHeader>\n *         <Heading size={ 4 }>Card Title</Heading>\n *       </CardHeader>\n *       <CardBody>\n *         <Text>Card Content</Text>\n *       </CardBody>\n *       <CardFooter>\n *         <Text>Card Footer</Text>\n *       </CardFooter>\n *     </Card>\n *   );\n * }\n * ```\n */\nconst ConnectedCard = contextConnect( Card, 'Card' );\n\nexport default ConnectedCard;\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card/component.js"],"names":["Card","props","forwardedRef","children","elevation","isBorderless","isRounded","size","otherProps","elevationBorderRadius","CONFIG","cardBorderRadius","cx","elevationClassName","borderRadius","contextProviderValue","contextProps","CardBody","CardHeader","CardFooter","styles","Content","ConnectedCard"],"mappings":";;;;;;;;;AAQA;;;;AALA;;AAUA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAnBA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA,SAASA,IAAT,CAAeC,KAAf,EAAsBC,YAAtB,EAAqC;AACpC,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,SAFK;AAGLC,IAAAA,YAHK;AAILC,IAAAA,SAJK;AAKLC,IAAAA,IALK;AAML,OAAGC;AANE,MAOF,mBAASP,KAAT,CAPJ;AAQA,QAAMQ,qBAAqB,GAAGH,SAAS,GAAGI,sBAAOC,gBAAV,GAA6B,CAApE;AAEA,QAAMC,EAAE,GAAG,mBAAX;AAEA,QAAMC,kBAAkB,GAAG,sBAC1B,MAAMD,EAAE,eAAE,gBAAK;AAAEE,IAAAA,YAAY,EAAEL;AAAhB,GAAL,olIAAF,CADkB,EAE1B,CAAEG,EAAF,EAAMH,qBAAN,CAF0B,CAA3B;AAKA,QAAMM,oBAAoB,GAAG,sBAAS,MAAM;AAC3C,UAAMC,YAAY,GAAG;AACpBT,MAAAA,IADoB;AAEpBF,MAAAA;AAFoB,KAArB;AAIA,WAAO;AACNY,MAAAA,QAAQ,EAAED,YADJ;AAENE,MAAAA,UAAU,EAAEF,YAFN;AAGNG,MAAAA,UAAU,EAAEH;AAHN,KAAP;AAKA,GAV4B,EAU1B,CAAEX,YAAF,EAAgBE,IAAhB,CAV0B,CAA7B;AAYA,SACC,4BAAC,8BAAD;AAAuB,IAAA,KAAK,EAAGQ;AAA/B,KACC,4BAAC,UAAD,6BAAWP,UAAX;AAAwB,IAAA,GAAG,EAAGN;AAA9B,MACC,4BAAC,UAAD;AAAM,IAAA,SAAS,EAAGU,EAAE,CAAEQ,MAAM,CAACC,OAAT;AAApB,KAA2ClB,QAA3C,CADD,EAEC,4BAAC,oBAAD;AACC,IAAA,SAAS,EAAGU,kBADb;AAEC,IAAA,aAAa,EAAG,KAFjB;AAGC,IAAA,KAAK,EAAGT,SAAS,GAAG,CAAH,GAAO;AAHzB,IAFD,EAOC,4BAAC,oBAAD;AACC,IAAA,SAAS,EAAGS,kBADb;AAEC,IAAA,aAAa,EAAG,KAFjB;AAGC,IAAA,KAAK,EAAGT;AAHT,IAPD,CADD,CADD;AAiBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,MAAMkB,aAAa,GAAG,6BAAgBtB,IAAhB,EAAsB,MAAtB,CAAtB;eAEesB,a","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { contextConnect, ContextSystemProvider } from '../../ui/context';\nimport { Elevation } from '../../elevation';\nimport { View } from '../../view';\nimport * as styles from '../styles';\nimport { useCard } from './hook';\nimport CONFIG from '../../utils/config-values';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} props\n * @param {import('react').Ref<any>}                                                            forwardedRef\n */\nfunction Card( props, forwardedRef ) {\n\tconst {\n\t\tchildren,\n\t\televation,\n\t\tisBorderless,\n\t\tisRounded,\n\t\tsize,\n\t\t...otherProps\n\t} = useCard( props );\n\tconst elevationBorderRadius = isRounded ? CONFIG.cardBorderRadius : 0;\n\n\tconst cx = useCx();\n\n\tconst elevationClassName = useMemo(\n\t\t() => cx( css( { borderRadius: elevationBorderRadius } ) ),\n\t\t[ cx, elevationBorderRadius ]\n\t);\n\n\tconst contextProviderValue = useMemo( () => {\n\t\tconst contextProps = {\n\t\t\tsize,\n\t\t\tisBorderless,\n\t\t};\n\t\treturn {\n\t\t\tCardBody: contextProps,\n\t\t\tCardHeader: contextProps,\n\t\t\tCardFooter: contextProps,\n\t\t};\n\t}, [ isBorderless, size ] );\n\n\treturn (\n\t\t<ContextSystemProvider value={ contextProviderValue }>\n\t\t\t<View { ...otherProps } ref={ forwardedRef }>\n\t\t\t\t<View className={ cx( styles.Content ) }>{ children }</View>\n\t\t\t\t<Elevation\n\t\t\t\t\tclassName={ elevationClassName }\n\t\t\t\t\tisInteractive={ false }\n\t\t\t\t\tvalue={ elevation ? 1 : 0 }\n\t\t\t\t/>\n\t\t\t\t<Elevation\n\t\t\t\t\tclassName={ elevationClassName }\n\t\t\t\t\tisInteractive={ false }\n\t\t\t\t\tvalue={ elevation }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</ContextSystemProvider>\n\t);\n}\n\n/**\n * `Card` provides a flexible and extensible content container.\n * `Card` also provides a convenient set of sub-components such as `CardBody`,\n * `CardHeader`, `CardFooter`, and more.\n *\n * @example\n * ```jsx\n * import {\n *   Card,\n *   CardHeader,\n *   CardBody,\n *   CardFooter,\n *   Text,\n *   Heading,\n * } from `@wordpress/components`;\n *\n * function Example() {\n *   return (\n *     <Card>\n *       <CardHeader>\n *         <Heading size={ 4 }>Card Title</Heading>\n *       </CardHeader>\n *       <CardBody>\n *         <Text>Card Content</Text>\n *       </CardBody>\n *       <CardFooter>\n *         <Text>Card Footer</Text>\n *       </CardFooter>\n *     </Card>\n *   );\n * }\n * ```\n */\nconst ConnectedCard = contextConnect( Card, 'Card' );\n\nexport default ConnectedCard;\n"]}

package/build/card/card/hook.js

@@ -81,7 +81,7 @@ function useCard(props) {
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => {
     return cx(styles.Card, isBorderless && styles.boxShadowless, isRounded && styles.rounded, className);
-  }, [className, isBorderless, isRounded]);
+  }, [className, cx, isBorderless, isRounded]);
   const surfaceProps = (0, _surface.useSurface)({ ...otherProps,
     className: classes
   });

package/build/card/card/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card/hook.js"],"names":["useDeprecatedProps","elevation","isElevated","otherProps","propsToReturn","computedElevation","since","alternative","useCard","props","className","isBorderless","isRounded","size","cx","classes","styles","Card","boxShadowless","rounded","surfaceProps"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAZA;AACA;AACA;;AAIA;AACA;AACA;;AAMA;AACA;AACA;AACA,SAASA,kBAAT,OAAwE;AAAA,MAA3C;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,UAAb;AAAyB,OAAGC;AAA5B,GAA2C;;AACvE;AACA,QAAMC,aAAa,GAAG,EACrB,GAAGD;AADkB,GAAtB;AAGA,MAAIE,iBAAiB,GAAGJ,SAAxB;;AAEA,MAAKC,UAAL,EAAkB;AAAA;;AACjB,6BAAY,sBAAZ,EAAoC;AACnCI,MAAAA,KAAK,EAAE,KAD4B;AAEnCC,MAAAA,WAAW,EAAE;AAFsB,KAApC;AAIA,0BAAAF,iBAAiB,UAAjB,yDAAAA,iBAAiB,GAAK,CAAtB;AACA,GAbsE,CAevE;AACA;;;AACA,MAAK,OAAOA,iBAAP,KAA6B,WAAlC,EAAgD;AAC/CD,IAAAA,aAAa,CAACH,SAAd,GAA0BI,iBAA1B;AACA;;AAED,SAAOD,aAAP;AACA;AAED;AACA;AACA;;;AACO,SAASI,OAAT,CAAkBC,KAAlB,EAA0B;AAChC,QAAM;AACLC,IAAAA,SADK;AAELT,IAAAA,SAAS,GAAG,CAFP;AAGLU,IAAAA,YAAY,GAAG,KAHV;AAILC,IAAAA,SAAS,GAAG,IAJP;AAKLC,IAAAA,IAAI,GAAG,QALF;AAML,OAAGV;AANE,MAOF,+BAAkBH,kBAAkB,CAAES,KAAF,CAApC,EAA+C,MAA/C,CAPJ;AASA,QAAMK,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAOD,EAAE,CACRE,MAAM,CAACC,IADC,EAERN,YAAY,IAAIK,MAAM,CAACE,aAFf,EAGRN,SAAS,IAAII,MAAM,CAACG,OAHZ,EAIRT,SAJQ,CAAT;AAMA,GAPe,EAOb,CAAEA,SAAF,EAAaC,YAAb,EAA2BC,SAA3B,CAPa,CAAhB;AASA,QAAMQ,YAAY,GAAG,yBAAY,EAAE,GAAGjB,UAAL;AAAiBO,IAAAA,SAAS,EAAEK;AAA5B,GAAZ,CAArB;AAEA,SAAO,EACN,GAAGK,YADG;AAENnB,IAAAA,SAFM;AAGNU,IAAAA,YAHM;AAINC,IAAAA,SAJM;AAKNC,IAAAA;AALM,GAAP;AAOA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport { useSurface } from '../../surface';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} props\n */\nfunction useDeprecatedProps( { elevation, isElevated, ...otherProps } ) {\n\t/**@type {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} */\n\tconst propsToReturn = {\n\t\t...otherProps,\n\t};\n\tlet computedElevation = elevation;\n\n\tif ( isElevated ) {\n\t\tdeprecated( 'Card isElevated prop', {\n\t\t\tsince: '5.9',\n\t\t\talternative: 'elevation',\n\t\t} );\n\t\tcomputedElevation ??= 2;\n\t}\n\n\t// The `elevation` prop should only be passed when it's not `undefined`,\n\t// otherwise it will override the value that gets derived from `useContextSystem`.\n\tif ( typeof computedElevation !== 'undefined' ) {\n\t\tpropsToReturn.elevation = computedElevation;\n\t}\n\n\treturn propsToReturn;\n}\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} props\n */\nexport function useCard( props ) {\n\tconst {\n\t\tclassName,\n\t\televation = 0,\n\t\tisBorderless = false,\n\t\tisRounded = true,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( useDeprecatedProps( props ), 'Card' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo( () => {\n\t\treturn cx(\n\t\t\tstyles.Card,\n\t\t\tisBorderless && styles.boxShadowless,\n\t\t\tisRounded && styles.rounded,\n\t\t\tclassName\n\t\t);\n\t}, [ className, isBorderless, isRounded ] );\n\n\tconst surfaceProps = useSurface( { ...otherProps, className: classes } );\n\n\treturn {\n\t\t...surfaceProps,\n\t\televation,\n\t\tisBorderless,\n\t\tisRounded,\n\t\tsize,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card/hook.js"],"names":["useDeprecatedProps","elevation","isElevated","otherProps","propsToReturn","computedElevation","since","alternative","useCard","props","className","isBorderless","isRounded","size","cx","classes","styles","Card","boxShadowless","rounded","surfaceProps"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AACA;;;;;;AAZA;AACA;AACA;;AAIA;AACA;AACA;;AAMA;AACA;AACA;AACA,SAASA,kBAAT,OAAwE;AAAA,MAA3C;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,UAAb;AAAyB,OAAGC;AAA5B,GAA2C;;AACvE;AACA,QAAMC,aAAa,GAAG,EACrB,GAAGD;AADkB,GAAtB;AAGA,MAAIE,iBAAiB,GAAGJ,SAAxB;;AAEA,MAAKC,UAAL,EAAkB;AAAA;;AACjB,6BAAY,sBAAZ,EAAoC;AACnCI,MAAAA,KAAK,EAAE,KAD4B;AAEnCC,MAAAA,WAAW,EAAE;AAFsB,KAApC;AAIA,0BAAAF,iBAAiB,UAAjB,yDAAAA,iBAAiB,GAAK,CAAtB;AACA,GAbsE,CAevE;AACA;;;AACA,MAAK,OAAOA,iBAAP,KAA6B,WAAlC,EAAgD;AAC/CD,IAAAA,aAAa,CAACH,SAAd,GAA0BI,iBAA1B;AACA;;AAED,SAAOD,aAAP;AACA;AAED;AACA;AACA;;;AACO,SAASI,OAAT,CAAkBC,KAAlB,EAA0B;AAChC,QAAM;AACLC,IAAAA,SADK;AAELT,IAAAA,SAAS,GAAG,CAFP;AAGLU,IAAAA,YAAY,GAAG,KAHV;AAILC,IAAAA,SAAS,GAAG,IAJP;AAKLC,IAAAA,IAAI,GAAG,QALF;AAML,OAAGV;AANE,MAOF,+BAAkBH,kBAAkB,CAAES,KAAF,CAApC,EAA+C,MAA/C,CAPJ;AASA,QAAMK,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBAAS,MAAM;AAC9B,WAAOD,EAAE,CACRE,MAAM,CAACC,IADC,EAERN,YAAY,IAAIK,MAAM,CAACE,aAFf,EAGRN,SAAS,IAAII,MAAM,CAACG,OAHZ,EAIRT,SAJQ,CAAT;AAMA,GAPe,EAOb,CAAEA,SAAF,EAAaI,EAAb,EAAiBH,YAAjB,EAA+BC,SAA/B,CAPa,CAAhB;AASA,QAAMQ,YAAY,GAAG,yBAAY,EAAE,GAAGjB,UAAL;AAAiBO,IAAAA,SAAS,EAAEK;AAA5B,GAAZ,CAArB;AAEA,SAAO,EACN,GAAGK,YADG;AAENnB,IAAAA,SAFM;AAGNU,IAAAA,YAHM;AAINC,IAAAA,SAJM;AAKNC,IAAAA;AALM,GAAP;AAOA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport { useSurface } from '../../surface';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} props\n */\nfunction useDeprecatedProps( { elevation, isElevated, ...otherProps } ) {\n\t/**@type {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} */\n\tconst propsToReturn = {\n\t\t...otherProps,\n\t};\n\tlet computedElevation = elevation;\n\n\tif ( isElevated ) {\n\t\tdeprecated( 'Card isElevated prop', {\n\t\t\tsince: '5.9',\n\t\t\talternative: 'elevation',\n\t\t} );\n\t\tcomputedElevation ??= 2;\n\t}\n\n\t// The `elevation` prop should only be passed when it's not `undefined`,\n\t// otherwise it will override the value that gets derived from `useContextSystem`.\n\tif ( typeof computedElevation !== 'undefined' ) {\n\t\tpropsToReturn.elevation = computedElevation;\n\t}\n\n\treturn propsToReturn;\n}\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').Props, 'div'>} props\n */\nexport function useCard( props ) {\n\tconst {\n\t\tclassName,\n\t\televation = 0,\n\t\tisBorderless = false,\n\t\tisRounded = true,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( useDeprecatedProps( props ), 'Card' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo( () => {\n\t\treturn cx(\n\t\t\tstyles.Card,\n\t\t\tisBorderless && styles.boxShadowless,\n\t\t\tisRounded && styles.rounded,\n\t\t\tclassName\n\t\t);\n\t}, [ className, cx, isBorderless, isRounded ] );\n\n\tconst surfaceProps = useSurface( { ...otherProps, className: classes } );\n\n\treturn {\n\t\t...surfaceProps,\n\t\televation,\n\t\tisBorderless,\n\t\tisRounded,\n\t\tsize,\n\t};\n}\n"]}

package/build/card/card-body/hook.js

@@ -38,7 +38,7 @@ function useCardBody(props) {
   } = (0, _context.useContextSystem)(props, 'CardBody');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.Body, styles.borderRadius, styles.cardPaddings[size], isShady && styles.shady, // This classname is added for legacy compatibility reasons.
-  'components-card__body', className), [className, isShady, size]);
+  'components-card__body', className), [className, cx, isShady, size]);
   return { ...otherProps,
     className: classes,
     isScrollable

package/build/card/card-body/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card-body/hook.js"],"names":["useCardBody","props","className","isScrollable","isShady","size","otherProps","cx","classes","styles","Body","borderRadius","cardPaddings","shady"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,WAAT,CAAsBC,KAAtB,EAA8B;AACpC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,YAAY,GAAG,KAFV;AAGLC,IAAAA,OAAO,GAAG,KAHL;AAILC,IAAAA,IAAI,GAAG,QAJF;AAKL,OAAGC;AALE,MAMF,+BAAkBL,KAAlB,EAAyB,UAAzB,CANJ;AAQA,QAAMM,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,IADN,EAEDD,MAAM,CAACE,YAFN,EAGDF,MAAM,CAACG,YAAP,CAAqBP,IAArB,CAHC,EAIDD,OAAO,IAAIK,MAAM,CAACI,KAJjB,EAKD;AACA,yBANC,EAODX,SAPC,CAFY,EAWf,CAAEA,SAAF,EAAaE,OAAb,EAAsBC,IAAtB,CAXe,CAAhB;AAcA,SAAO,EACN,GAAGC,UADG;AAENJ,IAAAA,SAAS,EAAEM,OAFL;AAGNL,IAAAA;AAHM,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').BodyProps, 'div'>} props\n */\nexport function useCardBody( props ) {\n\tconst {\n\t\tclassName,\n\t\tisScrollable = false,\n\t\tisShady = false,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( props, 'CardBody' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Body,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\tstyles.cardPaddings[ size ],\n\t\t\t\tisShady && styles.shady,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__body',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, isShady, size ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tisScrollable,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card-body/hook.js"],"names":["useCardBody","props","className","isScrollable","isShady","size","otherProps","cx","classes","styles","Body","borderRadius","cardPaddings","shady"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,WAAT,CAAsBC,KAAtB,EAA8B;AACpC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,YAAY,GAAG,KAFV;AAGLC,IAAAA,OAAO,GAAG,KAHL;AAILC,IAAAA,IAAI,GAAG,QAJF;AAKL,OAAGC;AALE,MAMF,+BAAkBL,KAAlB,EAAyB,UAAzB,CANJ;AAQA,QAAMM,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,IADN,EAEDD,MAAM,CAACE,YAFN,EAGDF,MAAM,CAACG,YAAP,CAAqBP,IAArB,CAHC,EAIDD,OAAO,IAAIK,MAAM,CAACI,KAJjB,EAKD;AACA,yBANC,EAODX,SAPC,CAFY,EAWf,CAAEA,SAAF,EAAaK,EAAb,EAAiBH,OAAjB,EAA0BC,IAA1B,CAXe,CAAhB;AAcA,SAAO,EACN,GAAGC,UADG;AAENJ,IAAAA,SAAS,EAAEM,OAFL;AAGNL,IAAAA;AAHM,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').BodyProps, 'div'>} props\n */\nexport function useCardBody( props ) {\n\tconst {\n\t\tclassName,\n\t\tisScrollable = false,\n\t\tisShady = false,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( props, 'CardBody' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Body,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\tstyles.cardPaddings[ size ],\n\t\t\t\tisShady && styles.shady,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__body',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isShady, size ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tisScrollable,\n\t};\n}\n"]}

package/build/card/card-divider/hook.js

@@ -35,7 +35,7 @@ function useCardDivider(props) {
   } = (0, _context.useContextSystem)(props, 'CardDivider');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.Divider, styles.borderColor, // This classname is added for legacy compatibility reasons.
-  'components-card__divider', className), [className]);
+  'components-card__divider', className), [className, cx]);
   return { ...otherProps,
     className: classes
   };

package/build/card/card-divider/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card-divider/hook.js"],"names":["useCardDivider","props","className","otherProps","cx","classes","styles","Divider","borderColor"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,cAAT,CAAyBC,KAAzB,EAAiC;AACvC,QAAM;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,MAA+B,+BACpCF,KADoC,EAEpC,aAFoC,CAArC;AAKA,QAAMG,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,OADN,EAEDD,MAAM,CAACE,WAFN,EAGD;AACA,4BAJC,EAKDN,SALC,CAFY,EASf,CAAEA,SAAF,CATe,CAAhB;AAYA,SAAO,EACN,GAAGC,UADG;AAEND,IAAAA,SAAS,EAAEG;AAFL,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../../divider').DividerProps, 'hr', false>} props\n */\nexport function useCardDivider( props ) {\n\tconst { className, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'CardDivider'\n\t);\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Divider,\n\t\t\t\tstyles.borderColor,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__divider',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card-divider/hook.js"],"names":["useCardDivider","props","className","otherProps","cx","classes","styles","Divider","borderColor"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,cAAT,CAAyBC,KAAzB,EAAiC;AACvC,QAAM;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,MAA+B,+BACpCF,KADoC,EAEpC,aAFoC,CAArC;AAKA,QAAMG,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,OADN,EAEDD,MAAM,CAACE,WAFN,EAGD;AACA,4BAJC,EAKDN,SALC,CAFY,EASf,CAAEA,SAAF,EAAaE,EAAb,CATe,CAAhB;AAYA,SAAO,EACN,GAAGD,UADG;AAEND,IAAAA,SAAS,EAAEG;AAFL,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../../divider').DividerProps, 'hr', false>} props\n */\nexport function useCardDivider( props ) {\n\tconst { className, ...otherProps } = useContextSystem(\n\t\tprops,\n\t\t'CardDivider'\n\t);\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Divider,\n\t\t\t\tstyles.borderColor,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__divider',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t};\n}\n"]}

package/build/card/card-footer/hook.js

@@ -39,7 +39,7 @@ function useCardFooter(props) {
   } = (0, _context.useContextSystem)(props, 'CardFooter');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.Footer, styles.borderRadius, styles.borderColor, styles.cardPaddings[size], isBorderless && styles.borderless, isShady && styles.shady, // This classname is added for legacy compatibility reasons.
-  'components-card__footer', className), [className, isBorderless, isShady, size]);
+  'components-card__footer', className), [className, cx, isBorderless, isShady, size]);
   return { ...otherProps,
     className: classes,
     justify

package/build/card/card-footer/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card-footer/hook.js"],"names":["useCardFooter","props","className","justify","isBorderless","isShady","size","otherProps","cx","classes","styles","Footer","borderRadius","borderColor","cardPaddings","borderless","shady"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,aAAT,CAAwBC,KAAxB,EAAgC;AACtC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,OAFK;AAGLC,IAAAA,YAAY,GAAG,KAHV;AAILC,IAAAA,OAAO,GAAG,KAJL;AAKLC,IAAAA,IAAI,GAAG,QALF;AAML,OAAGC;AANE,MAOF,+BAAkBN,KAAlB,EAAyB,YAAzB,CAPJ;AASA,QAAMO,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,MADN,EAEDD,MAAM,CAACE,YAFN,EAGDF,MAAM,CAACG,WAHN,EAIDH,MAAM,CAACI,YAAP,CAAqBR,IAArB,CAJC,EAKDF,YAAY,IAAIM,MAAM,CAACK,UALtB,EAMDV,OAAO,IAAIK,MAAM,CAACM,KANjB,EAOD;AACA,2BARC,EASDd,SATC,CAFY,EAaf,CAAEA,SAAF,EAAaE,YAAb,EAA2BC,OAA3B,EAAoCC,IAApC,CAbe,CAAhB;AAgBA,SAAO,EACN,GAAGC,UADG;AAENL,IAAAA,SAAS,EAAEO,OAFL;AAGNN,IAAAA;AAHM,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').FooterProps, 'div'>} props\n */\nexport function useCardFooter( props ) {\n\tconst {\n\t\tclassName,\n\t\tjustify,\n\t\tisBorderless = false,\n\t\tisShady = false,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( props, 'CardFooter' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Footer,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\tstyles.borderColor,\n\t\t\t\tstyles.cardPaddings[ size ],\n\t\t\t\tisBorderless && styles.borderless,\n\t\t\t\tisShady && styles.shady,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__footer',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, isBorderless, isShady, size ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tjustify,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card-footer/hook.js"],"names":["useCardFooter","props","className","justify","isBorderless","isShady","size","otherProps","cx","classes","styles","Footer","borderRadius","borderColor","cardPaddings","borderless","shady"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,aAAT,CAAwBC,KAAxB,EAAgC;AACtC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,OAFK;AAGLC,IAAAA,YAAY,GAAG,KAHV;AAILC,IAAAA,OAAO,GAAG,KAJL;AAKLC,IAAAA,IAAI,GAAG,QALF;AAML,OAAGC;AANE,MAOF,+BAAkBN,KAAlB,EAAyB,YAAzB,CAPJ;AASA,QAAMO,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,MADN,EAEDD,MAAM,CAACE,YAFN,EAGDF,MAAM,CAACG,WAHN,EAIDH,MAAM,CAACI,YAAP,CAAqBR,IAArB,CAJC,EAKDF,YAAY,IAAIM,MAAM,CAACK,UALtB,EAMDV,OAAO,IAAIK,MAAM,CAACM,KANjB,EAOD;AACA,2BARC,EASDd,SATC,CAFY,EAaf,CAAEA,SAAF,EAAaM,EAAb,EAAiBJ,YAAjB,EAA+BC,OAA/B,EAAwCC,IAAxC,CAbe,CAAhB;AAgBA,SAAO,EACN,GAAGC,UADG;AAENL,IAAAA,SAAS,EAAEO,OAFL;AAGNN,IAAAA;AAHM,GAAP;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').FooterProps, 'div'>} props\n */\nexport function useCardFooter( props ) {\n\tconst {\n\t\tclassName,\n\t\tjustify,\n\t\tisBorderless = false,\n\t\tisShady = false,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( props, 'CardFooter' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Footer,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\tstyles.borderColor,\n\t\t\t\tstyles.cardPaddings[ size ],\n\t\t\t\tisBorderless && styles.borderless,\n\t\t\t\tisShady && styles.shady,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__footer',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBorderless, isShady, size ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t\tjustify,\n\t};\n}\n"]}

package/build/card/card-header/hook.js

@@ -38,7 +38,7 @@ function useCardHeader(props) {
   } = (0, _context.useContextSystem)(props, 'CardHeader');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.Header, styles.borderRadius, styles.borderColor, styles.cardPaddings[size], isBorderless && styles.borderless, isShady && styles.shady, // This classname is added for legacy compatibility reasons.
-  'components-card__header', className), [className, isBorderless, isShady, size]);
+  'components-card__header', className), [className, cx, isBorderless, isShady, size]);
   return { ...otherProps,
     className: classes
   };

package/build/card/card-header/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card-header/hook.js"],"names":["useCardHeader","props","className","isBorderless","isShady","size","otherProps","cx","classes","styles","Header","borderRadius","borderColor","cardPaddings","borderless","shady"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,aAAT,CAAwBC,KAAxB,EAAgC;AACtC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,YAAY,GAAG,KAFV;AAGLC,IAAAA,OAAO,GAAG,KAHL;AAILC,IAAAA,IAAI,GAAG,QAJF;AAKL,OAAGC;AALE,MAMF,+BAAkBL,KAAlB,EAAyB,YAAzB,CANJ;AAQA,QAAMM,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,MADN,EAEDD,MAAM,CAACE,YAFN,EAGDF,MAAM,CAACG,WAHN,EAIDH,MAAM,CAACI,YAAP,CAAqBR,IAArB,CAJC,EAKDF,YAAY,IAAIM,MAAM,CAACK,UALtB,EAMDV,OAAO,IAAIK,MAAM,CAACM,KANjB,EAOD;AACA,2BARC,EASDb,SATC,CAFY,EAaf,CAAEA,SAAF,EAAaC,YAAb,EAA2BC,OAA3B,EAAoCC,IAApC,CAbe,CAAhB;AAgBA,SAAO,EACN,GAAGC,UADG;AAENJ,IAAAA,SAAS,EAAEM;AAFL,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').HeaderProps, 'div'>} props\n */\nexport function useCardHeader( props ) {\n\tconst {\n\t\tclassName,\n\t\tisBorderless = false,\n\t\tisShady = false,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( props, 'CardHeader' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Header,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\tstyles.borderColor,\n\t\t\t\tstyles.cardPaddings[ size ],\n\t\t\t\tisBorderless && styles.borderless,\n\t\t\t\tisShady && styles.shady,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__header',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, isBorderless, isShady, size ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card-header/hook.js"],"names":["useCardHeader","props","className","isBorderless","isShady","size","otherProps","cx","classes","styles","Header","borderRadius","borderColor","cardPaddings","borderless","shady"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,aAAT,CAAwBC,KAAxB,EAAgC;AACtC,QAAM;AACLC,IAAAA,SADK;AAELC,IAAAA,YAAY,GAAG,KAFV;AAGLC,IAAAA,OAAO,GAAG,KAHL;AAILC,IAAAA,IAAI,GAAG,QAJF;AAKL,OAAGC;AALE,MAMF,+BAAkBL,KAAlB,EAAyB,YAAzB,CANJ;AAQA,QAAMM,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,MADN,EAEDD,MAAM,CAACE,YAFN,EAGDF,MAAM,CAACG,WAHN,EAIDH,MAAM,CAACI,YAAP,CAAqBR,IAArB,CAJC,EAKDF,YAAY,IAAIM,MAAM,CAACK,UALtB,EAMDV,OAAO,IAAIK,MAAM,CAACM,KANjB,EAOD;AACA,2BARC,EASDb,SATC,CAFY,EAaf,CAAEA,SAAF,EAAaK,EAAb,EAAiBJ,YAAjB,EAA+BC,OAA/B,EAAwCC,IAAxC,CAbe,CAAhB;AAgBA,SAAO,EACN,GAAGC,UADG;AAENJ,IAAAA,SAAS,EAAEM;AAFL,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<import('../types').HeaderProps, 'div'>} props\n */\nexport function useCardHeader( props ) {\n\tconst {\n\t\tclassName,\n\t\tisBorderless = false,\n\t\tisShady = false,\n\t\tsize = 'medium',\n\t\t...otherProps\n\t} = useContextSystem( props, 'CardHeader' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Header,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\tstyles.borderColor,\n\t\t\t\tstyles.cardPaddings[ size ],\n\t\t\t\tisBorderless && styles.borderless,\n\t\t\t\tisShady && styles.shady,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__header',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBorderless, isShady, size ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t};\n}\n"]}

package/build/card/card-media/hook.js

@@ -35,7 +35,7 @@ function useCardMedia(props) {
   } = (0, _context.useContextSystem)(props, 'CardMedia');
   const cx = (0, _useCx.useCx)();
   const classes = (0, _element.useMemo)(() => cx(styles.Media, styles.borderRadius, // This classname is added for legacy compatibility reasons.
-  'components-card__media', className), [className]);
+  'components-card__media', className), [className, cx]);
   return { ...otherProps,
     className: classes
   };

package/build/card/card-media/hook.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/card/card-media/hook.js"],"names":["useCardMedia","props","className","otherProps","cx","classes","styles","Media","borderRadius"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,YAAT,CAAuBC,KAAvB,EAA+B;AACrC,QAAM;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,MAA+B,+BAAkBF,KAAlB,EAAyB,WAAzB,CAArC;AAEA,QAAMG,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,KADN,EAEDD,MAAM,CAACE,YAFN,EAGD;AACA,0BAJC,EAKDN,SALC,CAFY,EASf,CAAEA,SAAF,CATe,CAAhB;AAYA,SAAO,EACN,GAAGC,UADG;AAEND,IAAAA,SAAS,EAAEG;AAFL,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<{ children: import('react').ReactNode }, 'div'>} props\n */\nexport function useCardMedia( props ) {\n\tconst { className, ...otherProps } = useContextSystem( props, 'CardMedia' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Media,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__media',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t};\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/card/card-media/hook.js"],"names":["useCardMedia","props","className","otherProps","cx","classes","styles","Media","borderRadius"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;;;;;AAVA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AACO,SAASA,YAAT,CAAuBC,KAAvB,EAA+B;AACrC,QAAM;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,MAA+B,+BAAkBF,KAAlB,EAAyB,WAAzB,CAArC;AAEA,QAAMG,EAAE,GAAG,mBAAX;AAEA,QAAMC,OAAO,GAAG,sBACf,MACCD,EAAE,CACDE,MAAM,CAACC,KADN,EAEDD,MAAM,CAACE,YAFN,EAGD;AACA,0BAJC,EAKDN,SALC,CAFY,EASf,CAAEA,SAAF,EAAaE,EAAb,CATe,CAAhB;AAYA,SAAO,EACN,GAAGD,UADG;AAEND,IAAAA,SAAS,EAAEG;AAFL,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useContextSystem } from '../../ui/context';\nimport * as styles from '../styles';\nimport { useCx } from '../../utils/hooks/use-cx';\n\n/**\n * @param {import('../../ui/context').WordPressComponentProps<{ children: import('react').ReactNode }, 'div'>} props\n */\nexport function useCardMedia( props ) {\n\tconst { className, ...otherProps } = useContextSystem( props, 'CardMedia' );\n\n\tconst cx = useCx();\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.Media,\n\t\t\t\tstyles.borderRadius,\n\t\t\t\t// This classname is added for legacy compatibility reasons.\n\t\t\t\t'components-card__media',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx ]\n\t);\n\n\treturn {\n\t\t...otherProps,\n\t\tclassName: classes,\n\t};\n}\n"]}

package/build/circular-option-picker/index.js

@@ -21,6 +21,8 @@ var _dropdown = _interopRequireDefault(require("../dropdown"));
 
 var _tooltip = _interopRequireDefault(require("../tooltip"));
 
+// @ts-nocheck
+
 /**
  * External dependencies
  */

package/build/circular-option-picker/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/circular-option-picker/index.js"],"names":["Option","className","isSelected","selectedIconProps","tooltipText","additionalProps","optionButton","check","DropdownLinkAction","buttonProps","dropdownProps","linkText","isOpen","onToggle","ButtonAction","children","CircularOptionPicker","actions","options"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AAKA;;AACA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAKA,SAASA,MAAT,OAMI;AAAA,MANa;AAChBC,IAAAA,SADgB;AAEhBC,IAAAA,UAFgB;AAGhBC,IAAAA,iBAHgB;AAIhBC,IAAAA,WAJgB;AAKhB,OAAGC;AALa,GAMb;AACH,QAAMC,YAAY,GACjB,4BAAC,eAAD;AACC,IAAA,SAAS,EAAGJ,UADb;AAEC,IAAA,SAAS,EAAC;AAFX,KAGMG,eAHN,EADD;AAOA,SACC;AACC,IAAA,SAAS,EAAG,yBACXJ,SADW,EAEX,mDAFW;AADb,KAMGG,WAAW,GACZ,4BAAC,gBAAD;AAAS,IAAA,IAAI,EAAGA;AAAhB,KAAgCE,YAAhC,CADY,GAGZA,YATF,EAWGJ,UAAU,IACX,4BAAC,WAAD;AACC,IAAA,IAAI,EAAGK;AADR,KAEQJ,iBAAiB,GAAGA,iBAAH,GAAuB,EAFhD,EAZF,CADD;AAoBA;;AAED,SAASK,kBAAT,QAKI;AAAA,MALyB;AAC5BC,IAAAA,WAD4B;AAE5BR,IAAAA,SAF4B;AAG5BS,IAAAA,aAH4B;AAI5BC,IAAAA;AAJ4B,GAKzB;AACH,SACC,4BAAC,iBAAD;AACC,IAAA,SAAS,EAAG,yBACX,yDADW,EAEXV,SAFW,CADb;AAKC,IAAA,YAAY,EAAG;AAAA,UAAE;AAAEW,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAAF;AAAA,aACd,4BAAC,eAAD;AACC,yBAAgBD,MADjB;AAEC,yBAAc,MAFf;AAGC,QAAA,OAAO,EAAGC,QAHX;AAIC,QAAA,OAAO,EAAC;AAJT,SAKMJ,WALN,GAOGE,QAPH,CADc;AAAA;AALhB,KAgBMD,aAhBN,EADD;AAoBA;;AAED,SAASI,YAAT,QAAqE;AAAA,MAA9C;AAAEb,IAAAA,SAAF;AAAac,IAAAA,QAAb;AAAuB,OAAGV;AAA1B,GAA8C;AACpE,SACC,4BAAC,eAAD;AACC,IAAA,SAAS,EAAG,yBACX,0CADW,EAEXJ,SAFW,CADb;AAKC,IAAA,OAAO,MALR;AAMC,IAAA,OAAO,EAAC;AANT,KAOMI,eAPN,GASGU,QATH,CADD;AAaA;;AAEc,SAASC,oBAAT,QAKX;AAAA,MAL0C;AAC7CC,IAAAA,OAD6C;AAE7ChB,IAAAA,SAF6C;AAG7CiB,IAAAA,OAH6C;AAI7CH,IAAAA;AAJ6C,GAK1C;AACH,SACC;AACC,IAAA,SAAS,EAAG,yBACX,mCADW,EAEXd,SAFW;AADb,KAMC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGiB,OADH,CAND,EASGH,QATH,EAUGE,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CAXF,CADD;AAkBA;;AAEDD,oBAAoB,CAAChB,MAArB,GAA8BA,MAA9B;AACAgB,oBAAoB,CAACF,YAArB,GAAoCA,YAApC;AACAE,oBAAoB,CAACR,kBAArB,GAA0CA,kBAA1C","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport Tooltip from '../tooltip';\n\nfunction Option( {\n\tclassName,\n\tisSelected,\n\tselectedIconProps,\n\ttooltipText,\n\t...additionalProps\n} ) {\n\tconst optionButton = (\n\t\t<Button\n\t\t\tisPressed={ isSelected }\n\t\t\tclassName=\"components-circular-option-picker__option\"\n\t\t\t{ ...additionalProps }\n\t\t/>\n\t);\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\tclassName,\n\t\t\t\t'components-circular-option-picker__option-wrapper'\n\t\t\t) }\n\t\t>\n\t\t\t{ tooltipText ? (\n\t\t\t\t<Tooltip text={ tooltipText }>{ optionButton }</Tooltip>\n\t\t\t) : (\n\t\t\t\toptionButton\n\t\t\t) }\n\t\t\t{ isSelected && (\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ check }\n\t\t\t\t\t{ ...( selectedIconProps ? selectedIconProps : {} ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nfunction DropdownLinkAction( {\n\tbuttonProps,\n\tclassName,\n\tdropdownProps,\n\tlinkText,\n} ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-circular-option-picker__dropdown-link-action',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t>\n\t\t\t\t\t{ linkText }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t\t{ ...dropdownProps }\n\t\t/>\n\t);\n}\n\nfunction ButtonAction( { className, children, ...additionalProps } ) {\n\treturn (\n\t\t<Button\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-circular-option-picker__clear',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tisSmall\n\t\t\tvariant=\"secondary\"\n\t\t\t{ ...additionalProps }\n\t\t>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n}\n\nexport default function CircularOptionPicker( {\n\tactions,\n\tclassName,\n\toptions,\n\tchildren,\n} ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-circular-option-picker',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<div className=\"components-circular-option-picker__swatches\">\n\t\t\t\t{ options }\n\t\t\t</div>\n\t\t\t{ children }\n\t\t\t{ actions && (\n\t\t\t\t<div className=\"components-circular-option-picker__custom-clear-wrapper\">\n\t\t\t\t\t{ actions }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nCircularOptionPicker.Option = Option;\nCircularOptionPicker.ButtonAction = ButtonAction;\nCircularOptionPicker.DropdownLinkAction = DropdownLinkAction;\n"]}
+{"version":3,"sources":["@wordpress/components/src/circular-option-picker/index.js"],"names":["Option","className","isSelected","selectedIconProps","tooltipText","additionalProps","optionButton","check","DropdownLinkAction","buttonProps","dropdownProps","linkText","isOpen","onToggle","ButtonAction","children","CircularOptionPicker","actions","options"],"mappings":";;;;;;;;;;;;;AAIA;;AAKA;;AAKA;;AACA;;AACA;;AAhBA;;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAKA,SAASA,MAAT,OAMI;AAAA,MANa;AAChBC,IAAAA,SADgB;AAEhBC,IAAAA,UAFgB;AAGhBC,IAAAA,iBAHgB;AAIhBC,IAAAA,WAJgB;AAKhB,OAAGC;AALa,GAMb;AACH,QAAMC,YAAY,GACjB,4BAAC,eAAD;AACC,IAAA,SAAS,EAAGJ,UADb;AAEC,IAAA,SAAS,EAAC;AAFX,KAGMG,eAHN,EADD;AAOA,SACC;AACC,IAAA,SAAS,EAAG,yBACXJ,SADW,EAEX,mDAFW;AADb,KAMGG,WAAW,GACZ,4BAAC,gBAAD;AAAS,IAAA,IAAI,EAAGA;AAAhB,KAAgCE,YAAhC,CADY,GAGZA,YATF,EAWGJ,UAAU,IACX,4BAAC,WAAD;AACC,IAAA,IAAI,EAAGK;AADR,KAEQJ,iBAAiB,GAAGA,iBAAH,GAAuB,EAFhD,EAZF,CADD;AAoBA;;AAED,SAASK,kBAAT,QAKI;AAAA,MALyB;AAC5BC,IAAAA,WAD4B;AAE5BR,IAAAA,SAF4B;AAG5BS,IAAAA,aAH4B;AAI5BC,IAAAA;AAJ4B,GAKzB;AACH,SACC,4BAAC,iBAAD;AACC,IAAA,SAAS,EAAG,yBACX,yDADW,EAEXV,SAFW,CADb;AAKC,IAAA,YAAY,EAAG;AAAA,UAAE;AAAEW,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAAF;AAAA,aACd,4BAAC,eAAD;AACC,yBAAgBD,MADjB;AAEC,yBAAc,MAFf;AAGC,QAAA,OAAO,EAAGC,QAHX;AAIC,QAAA,OAAO,EAAC;AAJT,SAKMJ,WALN,GAOGE,QAPH,CADc;AAAA;AALhB,KAgBMD,aAhBN,EADD;AAoBA;;AAED,SAASI,YAAT,QAAqE;AAAA,MAA9C;AAAEb,IAAAA,SAAF;AAAac,IAAAA,QAAb;AAAuB,OAAGV;AAA1B,GAA8C;AACpE,SACC,4BAAC,eAAD;AACC,IAAA,SAAS,EAAG,yBACX,0CADW,EAEXJ,SAFW,CADb;AAKC,IAAA,OAAO,MALR;AAMC,IAAA,OAAO,EAAC;AANT,KAOMI,eAPN,GASGU,QATH,CADD;AAaA;;AAEc,SAASC,oBAAT,QAKX;AAAA,MAL0C;AAC7CC,IAAAA,OAD6C;AAE7ChB,IAAAA,SAF6C;AAG7CiB,IAAAA,OAH6C;AAI7CH,IAAAA;AAJ6C,GAK1C;AACH,SACC;AACC,IAAA,SAAS,EAAG,yBACX,mCADW,EAEXd,SAFW;AADb,KAMC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGiB,OADH,CAND,EASGH,QATH,EAUGE,OAAO,IACR;AAAK,IAAA,SAAS,EAAC;AAAf,KACGA,OADH,CAXF,CADD;AAkBA;;AAEDD,oBAAoB,CAAChB,MAArB,GAA8BA,MAA9B;AACAgB,oBAAoB,CAACF,YAArB,GAAoCA,YAApC;AACAE,oBAAoB,CAACR,kBAArB,GAA0CA,kBAA1C","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Dropdown from '../dropdown';\nimport Tooltip from '../tooltip';\n\nfunction Option( {\n\tclassName,\n\tisSelected,\n\tselectedIconProps,\n\ttooltipText,\n\t...additionalProps\n} ) {\n\tconst optionButton = (\n\t\t<Button\n\t\t\tisPressed={ isSelected }\n\t\t\tclassName=\"components-circular-option-picker__option\"\n\t\t\t{ ...additionalProps }\n\t\t/>\n\t);\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\tclassName,\n\t\t\t\t'components-circular-option-picker__option-wrapper'\n\t\t\t) }\n\t\t>\n\t\t\t{ tooltipText ? (\n\t\t\t\t<Tooltip text={ tooltipText }>{ optionButton }</Tooltip>\n\t\t\t) : (\n\t\t\t\toptionButton\n\t\t\t) }\n\t\t\t{ isSelected && (\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ check }\n\t\t\t\t\t{ ...( selectedIconProps ? selectedIconProps : {} ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nfunction DropdownLinkAction( {\n\tbuttonProps,\n\tclassName,\n\tdropdownProps,\n\tlinkText,\n} ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-circular-option-picker__dropdown-link-action',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t>\n\t\t\t\t\t{ linkText }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t\t{ ...dropdownProps }\n\t\t/>\n\t);\n}\n\nfunction ButtonAction( { className, children, ...additionalProps } ) {\n\treturn (\n\t\t<Button\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-circular-option-picker__clear',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\tisSmall\n\t\t\tvariant=\"secondary\"\n\t\t\t{ ...additionalProps }\n\t\t>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n}\n\nexport default function CircularOptionPicker( {\n\tactions,\n\tclassName,\n\toptions,\n\tchildren,\n} ) {\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-circular-option-picker',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t<div className=\"components-circular-option-picker__swatches\">\n\t\t\t\t{ options }\n\t\t\t</div>\n\t\t\t{ children }\n\t\t\t{ actions && (\n\t\t\t\t<div className=\"components-circular-option-picker__custom-clear-wrapper\">\n\t\t\t\t\t{ actions }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nCircularOptionPicker.Option = Option;\nCircularOptionPicker.ButtonAction = ButtonAction;\nCircularOptionPicker.DropdownLinkAction = DropdownLinkAction;\n"]}

package/build/color-indicator/index.js

@@ -13,6 +13,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+// @ts-nocheck
+
 /**
  * External dependencies
  */

package/build/color-indicator/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-indicator/index.js"],"names":["ColorIndicator","className","colorValue","props","background"],"mappings":";;;;;;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGA,MAAMA,cAAc,GAAG;AAAA,MAAE;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,UAAb;AAAyB,OAAGC;AAA5B,GAAF;AAAA,SACtB;AACC,IAAA,SAAS,EAAG,yBAAY,2BAAZ,EAAyCF,SAAzC,CADb;AAEC,IAAA,KAAK,EAAG;AAAEG,MAAAA,UAAU,EAAEF;AAAd;AAFT,KAGMC,KAHN,EADsB;AAAA,CAAvB;;eAQeH,c","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\nconst ColorIndicator = ( { className, colorValue, ...props } ) => (\n\t<span\n\t\tclassName={ classnames( 'component-color-indicator', className ) }\n\t\tstyle={ { background: colorValue } }\n\t\t{ ...props }\n\t/>\n);\n\nexport default ColorIndicator;\n"]}
+{"version":3,"sources":["@wordpress/components/src/color-indicator/index.js"],"names":["ColorIndicator","className","colorValue","props","background"],"mappings":";;;;;;;;;;;;;AAKA;;AALA;;AAEA;AACA;AACA;AAGA,MAAMA,cAAc,GAAG;AAAA,MAAE;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,UAAb;AAAyB,OAAGC;AAA5B,GAAF;AAAA,SACtB;AACC,IAAA,SAAS,EAAG,yBAAY,2BAAZ,EAAyCF,SAAzC,CADb;AAEC,IAAA,KAAK,EAAG;AAAEG,MAAAA,UAAU,EAAEF;AAAd;AAFT,KAGMC,KAHN,EADsB;AAAA,CAAvB;;eAQeH,c","sourcesContent":["// @ts-nocheck\n\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\nconst ColorIndicator = ( { className, colorValue, ...props } ) => (\n\t<span\n\t\tclassName={ classnames( 'component-color-indicator', className ) }\n\t\tstyle={ { background: colorValue } }\n\t\t{ ...props }\n\t/>\n);\n\nexport default ColorIndicator;\n"]}

package/build/color-palette/index.js

@@ -34,6 +34,8 @@ var _vStack = require("../v-stack");
 
 var _styles = require("./styles");
 
+// @ts-nocheck
+
 /**
  * External dependencies
  */
@@ -144,7 +146,7 @@ function ColorPalette(_ref6) {
     __experimentalIsRenderedInSidebar = false
   } = _ref6;
   const clearColor = (0, _element.useCallback)(() => onChange(undefined), [onChange]);
-  const Component = __experimentalHasMultipleOrigins ? MultiplePalettes : SinglePalette;
+  const Component = __experimentalHasMultipleOrigins && colors !== null && colors !== void 0 && colors.length ? MultiplePalettes : SinglePalette;
 
   const renderCustomColorPicker = () => (0, _element.createElement)(_colorPicker.ColorPicker, {
     color: value,
@@ -153,13 +155,9 @@ function ColorPalette(_ref6) {
   });
 
   let dropdownPosition;
-  let popoverProps;
 
   if (__experimentalIsRenderedInSidebar) {
-    dropdownPosition = (0, _i18n.isRTL)() ? 'bottom right' : 'bottom left';
-    popoverProps = {
-      __unstableForcePosition: true
-    };
+    dropdownPosition = 'bottom left';
   }
 
   const colordColor = (0, _colord.colord)(value);
@@ -170,7 +168,6 @@ function ColorPalette(_ref6) {
     position: dropdownPosition,
     isRenderedInSidebar: __experimentalIsRenderedInSidebar,
     renderContent: renderCustomColorPicker,
-    popoverProps: popoverProps,
     renderToggle: _ref7 => {
       let {
         isOpen,

package/build/color-palette/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-palette/index.js"],"names":["namesPlugin","a11yPlugin","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","color","name","colordColor","fill","contrast","backgroundColor","MultiplePalettes","map","index","colorPalette","length","CustomColorPickerDropdown","isRenderedInSidebar","props","ColorPalette","clearable","disableCustomColors","enableAlpha","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","undefined","Component","renderCustomColorPicker","dropdownPosition","popoverProps","__unstableForcePosition","isOpen","onToggle","background"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { map } from 'lodash';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf, isRTL } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from './styles';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn map( colors, ( { color, name } ) => {\n\t\t\tconst colordColor = colord( color );\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ color }\n\t\t\t\t\tisSelected={ value === color }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tvalue === color\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname ||\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tvalue === color ? clearColor : () => onChange( color )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t  sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t  sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\t\tcolors.length === index + 1 ? actions : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( { isRenderedInSidebar, ...props } ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName={ classnames(\n\t\t\t\t'components-color-palette__custom-color-dropdown-content',\n\t\t\t\t{\n\t\t\t\t\t'is-rendered-in-sidebar': isRenderedInSidebar,\n\t\t\t\t}\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default function ColorPalette( {\n\tclearable = true,\n\tclassName,\n\tcolors,\n\tdisableCustomColors = false,\n\tenableAlpha,\n\tonChange,\n\tvalue,\n\t__experimentalHasMultipleOrigins = false,\n\t__experimentalIsRenderedInSidebar = false,\n} ) {\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\tconst Component = __experimentalHasMultipleOrigins\n\t\t? MultiplePalettes\n\t\t: SinglePalette;\n\n\tconst renderCustomColorPicker = () => (\n\t\t<ColorPicker\n\t\t\tcolor={ value }\n\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\tenableAlpha={ enableAlpha }\n\t\t/>\n\t);\n\n\tlet dropdownPosition;\n\tlet popoverProps;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tdropdownPosition = isRTL() ? 'bottom right' : 'bottom left';\n\t\tpopoverProps = { __unstableForcePosition: true };\n\t}\n\n\tconst colordColor = colord( value );\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tposition={ dropdownPosition }\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color\"\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-label={ __( 'Custom color picker' ) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ value }\n\t\t\t\t\t\t</button>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<Component\n\t\t\t\tclearable={ clearable }\n\t\t\t\tclearColor={ clearColor }\n\t\t\t\tcolors={ colors }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tvalue={ value }\n\t\t\t\tactions={\n\t\t\t\t\t!! clearable && (\n\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\tonClick={ clearColor }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/color-palette/index.js"],"names":["namesPlugin","a11yPlugin","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","color","name","colordColor","fill","contrast","backgroundColor","MultiplePalettes","map","index","colorPalette","length","CustomColorPickerDropdown","isRenderedInSidebar","props","ColorPalette","clearable","disableCustomColors","enableAlpha","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","undefined","Component","renderCustomColorPicker","dropdownPosition","isOpen","onToggle","background"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { map } from 'lodash';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from './styles';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn map( colors, ( { color, name } ) => {\n\t\t\tconst colordColor = colord( color );\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ color }\n\t\t\t\t\tisSelected={ value === color }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tvalue === color\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t  }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname ||\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tvalue === color ? clearColor : () => onChange( color )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t  sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t  sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\t\tcolors.length === index + 1 ? actions : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( { isRenderedInSidebar, ...props } ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName={ classnames(\n\t\t\t\t'components-color-palette__custom-color-dropdown-content',\n\t\t\t\t{\n\t\t\t\t\t'is-rendered-in-sidebar': isRenderedInSidebar,\n\t\t\t\t}\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default function ColorPalette( {\n\tclearable = true,\n\tclassName,\n\tcolors,\n\tdisableCustomColors = false,\n\tenableAlpha,\n\tonChange,\n\tvalue,\n\t__experimentalHasMultipleOrigins = false,\n\t__experimentalIsRenderedInSidebar = false,\n} ) {\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\tconst Component =\n\t\t__experimentalHasMultipleOrigins && colors?.length\n\t\t\t? MultiplePalettes\n\t\t\t: SinglePalette;\n\n\tconst renderCustomColorPicker = () => (\n\t\t<ColorPicker\n\t\t\tcolor={ value }\n\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\tenableAlpha={ enableAlpha }\n\t\t/>\n\t);\n\n\tlet dropdownPosition;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tdropdownPosition = 'bottom left';\n\t}\n\n\tconst colordColor = colord( value );\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tposition={ dropdownPosition }\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color\"\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-label={ __( 'Custom color picker' ) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ value }\n\t\t\t\t\t\t</button>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<Component\n\t\t\t\tclearable={ clearable }\n\t\t\t\tclearColor={ clearColor }\n\t\t\t\tcolors={ colors }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tvalue={ value }\n\t\t\t\tactions={\n\t\t\t\t\t!! clearable && (\n\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\tonClick={ clearColor }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"]}

package/build/color-palette/index.native.js

@@ -203,7 +203,8 @@ function ColorPalette(_ref) {
     onContentSizeChange: onContentSizeChange,
     onScrollBeginDrag: () => shouldEnableBottomSheetScroll(false),
     onScrollEndDrag: () => shouldEnableBottomSheetScroll(true),
-    ref: scrollViewRef
+    ref: scrollViewRef,
+    testID: "color-palette"
   }, shouldShowCustomIndicator && (0, _element.createElement)(_reactNative.View, {
     style: customIndicatorWrapperStyle,
     onLayout: onCustomIndicatorLayout
@@ -235,7 +236,8 @@ function ColorPalette(_ref) {
       accessibilityState: {
         selected: isSelected(color)
       },
-      accessibilityHint: color
+      accessibilityHint: color,
+      testID: color
     }, (0, _element.createElement)(_reactNative.Animated.View, {
       style: {
         transform: [{

package/build/color-palette/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-palette/index.native.js"],"names":["ANIMATION_DURATION","contentWidth","scrollPosition","customIndicatorWidth","ColorPalette","setColor","activeColor","isGradientColor","defaultSettings","currentSegment","onCustomPress","shouldEnableBottomSheetScroll","shouldShowCustomIndicatorOption","shouldShowCustomLabel","shouldShowCustomVerticalSeparator","customColorIndicatorStyles","customIndicatorWrapperStyles","customSwatchGradients","scrollViewRef","isIOS","Platform","OS","isGradientSegment","colorsUtils","segments","scale","Animated","Value","current","opacity","defaultColors","colors","defaultGradientColors","gradients","customIndicatorColor","isCustomGradientColor","isSelectedCustom","shouldShowCustomIndicator","accessibilityHint","customText","scrollToEndWithDelay","scrollTo","x","y","isWithinColors","includes","isSelected","color","timingAnimation","property","toValue","timing","duration","easing","Easing","ease","useNativeDriver","performAnimation","setValue","parallel","start","scaleInterpolation","interpolate","inputRange","outputRange","deselectCustomGradient","width","Dimensions","get","isVisible","onColorPress","onContentSizeChange","delayedScroll","setTimeout","scrollToEnd","clearTimeout","onCustomIndicatorLayout","nativeEvent","layout","onScroll","contentOffset","verticalSeparatorStyle","styles","verticalSeparator","verticalSeparatorDark","customTextStyle","customTextAndroid","customTextDark","customIndicatorWrapperStyle","customIndicatorWrapper","contentContainer","container","selected","colorIndicator","toUpperCase","map","scaleValue","transform"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tScrollView,\n\tTouchableWithoutFeedback,\n\tView,\n\tAnimated,\n\tEasing,\n\tDimensions,\n\tPlatform,\n\tText,\n} from 'react-native';\nimport { map, uniq } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport ColorIndicator from '../color-indicator';\nimport { colorsUtils } from '../mobile/color-settings/utils';\n\nconst ANIMATION_DURATION = 200;\n\nlet contentWidth = 0;\nlet scrollPosition = 0;\nlet customIndicatorWidth = 0;\n\nfunction ColorPalette( {\n\tsetColor,\n\tactiveColor,\n\tisGradientColor,\n\tdefaultSettings,\n\tcurrentSegment,\n\tonCustomPress,\n\tshouldEnableBottomSheetScroll,\n\tshouldShowCustomIndicatorOption = true,\n\tshouldShowCustomLabel = true,\n\tshouldShowCustomVerticalSeparator = true,\n\tcustomColorIndicatorStyles,\n\tcustomIndicatorWrapperStyles,\n} ) {\n\tconst customSwatchGradients = [\n\t\t'linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)',\n\t\t'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)',\n\t\t'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)',\n\t];\n\n\tconst scrollViewRef = useRef();\n\tconst isIOS = Platform.OS === 'ios';\n\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\n\tconst scale = useRef( new Animated.Value( 1 ) ).current;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tconst defaultColors = uniq( map( defaultSettings.colors, 'color' ) );\n\tconst defaultGradientColors = uniq(\n\t\tmap( defaultSettings.gradients, 'gradient' )\n\t);\n\tconst colors = isGradientSegment ? defaultGradientColors : defaultColors;\n\n\tconst customIndicatorColor = isGradientSegment\n\t\t? activeColor\n\t\t: customSwatchGradients;\n\tconst isCustomGradientColor = isGradientColor && isSelectedCustom();\n\tconst shouldShowCustomIndicator =\n\t\tshouldShowCustomIndicatorOption &&\n\t\t( ! isGradientSegment || isCustomGradientColor );\n\n\tconst accessibilityHint = isGradientSegment\n\t\t? __( 'Navigates to customize the gradient' )\n\t\t: __( 'Navigates to custom color picker' );\n\tconst customText = __( 'Custom' );\n\n\tuseEffect( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tif ( isSelectedCustom() ) {\n\t\t\t\tscrollToEndWithDelay();\n\t\t\t} else {\n\t\t\t\tscrollViewRef.current.scrollTo( { x: 0, y: 0 } );\n\t\t\t}\n\t\t}\n\t}, [ currentSegment ] );\n\n\tfunction isSelectedCustom() {\n\t\tconst isWithinColors =\n\t\t\tactiveColor && colors && colors.includes( activeColor );\n\t\tif ( activeColor ) {\n\t\t\tif ( isGradientSegment ) {\n\t\t\t\treturn isGradientColor && ! isWithinColors;\n\t\t\t}\n\t\t\treturn ! isGradientColor && ! isWithinColors;\n\t\t}\n\t\treturn false;\n\t}\n\n\tfunction isSelected( color ) {\n\t\treturn ! isSelectedCustom() && activeColor === color;\n\t}\n\n\tfunction timingAnimation( property, toValue ) {\n\t\treturn Animated.timing( property, {\n\t\t\ttoValue,\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: true,\n\t\t} );\n\t}\n\n\tfunction performAnimation( color ) {\n\t\tif ( ! isSelected( color ) ) {\n\t\t\topacity.setValue( 0 );\n\t\t}\n\n\t\tAnimated.parallel( [\n\t\t\ttimingAnimation( scale, 2 ),\n\t\t\ttimingAnimation( opacity, 1 ),\n\t\t] ).start( () => {\n\t\t\topacity.setValue( 1 );\n\t\t\tscale.setValue( 1 );\n\t\t} );\n\t}\n\n\tconst scaleInterpolation = scale.interpolate( {\n\t\tinputRange: [ 1, 1.5, 2 ],\n\t\toutputRange: [ 1, 0.7, 1 ],\n\t} );\n\n\tfunction deselectCustomGradient() {\n\t\tconst { width } = Dimensions.get( 'window' );\n\t\tconst isVisible =\n\t\t\tcontentWidth - scrollPosition - customIndicatorWidth < width;\n\n\t\tif ( isCustomGradientColor ) {\n\t\t\tif ( ! isIOS ) {\n\t\t\t\t// Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.\n\t\t\t\t// https://github.com/facebook/react-native/issues/27504\n\t\t\t\t// Workaround: Force the scroll when deselecting custom gradient color and when custom indicator is visible on layout.\n\t\t\t\tif (\n\t\t\t\t\tisCustomGradientColor &&\n\t\t\t\t\tisVisible &&\n\t\t\t\t\tscrollViewRef.current\n\t\t\t\t) {\n\t\t\t\t\tscrollViewRef.current.scrollTo( {\n\t\t\t\t\t\tx: scrollPosition - customIndicatorWidth,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction onColorPress( color ) {\n\t\tdeselectCustomGradient();\n\t\tperformAnimation( color );\n\t\tsetColor( color );\n\t}\n\n\tfunction onContentSizeChange( width ) {\n\t\tcontentWidth = width;\n\t\tif ( isSelectedCustom() && scrollViewRef.current ) {\n\t\t\tscrollToEndWithDelay();\n\t\t}\n\t}\n\n\tfunction scrollToEndWithDelay() {\n\t\tconst delayedScroll = setTimeout( () => {\n\t\t\tscrollViewRef.current.scrollToEnd();\n\t\t}, ANIMATION_DURATION );\n\t\treturn () => {\n\t\t\tclearTimeout( delayedScroll );\n\t\t};\n\t}\n\n\tfunction onCustomIndicatorLayout( { nativeEvent } ) {\n\t\tconst { width } = nativeEvent.layout;\n\t\tif ( width !== customIndicatorWidth ) {\n\t\t\tcustomIndicatorWidth = width;\n\t\t}\n\t}\n\n\tfunction onScroll( { nativeEvent } ) {\n\t\tscrollPosition = nativeEvent.contentOffset.x;\n\t}\n\n\tconst verticalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.verticalSeparator,\n\t\tstyles.verticalSeparatorDark\n\t);\n\n\tconst customTextStyle = usePreferredColorSchemeStyle(\n\t\t[ styles.customText, ! isIOS && styles.customTextAndroid ],\n\t\tstyles.customTextDark\n\t);\n\n\tconst customIndicatorWrapperStyle = [\n\t\tstyles.customIndicatorWrapper,\n\t\tcustomIndicatorWrapperStyles,\n\t];\n\n\treturn (\n\t\t<ScrollView\n\t\t\tcontentContainerStyle={ styles.contentContainer }\n\t\t\tstyle={ styles.container }\n\t\t\thorizontal\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\tdisableScrollViewPanResponder\n\t\t\tscrollEventThrottle={ 16 }\n\t\t\tonScroll={ onScroll }\n\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\tonScrollBeginDrag={ () => shouldEnableBottomSheetScroll( false ) }\n\t\t\tonScrollEndDrag={ () => shouldEnableBottomSheetScroll( true ) }\n\t\t\tref={ scrollViewRef }\n\t\t>\n\t\t\t{ shouldShowCustomIndicator && (\n\t\t\t\t<View\n\t\t\t\t\tstyle={ customIndicatorWrapperStyle }\n\t\t\t\t\tonLayout={ onCustomIndicatorLayout }\n\t\t\t\t>\n\t\t\t\t\t{ shouldShowCustomVerticalSeparator && (\n\t\t\t\t\t\t<View style={ verticalSeparatorStyle } />\n\t\t\t\t\t) }\n\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\taccessibilityState={ { selected: isSelectedCustom() } }\n\t\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={ customIndicatorWrapperStyle }>\n\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\twithCustomPicker={ ! isGradientSegment }\n\t\t\t\t\t\t\t\tcolor={ customIndicatorColor }\n\t\t\t\t\t\t\t\tisSelected={ isSelectedCustom() }\n\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ shouldShowCustomLabel && (\n\t\t\t\t\t\t\t\t<Text style={ customTextStyle }>\n\t\t\t\t\t\t\t\t\t{ isIOS\n\t\t\t\t\t\t\t\t\t\t? customText\n\t\t\t\t\t\t\t\t\t\t: customText.toUpperCase() }\n\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t</View>\n\t\t\t) }\n\t\t\t{ colors.map( ( color ) => {\n\t\t\t\tconst scaleValue = isSelected( color ) ? scaleInterpolation : 1;\n\t\t\t\treturn (\n\t\t\t\t\t<View key={ `${ color }-${ isSelected( color ) }` }>\n\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\tonPress={ () => onColorPress( color ) }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: isSelected( color ),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityHint={ color }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Animated.View\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tscale: scaleValue,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelected( color ) }\n\t\t\t\t\t\t\t\t\topacity={ opacity }\n\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Animated.View>\n\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t</View>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ScrollView>\n\t);\n}\n\nexport default ColorPalette;\n"]}
+{"version":3,"sources":["@wordpress/components/src/color-palette/index.native.js"],"names":["ANIMATION_DURATION","contentWidth","scrollPosition","customIndicatorWidth","ColorPalette","setColor","activeColor","isGradientColor","defaultSettings","currentSegment","onCustomPress","shouldEnableBottomSheetScroll","shouldShowCustomIndicatorOption","shouldShowCustomLabel","shouldShowCustomVerticalSeparator","customColorIndicatorStyles","customIndicatorWrapperStyles","customSwatchGradients","scrollViewRef","isIOS","Platform","OS","isGradientSegment","colorsUtils","segments","scale","Animated","Value","current","opacity","defaultColors","colors","defaultGradientColors","gradients","customIndicatorColor","isCustomGradientColor","isSelectedCustom","shouldShowCustomIndicator","accessibilityHint","customText","scrollToEndWithDelay","scrollTo","x","y","isWithinColors","includes","isSelected","color","timingAnimation","property","toValue","timing","duration","easing","Easing","ease","useNativeDriver","performAnimation","setValue","parallel","start","scaleInterpolation","interpolate","inputRange","outputRange","deselectCustomGradient","width","Dimensions","get","isVisible","onColorPress","onContentSizeChange","delayedScroll","setTimeout","scrollToEnd","clearTimeout","onCustomIndicatorLayout","nativeEvent","layout","onScroll","contentOffset","verticalSeparatorStyle","styles","verticalSeparator","verticalSeparatorDark","customTextStyle","customTextAndroid","customTextDark","customIndicatorWrapperStyle","customIndicatorWrapper","contentContainer","container","selected","colorIndicator","toUpperCase","map","scaleValue","transform"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tScrollView,\n\tTouchableWithoutFeedback,\n\tView,\n\tAnimated,\n\tEasing,\n\tDimensions,\n\tPlatform,\n\tText,\n} from 'react-native';\nimport { map, uniq } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport ColorIndicator from '../color-indicator';\nimport { colorsUtils } from '../mobile/color-settings/utils';\n\nconst ANIMATION_DURATION = 200;\n\nlet contentWidth = 0;\nlet scrollPosition = 0;\nlet customIndicatorWidth = 0;\n\nfunction ColorPalette( {\n\tsetColor,\n\tactiveColor,\n\tisGradientColor,\n\tdefaultSettings,\n\tcurrentSegment,\n\tonCustomPress,\n\tshouldEnableBottomSheetScroll,\n\tshouldShowCustomIndicatorOption = true,\n\tshouldShowCustomLabel = true,\n\tshouldShowCustomVerticalSeparator = true,\n\tcustomColorIndicatorStyles,\n\tcustomIndicatorWrapperStyles,\n} ) {\n\tconst customSwatchGradients = [\n\t\t'linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)',\n\t\t'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)',\n\t\t'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)',\n\t];\n\n\tconst scrollViewRef = useRef();\n\tconst isIOS = Platform.OS === 'ios';\n\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\n\tconst scale = useRef( new Animated.Value( 1 ) ).current;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tconst defaultColors = uniq( map( defaultSettings.colors, 'color' ) );\n\tconst defaultGradientColors = uniq(\n\t\tmap( defaultSettings.gradients, 'gradient' )\n\t);\n\tconst colors = isGradientSegment ? defaultGradientColors : defaultColors;\n\n\tconst customIndicatorColor = isGradientSegment\n\t\t? activeColor\n\t\t: customSwatchGradients;\n\tconst isCustomGradientColor = isGradientColor && isSelectedCustom();\n\tconst shouldShowCustomIndicator =\n\t\tshouldShowCustomIndicatorOption &&\n\t\t( ! isGradientSegment || isCustomGradientColor );\n\n\tconst accessibilityHint = isGradientSegment\n\t\t? __( 'Navigates to customize the gradient' )\n\t\t: __( 'Navigates to custom color picker' );\n\tconst customText = __( 'Custom' );\n\n\tuseEffect( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tif ( isSelectedCustom() ) {\n\t\t\t\tscrollToEndWithDelay();\n\t\t\t} else {\n\t\t\t\tscrollViewRef.current.scrollTo( { x: 0, y: 0 } );\n\t\t\t}\n\t\t}\n\t}, [ currentSegment ] );\n\n\tfunction isSelectedCustom() {\n\t\tconst isWithinColors =\n\t\t\tactiveColor && colors && colors.includes( activeColor );\n\t\tif ( activeColor ) {\n\t\t\tif ( isGradientSegment ) {\n\t\t\t\treturn isGradientColor && ! isWithinColors;\n\t\t\t}\n\t\t\treturn ! isGradientColor && ! isWithinColors;\n\t\t}\n\t\treturn false;\n\t}\n\n\tfunction isSelected( color ) {\n\t\treturn ! isSelectedCustom() && activeColor === color;\n\t}\n\n\tfunction timingAnimation( property, toValue ) {\n\t\treturn Animated.timing( property, {\n\t\t\ttoValue,\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: true,\n\t\t} );\n\t}\n\n\tfunction performAnimation( color ) {\n\t\tif ( ! isSelected( color ) ) {\n\t\t\topacity.setValue( 0 );\n\t\t}\n\n\t\tAnimated.parallel( [\n\t\t\ttimingAnimation( scale, 2 ),\n\t\t\ttimingAnimation( opacity, 1 ),\n\t\t] ).start( () => {\n\t\t\topacity.setValue( 1 );\n\t\t\tscale.setValue( 1 );\n\t\t} );\n\t}\n\n\tconst scaleInterpolation = scale.interpolate( {\n\t\tinputRange: [ 1, 1.5, 2 ],\n\t\toutputRange: [ 1, 0.7, 1 ],\n\t} );\n\n\tfunction deselectCustomGradient() {\n\t\tconst { width } = Dimensions.get( 'window' );\n\t\tconst isVisible =\n\t\t\tcontentWidth - scrollPosition - customIndicatorWidth < width;\n\n\t\tif ( isCustomGradientColor ) {\n\t\t\tif ( ! isIOS ) {\n\t\t\t\t// Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.\n\t\t\t\t// https://github.com/facebook/react-native/issues/27504\n\t\t\t\t// Workaround: Force the scroll when deselecting custom gradient color and when custom indicator is visible on layout.\n\t\t\t\tif (\n\t\t\t\t\tisCustomGradientColor &&\n\t\t\t\t\tisVisible &&\n\t\t\t\t\tscrollViewRef.current\n\t\t\t\t) {\n\t\t\t\t\tscrollViewRef.current.scrollTo( {\n\t\t\t\t\t\tx: scrollPosition - customIndicatorWidth,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction onColorPress( color ) {\n\t\tdeselectCustomGradient();\n\t\tperformAnimation( color );\n\t\tsetColor( color );\n\t}\n\n\tfunction onContentSizeChange( width ) {\n\t\tcontentWidth = width;\n\t\tif ( isSelectedCustom() && scrollViewRef.current ) {\n\t\t\tscrollToEndWithDelay();\n\t\t}\n\t}\n\n\tfunction scrollToEndWithDelay() {\n\t\tconst delayedScroll = setTimeout( () => {\n\t\t\tscrollViewRef.current.scrollToEnd();\n\t\t}, ANIMATION_DURATION );\n\t\treturn () => {\n\t\t\tclearTimeout( delayedScroll );\n\t\t};\n\t}\n\n\tfunction onCustomIndicatorLayout( { nativeEvent } ) {\n\t\tconst { width } = nativeEvent.layout;\n\t\tif ( width !== customIndicatorWidth ) {\n\t\t\tcustomIndicatorWidth = width;\n\t\t}\n\t}\n\n\tfunction onScroll( { nativeEvent } ) {\n\t\tscrollPosition = nativeEvent.contentOffset.x;\n\t}\n\n\tconst verticalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.verticalSeparator,\n\t\tstyles.verticalSeparatorDark\n\t);\n\n\tconst customTextStyle = usePreferredColorSchemeStyle(\n\t\t[ styles.customText, ! isIOS && styles.customTextAndroid ],\n\t\tstyles.customTextDark\n\t);\n\n\tconst customIndicatorWrapperStyle = [\n\t\tstyles.customIndicatorWrapper,\n\t\tcustomIndicatorWrapperStyles,\n\t];\n\n\treturn (\n\t\t<ScrollView\n\t\t\tcontentContainerStyle={ styles.contentContainer }\n\t\t\tstyle={ styles.container }\n\t\t\thorizontal\n\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\tdisableScrollViewPanResponder\n\t\t\tscrollEventThrottle={ 16 }\n\t\t\tonScroll={ onScroll }\n\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\tonScrollBeginDrag={ () => shouldEnableBottomSheetScroll( false ) }\n\t\t\tonScrollEndDrag={ () => shouldEnableBottomSheetScroll( true ) }\n\t\t\tref={ scrollViewRef }\n\t\t\ttestID=\"color-palette\"\n\t\t>\n\t\t\t{ shouldShowCustomIndicator && (\n\t\t\t\t<View\n\t\t\t\t\tstyle={ customIndicatorWrapperStyle }\n\t\t\t\t\tonLayout={ onCustomIndicatorLayout }\n\t\t\t\t>\n\t\t\t\t\t{ shouldShowCustomVerticalSeparator && (\n\t\t\t\t\t\t<View style={ verticalSeparatorStyle } />\n\t\t\t\t\t) }\n\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\taccessibilityState={ { selected: isSelectedCustom() } }\n\t\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={ customIndicatorWrapperStyle }>\n\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\twithCustomPicker={ ! isGradientSegment }\n\t\t\t\t\t\t\t\tcolor={ customIndicatorColor }\n\t\t\t\t\t\t\t\tisSelected={ isSelectedCustom() }\n\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ shouldShowCustomLabel && (\n\t\t\t\t\t\t\t\t<Text style={ customTextStyle }>\n\t\t\t\t\t\t\t\t\t{ isIOS\n\t\t\t\t\t\t\t\t\t\t? customText\n\t\t\t\t\t\t\t\t\t\t: customText.toUpperCase() }\n\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t</View>\n\t\t\t) }\n\t\t\t{ colors.map( ( color ) => {\n\t\t\t\tconst scaleValue = isSelected( color ) ? scaleInterpolation : 1;\n\t\t\t\treturn (\n\t\t\t\t\t<View key={ `${ color }-${ isSelected( color ) }` }>\n\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\tonPress={ () => onColorPress( color ) }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: isSelected( color ),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityHint={ color }\n\t\t\t\t\t\t\ttestID={ color }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Animated.View\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tscale: scaleValue,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelected( color ) }\n\t\t\t\t\t\t\t\t\topacity={ opacity }\n\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Animated.View>\n\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t</View>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ScrollView>\n\t);\n}\n\nexport default ColorPalette;\n"]}

package/build/color-picker/color-display.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-picker/color-display.tsx"],"names":["ValueDisplay","values","map","value","abbreviation","COLORS","ui","theme","HslDisplay","color","enableAlpha","h","s","l","a","toHsl","Math","floor","round","push","RgbDisplay","r","g","b","toRgb","HexDisplay","colorWithoutHash","toHex","slice","toUpperCase","getComponent","colorType","ColorDisplay","copiedColor","setCopiedColor","copyTimer","props","Component","copyRef","toHslString","toRgbString","current","clearTimeout","setTimeout","undefined","height"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { colord, extend, Colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { useCopyToClipboard } from '@wordpress/compose';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { Text } from '../text';\nimport { Flex, FlexItem } from '../flex';\nimport { Tooltip } from '../ui/tooltip';\nimport type { ColorType } from './types';\nimport { space } from '../ui/utils/space';\nimport { COLORS } from '../utils/colors-values';\n\ninterface ColorDisplayProps {\n\tcolor: Colord;\n\tcolorType: ColorType;\n\tenableAlpha: boolean;\n}\n\ninterface DisplayProps {\n\tcolor: Colord;\n\tenableAlpha: boolean;\n}\n\ntype Values = [ number, string ][];\n\ninterface ValueDisplayProps {\n\tvalues: Values;\n}\n\nconst ValueDisplay = ( { values }: ValueDisplayProps ) => (\n\t<>\n\t\t{ values.map( ( [ value, abbreviation ] ) => {\n\t\t\treturn (\n\t\t\t\t<FlexItem key={ abbreviation } isBlock display=\"flex\">\n\t\t\t\t\t<Text color={ COLORS.ui.theme }>{ abbreviation }</Text>\n\t\t\t\t\t<Text>{ value }</Text>\n\t\t\t\t</FlexItem>\n\t\t\t);\n\t\t} ) }\n\t</>\n);\n\nconst HslDisplay = ( { color, enableAlpha }: DisplayProps ) => {\n\tconst { h, s, l, a } = color.toHsl();\n\n\tconst values: Values = [\n\t\t[ Math.floor( h ), 'H' ],\n\t\t[ Math.round( s * 100 ), 'S' ],\n\t\t[ Math.round( l * 100 ), 'L' ],\n\t];\n\tif ( enableAlpha ) {\n\t\tvalues.push( [ Math.round( a * 100 ), 'A' ] );\n\t}\n\n\treturn <ValueDisplay values={ values } />;\n};\n\nconst RgbDisplay = ( { color, enableAlpha }: DisplayProps ) => {\n\tconst { r, g, b, a } = color.toRgb();\n\n\tconst values: Values = [\n\t\t[ r, 'R' ],\n\t\t[ g, 'G' ],\n\t\t[ b, 'B' ],\n\t];\n\n\tif ( enableAlpha ) {\n\t\tvalues.push( [ Math.round( a * 100 ), 'A' ] );\n\t}\n\n\treturn <ValueDisplay values={ values } />;\n};\n\nconst HexDisplay = ( { color }: DisplayProps ) => {\n\tconst colorWithoutHash = color.toHex().slice( 1 ).toUpperCase();\n\treturn (\n\t\t<FlexItem>\n\t\t\t<Text color={ COLORS.ui.theme }>#</Text>\n\t\t\t<Text>{ colorWithoutHash }</Text>\n\t\t</FlexItem>\n\t);\n};\n\nconst getComponent = ( colorType: ColorType ) => {\n\tswitch ( colorType ) {\n\t\tcase 'hsl':\n\t\t\treturn HslDisplay;\n\t\tcase 'rgb':\n\t\t\treturn RgbDisplay;\n\t\tdefault:\n\t\tcase 'hex':\n\t\t\treturn HexDisplay;\n\t}\n};\n\nexport const ColorDisplay = ( {\n\tcolor,\n\tcolorType,\n\tenableAlpha,\n}: ColorDisplayProps ) => {\n\tconst [ copiedColor, setCopiedColor ] = useState< string | null >( null );\n\tconst copyTimer = useRef< ReturnType< typeof setTimeout > | undefined >();\n\tconst props = { color, enableAlpha };\n\tconst Component = getComponent( colorType );\n\tconst copyRef = useCopyToClipboard< HTMLDivElement >(\n\t\t() => {\n\t\t\tswitch ( colorType ) {\n\t\t\t\tcase 'hsl': {\n\t\t\t\t\treturn color.toHslString();\n\t\t\t\t}\n\t\t\t\tcase 'rgb': {\n\t\t\t\t\treturn color.toRgbString();\n\t\t\t\t}\n\t\t\t\tdefault:\n\t\t\t\tcase 'hex': {\n\t\t\t\t\treturn color.toHex();\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t() => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t\tsetCopiedColor( color.toHex() );\n\t\t\tcopyTimer.current = setTimeout( () => {\n\t\t\t\tsetCopiedColor( null );\n\t\t\t\tcopyTimer.current = undefined;\n\t\t\t}, 3000 );\n\t\t}\n\t);\n\tuseEffect( () => {\n\t\t// clear copyTimer on component unmount.\n\t\treturn () => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\treturn (\n\t\t<Tooltip\n\t\t\tcontent={\n\t\t\t\t<Text color=\"white\">\n\t\t\t\t\t{ copiedColor === color.toHex()\n\t\t\t\t\t\t? __( 'Copied!' )\n\t\t\t\t\t\t: __( 'Copy' ) }\n\t\t\t\t</Text>\n\t\t\t}\n\t\t>\n\t\t\t<Flex\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tgap={ space( 1 ) }\n\t\t\t\tref={ copyRef }\n\t\t\t\tstyle={ { height: 30 } }\n\t\t\t>\n\t\t\t\t<Component { ...props } />\n\t\t\t</Flex>\n\t\t</Tooltip>\n\t);\n};\n"]}
+{"version":3,"sources":["@wordpress/components/src/color-picker/color-display.tsx"],"names":["ValueDisplay","values","map","value","abbreviation","COLORS","ui","theme","HslDisplay","color","enableAlpha","h","s","l","a","toHsl","Math","floor","round","push","RgbDisplay","r","g","b","toRgb","HexDisplay","colorWithoutHash","toHex","slice","toUpperCase","getComponent","colorType","ColorDisplay","copiedColor","setCopiedColor","copyTimer","props","Component","copyRef","toHslString","toRgbString","current","clearTimeout","setTimeout","undefined","height"],"mappings":";;;;;;;AASA;;AADA;;AAEA;;AAKA;;AACA;;AACA;;AAEA;;AACA;;AApBA;AACA;AACA;;AAGA;AACA;AACA;;AAKA;AACA;AACA;AAyBA,MAAMA,YAAY,GAAG;AAAA,MAAE;AAAEC,IAAAA;AAAF,GAAF;AAAA,SACpB,qDACGA,MAAM,CAACC,GAAP,CAAY,SAA+B;AAAA,QAA7B,CAAEC,KAAF,EAASC,YAAT,CAA6B;AAC5C,WACC,4BAAC,cAAD;AAAU,MAAA,GAAG,EAAGA,YAAhB;AAA+B,MAAA,OAAO,MAAtC;AAAuC,MAAA,OAAO,EAAC;AAA/C,OACC,4BAAC,UAAD;AAAM,MAAA,KAAK,EAAGC,qBAAOC,EAAP,CAAUC;AAAxB,OAAkCH,YAAlC,CADD,EAEC,4BAAC,UAAD,QAAQD,KAAR,CAFD,CADD;AAMA,GAPC,CADH,CADoB;AAAA,CAArB;;AAaA,MAAMK,UAAU,GAAG,SAA4C;AAAA,MAA1C;AAAEC,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAA0C;AAC9D,QAAM;AAAEC,IAAAA,CAAF;AAAKC,IAAAA,CAAL;AAAQC,IAAAA,CAAR;AAAWC,IAAAA;AAAX,MAAiBL,KAAK,CAACM,KAAN,EAAvB;AAEA,QAAMd,MAAc,GAAG,CACtB,CAAEe,IAAI,CAACC,KAAL,CAAYN,CAAZ,CAAF,EAAmB,GAAnB,CADsB,EAEtB,CAAEK,IAAI,CAACE,KAAL,CAAYN,CAAC,GAAG,GAAhB,CAAF,EAAyB,GAAzB,CAFsB,EAGtB,CAAEI,IAAI,CAACE,KAAL,CAAYL,CAAC,GAAG,GAAhB,CAAF,EAAyB,GAAzB,CAHsB,CAAvB;;AAKA,MAAKH,WAAL,EAAmB;AAClBT,IAAAA,MAAM,CAACkB,IAAP,CAAa,CAAEH,IAAI,CAACE,KAAL,CAAYJ,CAAC,GAAG,GAAhB,CAAF,EAAyB,GAAzB,CAAb;AACA;;AAED,SAAO,4BAAC,YAAD;AAAc,IAAA,MAAM,EAAGb;AAAvB,IAAP;AACA,CAbD;;AAeA,MAAMmB,UAAU,GAAG,SAA4C;AAAA,MAA1C;AAAEX,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAA0C;AAC9D,QAAM;AAAEW,IAAAA,CAAF;AAAKC,IAAAA,CAAL;AAAQC,IAAAA,CAAR;AAAWT,IAAAA;AAAX,MAAiBL,KAAK,CAACe,KAAN,EAAvB;AAEA,QAAMvB,MAAc,GAAG,CACtB,CAAEoB,CAAF,EAAK,GAAL,CADsB,EAEtB,CAAEC,CAAF,EAAK,GAAL,CAFsB,EAGtB,CAAEC,CAAF,EAAK,GAAL,CAHsB,CAAvB;;AAMA,MAAKb,WAAL,EAAmB;AAClBT,IAAAA,MAAM,CAACkB,IAAP,CAAa,CAAEH,IAAI,CAACE,KAAL,CAAYJ,CAAC,GAAG,GAAhB,CAAF,EAAyB,GAAzB,CAAb;AACA;;AAED,SAAO,4BAAC,YAAD;AAAc,IAAA,MAAM,EAAGb;AAAvB,IAAP;AACA,CAdD;;AAgBA,MAAMwB,UAAU,GAAG,SAA+B;AAAA,MAA7B;AAAEhB,IAAAA;AAAF,GAA6B;AACjD,QAAMiB,gBAAgB,GAAGjB,KAAK,CAACkB,KAAN,GAAcC,KAAd,CAAqB,CAArB,EAAyBC,WAAzB,EAAzB;AACA,SACC,4BAAC,cAAD,QACC,4BAAC,UAAD;AAAM,IAAA,KAAK,EAAGxB,qBAAOC,EAAP,CAAUC;AAAxB,SADD,EAEC,4BAAC,UAAD,QAAQmB,gBAAR,CAFD,CADD;AAMA,CARD;;AAUA,MAAMI,YAAY,GAAKC,SAAF,IAA4B;AAChD,UAASA,SAAT;AACC,SAAK,KAAL;AACC,aAAOvB,UAAP;;AACD,SAAK,KAAL;AACC,aAAOY,UAAP;;AACD;AACA,SAAK,KAAL;AACC,aAAOK,UAAP;AAPF;AASA,CAVD;;AAYO,MAAMO,YAAY,GAAG,SAIF;AAAA,MAJI;AAC7BvB,IAAAA,KAD6B;AAE7BsB,IAAAA,SAF6B;AAG7BrB,IAAAA;AAH6B,GAIJ;AACzB,QAAM,CAAEuB,WAAF,EAAeC,cAAf,IAAkC,uBAA2B,IAA3B,CAAxC;AACA,QAAMC,SAAS,GAAG,sBAAlB;AACA,QAAMC,KAAK,GAAG;AAAE3B,IAAAA,KAAF;AAASC,IAAAA;AAAT,GAAd;AACA,QAAM2B,SAAS,GAAGP,YAAY,CAAEC,SAAF,CAA9B;AACA,QAAMO,OAAO,GAAG,iCACf,MAAM;AACL,YAASP,SAAT;AACC,WAAK,KAAL;AAAY;AACX,iBAAOtB,KAAK,CAAC8B,WAAN,EAAP;AACA;;AACD,WAAK,KAAL;AAAY;AACX,iBAAO9B,KAAK,CAAC+B,WAAN,EAAP;AACA;;AACD;AACA,WAAK,KAAL;AAAY;AACX,iBAAO/B,KAAK,CAACkB,KAAN,EAAP;AACA;AAVF;AAYA,GAdc,EAef,MAAM;AACL,QAAKQ,SAAS,CAACM,OAAf,EAAyB;AACxBC,MAAAA,YAAY,CAAEP,SAAS,CAACM,OAAZ,CAAZ;AACA;;AACDP,IAAAA,cAAc,CAAEzB,KAAK,CAACkB,KAAN,EAAF,CAAd;AACAQ,IAAAA,SAAS,CAACM,OAAV,GAAoBE,UAAU,CAAE,MAAM;AACrCT,MAAAA,cAAc,CAAE,IAAF,CAAd;AACAC,MAAAA,SAAS,CAACM,OAAV,GAAoBG,SAApB;AACA,KAH6B,EAG3B,IAH2B,CAA9B;AAIA,GAxBc,CAAhB;AA0BA,0BAAW,MAAM;AAChB;AACA,WAAO,MAAM;AACZ,UAAKT,SAAS,CAACM,OAAf,EAAyB;AACxBC,QAAAA,YAAY,CAAEP,SAAS,CAACM,OAAZ,CAAZ;AACA;AACD,KAJD;AAKA,GAPD,EAOG,EAPH;AAQA,SACC,4BAAC,gBAAD;AACC,IAAA,OAAO,EACN,4BAAC,UAAD;AAAM,MAAA,KAAK,EAAC;AAAZ,OACGR,WAAW,KAAKxB,KAAK,CAACkB,KAAN,EAAhB,GACC,cAAI,SAAJ,CADD,GAEC,cAAI,MAAJ,CAHJ;AAFF,KASC,4BAAC,UAAD;AACC,IAAA,OAAO,EAAC,YADT;AAEC,IAAA,GAAG,EAAG,kBAAO,CAAP,CAFP;AAGC,IAAA,GAAG,EAAGW,OAHP;AAIC,IAAA,KAAK,EAAG;AAAEO,MAAAA,MAAM,EAAE;AAAV;AAJT,KAMC,4BAAC,SAAD,EAAgBT,KAAhB,CAND,CATD,CADD;AAoBA,CA/DM","sourcesContent":["/**\n * External dependencies\n */\nimport type { Colord } from 'colord';\n\n/**\n * WordPress dependencies\n */\nimport { useCopyToClipboard } from '@wordpress/compose';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { Text } from '../text';\nimport { Flex, FlexItem } from '../flex';\nimport { Tooltip } from '../ui/tooltip';\nimport type { ColorType } from './types';\nimport { space } from '../ui/utils/space';\nimport { COLORS } from '../utils/colors-values';\n\ninterface ColorDisplayProps {\n\tcolor: Colord;\n\tcolorType: ColorType;\n\tenableAlpha: boolean;\n}\n\ninterface DisplayProps {\n\tcolor: Colord;\n\tenableAlpha: boolean;\n}\n\ntype Values = [ number, string ][];\n\ninterface ValueDisplayProps {\n\tvalues: Values;\n}\n\nconst ValueDisplay = ( { values }: ValueDisplayProps ) => (\n\t<>\n\t\t{ values.map( ( [ value, abbreviation ] ) => {\n\t\t\treturn (\n\t\t\t\t<FlexItem key={ abbreviation } isBlock display=\"flex\">\n\t\t\t\t\t<Text color={ COLORS.ui.theme }>{ abbreviation }</Text>\n\t\t\t\t\t<Text>{ value }</Text>\n\t\t\t\t</FlexItem>\n\t\t\t);\n\t\t} ) }\n\t</>\n);\n\nconst HslDisplay = ( { color, enableAlpha }: DisplayProps ) => {\n\tconst { h, s, l, a } = color.toHsl();\n\n\tconst values: Values = [\n\t\t[ Math.floor( h ), 'H' ],\n\t\t[ Math.round( s * 100 ), 'S' ],\n\t\t[ Math.round( l * 100 ), 'L' ],\n\t];\n\tif ( enableAlpha ) {\n\t\tvalues.push( [ Math.round( a * 100 ), 'A' ] );\n\t}\n\n\treturn <ValueDisplay values={ values } />;\n};\n\nconst RgbDisplay = ( { color, enableAlpha }: DisplayProps ) => {\n\tconst { r, g, b, a } = color.toRgb();\n\n\tconst values: Values = [\n\t\t[ r, 'R' ],\n\t\t[ g, 'G' ],\n\t\t[ b, 'B' ],\n\t];\n\n\tif ( enableAlpha ) {\n\t\tvalues.push( [ Math.round( a * 100 ), 'A' ] );\n\t}\n\n\treturn <ValueDisplay values={ values } />;\n};\n\nconst HexDisplay = ( { color }: DisplayProps ) => {\n\tconst colorWithoutHash = color.toHex().slice( 1 ).toUpperCase();\n\treturn (\n\t\t<FlexItem>\n\t\t\t<Text color={ COLORS.ui.theme }>#</Text>\n\t\t\t<Text>{ colorWithoutHash }</Text>\n\t\t</FlexItem>\n\t);\n};\n\nconst getComponent = ( colorType: ColorType ) => {\n\tswitch ( colorType ) {\n\t\tcase 'hsl':\n\t\t\treturn HslDisplay;\n\t\tcase 'rgb':\n\t\t\treturn RgbDisplay;\n\t\tdefault:\n\t\tcase 'hex':\n\t\t\treturn HexDisplay;\n\t}\n};\n\nexport const ColorDisplay = ( {\n\tcolor,\n\tcolorType,\n\tenableAlpha,\n}: ColorDisplayProps ) => {\n\tconst [ copiedColor, setCopiedColor ] = useState< string | null >( null );\n\tconst copyTimer = useRef< ReturnType< typeof setTimeout > | undefined >();\n\tconst props = { color, enableAlpha };\n\tconst Component = getComponent( colorType );\n\tconst copyRef = useCopyToClipboard< HTMLDivElement >(\n\t\t() => {\n\t\t\tswitch ( colorType ) {\n\t\t\t\tcase 'hsl': {\n\t\t\t\t\treturn color.toHslString();\n\t\t\t\t}\n\t\t\t\tcase 'rgb': {\n\t\t\t\t\treturn color.toRgbString();\n\t\t\t\t}\n\t\t\t\tdefault:\n\t\t\t\tcase 'hex': {\n\t\t\t\t\treturn color.toHex();\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t() => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t\tsetCopiedColor( color.toHex() );\n\t\t\tcopyTimer.current = setTimeout( () => {\n\t\t\t\tsetCopiedColor( null );\n\t\t\t\tcopyTimer.current = undefined;\n\t\t\t}, 3000 );\n\t\t}\n\t);\n\tuseEffect( () => {\n\t\t// clear copyTimer on component unmount.\n\t\treturn () => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\treturn (\n\t\t<Tooltip\n\t\t\tcontent={\n\t\t\t\t<Text color=\"white\">\n\t\t\t\t\t{ copiedColor === color.toHex()\n\t\t\t\t\t\t? __( 'Copied!' )\n\t\t\t\t\t\t: __( 'Copy' ) }\n\t\t\t\t</Text>\n\t\t\t}\n\t\t>\n\t\t\t<Flex\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tgap={ space( 1 ) }\n\t\t\t\tref={ copyRef }\n\t\t\t\tstyle={ { height: 30 } }\n\t\t\t>\n\t\t\t\t<Component { ...props } />\n\t\t\t</Flex>\n\t\t</Tooltip>\n\t);\n};\n"]}

package/build/color-picker/color-input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/color-picker/color-input.tsx"],"names":["ColorInput","colorType","color","onChange","enableAlpha","props"],"mappings":";;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAYO,MAAMA,UAAU,GAAG,QAKF;AAAA,MALI;AAC3BC,IAAAA,SAD2B;AAE3BC,IAAAA,KAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA;AAJ2B,GAKJ;AACvB,QAAMC,KAAK,GAAG;AAAEH,IAAAA,KAAF;AAASC,IAAAA,QAAT;AAAmBC,IAAAA;AAAnB,GAAd;;AACA,UAASH,SAAT;AACC,SAAK,KAAL;AACC,aAAO,4BAAC,kBAAD,EAAeI,KAAf,CAAP;;AACD,SAAK,KAAL;AACC,aAAO,4BAAC,kBAAD,EAAeA,KAAf,CAAP;;AACD;AACA,SAAK,KAAL;AACC,aAAO,4BAAC,kBAAD,EAAeA,KAAf,CAAP;AAPF;AASA,CAhBM","sourcesContent":["/**\n * External dependencies\n */\nimport { colord, extend, Colord } from 'colord';\n\n/**\n * Internal dependencies\n */\nimport { RgbInput } from './rgb-input';\nimport { HslInput } from './hsl-input';\nimport { HexInput } from './hex-input';\n\ninterface ColorInputProps {\n\tcolorType: 'hsl' | 'hex' | 'rgb';\n\tcolor: Colord;\n\tonChange: ( nextColor: Colord ) => void;\n\tenableAlpha: boolean;\n}\n\nexport const ColorInput = ( {\n\tcolorType,\n\tcolor,\n\tonChange,\n\tenableAlpha,\n}: ColorInputProps ) => {\n\tconst props = { color, onChange, enableAlpha };\n\tswitch ( colorType ) {\n\t\tcase 'hsl':\n\t\t\treturn <HslInput { ...props } />;\n\t\tcase 'rgb':\n\t\t\treturn <RgbInput { ...props } />;\n\t\tdefault:\n\t\tcase 'hex':\n\t\t\treturn <HexInput { ...props } />;\n\t}\n};\n"]}
+{"version":3,"sources":["@wordpress/components/src/color-picker/color-input.tsx"],"names":["ColorInput","colorType","color","onChange","enableAlpha","props"],"mappings":";;;;;;;;;AAQA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAYO,MAAMA,UAAU,GAAG,QAKF;AAAA,MALI;AAC3BC,IAAAA,SAD2B;AAE3BC,IAAAA,KAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA;AAJ2B,GAKJ;AACvB,QAAMC,KAAK,GAAG;AAAEH,IAAAA,KAAF;AAASC,IAAAA,QAAT;AAAmBC,IAAAA;AAAnB,GAAd;;AACA,UAASH,SAAT;AACC,SAAK,KAAL;AACC,aAAO,4BAAC,kBAAD,EAAeI,KAAf,CAAP;;AACD,SAAK,KAAL;AACC,aAAO,4BAAC,kBAAD,EAAeA,KAAf,CAAP;;AACD;AACA,SAAK,KAAL;AACC,aAAO,4BAAC,kBAAD,EAAeA,KAAf,CAAP;AAPF;AASA,CAhBM","sourcesContent":["/**\n * External dependencies\n */\nimport type { Colord } from 'colord';\n\n/**\n * Internal dependencies\n */\nimport { RgbInput } from './rgb-input';\nimport { HslInput } from './hsl-input';\nimport { HexInput } from './hex-input';\n\ninterface ColorInputProps {\n\tcolorType: 'hsl' | 'hex' | 'rgb';\n\tcolor: Colord;\n\tonChange: ( nextColor: Colord ) => void;\n\tenableAlpha: boolean;\n}\n\nexport const ColorInput = ( {\n\tcolorType,\n\tcolor,\n\tonChange,\n\tenableAlpha,\n}: ColorInputProps ) => {\n\tconst props = { color, onChange, enableAlpha };\n\tswitch ( colorType ) {\n\t\tcase 'hsl':\n\t\t\treturn <HslInput { ...props } />;\n\t\tcase 'rgb':\n\t\t\treturn <RgbInput { ...props } />;\n\t\tdefault:\n\t\tcase 'hex':\n\t\t\treturn <HexInput { ...props } />;\n\t}\n};\n"]}

package/build/color-picker/component.js

@@ -11,8 +11,6 @@ var _element = require("@wordpress/element");
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _react = require("react");
-
 var _colord = require("colord");
 
 var _names = _interopRequireDefault(require("colord/plugins/names"));
@@ -42,7 +40,6 @@ var _hooks = require("../utils/hooks");
 /**
  * External dependencies
  */
-// eslint-disable-next-line no-restricted-imports
 
 /**
  * WordPress dependencies
@@ -79,10 +76,10 @@ const ColorPicker = (props, forwardedRef) => {
     defaultValue
   });
   const safeColordColor = (0, _element.useMemo)(() => {
-    return (0, _colord.colord)(color);
+    return (0, _colord.colord)(color || '');
   }, [color]);
   const debouncedSetColor = (0, _compose.useDebounce)(setColor);
-  const handleChange = (0, _react.useCallback)(nextValue => {
+  const handleChange = (0, _element.useCallback)(nextValue => {
     debouncedSetColor(nextValue.toHex());
   }, [debouncedSetColor]);
   const [showInputs, setShowInputs] = (0, _element.useState)(false);