@react-spectrum/s2 3.0.0-nightly-63d4359d6-250428 → 3.0.0-nightly-1dd65ffc5-250430

package/dist/ComboBox.mjs

@@ -46,57 +46,57 @@ import {useResizeObserver as $5rXoR$useResizeObserver, mergeRefs as $5rXoR$merge
 
 const $a2f262fac286a920$export$d414ccceff7063c3 = /*#__PURE__*/ (0, $5rXoR$createContext)(null);
 const $a2f262fac286a920$var$inputButton = function anonymous(props) {
-    let rules = " .";
-    rules += ' _0d';
-    rules += ' _Ma';
-    rules += ' _kb';
-    rules += ' wf';
-    rules += ' _wi';
-    rules += ' _xi';
-    rules += ' _yi';
-    rules += ' _zi';
-    rules += ' _2c';
-    rules += ' _3d';
-    if (props.size === "XL") rules += ' lU';
-    else if (props.size === "L") rules += ' lM';
-    else if (props.size === "M") rules += ' lI';
-    else if (props.size === "S") rules += ' lE';
-    if (props.size === "XL") rules += ' kU';
-    else if (props.size === "L") rules += ' kM';
-    else if (props.size === "M") rules += ' kI';
-    else if (props.size === "S") rules += ' kE';
-    rules += ' yF';
-    rules += ' _cb';
-    rules += ' _9-3t1x';
-    rules += ' _Pag';
-    rules += ' _Pa';
-    rules += ' _Ra-375x7f';
-    rules += ' _R-375x7f';
-    rules += ' _Saa';
-    rules += ' _Sa';
-    if (props.isDisabled) rules += ' ba_____O';
-    else if (props.isOpen) rules += ' ba_____M';
-    else if (props.isHovered) rules += ' ba_____M';
-    else rules += ' ba_____K';
-    if (props.isDisabled) rules += ' bg';
-    else if (props.isOpen) rules += ' bh';
+    let rules = " ";
+    rules += ' ma';
+    rules += ' ta';
+    rules += ' _Ec';
+    rules += ' Rb';
+    rules += ' zg';
+    rules += ' xg';
+    rules += ' wg';
+    rules += ' yg';
+    rules += ' Fa';
+    rules += ' _pa';
+    if (props.size === "XL") rules += ' fg';
+    else if (props.size === "L") rules += ' fc';
+    else if (props.size === "M") rules += ' fb';
+    else if (props.size === "S") rules += ' ff';
+    if (props.size === "XL") rules += ' ec';
+    else if (props.size === "L") rules += ' eb';
+    else if (props.size === "M") rules += ' ea';
+    else if (props.size === "S") rules += ' eg';
+    rules += ' hi';
+    rules += ' _Oa';
+    rules += ' _ra';
+    rules += ' _ia';
+    rules += ' _ibc';
+    rules += ' _ka';
+    rules += ' _kba';
+    rules += ' _ea';
+    rules += ' _eba';
+    if (props.isDisabled) rules += ' ca';
+    else if (props.isOpen) rules += ' ce';
     else {
-        if (props.isPressed) rules += ' bh';
-        else if (props.isFocusVisible) rules += ' bh';
-        else if (props.isHovered) rules += ' bh';
-        else rules += ' bg';
+        if (props.isPressed) rules += ' ce';
+        else if (props.isFocusVisible) rules += ' ce';
+        else if (props.isHovered) rules += ' ce';
+        else rules += ' ca';
     }
-    rules += ' aa_____J';
-    if (props.isDisabled) rules += ' aj';
+    if (props.isDisabled) rules += ' cbo';
+    else if (props.isOpen) rules += ' cbg';
+    else if (props.isHovered) rules += ' cbg';
+    else rules += ' cbt';
+    if (props.isDisabled) rules += ' dc';
     else {
-        if (props.isPressed) rules += ' ao';
-        else if (props.isFocusVisible) rules += ' ao';
-        else if (props.isHovered) rules += ' ao';
-        else rules += ' an';
+        if (props.isPressed) rules += ' db';
+        else if (props.isFocusVisible) rules += ' db';
+        else if (props.isHovered) rules += ' db';
+        else rules += ' da';
     }
+    rules += ' dbp';
     return rules;
 };
-const $a2f262fac286a920$var$iconStyles = " _9-3t1x R-3hn0u -rwx0fg_e-b";
+const $a2f262fac286a920$var$iconStyles = " _ra _Sa -_8sjo0b-Oa";
 let $a2f262fac286a920$var$InternalComboboxContext = /*#__PURE__*/ (0, $5rXoR$createContext)({
     size: 'M'
 });
@@ -146,60 +146,60 @@ const $a2f262fac286a920$export$72b9695b8216309a = /*#__PURE__*/ (0, $5rXoR$forwa
         ...pickerProps,
         style: UNSAFE_style,
         className: UNSAFE_className + function anonymous(props, overrides) {
-            let rules = " .";
-            let matches = (overrides || '').match(/(?:^|\s)(?:y|z|A|B|__a|_9|h|_6|_5|__B|__d|__e|__b|__c|V|__R|Y|_a|W|X|l|q|r)[^\s]+/g) || [];
-            rules += matches.join('');
-            let $__b = false;
-            let $__c = false;
+            let rules = " ";
+            let gridColumnStart = false;
+            let gridColumnEnd = false;
+            let matches = (overrides || '').matchAll(/(?:^|\s)(j|l|h|i|_H|_r|M|__f|_X|_M|L|N|_f|_d|K|__B|H|G|J|I|f|u|_l)[^\s]+/g);
             for (let p of matches){
-                if (/^\s*__b/.test(p)) $__b = true;
-                if (/^\s*__c/.test(p)) $__c = true;
+                if (p[1] === "L") gridColumnStart = true;
+                if (p[1] === "N") gridColumnEnd = true;
+                rules += p[0];
             }
-            rules += ' _0f';
-            if (!$__b) {
-                if (props.isInForm) rules += ' __b-3t1y';
+            rules += ' mb';
+            if (props.isInForm) {
+                if (!gridColumnStart) rules += ' L2mU';
             }
-            if (!$__c) {
-                if (props.isInForm) {
-                    if (props.labelPosition === "side") rules += ' __c-yqnebx';
+            if (props.isInForm) {
+                if (props.labelPosition === "side") {
+                    if (!gridColumnEnd) rules += ' NvoofG';
                 }
             }
-            if (props.isInForm) rules += ' __i-1a97rzt';
+            if (props.isInForm) rules += ' SLwlgod';
             else {
-                if (props.labelPosition === "side") rules += ' __i-ar5vcf';
-                else if (props.labelPosition === "top") rules += ' __i-2wzs0i';
+                if (props.labelPosition === "side") rules += ' SPlN5qb';
+                else if (props.labelPosition === "top") rules += ' SM8Mfn';
             }
-            if (props.labelPosition === "side") rules += ' __j-ar5vcf';
-            else if (props.labelPosition === "top") rules += ' __j-1a6w430';
-            if (props.labelPosition === "side") rules += ' __k-18h2yqz';
-            else if (props.labelPosition === "top") rules += ' __k-1srn173';
+            if (props.labelPosition === "side") rules += ' _FPlN5qb';
+            else if (props.labelPosition === "top") rules += ' _F4w1sLc';
+            if (props.labelPosition === "side") rules += ' _ubRM95c';
+            else if (props.labelPosition === "top") rules += ' _uxaocre';
             if (props.size === "XL") {
-                rules += ' _ebj';
-                rules += ' _ei';
+                rules += ' ah';
+                rules += ' aac';
             } else if (props.size === "L") {
-                rules += ' _ebh';
-                rules += ' _eg';
+                rules += ' ae';
+                rules += ' aad';
             } else if (props.size === "S") {
-                rules += ' _ebd';
-                rules += ' _ec';
+                rules += ' af';
+                rules += ' aag';
             } else if (props.size === "XS") {
-                rules += ' _ebb';
-                rules += ' _ea';
+                rules += ' ai';
+                rules += ' aaj';
             } else {
-                rules += ' _ebf';
-                rules += ' _ee';
+                rules += ' aa';
+                rules += ' aab';
             }
-            rules += ' _2d';
-            rules += ' _g-1x99dlob';
-            rules += ' _ga';
-            if (props.size === "XL") rules += ' -aqrvqh_k-j';
-            else if (props.size === "L") rules += ' -aqrvqh_k-i';
-            else if (props.size === "S") rules += ' -aqrvqh_k-h';
-            else if (props.size === "XS") rules += ' -aqrvqh_k-g';
-            else rules += ' -aqrvqh_k-f';
-            rules += ' -_1inj1bc_i--prjw07';
-            rules += ' je';
-            rules += ' __S-yksgrp';
+            rules += ' Fb';
+            rules += ' gb';
+            rules += ' gca';
+            if (props.size === "XL") rules += ' -BhX7R-ee';
+            else if (props.size === "L") rules += ' -BhX7R-ed';
+            else if (props.size === "S") rules += ' -BhX7R-eb';
+            else if (props.size === "XS") rules += ' -BhX7R-ea';
+            else rules += ' -BhX7R-ec';
+            rules += ' -AJjOLd-p8R8pb';
+            rules += ' ka';
+            rules += ' _Ga';
             return rules;
         }({
             isInForm: !!formContext,
@@ -229,27 +229,27 @@ const $a2f262fac286a920$export$72b9695b8216309a = /*#__PURE__*/ (0, $5rXoR$forwa
                             isInvalid: isInvalid,
                             size: size,
                             styles: function anonymous(props) {
-                                let rules = " .";
-                                rules += ' __b-g2ozi1';
-                                rules += ' __c-g2ozi1';
-                                rules += ' __d-g2ozi1';
-                                rules += ' __e-g2ozi1';
-                                if (props.size === "XL") rules += ' qj';
-                                else if (props.size === "L") rules += ' qi';
-                                else if (props.size === "S") rules += ' qh';
-                                else if (props.size === "XS") rules += ' qg';
-                                else rules += ' qf';
-                                if (props.isQuiet) rules += ' __na';
-                                else rules += ' __n-1s8glxue';
-                                if (props.size === "XL") rules += ' -usygro_l-____g';
-                                else if (props.size === "L") rules += ' -usygro_l-___0';
-                                else if (props.size === "S") rules += ' -usygro_l-___u';
-                                else rules += ' -usygro_l-___K';
-                                rules += ' m-rwozxi';
-                                rules += ' C-375tnm';
-                                rules += ' D-375tnn';
-                                rules += ' -_375tnm_C-I';
-                                rules += ' -_375tnn_D--45az6c';
+                                let rules = " ";
+                                rules += ' LXcEWr';
+                                rules += ' NXcEWr';
+                                rules += ' _fXcEWr';
+                                rules += ' _dXcEWr';
+                                if (props.size === "XL") rules += ' ub';
+                                else if (props.size === "L") rules += ' ud';
+                                else if (props.size === "S") rules += ' uc';
+                                else if (props.size === "XS") rules += ' ua';
+                                else rules += ' ue';
+                                if (props.isQuiet) rules += ' _vb';
+                                else rules += ' _vma';
+                                if (props.size === "XL") rules += ' -Anxdcc-fh';
+                                else if (props.size === "L") rules += ' -Anxdcc-fl';
+                                else if (props.size === "S") rules += ' -Anxdcc-fd';
+                                else rules += ' -Anxdcc-fk';
+                                rules += ' _DWMn6Hb';
+                                rules += ' oGQFGYc';
+                                rules += ' n9PFGYc';
+                                rules += ' -o_-ob';
+                                rules += ' -n_-nyK6oge';
                                 return rules;
                             }({
                                 size: size
@@ -303,7 +303,7 @@ const $a2f262fac286a920$export$72b9695b8216309a = /*#__PURE__*/ (0, $5rXoR$forwa
                                 // manually subtract border as we can't set Popover to border-box, it causes the contents to spill out
                                 '--trigger-width': `calc(${triggerWidth} - 2px)`
                             },
-                            styles: " q-1utmx2y l-1utmx2y",
+                            styles: " uuHSBze fuHSBze",
                             children: /*#__PURE__*/ (0, $5rXoR$jsx)((0, $5rXoR$Provider), {
                                 values: [
                                     [

package/dist/ContextualHelp.cjs

@@ -41,7 +41,7 @@ $parcel$export(module.exports, "ContextualHelp", () => $bab829476f85a155$export$
 
 
 
-const $bab829476f85a155$var$popover = " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh q___U l___U Eh Fh Ch Dh";
+const $bab829476f85a155$var$popover = " bh bdf beg bfa bgb bhd bje bic ur fG rc vc od nd";
 const $bab829476f85a155$export$41b9afaaba473494 = /*#__PURE__*/ (0, $44GE8$react.createContext)(null);
 const $bab829476f85a155$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $44GE8$react.forwardRef)(function ContextualHelp(props, ref) {
     let stringFormatter = (0, $44GE8$reactariai18n.useLocalizedStringFormatter)((0, ($parcel$interopDefault($4526404114e78c80$exports))), '@react-spectrum/s2');
@@ -82,7 +82,7 @@ const $bab829476f85a155$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $44GE8$react
                 hideArrow: true,
                 styles: $bab829476f85a155$var$popover,
                 children: /*#__PURE__*/ (0, $44GE8$reactjsxruntime.jsx)((0, $44GE8$reactariacomponents.Dialog), {
-                    className: (0, $308b180f49d82d28$exports.mergeStyles)((0, $0f4636c7093b9233$exports.dialogInner), " _wa _xa _ya _za AP BP yP zP Eh Fh Ch Dh"),
+                    className: (0, $308b180f49d82d28$exports.mergeStyles)((0, $0f4636c7093b9233$exports.dialogInner), " zf xf wf yf je ld hm ik rc vc od nd"),
                     children: /*#__PURE__*/ (0, $44GE8$reactjsxruntime.jsx)((0, $44GE8$reactariacomponents.Provider), {
                         values: [
                             [
@@ -96,19 +96,19 @@ const $bab829476f85a155$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $44GE8$react
                             [
                                 (0, $6367bc87eb7d24ad$exports.HeadingContext),
                                 {
-                                    styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ei _ebj _fe _f-1x99dloe _ga _g-1x99dlob ao Aa B-y6pz8c ya za"
+                                    styles: " bh bdf beg bfa bgb bhd bje bic ah aac Dc Ec Ca Dcc Ecc Cca gb gca db ja le ha ia"
                                 }
                             ],
                             [
                                 (0, $6367bc87eb7d24ad$exports.ContentContext),
                                 {
-                                    styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ee _ebf _fb _gb _g-1x99dloc an"
+                                    styles: " bh bdf beg bfa bgb bhd bje bic aa aab Da Ea Ca ga gcc da"
                                 }
                             ],
                             [
                                 (0, $6367bc87eb7d24ad$exports.FooterContext),
                                 {
-                                    styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ee _ebf _fb _gb _g-1x99dloc an Af"
+                                    styles: " bh bdf beg bfa bgb bhd bje bic aa aab Da Ea Ca ga gcc da jc"
                                 }
                             ]
                         ],

package/dist/ContextualHelp.css

@@ -1,184 +1,198 @@
 @layer _.a {
-  .q___U {
+  .ur {
     min-width: calc(13.625rem * var(--s2-scale));
   }
 
-  .l___U {
+  .fG {
     width: calc(13.625rem * var(--s2-scale));
   }
 
-  ._wa {
+  .zf {
     border-start-start-radius: 0;
   }
 
-  ._xa {
+  .xf {
     border-start-end-radius: 0;
   }
 
-  ._ya {
+  .wf {
     border-end-start-radius: 0;
   }
 
-  ._za {
+  .yf {
     border-end-end-radius: 0;
   }
 
-  .AP {
+  .je {
     margin-top: -1.5rem;
   }
 
-  .BP {
+  .ld {
     margin-bottom: -1.5rem;
   }
 
-  .yP {
+  .hm {
     margin-inline-start: -1.5rem;
   }
 
-  .zP {
+  .ik {
     margin-inline-end: -1.5rem;
   }
 
-  .Eh {
+  .rc {
     padding-top: 1.5rem;
   }
 
-  .Fh {
+  .vc {
     padding-bottom: 1.5rem;
   }
 
-  .Ch {
+  .od {
     padding-inline-start: 1.5rem;
   }
 
-  .Dh {
+  .nd {
     padding-inline-end: 1.5rem;
   }
 
-  ._ei {
+  .ah {
     font-size: 1.125rem;
   }
 
-  ._fe {
+  .Dc {
     font-variation-settings: "wght" 800;
-    font-synthesis-weight: none;
+  }
+
+  .Ec {
     font-weight: 800;
   }
 
-  ._ga {
+  .gb {
     line-height: 1.3;
   }
 
-  .ao {
+  .db {
     color: var(--lightningcss-light, #131313) var(--lightningcss-dark, #f2f2f2);
   }
 
-  .Aa {
+  .ja {
     margin-top: 0;
   }
 
-  .B-y6pz8c {
+  .le {
     margin-bottom: .5rem;
   }
 
-  .ya {
+  .ha {
     margin-inline-start: 0;
   }
 
-  .za {
+  .ia {
     margin-inline-end: 0;
   }
 
-  ._da {
+  .bh {
     font-family: adobe-clean-variable, adobe-clean, ui-sans-serif, system-ui, sans-serif;
   }
 
-  ._ee {
+  .aa {
     font-size: .875rem;
   }
 
-  ._fb {
+  .Da {
     font-variation-settings: "wght" 400;
-    font-synthesis-weight: none;
+  }
+
+  .Ea {
     font-weight: 400;
   }
 
-  ._gb {
+  .Ca {
+    font-synthesis-weight: none;
+  }
+
+  .ga {
     line-height: 1.5;
   }
 
-  .an {
+  .da {
     color: var(--lightningcss-light, #292929) var(--lightningcss-dark, #dbdbdb);
   }
 
-  .Af {
+  .jc {
     margin-top: 1rem;
   }
 }
 
 @layer _.b {
-  ._f-1x99dloe:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  .Dcc:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-variation-settings: "wght" 800;
-    font-synthesis-weight: none;
+  }
+
+  .Ecc:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     font-weight: 800;
   }
 
-  ._g-1x99dlob:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  .Cca:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+    font-synthesis-weight: none;
+  }
+
+  .gca:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     line-height: 1.5;
   }
 
-  ._d-enzrfpb:lang(ar) {
+  .bdf:lang(ar) {
     font-family: myriad-arabic, ui-sans-serif, system-ui, sans-serif;
   }
 
-  ._g-1x99dloc:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
+  .gcc:is(:lang(ja), :lang(ko), :lang(zh), :lang(zh-Hant), :lang(zh-Hans)) {
     line-height: 1.7;
   }
 }
 
 @layer _.c {
-  ._d-enzwzjc:lang(he) {
+  .beg:lang(he) {
     font-family: myriad-hebrew, ui-sans-serif, system-ui, sans-serif;
   }
 }
 
 @layer _.d {
-  ._d-enzykdd:lang(ja) {
+  .bfa:lang(ja) {
     font-family: adobe-clean-han-japanese, Hiragino Kaku Gothic ProN, ヒラギノ角ゴ ProN W3, Osaka, YuGothic, Yu Gothic, メイリオ, Meiryo, ＭＳ Ｐゴシック, MS PGothic, sans-serif;
   }
 }
 
 @layer _.e {
-  ._d-enzzrge:lang(ko) {
+  .bgb:lang(ko) {
     font-family: adobe-clean-han-korean, source-han-korean, Malgun Gothic, Apple Gothic, sans-serif;
   }
 }
 
 @layer _.f {
-  ._d-eo0c6sf:lang(zh) {
+  .bhd:lang(zh) {
     font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Heiti TC Light, sans-serif;
   }
 }
 
 @layer _.g {
-  ._d-1uotwbwg:lang(zh-hant) {
+  .bje:lang(zh-hant) {
     font-family: adobe-clean-han-traditional, source-han-traditional, MingLiu, Microsoft JhengHei UI, Microsoft JhengHei, Heiti TC Light, sans-serif;
   }
 }
 
 @layer _.h {
-  ._d-bc1l9oh:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
+  .bic:is(:lang(zh-Hans), :lang(zh-CN), :lang(zh-SG)) {
     font-family: adobe-clean-han-simplified-c, source-han-simplified-c, SimSun, Heiti SC Light, sans-serif;
   }
 }
 
-@layer _.b.b {
+@layer _.b.a {
   @media not ((hover: hover) and (pointer: fine)) {
-    ._ebj {
+    .aac {
       font-size: 1.375rem;
     }
 
-    ._ebf {
+    .aab {
       font-size: 1.0625rem;
     }
   }

package/dist/ContextualHelp.css.map

@@ -1 +1 @@
-{"mappings":"ACyCgB;EAAA;;;;EAAA;;;;EAiEuC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQf;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQD;;;;EAAA;;;;EAAA;;;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAjFvB;EAyEwB;;;;;;EAAA;;;;EAQD;;;;EAAA;;;;;AAjFvB;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAyEwB;EAAA;IAAA;;;;IAKA","sources":["019fb1fcc3c1598d","packages/@react-spectrum/s2/src/ContextualHelp.tsx"],"sourcesContent":["@import \"3578337ca657fa78\";\n@import \"a023844b8de14349\";\n@import \"3be9de50ea21a4ea\";\n@import \"5266771b1d67e2fb\";\n@import \"ccaa61f08a335ea7\";\n","import {ActionButton} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {ContentContext, FooterContext, HeadingContext} from './Content';\nimport {ContextValue, DEFAULT_SLOT, Provider, Dialog as RACDialog, TextContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {dialogInner} from './Dialog';\nimport {DialogTrigger, DialogTriggerProps} from './DialogTrigger';\nimport {filterDOMProps, mergeProps, useLabels} from '@react-aria/utils';\nimport HelpIcon from '../s2wf-icons/S2_Icon_HelpCircle_20_N.svg';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {PopoverBase, PopoverDialogProps} from './Popover';\nimport {space, style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils' with { type: 'macro' };\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ContextualHelpStyleProps {\n  /**\n   * Indicates whether contents are informative or provides helpful guidance.\n   *\n   * @default 'help'\n   */\n  variant?: 'info' | 'help'\n}\nexport interface ContextualHelpProps extends\n  Pick<DialogTriggerProps, 'isOpen' | 'defaultOpen' | 'onOpenChange'>,\n  Pick<PopoverDialogProps, 'shouldFlip' | 'offset' | 'crossOffset' | 'placement' | 'containerPadding'>,\n  ContextualHelpStyleProps, StyleProps, DOMProps, AriaLabelingProps {\n  /** Contents of the Contextual Help popover. */\n  children: ReactNode,\n  /**\n   * The size of the ActionButton.\n   *\n   * @default 'XS'\n   */\n  size?: 'XS' | 'S'\n}\n\nconst popover = style({\n  fontFamily: 'sans',\n  minWidth: 218,\n  width: 218,\n  padding: 24\n});\n\nexport const ContextualHelpContext = createContext<ContextValue<Partial<ContextualHelpProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * Contextual help shows a user extra information about the state of an adjacent component, or a total view.\n */\nexport const ContextualHelp = forwardRef(function ContextualHelp(props: ContextualHelpProps, ref: FocusableRef<HTMLButtonElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, ContextualHelpContext);\n  let {\n    children,\n    defaultOpen,\n    // containerPadding = 24, // See popover() above. Issue noted in Popover.tsx.\n    size = 'XS',\n    crossOffset,\n    isOpen,\n    offset = 8,\n    onOpenChange,\n    placement = 'bottom start',\n    shouldFlip,\n    UNSAFE_className,\n    UNSAFE_style,\n    styles,\n    variant = 'help'\n  } = props;\n\n  // In a FieldLabel we're getting the context's aria-labeledby, so we need to\n  // manually set the aria-label after useLabels() to keep the order of label\n  // then ContextualHelp variant\n  let labelProps = useLabels(props);\n  let label = stringFormatter.format(`contextualhelp.${variant}`);\n  labelProps['aria-label'] = labelProps['aria-label'] ? labelProps['aria-label'] + ' ' + label : label;\n\n  let buttonProps = filterDOMProps(props, {labelable: true});\n\n  return (\n    <DialogTrigger\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}>\n      <ActionButton\n        slot={null}\n        ref={ref}\n        size={size}\n        {...mergeProps(buttonProps, labelProps)}\n        UNSAFE_style={UNSAFE_style}\n        UNSAFE_className={UNSAFE_className}\n        styles={styles}\n        isQuiet>\n        {variant === 'info' ? <InfoIcon /> : <HelpIcon />}\n      </ActionButton>\n      <PopoverBase\n        placement={placement}\n        shouldFlip={shouldFlip}\n        // not working => containerPadding={containerPadding}\n        offset={offset}\n        crossOffset={crossOffset}\n        hideArrow\n        styles={popover}>\n        <RACDialog className={mergeStyles(dialogInner, style({borderRadius: 'none', margin: -24, padding: 24}))}>\n          <Provider\n            values={[\n              [TextContext, {\n                slots: {\n                  [DEFAULT_SLOT]: {}\n                }\n              }],\n              [HeadingContext, {styles: style({\n                font: 'heading-xs',\n                margin: 0,\n                marginBottom: space(8) // This only makes it 10px on mobile and should be 12px\n              })}],\n              [ContentContext, {styles: style({\n                font: 'body-sm'\n              })}],\n              [FooterContext, {styles: style({\n                font: 'body-sm',\n                marginTop: 16\n              })}]\n            ]}>\n            {children}\n          </Provider>\n        </RACDialog>\n      </PopoverBase>\n    </DialogTrigger>\n  );\n});\n"],"names":[],"version":3,"file":"ContextualHelp.css.map"}
+{"mappings":"ACyCgB;EAAA;;;;EAAA;;;;EAiEuC;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQf;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQD;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAAA;;;;;AAjFvB;EAyEwB;;;;EAAA;;;;EAAA;;;;EAAA;;;;EAQD;;;;EAAA;;;;;AAjFvB;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAAA;EAAA;;;;;AAyEwB;EAAA;IAAA;;;;IAKA","sources":["019fb1fcc3c1598d","packages/@react-spectrum/s2/src/ContextualHelp.tsx"],"sourcesContent":["@import \"3578337ca657fa78\";\n@import \"a023844b8de14349\";\n@import \"3be9de50ea21a4ea\";\n@import \"5266771b1d67e2fb\";\n@import \"ccaa61f08a335ea7\";\n","import {ActionButton} from './ActionButton';\nimport {AriaLabelingProps, DOMProps, FocusableRef, FocusableRefValue} from '@react-types/shared';\nimport {ContentContext, FooterContext, HeadingContext} from './Content';\nimport {ContextValue, DEFAULT_SLOT, Provider, Dialog as RACDialog, TextContext} from 'react-aria-components';\nimport {createContext, forwardRef, ReactNode} from 'react';\nimport {dialogInner} from './Dialog';\nimport {DialogTrigger, DialogTriggerProps} from './DialogTrigger';\nimport {filterDOMProps, mergeProps, useLabels} from '@react-aria/utils';\nimport HelpIcon from '../s2wf-icons/S2_Icon_HelpCircle_20_N.svg';\nimport InfoIcon from '../s2wf-icons/S2_Icon_InfoCircle_20_N.svg';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport {mergeStyles} from '../style/runtime';\nimport {PopoverBase, PopoverDialogProps} from './Popover';\nimport {space, style} from '../style' with {type: 'macro'};\nimport {StyleProps} from './style-utils' with { type: 'macro' };\nimport {useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface ContextualHelpStyleProps {\n  /**\n   * Indicates whether contents are informative or provides helpful guidance.\n   *\n   * @default 'help'\n   */\n  variant?: 'info' | 'help'\n}\nexport interface ContextualHelpProps extends\n  Pick<DialogTriggerProps, 'isOpen' | 'defaultOpen' | 'onOpenChange'>,\n  Pick<PopoverDialogProps, 'shouldFlip' | 'offset' | 'crossOffset' | 'placement' | 'containerPadding'>,\n  ContextualHelpStyleProps, StyleProps, DOMProps, AriaLabelingProps {\n  /** Contents of the Contextual Help popover. */\n  children: ReactNode,\n  /**\n   * The size of the ActionButton.\n   *\n   * @default 'XS'\n   */\n  size?: 'XS' | 'S'\n}\n\nconst popover = style({\n  fontFamily: 'sans',\n  minWidth: 218,\n  width: 218,\n  padding: 24\n});\n\nexport const ContextualHelpContext = createContext<ContextValue<Partial<ContextualHelpProps>, FocusableRefValue<HTMLButtonElement>>>(null);\n\n/**\n * Contextual help shows a user extra information about the state of an adjacent component, or a total view.\n */\nexport const ContextualHelp = forwardRef(function ContextualHelp(props: ContextualHelpProps, ref: FocusableRef<HTMLButtonElement>) {\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  [props, ref] = useSpectrumContextProps(props, ref, ContextualHelpContext);\n  let {\n    children,\n    defaultOpen,\n    // containerPadding = 24, // See popover() above. Issue noted in Popover.tsx.\n    size = 'XS',\n    crossOffset,\n    isOpen,\n    offset = 8,\n    onOpenChange,\n    placement = 'bottom start',\n    shouldFlip,\n    UNSAFE_className,\n    UNSAFE_style,\n    styles,\n    variant = 'help'\n  } = props;\n\n  // In a FieldLabel we're getting the context's aria-labeledby, so we need to\n  // manually set the aria-label after useLabels() to keep the order of label\n  // then ContextualHelp variant\n  let labelProps = useLabels(props);\n  let label = stringFormatter.format(`contextualhelp.${variant}`);\n  labelProps['aria-label'] = labelProps['aria-label'] ? labelProps['aria-label'] + ' ' + label : label;\n\n  let buttonProps = filterDOMProps(props, {labelable: true});\n\n  return (\n    <DialogTrigger\n      isOpen={isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}>\n      <ActionButton\n        slot={null}\n        ref={ref}\n        size={size}\n        {...mergeProps(buttonProps, labelProps)}\n        UNSAFE_style={UNSAFE_style}\n        UNSAFE_className={UNSAFE_className}\n        styles={styles}\n        isQuiet>\n        {variant === 'info' ? <InfoIcon /> : <HelpIcon />}\n      </ActionButton>\n      <PopoverBase\n        placement={placement}\n        shouldFlip={shouldFlip}\n        // not working => containerPadding={containerPadding}\n        offset={offset}\n        crossOffset={crossOffset}\n        hideArrow\n        styles={popover}>\n        <RACDialog className={mergeStyles(dialogInner, style({borderRadius: 'none', margin: -24, padding: 24}))}>\n          <Provider\n            values={[\n              [TextContext, {\n                slots: {\n                  [DEFAULT_SLOT]: {}\n                }\n              }],\n              [HeadingContext, {styles: style({\n                font: 'heading-xs',\n                margin: 0,\n                marginBottom: space(8) // This only makes it 10px on mobile and should be 12px\n              })}],\n              [ContentContext, {styles: style({\n                font: 'body-sm'\n              })}],\n              [FooterContext, {styles: style({\n                font: 'body-sm',\n                marginTop: 16\n              })}]\n            ]}>\n            {children}\n          </Provider>\n        </RACDialog>\n      </PopoverBase>\n    </DialogTrigger>\n  );\n});\n"],"names":[],"version":3,"file":"ContextualHelp.css.map"}

package/dist/ContextualHelp.mjs

@@ -34,7 +34,7 @@ function $parcel$interopDefault(a) {
 
 
 
-const $8e176595bc49ca3f$var$popover = " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh q___U l___U Eh Fh Ch Dh";
+const $8e176595bc49ca3f$var$popover = " bh bdf beg bfa bgb bhd bje bic ur fG rc vc od nd";
 const $8e176595bc49ca3f$export$41b9afaaba473494 = /*#__PURE__*/ (0, $bcd4U$createContext)(null);
 const $8e176595bc49ca3f$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $bcd4U$forwardRef)(function ContextualHelp(props, ref) {
     let stringFormatter = (0, $bcd4U$useLocalizedStringFormatter)((0, ($parcel$interopDefault($bcd4U$intlStringsmjs))), '@react-spectrum/s2');
@@ -75,7 +75,7 @@ const $8e176595bc49ca3f$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $bcd4U$forwa
                 hideArrow: true,
                 styles: $8e176595bc49ca3f$var$popover,
                 children: /*#__PURE__*/ (0, $bcd4U$jsx)((0, $bcd4U$Dialog), {
-                    className: (0, $feb886035e0d4633$export$e618dc39ac9ad607)((0, $9bbc115952dac5a6$export$6af31f836f9aa6f2), " _wa _xa _ya _za AP BP yP zP Eh Fh Ch Dh"),
+                    className: (0, $feb886035e0d4633$export$e618dc39ac9ad607)((0, $9bbc115952dac5a6$export$6af31f836f9aa6f2), " zf xf wf yf je ld hm ik rc vc od nd"),
                     children: /*#__PURE__*/ (0, $bcd4U$jsx)((0, $bcd4U$Provider), {
                         values: [
                             [
@@ -89,19 +89,19 @@ const $8e176595bc49ca3f$export$7d3cdb256c2ba320 = /*#__PURE__*/ (0, $bcd4U$forwa
                             [
                                 (0, $8e847109a6ab556d$export$d688439359537581),
                                 {
-                                    styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ei _ebj _fe _f-1x99dloe _ga _g-1x99dlob ao Aa B-y6pz8c ya za"
+                                    styles: " bh bdf beg bfa bgb bhd bje bic ah aac Dc Ec Ca Dcc Ecc Cca gb gca db ja le ha ia"
                                 }
                             ],
                             [
                                 (0, $8e847109a6ab556d$export$1cbdd774077931b4),
                                 {
-                                    styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ee _ebf _fb _gb _g-1x99dloc an"
+                                    styles: " bh bdf beg bfa bgb bhd bje bic aa aab Da Ea Ca ga gcc da"
                                 }
                             ],
                             [
                                 (0, $8e847109a6ab556d$export$5630640b68817ed6),
                                 {
-                                    styles: " _da _d-enzrfpb _d-enzwzjc _d-enzykdd _d-enzzrge _d-eo0c6sf _d-1uotwbwg _d-bc1l9oh _ee _ebf _fb _gb _g-1x99dloc an Af"
+                                    styles: " bh bdf beg bfa bgb bhd bje bic aa aab Da Ea Ca ga gcc da jc"
                                 }
                             ]
                         ],