@react-spectrum/overlays 5.9.3 → 5.10.0

package/dist/underlay_vars_css.main.js

@@ -1,50 +0,0 @@
-
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-
-$parcel$export(module.exports, "focus-ring", () => $42908e91b4c5f428$export$f39a09f249340e2a, (v) => $42908e91b4c5f428$export$f39a09f249340e2a = v);
-$parcel$export(module.exports, "i18nFontFamily", () => $42908e91b4c5f428$export$8c4ee2c50c22c514, (v) => $42908e91b4c5f428$export$8c4ee2c50c22c514 = v);
-$parcel$export(module.exports, "spectrum-overlay--open", () => $42908e91b4c5f428$export$a397eb58038aa381, (v) => $42908e91b4c5f428$export$a397eb58038aa381 = v);
-$parcel$export(module.exports, "is-open", () => $42908e91b4c5f428$export$a9781837241c946d, (v) => $42908e91b4c5f428$export$a9781837241c946d = v);
-$parcel$export(module.exports, "spectrum-FocusRing-ring", () => $42908e91b4c5f428$export$4109102f950813a6, (v) => $42908e91b4c5f428$export$4109102f950813a6 = v);
-$parcel$export(module.exports, "spectrum-FocusRing", () => $42908e91b4c5f428$export$24c7f46a6e3605dd, (v) => $42908e91b4c5f428$export$24c7f46a6e3605dd = v);
-$parcel$export(module.exports, "spectrum-FocusRing--quiet", () => $42908e91b4c5f428$export$2927016961429360, (v) => $42908e91b4c5f428$export$2927016961429360 = v);
-$parcel$export(module.exports, "spectrum-overlay", () => $42908e91b4c5f428$export$39eed38e2296a1d6, (v) => $42908e91b4c5f428$export$39eed38e2296a1d6 = v);
-$parcel$export(module.exports, "spectrum-Underlay", () => $42908e91b4c5f428$export$74470528f463af97, (v) => $42908e91b4c5f428$export$74470528f463af97 = v);
-$parcel$export(module.exports, "spectrum-Underlay--transparent", () => $42908e91b4c5f428$export$8eb3860104039b44, (v) => $42908e91b4c5f428$export$8eb3860104039b44 = v);
-$parcel$export(module.exports, "spectrum-overlay--bottom--open", () => $42908e91b4c5f428$export$a96755f239de61ee, (v) => $42908e91b4c5f428$export$a96755f239de61ee = v);
-$parcel$export(module.exports, "spectrum-overlay--left--open", () => $42908e91b4c5f428$export$a85c0c6b6cf8598c, (v) => $42908e91b4c5f428$export$a85c0c6b6cf8598c = v);
-$parcel$export(module.exports, "spectrum-overlay--right--open", () => $42908e91b4c5f428$export$85aaa87e65e040bf, (v) => $42908e91b4c5f428$export$85aaa87e65e040bf = v);
-$parcel$export(module.exports, "spectrum-overlay--top--open", () => $42908e91b4c5f428$export$b9768db7ffc1bc2, (v) => $42908e91b4c5f428$export$b9768db7ffc1bc2 = v);
-var $42908e91b4c5f428$export$f39a09f249340e2a;
-var $42908e91b4c5f428$export$8c4ee2c50c22c514;
-var $42908e91b4c5f428$export$a397eb58038aa381;
-var $42908e91b4c5f428$export$a9781837241c946d;
-var $42908e91b4c5f428$export$4109102f950813a6;
-var $42908e91b4c5f428$export$24c7f46a6e3605dd;
-var $42908e91b4c5f428$export$2927016961429360;
-var $42908e91b4c5f428$export$39eed38e2296a1d6;
-var $42908e91b4c5f428$export$74470528f463af97;
-var $42908e91b4c5f428$export$8eb3860104039b44;
-var $42908e91b4c5f428$export$a96755f239de61ee;
-var $42908e91b4c5f428$export$a85c0c6b6cf8598c;
-var $42908e91b4c5f428$export$85aaa87e65e040bf;
-var $42908e91b4c5f428$export$b9768db7ffc1bc2;
-$42908e91b4c5f428$export$f39a09f249340e2a = `fdFt3W_focus-ring`;
-$42908e91b4c5f428$export$8c4ee2c50c22c514 = `fdFt3W_i18nFontFamily`;
-$42908e91b4c5f428$export$a397eb58038aa381 = `fdFt3W_spectrum-overlay--open`;
-$42908e91b4c5f428$export$a9781837241c946d = `fdFt3W_is-open ${$42908e91b4c5f428$export$a397eb58038aa381}`;
-$42908e91b4c5f428$export$4109102f950813a6 = `fdFt3W_spectrum-FocusRing-ring`;
-$42908e91b4c5f428$export$24c7f46a6e3605dd = `fdFt3W_spectrum-FocusRing ${$42908e91b4c5f428$export$4109102f950813a6}`;
-$42908e91b4c5f428$export$2927016961429360 = `fdFt3W_spectrum-FocusRing--quiet`;
-$42908e91b4c5f428$export$39eed38e2296a1d6 = `fdFt3W_spectrum-overlay`;
-$42908e91b4c5f428$export$74470528f463af97 = `fdFt3W_spectrum-Underlay ${$42908e91b4c5f428$export$39eed38e2296a1d6}`;
-$42908e91b4c5f428$export$8eb3860104039b44 = `fdFt3W_spectrum-Underlay--transparent`;
-$42908e91b4c5f428$export$a96755f239de61ee = `fdFt3W_spectrum-overlay--bottom--open`;
-$42908e91b4c5f428$export$a85c0c6b6cf8598c = `fdFt3W_spectrum-overlay--left--open`;
-$42908e91b4c5f428$export$85aaa87e65e040bf = `fdFt3W_spectrum-overlay--right--open`;
-$42908e91b4c5f428$export$b9768db7ffc1bc2 = `fdFt3W_spectrum-overlay--top--open`;
-
-
-//# sourceMappingURL=underlay_vars_css.main.js.map

package/dist/underlay_vars_css.main.js.map

@@ -1 +0,0 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAbA,4CAA+B,CAAC,iBAAiB,CAAC;AAClD,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA2C,CAAC,6BAA6B,CAAC;AAC1E,4CAA4B,CAAC,eAAe,EAAE,2CAA0C;AACxF,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAAuC,CAAC,0BAA0B,EAAE,2CAA2C;AAC/G,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAAqC,CAAC,uBAAuB,CAAC;AAC9D,4CAAsC,CAAC,yBAAyB,EAAE,2CAAoC;AACtG,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAiD,CAAC,mCAAmC,CAAC;AACtF,4CAAkD,CAAC,oCAAoC,CAAC;AACxF,2CAAgD,CAAC,kCAAkC,CAAC","sources":["packages/@adobe/spectrum-css-temp/components/underlay/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"underlay_vars_css.main.js.map"}

package/dist/underlay_vars_css.mjs

@@ -1,52 +0,0 @@
-
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-var $c77d7b73b2bbd0fb$exports = {};
-
-$parcel$export($c77d7b73b2bbd0fb$exports, "focus-ring", () => $c77d7b73b2bbd0fb$export$f39a09f249340e2a, (v) => $c77d7b73b2bbd0fb$export$f39a09f249340e2a = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "i18nFontFamily", () => $c77d7b73b2bbd0fb$export$8c4ee2c50c22c514, (v) => $c77d7b73b2bbd0fb$export$8c4ee2c50c22c514 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--open", () => $c77d7b73b2bbd0fb$export$a397eb58038aa381, (v) => $c77d7b73b2bbd0fb$export$a397eb58038aa381 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "is-open", () => $c77d7b73b2bbd0fb$export$a9781837241c946d, (v) => $c77d7b73b2bbd0fb$export$a9781837241c946d = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-FocusRing-ring", () => $c77d7b73b2bbd0fb$export$4109102f950813a6, (v) => $c77d7b73b2bbd0fb$export$4109102f950813a6 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-FocusRing", () => $c77d7b73b2bbd0fb$export$24c7f46a6e3605dd, (v) => $c77d7b73b2bbd0fb$export$24c7f46a6e3605dd = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-FocusRing--quiet", () => $c77d7b73b2bbd0fb$export$2927016961429360, (v) => $c77d7b73b2bbd0fb$export$2927016961429360 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay", () => $c77d7b73b2bbd0fb$export$39eed38e2296a1d6, (v) => $c77d7b73b2bbd0fb$export$39eed38e2296a1d6 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-Underlay", () => $c77d7b73b2bbd0fb$export$74470528f463af97, (v) => $c77d7b73b2bbd0fb$export$74470528f463af97 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-Underlay--transparent", () => $c77d7b73b2bbd0fb$export$8eb3860104039b44, (v) => $c77d7b73b2bbd0fb$export$8eb3860104039b44 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--bottom--open", () => $c77d7b73b2bbd0fb$export$a96755f239de61ee, (v) => $c77d7b73b2bbd0fb$export$a96755f239de61ee = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--left--open", () => $c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c, (v) => $c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--right--open", () => $c77d7b73b2bbd0fb$export$85aaa87e65e040bf, (v) => $c77d7b73b2bbd0fb$export$85aaa87e65e040bf = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--top--open", () => $c77d7b73b2bbd0fb$export$b9768db7ffc1bc2, (v) => $c77d7b73b2bbd0fb$export$b9768db7ffc1bc2 = v);
-var $c77d7b73b2bbd0fb$export$f39a09f249340e2a;
-var $c77d7b73b2bbd0fb$export$8c4ee2c50c22c514;
-var $c77d7b73b2bbd0fb$export$a397eb58038aa381;
-var $c77d7b73b2bbd0fb$export$a9781837241c946d;
-var $c77d7b73b2bbd0fb$export$4109102f950813a6;
-var $c77d7b73b2bbd0fb$export$24c7f46a6e3605dd;
-var $c77d7b73b2bbd0fb$export$2927016961429360;
-var $c77d7b73b2bbd0fb$export$39eed38e2296a1d6;
-var $c77d7b73b2bbd0fb$export$74470528f463af97;
-var $c77d7b73b2bbd0fb$export$8eb3860104039b44;
-var $c77d7b73b2bbd0fb$export$a96755f239de61ee;
-var $c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c;
-var $c77d7b73b2bbd0fb$export$85aaa87e65e040bf;
-var $c77d7b73b2bbd0fb$export$b9768db7ffc1bc2;
-$c77d7b73b2bbd0fb$export$f39a09f249340e2a = `fdFt3W_focus-ring`;
-$c77d7b73b2bbd0fb$export$8c4ee2c50c22c514 = `fdFt3W_i18nFontFamily`;
-$c77d7b73b2bbd0fb$export$a397eb58038aa381 = `fdFt3W_spectrum-overlay--open`;
-$c77d7b73b2bbd0fb$export$a9781837241c946d = `fdFt3W_is-open ${$c77d7b73b2bbd0fb$export$a397eb58038aa381}`;
-$c77d7b73b2bbd0fb$export$4109102f950813a6 = `fdFt3W_spectrum-FocusRing-ring`;
-$c77d7b73b2bbd0fb$export$24c7f46a6e3605dd = `fdFt3W_spectrum-FocusRing ${$c77d7b73b2bbd0fb$export$4109102f950813a6}`;
-$c77d7b73b2bbd0fb$export$2927016961429360 = `fdFt3W_spectrum-FocusRing--quiet`;
-$c77d7b73b2bbd0fb$export$39eed38e2296a1d6 = `fdFt3W_spectrum-overlay`;
-$c77d7b73b2bbd0fb$export$74470528f463af97 = `fdFt3W_spectrum-Underlay ${$c77d7b73b2bbd0fb$export$39eed38e2296a1d6}`;
-$c77d7b73b2bbd0fb$export$8eb3860104039b44 = `fdFt3W_spectrum-Underlay--transparent`;
-$c77d7b73b2bbd0fb$export$a96755f239de61ee = `fdFt3W_spectrum-overlay--bottom--open`;
-$c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c = `fdFt3W_spectrum-overlay--left--open`;
-$c77d7b73b2bbd0fb$export$85aaa87e65e040bf = `fdFt3W_spectrum-overlay--right--open`;
-$c77d7b73b2bbd0fb$export$b9768db7ffc1bc2 = `fdFt3W_spectrum-overlay--top--open`;
-
-
-export {$c77d7b73b2bbd0fb$exports as default};
-//# sourceMappingURL=underlay_vars_css.module.js.map

package/dist/underlay_vars_css.module.js

@@ -1,52 +0,0 @@
-
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-var $c77d7b73b2bbd0fb$exports = {};
-
-$parcel$export($c77d7b73b2bbd0fb$exports, "focus-ring", () => $c77d7b73b2bbd0fb$export$f39a09f249340e2a, (v) => $c77d7b73b2bbd0fb$export$f39a09f249340e2a = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "i18nFontFamily", () => $c77d7b73b2bbd0fb$export$8c4ee2c50c22c514, (v) => $c77d7b73b2bbd0fb$export$8c4ee2c50c22c514 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--open", () => $c77d7b73b2bbd0fb$export$a397eb58038aa381, (v) => $c77d7b73b2bbd0fb$export$a397eb58038aa381 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "is-open", () => $c77d7b73b2bbd0fb$export$a9781837241c946d, (v) => $c77d7b73b2bbd0fb$export$a9781837241c946d = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-FocusRing-ring", () => $c77d7b73b2bbd0fb$export$4109102f950813a6, (v) => $c77d7b73b2bbd0fb$export$4109102f950813a6 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-FocusRing", () => $c77d7b73b2bbd0fb$export$24c7f46a6e3605dd, (v) => $c77d7b73b2bbd0fb$export$24c7f46a6e3605dd = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-FocusRing--quiet", () => $c77d7b73b2bbd0fb$export$2927016961429360, (v) => $c77d7b73b2bbd0fb$export$2927016961429360 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay", () => $c77d7b73b2bbd0fb$export$39eed38e2296a1d6, (v) => $c77d7b73b2bbd0fb$export$39eed38e2296a1d6 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-Underlay", () => $c77d7b73b2bbd0fb$export$74470528f463af97, (v) => $c77d7b73b2bbd0fb$export$74470528f463af97 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-Underlay--transparent", () => $c77d7b73b2bbd0fb$export$8eb3860104039b44, (v) => $c77d7b73b2bbd0fb$export$8eb3860104039b44 = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--bottom--open", () => $c77d7b73b2bbd0fb$export$a96755f239de61ee, (v) => $c77d7b73b2bbd0fb$export$a96755f239de61ee = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--left--open", () => $c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c, (v) => $c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--right--open", () => $c77d7b73b2bbd0fb$export$85aaa87e65e040bf, (v) => $c77d7b73b2bbd0fb$export$85aaa87e65e040bf = v);
-$parcel$export($c77d7b73b2bbd0fb$exports, "spectrum-overlay--top--open", () => $c77d7b73b2bbd0fb$export$b9768db7ffc1bc2, (v) => $c77d7b73b2bbd0fb$export$b9768db7ffc1bc2 = v);
-var $c77d7b73b2bbd0fb$export$f39a09f249340e2a;
-var $c77d7b73b2bbd0fb$export$8c4ee2c50c22c514;
-var $c77d7b73b2bbd0fb$export$a397eb58038aa381;
-var $c77d7b73b2bbd0fb$export$a9781837241c946d;
-var $c77d7b73b2bbd0fb$export$4109102f950813a6;
-var $c77d7b73b2bbd0fb$export$24c7f46a6e3605dd;
-var $c77d7b73b2bbd0fb$export$2927016961429360;
-var $c77d7b73b2bbd0fb$export$39eed38e2296a1d6;
-var $c77d7b73b2bbd0fb$export$74470528f463af97;
-var $c77d7b73b2bbd0fb$export$8eb3860104039b44;
-var $c77d7b73b2bbd0fb$export$a96755f239de61ee;
-var $c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c;
-var $c77d7b73b2bbd0fb$export$85aaa87e65e040bf;
-var $c77d7b73b2bbd0fb$export$b9768db7ffc1bc2;
-$c77d7b73b2bbd0fb$export$f39a09f249340e2a = `fdFt3W_focus-ring`;
-$c77d7b73b2bbd0fb$export$8c4ee2c50c22c514 = `fdFt3W_i18nFontFamily`;
-$c77d7b73b2bbd0fb$export$a397eb58038aa381 = `fdFt3W_spectrum-overlay--open`;
-$c77d7b73b2bbd0fb$export$a9781837241c946d = `fdFt3W_is-open ${$c77d7b73b2bbd0fb$export$a397eb58038aa381}`;
-$c77d7b73b2bbd0fb$export$4109102f950813a6 = `fdFt3W_spectrum-FocusRing-ring`;
-$c77d7b73b2bbd0fb$export$24c7f46a6e3605dd = `fdFt3W_spectrum-FocusRing ${$c77d7b73b2bbd0fb$export$4109102f950813a6}`;
-$c77d7b73b2bbd0fb$export$2927016961429360 = `fdFt3W_spectrum-FocusRing--quiet`;
-$c77d7b73b2bbd0fb$export$39eed38e2296a1d6 = `fdFt3W_spectrum-overlay`;
-$c77d7b73b2bbd0fb$export$74470528f463af97 = `fdFt3W_spectrum-Underlay ${$c77d7b73b2bbd0fb$export$39eed38e2296a1d6}`;
-$c77d7b73b2bbd0fb$export$8eb3860104039b44 = `fdFt3W_spectrum-Underlay--transparent`;
-$c77d7b73b2bbd0fb$export$a96755f239de61ee = `fdFt3W_spectrum-overlay--bottom--open`;
-$c77d7b73b2bbd0fb$export$a85c0c6b6cf8598c = `fdFt3W_spectrum-overlay--left--open`;
-$c77d7b73b2bbd0fb$export$85aaa87e65e040bf = `fdFt3W_spectrum-overlay--right--open`;
-$c77d7b73b2bbd0fb$export$b9768db7ffc1bc2 = `fdFt3W_spectrum-overlay--top--open`;
-
-
-export {$c77d7b73b2bbd0fb$exports as default};
-//# sourceMappingURL=underlay_vars_css.module.js.map

package/dist/underlay_vars_css.module.js.map

@@ -1 +0,0 @@
-{"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AAbA,4CAA+B,CAAC,iBAAiB,CAAC;AAClD,4CAAmC,CAAC,qBAAqB,CAAC;AAC1D,4CAA2C,CAAC,6BAA6B,CAAC;AAC1E,4CAA4B,CAAC,eAAe,EAAE,2CAA0C;AACxF,4CAA4C,CAAC,8BAA8B,CAAC;AAC5E,4CAAuC,CAAC,0BAA0B,EAAE,2CAA2C;AAC/G,4CAA8C,CAAC,gCAAgC,CAAC;AAChF,4CAAqC,CAAC,uBAAuB,CAAC;AAC9D,4CAAsC,CAAC,yBAAyB,EAAE,2CAAoC;AACtG,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAmD,CAAC,qCAAqC,CAAC;AAC1F,4CAAiD,CAAC,mCAAmC,CAAC;AACtF,4CAAkD,CAAC,oCAAoC,CAAC;AACxF,2CAAgD,CAAC,kCAAkC,CAAC","sources":["packages/@adobe/spectrum-css-temp/components/underlay/vars.css"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n@import './index.css';\n@import './skin.css';\n"],"names":[],"version":3,"file":"underlay_vars_css.module.js.map"}

package/src/Modal.tsx

@@ -1,109 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {AriaModalOverlayProps, useModalOverlay} from '@react-aria/overlays';
-import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
-import {DOMRef, RefObject, StyleProps} from '@react-types/shared';
-import modalStyles from '@adobe/spectrum-css-temp/components/modal/vars.css';
-import {Overlay} from './Overlay';
-import {OverlayProps} from '@react-types/overlays';
-import {OverlayTriggerState} from '@react-stately/overlays';
-import overrideStyles from './overlays.css';
-import React, {ForwardedRef, forwardRef, ReactNode, useRef} from 'react';
-import {Underlay} from './Underlay';
-import {useObjectRef, useViewportSize} from '@react-aria/utils';
-
-interface ModalProps extends AriaModalOverlayProps, StyleProps, Omit<OverlayProps, 'nodeRef' | 'shouldContainFocus'> {
-  children: ReactNode,
-  state: OverlayTriggerState,
-  type?: 'modal' | 'fullscreen' | 'fullscreenTakeover'
-}
-
-interface ModalWrapperProps extends ModalProps {
-  isOpen?: boolean,
-  wrapperRef: RefObject<HTMLDivElement | null>,
-  children: ReactNode
-}
-
-export const Modal = forwardRef(function Modal(props: ModalProps, ref: DOMRef<HTMLDivElement>) {
-  let {children, state, ...otherProps} = props;
-  let domRef = useDOMRef(ref);
-  let wrapperRef = useRef<HTMLDivElement>(null);
-
-  return (
-    <Overlay {...otherProps} isOpen={state.isOpen} nodeRef={wrapperRef}>
-      <ModalWrapper {...props} wrapperRef={wrapperRef} ref={domRef}>
-        {children}
-      </ModalWrapper>
-    </Overlay>
-  );
-});
-
-let typeMap = {
-  fullscreen: 'fullscreen',
-  fullscreenTakeover: 'fullscreenTakeover'
-};
-
-let ModalWrapper = forwardRef(function (props: ModalWrapperProps, ref: ForwardedRef<HTMLDivElement | null>) {
-  let {type, children, state, isOpen, wrapperRef} = props;
-  let typeVariant = type != null ? typeMap[type] : undefined;
-  let {styleProps} = useStyleProps(props);
-  let objRef = useObjectRef(ref);
-  let {modalProps, underlayProps} = useModalOverlay(props, state, objRef);
-
-  let wrapperClassName = classNames(
-    modalStyles,
-    'spectrum-Modal-wrapper',
-    classNames(
-      overrideStyles,
-      'spectrum-Modal-wrapper',
-      'react-spectrum-Modal-wrapper'
-    )
-  );
-
-  let modalClassName = classNames(
-    modalStyles,
-    'spectrum-Modal',
-    {
-      'is-open': isOpen
-    },
-    classNames(
-      overrideStyles,
-      'spectrum-Modal',
-      'react-spectrum-Modal'
-    ),
-    {[`spectrum-Modal--${typeVariant}`]: typeVariant},
-    styleProps.className
-  );
-
-  let viewport = useViewportSize();
-  let style: any = {
-    '--spectrum-visual-viewport-height': viewport.height + 'px'
-  };
-
-  // Attach Transition's nodeRef to outer most wrapper for node.reflow: https://github.com/reactjs/react-transition-group/blob/c89f807067b32eea6f68fd6c622190d88ced82e2/src/Transition.js#L231
-  return (
-    <div ref={wrapperRef}>
-      <Underlay {...underlayProps} isOpen={isOpen} />
-      <div className={wrapperClassName} style={style}>
-        <div
-          {...styleProps}
-          {...modalProps}
-          ref={objRef}
-          className={modalClassName}
-          data-testid="modal">
-          {children}
-        </div>
-      </div>
-    </div>
-  );
-});

package/src/OpenTransition.tsx

@@ -1,47 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import React, {JSX, JSXElementConstructor, ReactElement} from 'react';
-import {Transition} from 'react-transition-group';
-
-const OPEN_STATES = {
-  entering: false,
-  entered: true
-};
-
-/**
- * Timeout issues adding css animations to enter may be related to
- * https://github.com/reactjs/react-transition-group/issues/189 or
- * https://github.com/reactjs/react-transition-group/issues/22
- * my VM isn't good enough to debug accurately and get a better answer.
- *
- * As a result, use enter 0 so that is-open is applied once entered
- * it doesn't matter if we know when the css-animation is done on entering
- * for exiting though, give time for the css-animation to play
- * before removing from the DOM
- * **note** hitting esc bypasses exit animation for anyone testing.
- */
-
-export function OpenTransition(
-  props: any
-): JSX.Element | ReactElement<any, string | JSXElementConstructor<any>>[] {
-  // Do not apply any transition if in chromatic.
-  if (typeof process !== 'undefined' && process.env.CHROMATIC) {
-    return React.Children.map(props.children, child => child && React.cloneElement(child, {isOpen: props.in}));
-  }
-
-  return (
-    <Transition timeout={{enter: 0, exit: 350}} {...props}>
-      {(state) => React.Children.map(props.children, child => child && React.cloneElement(child, {isOpen: !!OPEN_STATES[state]}))}
-    </Transition>
-  );
-}

package/src/Overlay.tsx

@@ -1,77 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {DOMRef} from '@react-types/shared';
-import {OpenTransition} from './OpenTransition';
-import {OverlayProps} from '@react-types/overlays';
-import {Provider} from '@react-spectrum/provider';
-import React, {useCallback, useState} from 'react';
-import {Overlay as ReactAriaOverlay} from '@react-aria/overlays';
-
-export const Overlay = React.forwardRef(function Overlay(props: OverlayProps, ref: DOMRef<HTMLDivElement>) {
-  let {
-    children,
-    isOpen,
-    disableFocusManagement,
-    shouldContainFocus,
-    container,
-    onEnter,
-    onEntering,
-    onEntered,
-    onExit,
-    onExiting,
-    onExited,
-    nodeRef
-  } = props;
-
-  let [exited, setExited] = useState(!isOpen);
-
-  let handleEntered = useCallback(() => {
-    setExited(false);
-    if (onEntered) {
-      onEntered();
-    }
-  }, [onEntered]);
-
-  let handleExited = useCallback(() => {
-    setExited(true);
-    if (onExited) {
-      onExited();
-    }
-  }, [onExited]);
-
-  // Don't un-render the overlay while it's transitioning out.
-  let mountOverlay = isOpen || !exited;
-  if (!mountOverlay) {
-    // Don't bother showing anything if we don't have to.
-    return null;
-  }
-
-  return (
-    <ReactAriaOverlay portalContainer={container} disableFocusManagement={disableFocusManagement} shouldContainFocus={shouldContainFocus} isExiting={!isOpen}>
-      <Provider ref={ref} UNSAFE_style={{background: 'transparent', isolation: 'isolate'}} isDisabled={false}>
-        <OpenTransition
-          in={isOpen}
-          appear
-          onExit={onExit}
-          onExiting={onExiting}
-          onExited={handleExited}
-          onEnter={onEnter}
-          onEntering={onEntering}
-          onEntered={handleEntered}
-          nodeRef={nodeRef}>
-          {children}
-        </OpenTransition>
-      </Provider>
-    </ReactAriaOverlay>
-  );
-});

package/src/Popover.tsx

@@ -1,253 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {AriaPopoverProps, DismissButton, PopoverAria, usePopover} from '@react-aria/overlays';
-import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
-import {DOMRef, RefObject, StyleProps} from '@react-types/shared';
-import {FocusWithinProps, useFocusWithin} from '@react-aria/interactions';
-import {mergeProps, useLayoutEffect, useObjectRef} from '@react-aria/utils';
-import {Overlay} from './Overlay';
-import {OverlayTriggerState} from '@react-stately/overlays';
-import overrideStyles from './overlays.css';
-import React, {ForwardedRef, forwardRef, ReactNode, useRef, useState} from 'react';
-import styles from '@adobe/spectrum-css-temp/components/popover/vars.css';
-import {Underlay} from './Underlay';
-
-interface PopoverProps extends Omit<AriaPopoverProps, 'popoverRef' | 'maxHeight'>, FocusWithinProps, StyleProps {
-  children: ReactNode,
-  hideArrow?: boolean,
-  state: OverlayTriggerState,
-  shouldContainFocus?: boolean,
-  onEntering?: () => void,
-  onEnter?: () => void,
-  onEntered?: () => void,
-  onExiting?: () => void,
-  onExited?: () => void,
-  onExit?: () => void,
-  container?: HTMLElement,
-  disableFocusManagement?: boolean,
-  enableBothDismissButtons?: boolean,
-  onDismissButtonPress?: () => void
-}
-
-interface PopoverWrapperProps extends PopoverProps, FocusWithinProps {
-  isOpen?: boolean,
-  wrapperRef: RefObject<HTMLDivElement | null>
-}
-
-interface ArrowProps {
-  arrowProps: PopoverAria['arrowProps'],
-  isLandscape: boolean,
-  arrowRef?: RefObject<SVGSVGElement | null>,
-  primary: number,
-  secondary: number,
-  borderDiagonal: number
-}
-
-/**
- * Arrow placement can be done pointing right or down because those paths start at 0, x or y. Because the
- * other two don't, they start at a fractional pixel value, it introduces rounding differences between browsers and
- * between display types (retina with subpixels vs not retina). By flipping them with CSS we can ensure that
- * the path always starts at 0 so that it perfectly overlaps the popover's border.
- * See bottom of file for more explanation.
- */
-let arrowPlacement = {
-  left: 'right',
-  right: 'right',
-  top: 'bottom',
-  bottom: 'bottom'
-};
-
-export const Popover = forwardRef(function Popover(props: PopoverProps, ref: DOMRef<HTMLDivElement>) {
-  let {
-    children,
-    state,
-    ...otherProps
-  } = props;
-  let domRef = useDOMRef(ref);
-  let wrapperRef = useRef<HTMLDivElement>(null);
-
-  return (
-    <Overlay {...otherProps} isOpen={state.isOpen} nodeRef={wrapperRef}>
-      <PopoverWrapper ref={domRef} {...props} wrapperRef={wrapperRef}>
-        {children}
-      </PopoverWrapper>
-    </Overlay>
-  );
-});
-
-const PopoverWrapper = forwardRef((props: PopoverWrapperProps, ref: ForwardedRef<HTMLDivElement | null>) => {
-  let {
-    children,
-    isOpen,
-    hideArrow,
-    isNonModal,
-    enableBothDismissButtons,
-    state,
-    wrapperRef,
-    onDismissButtonPress = () => state.close()
-  } = props;
-  let {styleProps} = useStyleProps(props);
-  let objRef = useObjectRef(ref);
-
-  let {size, borderWidth, arrowRef} = useArrowSize();
-  const borderRadius = usePopoverBorderRadius(objRef);
-  let borderDiagonal = borderWidth * Math.SQRT2;
-  let primary = size + borderDiagonal;
-  let secondary = primary * 2;
-  let {
-    popoverProps,
-    arrowProps,
-    underlayProps,
-    placement
-  } = usePopover({
-    ...props,
-    popoverRef: objRef,
-    maxHeight: undefined,
-    arrowSize: hideArrow ? 0 : secondary,
-    arrowBoundaryOffset: borderRadius
-  }, state);
-  let {focusWithinProps} = useFocusWithin(props);
-
-  // Attach Transition's nodeRef to outermost wrapper for node.reflow: https://github.com/reactjs/react-transition-group/blob/c89f807067b32eea6f68fd6c622190d88ced82e2/src/Transition.js#L231
-  return (
-    <div ref={wrapperRef}>
-      {!isNonModal && <Underlay isTransparent {...mergeProps(underlayProps)} isOpen={isOpen} /> }
-      <div
-        {...styleProps}
-        {...mergeProps(popoverProps, focusWithinProps)}
-        style={{
-          ...styleProps.style,
-          ...popoverProps.style
-        }}
-        ref={objRef}
-        className={
-          classNames(
-            styles,
-            'spectrum-Popover',
-            `spectrum-Popover--${placement}`,
-            {
-              'spectrum-Popover--withTip': !hideArrow,
-              'is-open': isOpen,
-              [`is-open--${placement}`]: isOpen
-            },
-            classNames(
-              overrideStyles,
-              'spectrum-Popover',
-              'react-spectrum-Popover'
-            ),
-            styleProps.className
-          )
-        }
-        role="presentation"
-        data-testid="popover">
-        {(!isNonModal || enableBothDismissButtons) && <DismissButton onDismiss={onDismissButtonPress} />}
-        {children}
-        {hideArrow ? null : (
-          <Arrow
-            arrowProps={arrowProps}
-            isLandscape={placement != null ? arrowPlacement[placement] === 'bottom' : false}
-            arrowRef={arrowRef}
-            primary={primary}
-            secondary={secondary}
-            borderDiagonal={borderDiagonal} />
-        )}
-        <DismissButton onDismiss={onDismissButtonPress} />
-      </div>
-    </div>
-  );
-});
-
-function usePopoverBorderRadius(popoverRef: RefObject<HTMLDivElement | null>) {
-  let [borderRadius, setBorderRadius] = useState(0);
-  useLayoutEffect(() => {
-    if (popoverRef.current) {
-      let spectrumBorderRadius = window.getComputedStyle(popoverRef.current).borderRadius;
-      if (spectrumBorderRadius !== '') {
-        setBorderRadius(parseInt(spectrumBorderRadius, 10));
-      }
-    }
-  }, [popoverRef]);
-  return borderRadius;
-}
-
-function useArrowSize() {
-  let [size, setSize] = useState(20);
-  let [borderWidth, setBorderWidth] = useState(1);
-  let arrowRef = useRef<SVGSVGElement>(null);
-  // get the css value for the tip size and divide it by 2 for this arrow implementation
-  useLayoutEffect(() => {
-    if (arrowRef.current) {
-      let spectrumTipWidth = window.getComputedStyle(arrowRef.current)
-        .getPropertyValue('--spectrum-popover-tip-size');
-      if (spectrumTipWidth !== '') {
-        setSize(parseInt(spectrumTipWidth, 10) / 2);
-      }
-
-      let spectrumBorderWidth = window.getComputedStyle(arrowRef.current)
-        .getPropertyValue('--spectrum-popover-tip-borderWidth');
-      if (spectrumBorderWidth !== '') {
-        setBorderWidth(parseInt(spectrumBorderWidth, 10));
-      }
-    }
-  }, []);
-  return {size, borderWidth, arrowRef};
-}
-
-function Arrow(props: ArrowProps) {
-  let {primary, secondary, isLandscape, arrowProps, borderDiagonal, arrowRef} = props;
-  let halfBorderDiagonal = borderDiagonal / 2;
-
-  let primaryStart = 0;
-  let primaryEnd = primary - halfBorderDiagonal;
-
-  let secondaryStart = halfBorderDiagonal;
-  let secondaryMiddle = secondary / 2;
-  let secondaryEnd = secondary - halfBorderDiagonal;
-
-  let pathData = isLandscape ? [
-    'M', secondaryStart, primaryStart,
-    'L', secondaryMiddle, primaryEnd,
-    'L', secondaryEnd, primaryStart
-  ] : [
-    'M', primaryStart, secondaryStart,
-    'L', primaryEnd, secondaryMiddle,
-    'L', primaryStart, secondaryEnd
-  ];
-
-  /* use ceil because the svg needs to always accommodate the path inside it */
-  return (
-    <svg
-      xmlns="http://www.w3.org/svg/2000"
-      width={Math.ceil(isLandscape ? secondary : primary)}
-      height={Math.ceil(isLandscape ? primary : secondary)}
-      className={classNames(styles, 'spectrum-Popover-tip')}
-      ref={arrowRef}
-      {...arrowProps}>
-      <path className={classNames(styles, 'spectrum-Popover-tip-triangle')} d={pathData.join(' ')} />
-    </svg>
-  );
-}
-
-/**
- * More explanation on popover tips.
- * - I tried changing the calculation of the popover placement in an effort to get it squarely onto the pixel grid.
- * This did not work because the problem was in the svg partial pixel end of the path in the popover right and popover bottom.
- * - I tried creating an extra 'bandaid' path that matched the background color and would overlap the popover border.
- * This didn't work because the border on the svg triangle didn't extend all the way to match nicely with the popover border.
- * - I tried getting the client bounding box and setting the svg to that partial pixel value
- * This didn't work because again the issue was inside the svg
- * - I didn't try drawing the svg backwards
- * This could still be tried
- * - I tried changing the calculation of the popover placement AND the svg height/width so that they were all rounded
- * This seems to have done the trick.
- */